Figma怎么做进度动画 波浪感进度动画的制作方法

金珍妮            来源:优草派

你是不是经常在进入网页和进入app的时候,看到一个进度动画。这个其实是在我们的界面设计中非常有用也是非常重要的一个部分,因为我们可以通过进度动画来知道我们的使用进度以防止我们退出界面。今天小编为大家带来的就是,Figma怎么做进度动画的方法解答。赶快和小编一起来看看吧!

Figma怎么做进度动画 波浪感进度动画的制作方法

1.首先第一步,我们需要在AI中绘制好波浪,然后根据我们的需要在数值面板中修改一些数值。

2.第二步,打开我们的figma软件,绘制一下圆形边框的样式,可以多绘制几个制作不一样的渐变效果。

3.第三步,将波浪添加至我们的容器内,并且在这一步中调整一下样式,将波浪的纹路在圆形的图标中设置一下位置,根据你喜欢的感觉来设置,注意要做出前后对比的效果。

4.第四步,移动一下两个波浪的水平位置,要进行反方向的移动。

5.复制一下画板,定位好波浪的终点位置,也是反方向的设置。

6.接下来,我们创建一下组件集,将波浪组件复制进绘制好的界面内,并且添加交互。

7.最后我们检查一下我们的画面,然后演示一下动画效果,就完成啦。

以上就是小编为大家带来的,Figma怎么做进度动画的方法解答。希望对各位正在学习UI设计和正在学习Figma软件的小伙伴们有所帮助哦!

【原创声明】凡注明“来源:优草派”的文章,系本站原创,任何单位或个人未经本站书面授权不得转载、链接、转贴或以其他方式复制发表。否则,本站将依法追究其法律责任。
TOP 10
  • 周排行
  • 月排行