动效练习
2018-07-25 本文已影响0人
小鹿大概不是我
月账单载入动效
这是当时在做iVoka Mini X的账单功能后续的一个优化方案。
对于线上的版本,因为开发时间等种种原因,效果并不理想。因此尝试以下的优化方案:
1.用饱和度较低的色彩和线性图标、细字体等的搭配,使页面设计轻盈化
2.加入载入动效,使页面更活泼
3.弱化列表感,通过色彩区分列表
记账本的月账单页面载入动效设计
机票搜索页面的动效设计
这是看到网上的一个screen,非常喜欢,尝试丰富了细节和后续页面。
1.用阴影和色块替代常规的分割线,页面更整洁、生动。
2.用飞机元素去标示交互路径
3.模拟飞机飞行路线动画
机票搜索页面的动效设计
较早的一个机票搜索页面动效
14年左右的一个设计练习。当时页面搜索结果加载会比较慢,尝试使用动效来缓解用户的等待焦虑。
1.原搜索页面都为表单输入,比较单一,加入插画丰富视觉元素
2.点击搜索后模拟飞机起飞滑行效果,而点击的同时,后台已经在开始搜索,大大缩短下一列表展示界面的加载时间。
3.列表项也模拟飞机看板的翻转,经常飞行的人对看板的这个效果比较熟悉,增加亲和力。同时,也能缩短列表的加载时间。
4.将抵达城市的设为背景图,画面更丰富且熟悉。
机票搜索页面动效