设计方法
老版投影技巧为什么仍影响现代界面层次
投影不是复古滤镜。只要界面需要表达前后关系、浮起状态和光源方向，它仍是重要的视觉线索。
投影先说明遮挡关系，再参与装饰风格
界面里的弹窗覆盖页面、菜单从按钮下方展开、卡片被拖起时，用户需要快速判断谁在上层。投影通过偏移、模糊与明暗建立一个不占真实空间的深度线索。它不是把元素画得更华丽，而是在二维屏幕上补充遮挡和高度信息。
如果所有组件都使用同样阴影，页面只能得到统一的灰边，无法表达层级。贴近背景的卡片应保持克制，临时浮起的菜单可以更明显，阻断任务的对话框还需要背景遮罩协同。强度跟随交互关系，而不是跟随组件面积。
反过来，没有阴影也不等于扁平设计更现代。边框、背景色差、遮罩和位置都能表达层次；只要关系清楚，投影可以很弱甚至不存在。判断标准是用户能否识别活动表面与被覆盖内容，而不是页面是否符合某个年代的视觉标签。
CSS参数对应旧教程里不同的观察量
MDN对box-shadow的说明把阴影拆成水平偏移、垂直偏移、模糊半径、扩张半径和颜色。旧版Photoshop面板中的距离、角度、大小与不透明度虽然名称不同，背后仍在控制光源方向、边缘软硬和覆盖范围。界面变了，观察对象没有消失。
偏移决定阴影重心落在哪里，模糊扩大半影，扩张则在模糊前改变实体轮廓。只提高模糊会让阴影松散，却不会自动产生更高的感觉；只增加偏移又会像对象侧移。参数需要围绕一个空间假设共同变化。
box-shadow不会改变CSS盒模型尺寸。阴影可以越过组件边缘，却不会替元素争取布局空间，因此可能被容器裁切或覆盖邻近内容。遇到阴影消失时，应检查overflow与堆叠关系，而不是无限加深颜色。
接触阴影与环境阴影承担不同信息
物体贴近表面时，接触处通常有较窄、较深的阴影，它说明对象真正落在背景上。距离增加后，阴影边缘更柔，覆盖范围更大。将二者叠加，可以同时保留落点和空气感；只剩大面积柔影，卡片容易像漂浮雾团。
CSS允许同一元素使用多层阴影，书写顺序会影响叠加。设计系统可用一层短小暗影建立接触，再用一层低不透明度广影表达环境。两层各自有明确作用，比复制许多近似阴影更容易维护，也能在深色模式分别调整。
接触关系还要符合组件形状。圆角卡片的阴影轮廓应跟随圆角，弹出箭头与菜单主体应看成一个对象。若箭头没有阴影或出现接缝，用户会读成两张叠贴图形。明确对象边界后再调整参数，比从预设库挑一个漂亮效果更可靠。
统一光源不要求所有阴影复制同一组数值
同一界面应让主要偏移方向一致，否则按钮向右下投影，弹窗却向左上投影，空间像由两套重力拼成。光源一致指方向与基本明暗逻辑一致，不代表不同高度、大小和背景的元素必须使用完全相同半径。
较高表面可以有更宽、更淡的环境影，较低表面保留短小接触影。若仅用更黑表示更高，重要弹窗会显得沉重，反而像陷进背景。高度变化需要偏移、模糊和遮罩共同说明，内容优先级仍由标题、布局与操作关系承担。
界面动画中，阴影变化应跟随位移。卡片抬起时，接触影减弱、环境影展开；按下时则回到更贴近表面的状态。若元素向上移动而阴影不变，视觉会像整张贴纸平移。动态关系正是旧投影原理在现代交互中的延续。
深色模式常需要边界与高光共同工作
浅色背景上的灰黑阴影容易被看见，深色背景会吞掉同样颜色。简单把浅色主题参数复制过去，卡片边界可能消失；把阴影加黑又会损失暗部层次。深色模式通常需要微弱亮边、表面亮度差或局部高光来补充轮廓。
高光不能随意绕元素一圈。若假定光从上方来，上缘可以略亮，下缘仍由暗影和背景差表达。四边同亮会更像描边，而不是受光表面。是否使用描边取决于组件状态，但不应把它伪装成光照。
OLED屏幕、低亮度环境与压缩截图都会改变暗部可见性。设计者应在真实设备和较低亮度下查看关键弹窗，不只在高亮专业显示器上判断。目标不是让每层都明显，而是避免活动控件与不可交互背景混为一体。
投影不能替代可访问的边界和焦点状态
W3C对非文本对比的说明要求，识别重要用户界面组件所需的视觉信息应有足够对比。投影若是唯一边界，就必须在实际背景上提供可识别差异；模糊、半透明阴影在复杂图片上很容易失效，不能把参数表里的不透明度直接当作可见对比。
键盘焦点尤其不能只靠增加投影。用户需要知道当前操作位置，清晰轮廓、颜色变化或下划线通常比柔影更稳定。投影可以强化浮起感，但焦点指示必须在不同背景和缩放条件下仍能辨认。
抗锯齿会让细线和柔影的实际像素比标称颜色更淡。对比测试应取最弱可见部分，并在真实渲染中观察。若组件边界只有一像素且颜色接近背景，理论色值差异可能无法抵消显示与视觉条件造成的衰减。
大范围模糊会改变性能与画面秩序
大量宽模糊阴影会扩大需要绘制的区域，滚动列表和低性能移动设备上可能增加合成负担。单个卡片效果平顺，不代表几十张卡片同时出现仍然稳定。把层级信息集中在真正浮起的组件上，既减少视觉噪声，也降低无意义渲染。
阴影还会与邻近内容叠加。卡片间距过小，多个阴影混成灰雾，用户反而难以看出边界。空间不足时，减小扩散或改用细边框比继续调整颜色更有效，因为问题来自阴影覆盖范围而不是亮度。
设计系统应保存少量有语义的层级样式，例如静置、悬停、拖动和模态，而不是让每位设计师创造一组参数。语义样式仍需在具体背景验证，不能成为机械套用；它的价值是让同一交互状态在不同页面讲相同空间语言。
旧教程真正留下的是从光源反推参数的能力
旧版Photoshop教程常从一个角度、距离和大小开始，具体面板位置今天可能已经变化。仍然有效的是观察顺序：先确定表面关系与主光方向，再判断接触、半影和环境亮度，最后才把观察翻译成软件参数。
迁移到CSS、原型工具或移动界面时，不必追求数值逐项相等。不同渲染器的模糊算法和色彩合成会产生差异，视觉目标才是共同基准。用代表组件做样张，在浅色、深色和图片背景比较，比复制截图里的数字更能复现原理。
Nerwo设计教程保留投影主题，是因为现代界面仍需要表达前后、浮起与按下。完成标准不是阴影更逼真，而是用户不必思考就能读懂层级，同时文字、边界与操作状态不被效果吞没。
验收阴影要回到组件所在的真实背景
在白色画板上调好的卡片，放进带照片的页面后可能失去边界；在单个组件预览里清楚的柔影，进入密集列表后会互相污染。验收应使用真实间距、背景和滚动状态，因为阴影与周围像素共同形成可见结果。
还要比较静置、悬停、按下和禁用状态。若每个状态只增加阴影强度，禁用按钮也可能像可点击。状态差异应由颜色、形状与行为共同表达，投影只强化其中的空间变化，不能承担全部可用性信号。
最终参数应保留设计理由，例如短影表示接触、宽影表示模态浮层。理由能帮助后续主题调整时保持机制，机械复制数值只能保留某次截图。旧投影技巧的现代价值，正是把参数重新连回光源和交互关系。