背景动效自由！4步搞定Figma循环光效动画

今天我要分享一个超实用的设计技巧——如何用Figma制作无限循环的页面背景光效动画！
 
简单4步，打造循环光效动画
第一步：建立光效形状
一切从基础开始！首先，你需要在Figma中创建一个形状，比如一个500×500像素的矩形，并为其设置颜色和透明度。为了让光效更有层次感，记得给它添加一个明显的模糊效果——这里建议使用 Layer blur 200，模糊的参数可以根据你的设计需求自行调整。
 
第二步：制作四帧动画
光效的魅力在于它的动态表现。通过创建4个不同的Frame（帧），你可以定义光效的运动轨迹。按照图片的说明，把形状逐步移动到不同的位置，形成一个顺时针的运动路线。这4帧将是动画循环的核心。
 
第三步：调整动画参数
现在是让动画“活”起来的时候了！在Figma的Prototype模式下，为每个Frame设置跳转逻辑。
- 触发方式：选择“After delay”，设置延迟时间为1毫秒，这样动画就能流畅地从一帧跳转到下一帧。
- 动画效果：选择“Smart animate”，让Figma自动帮你优化动画的过渡效果。
- 时间参数：特别注意的是，Frame 2到Frame 3，以及Frame 4回到Frame 1的动画时间需要延长到4000毫秒，这样可以让光效的运动更加柔和、自然。
 
第四步：完成循环效果
当所有参数设置完毕后，你的动画就完成了！通过Figma的Prototype功能，这4帧会自动无缝循环，形成一个令人惊艳的背景光效动画。
 
利用Figma的Prototype功能，你可以快速创建出无限循环的光效动画，为你的设计作品增添活力。别犹豫了！快打开Figma，动手试试这个炫酷的技巧吧！