很赞值得收藏：浅析动效在UI设计中的作用

　功能变化<br><br>　　在许多案例当中，设计师会强行设计一个可点击的按钮，在特定情况下，功能会发生改变。在移动端设计中，由于屏幕空间的限制，我们常常会看到这样的按钮。

01f71b58c35520a801219c77ede99a.gif

01cd4d5b888850a80120245c387f02.gif

小练习

0117d659103fd9b5b3086ed4d991ee.gif

UI界面-AE动效

01a2bc58ff51e1a801214550c4b824.gif

019vmfpg9b1bhmpvbbaeia3735.gif

AE练习动画

Principle教程（四）：动效视图的运用（附源文件）

013b54585fe5c2a8012060c8c4f576.gif

01d6df5ef07856a801206621aa1418.gif

动效设计存档

0104e15a9dffefa801219586a95325.gif

交互动效练习

01e4275915448ca801216a3e129f80.gif

principle做的第一个动效界面

01d6835efadf5fa8012066211c0c56.gif

动效练习一

0121be5a938101a801219231ead6d2.gif

练习：小动效

0187405b554871a80121ade0c6fe56.gif

个人作品集

01b9e259b794cea801211d25efd71d.gif

动效练习

01b3095b865c03a8012126ce611341.gif

动效

01163b5a4496c5a801219741b6d95f.gif

UI动效作品合集

01113a5f8abbab11013f3110866ff8.gif

【字演生肖】这是大（dai）王文字编排实验11

站酷推荐文章作者

高高手老师

站酷2022年度创作者

01wmown46yzluqr0exzbkv3637.gif

011e705d4044d5a8012187f49b9b42.gif

Preview

01afb858d35ffda801219c770239ef.jpg

“练习”

0176a65b73f7cea80120d8c0ce0843.gif

动效作品

0109cf5af1061ca801219b7f010359.gif

卡片动效

0173655ab625c2a80120be14e8f644.gif

小动效

0128d661e9804c11013f01cd9d67ab.gif

AE动效

01abd455424f220000019ae9cf4574.jpg

手游界面设计

01aab658c0ef7ba801219c77945fda.gif

Film Interface

01d0b25978118fa8012193a3b25e26.png

Demo20170726

01650f587dc961a8012060c894e9d6.gif

继续ae动效

01cafnhyamhww4qdlvvojy3435.jpg

01el85lnnresdqahpftvwr3339.gif

引导页动效

这是个写日记的应用，跟平常的日记应用的交互可能有点不同。但如果目标用户为比较年轻的用户，学习能力比较强，通过第一次使用时的指导，基本就能学会，不太符合用户习惯，又有何不可呢。刚打开这个应用展示的只有前一次的记录内容，左滑该卡片即可进入今天内容的编辑界面。右滑该卡片即可查看以往的记录。下滑可以选择日期查看。 以上只是练习时的一些想法，实际当然更要考虑用户 使用场景 以及目标等等因素。

016a015a0e76aba801204a0ea5980a.gif