这四个动效小趋势,让你可以把网页设计得更加圆融
随着交互设计重要性的提升,动效也越来越被设计师所重视。它不仅仅是取悦用户的工具,而且被视作为改善用户体验的重要手段。从为界面营造氛围的微小动效,到用来沟通用户的视觉线索,动效解决方案越来越全面。
尽管我们在实际运用的过程中,经常需要测试和试验效果,但是依然有一些经过验证的、可行性较高的动效,可以直接拿来使用。今天我们所探讨的四种动效,都贴合趋势,且颇为实用。接下来,我们一起探索吧!
一、弹性动效
有趣而优雅的弹性动效每天都能看到。通常,弹性动效是短暂而优雅的,它常常能够吸引用户的注意力。成功的动效通常不仅依赖于设计师的设计,还需要代码实现,以及贴合物理规律的微积分函数作为支撑。在很多时候,这种看起来涉及物理学的动效,很难创新。不过事实上,关键还是要看你如何实现,以及在哪里实现这些动效。如果你对于 Velocity.js 和 WebGL 这些工具一无所知,也能用CSS实现它。最受欢迎的弹跳动效包括:
类似弹簧一样,快速拉伸变大,然后迅速压缩成所需的形状,在打开某个组件的时候强化视觉,通常,这个过程都很短暂。
平滑的充满流体动感的动效,伸展,浮动,然后收缩为初始状态。一般而言,它会持续地弹跳,营造氛围。
在具体的实施的过程中,设计师通常会合理地选择两种动效作为支撑。比如 LatinoMedios 和 Oprette 都使用弹性动效来增强控件的打开体验。前者采用了圆润流畅的弹性动效,而后者则采用了弹簧式的动效,更加抢眼。
二、变化的LOGO
花上几秒钟看着LOGO逐渐变化,似乎是一件颇为浪费时间和资源的事情,但是在很多时候,它是非常有效的设计。作为品牌标识的一部分,LOGO 承载着品牌信息(特征、风格、元素、色彩等),也关乎审美。虽然LOGO在网页中占据的位置并不大,但是它非常吸引眼球,在用户心目中也会被视作为重要的组件,并不会被那么轻易被忽略。
三、有意义的加载动效
是时候和无聊的等待加载的沙漏说再见了。优秀的加载动效已经越来越智慧和复杂了。
讲真,现如今的加载动画已经是聚光灯下的重要设计元素了。从最初简单的设计,到如今加载动效成为了承载着重要作用的小动画,它不仅告知用户这个等待过程进度,而且通过愉悦用户,增强了整个用户体验。
四、动画化的汉堡图标
尽管这个由三条横杠组成的小图标在很久之前就已经失去其魅力了,但是它如今依然无处不在。所以,不少设计师还是尽量想为这个图标注入更多的的魅力。你无需重新造轮子,不用进行复杂的重设计,你只需要为汉堡图标添加一个有趣的动效就能产生为它注入生命力。让它与周遭的设计融合起来,对于用户更加友好即可。
结语
并不是每个人都会注意到动效,但是动效的加入让体验更加优秀了却是不争的事实。这也是为什么它会成为时下流行的趋势。通过审视熟虑的设计和实现,界面在动效的驱动下却是会更上一层楼。许多东西看起来是不言自明的,但是在动画效果的加持下,逻辑和关系会更加顺畅,重要的还是易于理解和更优质的体验。
-
2021/12/27
-
2021/12/22
-
2021/12/16
- 爱华仕斩获“2021年度中国厨卫行业年度智能
- 回首2021,迎战2022 彩虹线开启新征程!
- 福临板材|福满2021,圆梦2022
- 美特照明:2022年照明新趋势,经销商如何做大
- 会自己“洗澡”的集成灶,帅康自动清洗集成灶
- 带你设计一款功能多变,简单实用的休闲露台阳
- 世纪豪门吊顶:破防了!原来颜值+实力=H20
- 装修木门选的好,噪音统统没烦恼
- 寒潮来了,有淋浴房洗澡更保暖舒服
- 元旦特辑:欧意电器述说生活的点滴与美好
- “中国十大品牌”获奖名单出炉,赛戈水漆荣耀
- 2021值得消费大赏 凯迪仕智能锁荣摘两项桂冠
- 益恩家居:新年新气象,爱自己从好好睡觉开始
- 元旦伊始:健康新生活,从精格管道直饮水开始
- 喜迎元旦|新年新灯饰 箔晶智能照明让酒店暖
- 吉美帮的2021 “专精特新” 深耕屋面防水体
- Aqara携手京东成立灯光设计联盟 打造灯饰照
- 年底厨房焕新颜,如何选择厨电?好太太智能来
- 全铝家具全屋莫兰迪色系,这款美式轻奢范赢邻
- 顺趋势·筑凤巢·赢未来 凤梧居门窗2021年会隆