优草派 > 视觉设计

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

金珍妮         优草派

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

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

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

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

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

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

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

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

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

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

  • 微信好友

  • 朋友圈

  • 新浪微博

  • QQ空间

  • 复制链接

取消
5天短视频训练营
新手入门剪辑课程,零基础也能学
分享变现渠道,助你兼职赚钱
限时特惠:0元
立即抢
新手剪辑课程 (精心挑选,简单易学)
第一课
新手如何学剪辑视频? 开始学习
第二课
短视频剪辑培训班速成是真的吗? 开始学习
第三课
不需要付费的视频剪辑软件有哪些? 开始学习
第四课
手机剪辑app哪个好? 开始学习
第五课
如何做短视频剪辑赚钱? 开始学习
第六课
视频剪辑接单网站APP有哪些? 开始学习
第七课
哪里可以学短视频运营? 开始学习
第八课
做短视频运营需要会什么? 开始学习
【原创声明】凡注明“来源:优草派”的文章,系本站原创,任何单位或个人未经本站书面授权不得转载、链接、转贴或以其他方式复制发表。否则,本站将依法追究其法律责任。

客服热线:0731-85127885

湘ICP备19005950号-1  

工商营业执照信息

违法和不良信息举报

举报电话:0731-85127885 举报邮箱:tousu@csai.cn

优草派  版权所有 © 2024