在
网页设计过程中我们考虑具有良好体验的交互动画是非常有挑战性的，太多了会分散注意力。太少了设计感觉扁平。环境动画是中间地带——微妙、缓慢移动的细节，可以在不抢尽风头的情况下增加气氛。
与基于时间线的动画不同，基于时间轴的动画讲述一系列事件的故事，或在有人触摸某物时触发的交互动画，环境动画是你一开始可能不会注意到的那种被动运动。但是它们以微妙的方式使设计看起来栩栩如生。
在环境动画中，元素可能会在颜色之间微妙过渡、缓慢移动或逐渐移动位置。元素可以出现和消失、改变大小或可以缓慢旋转。环境动画不是侵入性的;它们不需要关注，不会分散注意力，也不会干扰某人在使用产品或网站时试图实现的目标。它们也可以很顽皮，当人们看到它们时会微笑。这样，环境动画就可以增加品牌个性的深度。
并非页面或图形中的所有内容都需要移动，设计环境动画的一部分是知道何时停止。诀窍是选择自然适合微妙运动的元素，而不是强迫运动进入不属于它的地方。当我决定制作什么动画时，我会寻找自然的运动提示，并考虑什么时候会在现实世界中自然移动。我问自己：“这东西有重量吗？”“它有弹性吗？”“它在现实生活中会移动吗？如果答案是“是”，那么如果它移动，它可能会感觉正确。动作吸引眼球，即使是细微的动作也有视觉分量。因此，我将最明显的动画保留给我需要产生最大影响的元素。
如果您希望动画给人一种环境感，更像是氛围而不是动作，那么遵循一些原则会有所帮助。这些不是硬性规定，而是我在制作烟雾、闪光、眼球和眉毛动画时学到的东西。环境动画应该让人感觉轻松，因此请使用更长的持续时间并选择感觉有机的缓动曲线。我经常使用 ，但当您想要更轻松的感觉和自然界中可能发现的那种运动时，立方贝塞尔曲线也会有所帮助。硬重置或突然跳跃会破坏情绪，因此如果动画循环，请确保其流畅循环。为此，你可以匹配开始和结束关键帧，或者将 设置为值，以便动画向前播放，然后向后播放。
环境动画的要点是它不会占主导地位。这是一个背景元素，而不是号召性用语。环境动画就像一道美味佳肴的调味料。这是你几乎不会注意到的盐，但当它消失时你会错过。它不会大喊大叫，而是低声说。它不会引导，而是挥之不去。它是漂浮的烟雾、摇曳的羽毛和你眼角余光的闪光。如果做得好，环境动画会为设计增添个性，而无需掌声。
