下载安卓APP箭头
箭头给我发消息

客服QQ:3315713922

交互设计的APP导航模式大比拼

作者:课课家教育     来源: http://www.kokojia.com点击数:1149发布时间: 2016-12-09 08:00:27

标签: 交互设计app设计界面设计

  交互设计(InteractionDesign)是指设计师对产品与它的使用者之间的互动机制进行分析、预测、定义、规划、描述和探索的过程,即定义人造物的行为方式。下面为大家分享八种移动app设计的风格,当我们确定了移动APP的设计需求和APP产品设计流程方案之后,就开始动手设计原型图,往往在这时候我们就会考虑到时是怎样的组合起来才是最好的选择呢?也许我们对比和了解一些其他常用的APP导航设计模式。而且良好的APP导航设计模式决策对整个app的核心体验起到关键作用。

  首先先来看看八种移动APP导航设计模式对比图。

交互设计的APP导航设计模式大比拼_交互设计_app设计_界面设计_课课家

  第一种:App标签导航

     标签导航基本位于页面底部方便切换,5个标签是比较合适的数量。这种导航在APP界面是非常常见的,如果你的应用需要用户频繁分页切换,可以采用这种导航。它的缺点是会占用一定高度的空间的APP界面设计图。

标签导航  第二种:APP舵式导航

  目前流行一种标签导航的变体,个人把它称为“舵式导航”,因为它的样式很像轮船上用来指挥的船舵,两侧是其他操作按钮。当页面有处于同一层级的几大部分内容,同时又需要一个非常重要且频繁操作的入口,就可以采用这种APP导航模式。

陀式导航  第三种:APP抽屉式导航模式

  抽屉导航是菜单隐藏在当前页面后,点击入口即可像拉抽屉一样找出菜单,这种导航是节省页面展示空间,让用户将更多的注意力聚焦到当前页面。比较适合于不需要频繁切换内容的应用,对设置和关于等内容的隐藏。这种导航设计需要注意的是一定要提供菜单滑出的过渡动画设计。这种抽屉式导航菜单非常受到大家的喜爱,

抽屉式导航  第四种:APP九宫格导航

  这种宫格导航是将主要入口全部分类聚合在同一个页面上,让用户作出选择。这样的方式无法让用户在第一时间看到内容,在界面选择压力较大,采用这种导航的应用的APP设计已经越来越少,往往用在二级页作为内容列表的一种图形化形式呈现,或是作为一系列工具入口的聚合来使用。

宫格导航  第五种:APP混合组合导航

  当用户需要聚焦内容,同时又需要一些快捷入口能够连接到某些页面界面时就可以采用组合导航。组合导航上方用宫格的形式展现快捷入口,与标签导航不同的是,这些宫格入口之间不需要是平级的关系,也不必包含整个层级的内容,你可以将它理解为一种图形化的文字链。这种导航比较灵活,能适应架构的快速调整。

混合式导航  第六种:列表式APP导航

  APP导航页面通过列表的形式表达出来,是我们在APP设计种必不可少的一个信息承载模式。当然作为一个APP的软件导航也是非常方便的。不过目前来看,列表导航通常用于二级页面,由于它与宫格导航一样,不会默认展示任何实质性的内容,所以通常app不会在首页使用它。这种导航结构清晰,易于理解,冷静高效,能够帮助用户快速的定位去到对应的页面。列表项目可以通过间距、标题等进行分组。

列表式导航  第七种:TAB导航

  tab导航适合于二级页面,本质和标签导航相同,当应用层级较多的情况下可以采用tab导航,典型场景是用于改变的当前的视图状态,或对当前页面内容进行分类查看的表示方式。

tab导航  第八种:大图轮播导航设计

  当你的应用信息足够扁平,可以尝试轮播导航,如果应用得当,能够给人耳目一新的体验。这种导航能够最大程度的保证应用的页面简洁性,操作也是最方便的利用转盘的方式表达内容,。但是缺点是不能够快速的定位对应的分页内容问题。

轮播式导航  总结:以上八种界面设计方法在APP导航页面也挺常见,作为导航页面和二级页面的使用,各有各的设计风格,都是经过分类和展示方式来表达,结构清晰,易于理解,希望在交互设计上能给你在构思流程的时候给予帮助和参考,APP导航的界面影响整个APP功能的核心。如果你还有更好的移动APP导航设计模式,也可以分享给我们喔,关于更多交互设计的知识尽在课课家在线教育

赞(18)
踩(0)
分享到:
华为认证网络工程师 HCIE直播课视频教程