网站可以有表现力，但不需要每个物件都在动。我们的起点不是先选哪个动画库，而是问动效到底贡献了什么：材质感，过程说明，重点变化，还是对操作的反馈。如果这件事说不清楚，去掉动画可能反而更好。
先分清内容层和氛围层
标题，价格，导航和咨询入口应该是正常可阅读的网页内容。装饰性的运动可以出现在它们周围或背后，但访客不应该必须操作一个画布，才能理解我们的服务。这样分层，也让高级图形无法运行时仍有完整的网站。
连续背景可以比一堆互不相关的动效卡片更统一，但不代表所有内容都必须透明。文字密集的地方，可以使用安静的实色阅读面板。周围的纹理继续连接不同章节，静止和运动的对比，本身就是设计的一部分。
保留可以预期的滚动和阅读
我们倾向于保留浏览器正常滚动。访客应该能够快速略读，返回价格，或使用键盘导航，而不必学习特别的手势。动效可以响应滚动位置，但不应该拦住导航，也不应该要求看完一长段动画后才出现有用信息。
W3C 对 WCAG 2.2.2 的解释，包含了与其他内容同时呈现，自动开始并持续超过五秒的非必要移动内容的控制要求。因此我们提供明确的暂停入口。同时尊重系统减少动态效果的偏好，但这些设置不能替代对整体体验的检查。自动扫描通过，也不等于每一种动画都令人舒适。
手机版本需要单独设计
小屏幕不是缩小的桌面版。文字，按钮和照片所需的空间不同，用户也可能希望节省流量或避免较重的图形。我们先提供经过设计的静态构图，再把较轻的互动体验作为选择。主要服务和咨询路径不依赖它。
检查窄屏时，应该确认语言和币种仍然好找，键盘不会挡住必填项目，大标题换行也经过安排。不能只把桌面截图缩小后当作验收。横竖屏变化和较大字体，也应该单独看一遍。
判断实际体验，不只看技术名字
一个技术上很厉害的场景，也可能让访客困惑。评审时更值得问：用户记住了什么，是否理解业务，能否找到下一步，是否能够暂停。观察到的行为与关于收入和转化的推测，应该分开记录。
作品集展示不同业务的实际使用路径，互动实验室则提供更偏技术探索的设计。把两种角色分开，主站既能表达审美，也不要求每位访客研究技术。目标是有记忆点的第一印象，以及清楚的下一步，而不是为了运动而运动。
把“第一印象研究”放回正确语境
Tuch 等人在 2012 年发表的一项网站审美研究，使用 119 张真实网站截图研究第一印象。实验显示，在非常短的观看时间里，视觉复杂度和“是否像这一类网站”都会影响审美判断；较低复杂度和较高类别熟悉度通常得到更好的美感评价。这个结果对设计很有启发，但它不是转化率实验，也不意味着有设计感的网站都应该变得普通。
对小企业工作室更有用的理解是：可以保留一个强烈、容易记住的视觉想法，同时让导航、文字层级、价格和联系路径保持熟悉。这样既能展示设计能力，也不要求顾客先学会一套新交互。
给动效设一个预算
在开发之前列出所有会动的东西。哪一个负责建立氛围，哪一个解释关系，哪一个回应用户主动操作？如果多个动效做的是同一件事，就删掉一些。真正有设计感的页面，静止同样是节奏的一部分。
长页面还要决定离开视口后哪些渲染应该停止。访客已经滚到长文章区域时，首屏 Three.js 没必要继续用同样强度运行。离屏暂停可以减少无意义计算和电量消耗。具体帧率应该在目标设备上测试，而不是把某个数字写成普遍承诺。
高级效果开始前、运行中和停止后，信息都应可读。
- 01先呈现内容
设计好的静态页面已经可用。
- 02有目的地运行
用于氛围或清楚的操作反馈。
- 03按需要暂停
尊重用户控制，停止无用后台渲染。
- 04保留完整降级
失败不能让服务信息消失。
把控制和降级也纳入视觉系统
W3C 的 Pause, Stop, Hide 指南之所以存在，是因为持续运动可能干扰阅读和注意力。暂停按钮不应该像上线后补上的“保险开关”，而应该和网站设计语言一致。减少动态偏好、节省流量状态和 WebGL 失败也都应该有认真设计过的替代。
好的降级不是让画布变成空白。静态海报、颜色和标题构图仍然可以保持相同气质。这样高级渲染层在技术上是可选的，但品牌表达不会因此突然消失。
用真实业务任务检验动效
设计评审不要停在“这个动画挺丝滑”。给测试者一个任务：理解服务、比较价格、打开作品、切换语言、提交询盘。再观察动效是在帮助定位，还是在抢注意力。
我们的互动设计实验室把更技术化的操作单独放在一个空间，主站则更克制地使用氛围动效。这个分工是有意的：可以展示编程能力，但不用让每位潜在客户先操作 3D，才能知道我们做什么。
