浅析移动应用的导航模型

和网站一样,移动应用也具有自己的信息架构,根据应用的性质以及">核心功能界面之间的关系,来对其采用合理的信息结构,此时,移动应用的导航模型便起到了穿针引线的效果,一个好的导航将使得应用的信息架构清晰明了,且操作简单高效。 移动应用的导航模型基本包括 平铺页面、标签tab、树形列表、九宫格、以及目前较为流行的左侧列表等,以下针对几种常见的导航模型进行简要分析和比较,以帮助我们选择最合适的导航模型,提升移动体验。

模型一:平铺页面

平铺页面,顾名思义就是一张或者一叠纸片,平铺展示给用户,用户通过左右拂动来切换不同的页面,它适用于没有信息层级,没有组织架构,且每个页面的界面类型一致的应用,一般在短小精炼的功能工具性应用较为常见,比如IOS自带的天气预报。平铺页面模型的优点在于“页面”元素的数量和顺序可以随意改变,且分页标签高度只有6px,可供内容展示的区域大;缺点在于页面数量不能太大,否则浏览起来麻烦,用户还需记得哪个“点”代表什么内容;

模型二:tab标签栏

这种类型的导航模式最为常见,它将界面最下方的区域作为导航区,通过tab标签的形式划分为3至5个标签,每个标签对应不同功能。这种模型适合功能精炼层级较少且需要频繁切换功能的应用;它的优点在于可以直接将最核心的tab界面最为默认选中状态,用户打开应用时便直接呈现出用户最关心的信息内容,比如社交应用的信息流,邮件应用的收件列表等;同时,用户可以在大部分页面中直接切换tab标签而轻松跳转页面,并清晰告诉用户该应用的主要功能以及当前所在功能;缺点在于tab标签数量有限,IOS HIG建议不超过5个标签,如有超过的功能菜单则统一放在“更多”标签中;同时,该标签占据50px高度的区域,且在大部分界面中始终存在,占据着10%的信息展现区域。

模型三:树形列表

树形列表形式的导航模型在邮件系统比较常见,它将每一级别的功能通过list列表形式展现,点击之后展开下一级的lis列表,如此类推直到最终的功能展现界面。这种导航模型的优势在于可扩展性大,能应对具有大量的类别、功能和项目的应用,比如购物分类等,这种list的组织形式在web中比较常见,用户容易理解,并且可满足用户自定义列表的需要,比如对列表进行新增、删除、排序等,微信的应用插件模式也采用了列表来展现。树形列表的缺点在于层级深,父级的所有其它列表在子列表中不可见,必须要返回到上一级,来回返回比较麻烦,往往从一个子功能切换到另一个子功能时需要在漫漫路途上“奔波”;

模型四:九宫格

九宫格也是目前普遍使用的一种导航模型,它将应用的所有一级功能纵横排列在首页,多用简洁或精致的图标展示,同时配合功能菜单文字,因此首页效果漂亮,可供设计师发挥的空间大。九宫格导航适合有多个同等重要频道的应用,特别是大而全的平台级产品,比如facebook、QQ朋友、人人等;不过九宫格的缺点也比较明显,其图标数量要适中控制,过多则可能出现左右分页,过少则可能为了堆砌菜单而在首屏添加不必要功能;同时菜单图标的横竖排列使得眼动轨迹往返移动,如果数量过多,则导致视觉定位频繁,识别率下降,不如列表来得顺畅利落;在九宫格导航模型中从一个子功能切换到另一个子功能时需要返回到主导航界面,操作效率底,所以越来越多的应用通过添加快捷操作来实现快速返回到首页,比如facebook点击导航栏的中央区域来回到首页;九宫格最大的缺点在于需要先选功能才能使用,无法去追求那个最刚性最频繁最唯一的东西,并让它直接展现给用户,九宫格容易让产品设计者停止做这样的思考,相比之下,tab标签导航便通过默认选中标签来实现了这一目标。

模型五:左侧导航

随着path出现,左侧导航可以说脱离了传统的ios交互结构,这种新颖的导航模型也越来越受到大家的青睐。可以说左侧导航是集众家之所长,取其精华去其糟粕,具有无限的功能拓展性,可实现用户自定义;界面逻辑清晰,物理层次明了;视觉上搭配精美icon图标,眼动轨迹垂直单一,视觉负担小;且不像九宫格专用首页来展现导航,左侧导航将首页展现的舞台留给了最核心的功能,它仅是一个“附属功能”,随叫随到,不喧宾夺主,却又给人留下深刻印象;所以我们可以看见越来越多应用采用了这种导航模式,如最新版的facebook、QQ朋友、National Parks等等,可谓时下潮流;当然左侧导航目前在一些应用中也存在不足,比如调用该导航时必须到首页点击左上角的“列表”图标,而不能在任何界面通过某种手势来随叫随到。

源地址:http://www.zleee.com/inde……/navigations/

时间: 2024-09-24 18:38:33

浅析移动应用的导航模型的相关文章

浅析:SEO通用优化模型

今天爆老师和大家分享的话题是<SEO通用优化模型>.SEO优化是有套路可循的,我把他们总结成一个通用优化的模型,并且将其中的优化元素按照人为可控性再做了一个模型,这样你就知道优化解决的是什么,能够被自己控制的是什么. 首先我们来看一下这个SEO通用优化模型,在爆老师的概念里优化是可以分成三个阶段的分别是被找到,被识别,被认可.在这三个阶段中分别代表的是收录量问题,关键词排名问题和网站权重问题.对于很多新站或是小站而言,这三大问题是一直伴随着他们的,所以通过优化模型来找到哪些优化点是用来解决哪一

浅析智能手机的多任务导航

多任务,顾名思义就是同时多个不同的任务(废话).多任务是先进的PC所需要具有的最基本功能之一,也正因为如此微软才将自己的操作系统定名为Windows. PC上的Windows发展到今天,多任务的功能已经有了很大的变化,但是一些最基本的思想仍然没有变化. 每个任务都以独立的窗口表示所有的任务窗口都显示在任务栏上可以通过任务栏或快捷键在不同的任务窗口之间切换使用快捷切换任务时,会在最前端出现一个覆盖式的提示窗口 这一切在PC上表现的是如此自然,以至于让人们忽略了多任务这个概念.直到智能手机有一天,也

交互设计实例分析:移动应用的5种导航模型设计

文章描述:浅析移动应用的导航模型. 和网站一样,移动应用也具有自己的信息架构,根据应用的性质以及核心功能界面之间的关系,来对其采用合理的信息结构,此时,移动应用的导航模型便起到了穿针引线的效果,一个好的导航将使得应用的信息架构清晰明了,且操作简单高效. 移动应用的导航模型基本包括 平铺页面.标签tab.树形列表.九宫格.以及目前较为流行的左侧列表等,以下针对几种常见的导航模型进行简要分析和比较,以帮助我们选择最合适的导航模型,提升移动体验. 模型一:平铺页面 平铺页面,顾名思义就是一张或者一叠纸

J2ME编程最佳实践之屏幕导航

编程|导航 除了游戏程序,在通常的MIDP应用程序中,通常会有很多个Screen或Canvas,这些屏幕一般靠命令来实现切换,比如用户点击"Next"应该跳到下一屏,点击"Back"应该返回到上一屏.当屏幕数量相当可观时,如何在各个屏幕之间导航就值得好好考虑了. 经典的MVC模式可用于屏幕导航,Model用于存储应用程序数据,而View则是各个Displayable对象,Controller需要单独的一个类实现.由于MIDlet类本身在生命周期内就只有一个实例,因此

在 Windows 应用商店应用程序中导航的基础知识

确保用户能够随时快速而轻松地访问所需内容是任何新型应用程序的一个必不可少的特征 .这意味着,在用户需要进行导航之前,导航方式不得干扰用户操作,并且不得强制用户做 出难以逆转的选择.这是一种称为"内容在版式上方"的 UI 设计技术.强制实施此设计模 式的最佳方法是将大多数导航直接置入到内容中.可以在 Windows 应用商店应用程序中轻松 实现这一点,因为它们遵循此导航设计原则. Windows 应用商店应用程序导航概述 在 Windows 应用商店应用程序中,开发人员将导航置入到内容中

《jQuery Mobile快速入门》—— 2.3 Ajax驱动的导航

2.3 Ajax驱动的导航 jQuery Mobile快速入门在上面提到的多页面案例中(见程序清单2-3),我们了解到jQuery Mobile如何从一个内部页面导航到另外一个内部页面.当多页面文档在初始化时,内部页面已经添加到DOM中,这样从一个内部页面转换到另外一个页面时,速度才会相当快.在从一个页面导航到另外一个页面时,我们可以配置要应用的页面转换类型.默认情况下,框架会为所有的转换应用一个"滑动(slide)"效果.在本章后面,我们会讨论可以选择的转换和转换类型. 当一个单页面

[体感游戏]关于体感游戏的一些思考(五) --- 导航

正如我在第二篇博文提到的:在3D虚拟世界中导航是一项充满挑战性的工作.导航模型的实现并不难,难的地方在于设计一个可以让人感觉比较舒服,不会造成玩家总是出现感知上的困难的3D水平.我们真的生活在3D世界中吗? 我们的一生几乎都是靠双脚.我们没有和鸟类或者会飞的昆虫等同的3D体验.此外,我们还对完全自由的运动有所恐惧.想象一下行走在一个你可以往任意方向移动的丛林里,你总是要花心思去选择你该走的路,你会感觉安全吗?现在想象那里有一条路让你走,甚至是一个有大路和人行道的城市?让我们再想想第二篇博文讨论的

为 ADO 程序员设计的 ADO.NET (2)

ado|程序|程序员|设计 转换现有代码有许多 ASP 页面使用 ADO 对象来抽取数据.让我们来讨论几种典型的情况,您在不久的将来移植和改编代码时可能会遇上这些情形.如果您有从单个记录集生成报表的 ASP 页面,DataReader 对象将是您最好的伙伴.您浏览 DataReader 对象时,它会将结果输出到页面. String strConn, strCmd; strConn = "DATABASE=MyAgenda;SERVER=localhost;UID=sa;PWD=;";

Java Persistence with Hibernate中文版Hibernate实战第2版出版

Java Persistence with Hibernate中文版Hibernate实战第2版出版 图灵出版社官方Hibernate实战(第2版)链接为: http://www.turingbook.com/Books/ShowBook.aspx?BookID=260 书 名: Hibernate实战(第2版) 评论星级: **** 书 号: 978-7-115-17448-2 原 书 名: Java Persistence with Hibernate 原出版社: Manning Publi