码迷,mamicode.com
首页 > 移动开发 > 详细

挖掘创新!2014年APP交互设计10大趋势

时间:2014-06-07 10:44:47      阅读:241      评论:0      收藏:0      [点我收藏+]

标签:c   blog   a   http   tar   ext   

在移动互联网飞速发展的这几年,每年都会有一些新鲜的设计趋势涌现出来。2014年,又有哪些新的设计趋势脱颖而出呢? 百度MUX有一群关注趋势的小伙伴,从大量的APP中去发现设计范式,挖掘设计趋势,预测出2014年在移动产品中会被广泛应用的十大交互设计趋势。希望这些新颖的设计模式,为设计师们带来创新设计灵感,进而为用户带来新鲜有趣的体验。

bubuko.com,布布扣
图00

  1 转场动效的极致平滑(TRANSITION ANIMATION IS SMOOTH EXTREME)

  移动APP越来越强调沉浸式的体验,页面和页面之间切换也需要更加的流畅,转场动效需要更加的极致和平滑。如果你还没有为你的APP提供转场动效,那么你已经落伍了,如果你还是使用比较传统的转场动效,如向左滑动、放大缩小,那么你的体验也已经落伍了。平滑无缝的切换和体验,信息需要没有阻力的传递,用户需要集中注意力,专注于目标任务来进行一系列的操作。我们相信,优先注重转场动效的移动产品,会有极大的产品竞争力。

bubuko.com,布布扣
图01

bubuko.com,布布扣
图02

bubuko.com,布布扣
图03

  Yahoo! New Digest  Making of Making Facebook Paper

  Yahoo! New Digest/Making of Making/Facebook Paper,都对转场的动效进行了精心的设计,平滑流畅的体验让我们眼前一亮。

  设计师设计移动APP的的动效,需要像导演一样,布局不同场景中,界面元素的登场方式,不同元素之间的出现、运动、消失要足够的连贯。必要时,信息框架需要优化重构。动效的语义需要保持一致,避免认知的混淆。如果使用拟物化的动效语言需要符合物理定律。

  2 多样化新手引导( VARIOUS GUIDANCE)

  静态图片或蒙灰图层的新手引导容易被用户忽略,眼前一亮的新手引导才能让用户有学习的欲望与冲动。新颖的新手引导往往会突破静态图片这种方式,通过生动的故事、吸引眼球的动效、场景化的图片、语音引导及视频小短片等新颖的新手引导突破静态图片的方式,吸引用户的眼球。

bubuko.com,布布扣
图04

  Hue

  视觉动效类的引导,各种视差动效、过渡动效、入场动效、强化动效等等多种多样,”Hue”通过动效将功能及引导元素串联起,活泼的展现在用户面前,也不失为一种吸引眼球的方式。

bubuko.com,布布扣
图05

  为Ta闹钟

  语音视频类的引导,”为ta闹钟”则直接应用一个制作精良的动画短片让你了解APP的使用场景,激起用户对功能的尝试欲望。

  另外,Facebook paper的新手引导使用真人语音配合动效教学基本的操作手势,而且是一步一提醒的交互形式,非常简单、”醒耳”。

  3 信息框架扁平化(FLAT INFORMATION FRAMEWORK)

  APP设计中一个比较重要的设计因素,是效率的最大化。2013年我们追求界面扁平,注重通过弱化视觉效果,来强化功能主义,界面风格的扁平化,还远远不够,2014年应该从信息架构角度,再进一步的去应用扁平化的设计理念,这就是信息架构的扁平化趋势。

  信息框架扁平目的是减少信息层级,追求信息到达用户的最短距离。通常,移动APP的层级关系不比网页直观,不不存在面包屑或是站点地图允许用户任意跳转。纵深的返回机制会增加用户操作成本,扁平的信息框架会从根本上解决上述问题。

bubuko.com,布布扣
图06

  Google Now

  Google Now使用卡片式列表框架展示信息,把用户需要的信息展示在首页,将搜索结果前置,省去输入、点击和页面跳转的步骤,让用户更快捷的获取所需要的信息。

bubuko.com,布布扣
图07

  Drippler

  Drippler主要提供和自己设备相关的提示、软件更新等所有信息。首页以瀑布流的方式展示信息,支持顶部下拉菜单进行筛选,省去更多分类入口,缩短用户到达信息详情页的步骤。

 获取更多更新的行业资讯请关注微信公众平台:蓝蓝设计bubuko.com,布布扣

挖掘创新!2014年APP交互设计10大趋势,布布扣,bubuko.com

挖掘创新!2014年APP交互设计10大趋势

标签:c   blog   a   http   tar   ext   

原文地址:http://www.cnblogs.com/lanlanwork/p/3770154.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!