创新性动画:界面动画的12个概念
生命在于运动,我们无法想象生活中如果没有运动会是什么样子。动画应用于我们每天使用的数码产品,动画的存在为这个数码时代增添了几分生气。关于界面动画,它存在的关键之处就是可以帮助用户更自然地感受到一个页面到另一个页面的转换以及更加直观的引导。合理的使用动画可以让界面更加清晰易用,毫无疑问,这就是用户对产品的期望。
今天的文章介绍了Tubik工作室设计人员为一些项目设计的概念性界面动画。
珠宝电商应用
这是一个珠宝电商应用。在界面动画中你可以看到用户如何从目录中选择产品,查看详细信息和评分。还可以加入购物车使用网络银行进行支付。视觉中心是这个产品的高清图像,图标使用了简约的线性风格,这样不会分散用户的注意力。整张界面使用了比较柔和的色调,在信息冗杂的界面中看起来也很舒适。
书籍交换应用
这是一个为需要交换书籍的读者而设计的社交应用。设计师选择了暗色调背景,因为这个应用中含有大量的图片,包括书籍封面和用户头像,所以暗色背景可以让这些内容看起来更高级。像“followers”和“following”是许多社交类应用的通用元素,设计师决定尝试优化这部分的空间,只留下了“ers”和“ing”
待办事项列表应用
这是为iphone设计的简单优雅的待办事项列表。该应用的基本功能是围绕用户创建待办事项和待办事项时间的任务列表去构建的。可以轻松删除或者标记为完成。此外,这款应用会分析完成进度,以保持用户的动力。简单的界面设计和经过深思熟虑的排版使内容具有高度的可读性,可以让用户在任何环境或者正在移动的过程中都可以轻松使用。
事件应用
这是一个比较简单的应用,它可以让人们看到柏林当天发生所有事件的列表。交互动画中展示了事件列表,数据会按照事件发生的时间进行排序,用户可以垂直滚动浏览。每张卡片会显示有关该事件的关键点:类型、标题、时间、事件的图像。感兴趣的用户可以点击卡片查看关于该事件的更多细节。
闹铃应用
引导页是界面的重要组成部分,可以帮助用户了解基本的交互。设计师使用三张引导页告诉用户应用的功能并创造出一个快乐的吉祥物作为整个屏幕的中心,在交互过程中共用一个元素让整个交互动画更加平滑顺畅。
闹铃类应用中的时间选择器是此类应用的核心部分,也是设计师和开发者要着重关注的部分。当用户设置时间时,屏幕上方的动画会随着时间改变。
另一个有创造性的动画是闹铃的开关,需要一个元素来表明闹铃处于激活状态。设计师的解决方案是在闹铃处于激活状态时,按钮看起来像是一个太阳。
使用动画会更加的生动和愉快,同时也增强了用户体验,使界面更具吸引力和趣味性。
该动画还显示了闹铃界面的另一个功能:当用户摇动设备时,选项卡上的标签全部随机混杂。它看起来很有趣,并且通过模仿自然的物理规律做出交互。这会让应用变得更加形象、有趣。
房地产平台的logo动画
这是一个网站的品牌标志,代表了一个多功能平台,用于不动产业务。使用了一个识别性较强的吉祥物,设计师在设计web界面中使用了动画,增强标志角色的欢快本质。
动画插画
这是为一家营销创业公司做的动画,设计任务是做一个具有创造力的弹窗。画面中的插图具有象征意义:火箭代表有效和快速的业务进展,向上的一个运动趋势则代表了业务的动态增长。
天气应用的交互动画
这个例子是一个简单但很有吸引力的天气交互动画。它提供给用户的功能之一是能够查看当天和未来几天的日落时间。设计师使用了城市的景色插图并且让他们动起来。
社交网络教程
这个例子是针对社交网络应用做的动画。目的是要通过动画对用户起到教程的作用,并且采用一种令人愉悦的方式来展现应用的主要功能。
医疗保健应用
这是一个医疗类的应用,主要目标是优化医生定期处理的大量数据。对于每一位患者的每一条信息都作出正确的判断是至关重要的,因此整个界面要规整有序,使其清晰易用。更加直观的导航使中低技术水平的人也能很好的操作。界面中添加了一些动画转换:输入数据、操作完成、接收完成。
社交应用教程
活泼的动画、明亮的色彩,不仅让用户了解应用,而且可以在打开app的第一时间就营造出了一种积极的气氛。
计算器应用
生活中不仅是严肃的工作,有时候我们希望做一件事的时候给我们带来一些趣味性。计算器是我们平时经常使用的工具,我们希望除了得出答案以外再多一些互动。例如在想要归零时晃动手机,我们认为这很酷。