服务与支持 |咨询热线 0931-8733767
  • 金城在线
  • 公司简介
  • 发展历程
  • 企业文化
  • 售后服务
  • 工作机会
  • 联系我们

智能手机应用界面的导航设计分析

来源:发布时间:2017-8-10 10:14:26

        导航(Navigation)是指引用户从一点行动到另一点的方法,常见于互联网网站设计。艾伦?库伯(Alan Cooper)认为任何将用户带到新的界面部分、定位对象、工具或者数据的动作都是导航。在一个网站中,由于全部信息无法展现在一个页面以内,因此需要提供页面之间跳转的链接。导航正是组织和引导这些链接的媒介,以帮助用户高效完成任务。正如道格拉斯?〖?范杜月(Douglask.Van Duyne)等人提出用户不是总能找到链接,并且不知道链接会将其带到何方,因此导航是每个网站中的重要模块。不仅如此,用户还能通过导航了解网站中页面与页面、页面中内容与内容之间的关系。由此得出,导航是用户动作触发的指南针,在整个体验过程中起到关键作用。


        常见的互联网网站导航按作用主要分为三种类型:公共导航、结构化导航与关联性导航。公共导航:页头导航和页尾导航是构成网站公共导航的形式,它们出现在网站的每一个页面。显示常用信息、常用操作链接或按钮等,例如:用户名、企业的Logo、热线电话、中英文切换等。结构导航:是基于内容的核心导航形式,主要分为全局导航、面包屑导航、局部导航三种类型。全局导航和面包屑导航是网站架构中的核心,由于用户在浏览网页时的眼睛运动轨迹主要围绕字母“F”展开,因此重要的导航应放置于网站页面的顶部(页头导航之下)。全


        局导航中所提供的关键词链接是对整个网站内容的概括,用户能通过全局导航到达任何一个一级页面后再进行轻易切换(到其它一级页面);而面包屑导航能通过用户浏览页面的轨迹清晰地告知用户在网站中的位置,在提供轻松返回历史查看页面的基础上,使用户在网站中不至于迷失方向。局部导航出现在网页的左右两边,提供了当前页面中二级内容的链接,使用户能在当前页查看不同信息。关


        联导航:属于网页中的附加导航,有相关推荐、快速链接,上下文导航三种具体形式,例如:通过下拉框的形式提供关联信息的链接。此外,广告、活动等网站运营型的内容会使用此种类型的导航。


        智能手机移动互联网应用界面导航是界面中引导用户操作的重要模块,是应用界面信息架构的具体表现形式。不同于网站导航,移动应用界面导航没有固定的形式,其目标是展示界面中的核心信息与操作,帮助用户快速达到目标。智能手机移动互联网应用界面导航由内容与结构组成,设计师应该先确定与内容有关的信息,再思考与实际内容相关的导航结构形式。根据应用、智能手机与移动用户的特点,应用界面的导航需要聚焦于用户的主要任务,尽可能删减不必要出现的信息。智能手机移动互联网应用界面的导航分为主界面导航和次级界面导航两种模式,次级界面导航由主界面导航分解而来,其作用是配合主界面导航的样式使界面导航形成一个整体,因此次级界面导航的样式一般较为单一;主界面导航是整个导航系统的中心模块,影响整个界面的布局与操作方式。本节主要基于主界面导航的样式,重点研究应用界面导航的设计要点与方法。笔者总结了智能手机移动互联网应用界面的导航主要分为以下九种。


        (1)列表导航:列表导航在智能手机移动互联网应用界面中比较常见,属于传统的导航方式。例如联系人应用、歌曲播放应用、邮件应用等都适合采用列表导航的形式。在列表导航中,其上下列表之间的内容相对独立,没有从属关系,这种形式有利于单独更新列表以及列表中的内容。在运用列表导航时,列表中关键词或关键内容的表达不宜太复杂,简单易懂的信息能帮助用户顺利完成任务。而一个列表跳转至其它界面的层级尽量保持在两步以内,否则将会容易导致用户迷失方向或返回成本过高的问题。此外,在一个界面范围内(或一个屏幕以内),列表导航中列的数量可以根据移动设备屏幕尺寸和每列显示内容的多少来定义,例如在iPhone4S接听电话应用的通话记录列表界面中就显示了 8列最新通话信息。


        (2)九宫格导航:九宫格导航常以具有相同尺寸的方格(数量为九个方格)呈“三行三列”的布局形式出现在主界面中。所谓九宫格导航是指用户在一个屏幕范围内所见方格为九个,当界面需要展示的信息超过一屏时,可将其它信息再以方格的形式置于第二屏中,而用户也能通过向上滑动屏幕见到其它方格内的信息(第二屏的方格数量也要小于或者等于九)。每一个方格都是第二级界面中部分内容的入口,并且方格之间的信息关联度较低,没有明显的从属层级关系。根据具体应用界面的需求,可以将文字、图形等内容设计于每一个方格里,因此九宫格导航中的方格适合设置带有明显标识的信息。


        随着快信息读图时代的到来,九宫格导航中的方格不仅可以作为二级界面的入口,还可以用来展示具体信息,例如:在电子商务应用界面中通过方格展示服装的缩略图片,若用户看到中意的服装便会直接点击图片进入界面查看详细信息。以图片作为方格内容的形式,不仅能帮助用户快速识别信息,其直观的视觉效果还能在情感上为用户带来愉悦的感受。因此,九宫格导航中方格里的内容可以根据应用的实际情况进行设计,而方格的数量也可以进行适当的减少以便更好地展示信息,例如豆瓣电影应用界面就将电影的海报放置于长方形方格内,并设置一屏以内的方格数量为六个。


        (3)标签(Tab)导航:标签导航来源于桌面浏览器,其作用是将已经打开的网页以标签的形式进行分类,以方便用户在多网页中进行切换。标签形式良好地运用了物理隐喻的原理,有效地避免了不必要的页面跳转。在移动互联网应用界面中,标签导航主要用来将并列的信息通过横向标签的形式进行区分,以方便用户点击和切换不同信息。


        与传统的构架方式,如列表方式比较,标签导航能在有限的空间里展现较多内容,并减少用户的点击次数,提高操作效率。通常情况下,移动应用界面中各标签之间应该呈并列关系,而随着触摸屏幕的普及,通过标签改良的新型导航形式也应运而生。当导航展示信息为两个的时候,可以将标签的形式改良为通过按钮切换信息,而按钮的操作方式既可以是点击又可以是左右滑动,这种方式能使用户与界面的交互更加自然。此外,值得注意的是标签上不同类型的内容和功能尽量保持独立。在一个屏幕以内,只允许用户与一个主要的功能进行交互。


        (4)旋转导航:旋转导航主要通过左右滑动或单方向滑动(只往左或只往右)切换不同的信息,适用于屏幕空间有限而又需要展示大量信息的应用界面。旋转导航内的信息都具有相同属性,如同属于广告信息、推荐内容、搜索内容等,在电子商务应用中较为常见,如团购、电商平台、电影等。旋转导航能充分利用移动设备有限的屏幕空间,在应用界面的一个模块以内展示一系列信息,而展示的信息多为清晰的图像或文字。设计师需要在视觉上告知用户旋转导航内的信息数目,并同时告知用户目前所在的位置,如左图中有两个焦点表示一共有两页可供转换的信息,而当前所在的是A页。与此同时,应用界面系统还要支持用户循环旋转导航内的信息,如导航内有三条信息,而用户能一直往左边滑动循环查看三条不同的信息。如今,设计师一般会将旋转导航与其它导航形式进行结合,以便在一个屏幕以内展现更多的信息。例如将旋转导航与九宫格导航结合起来,旋转导航用来展示信息,而九宫格导航则提供第二级界面的入口。


        (5)抽屉导航:抽屉式导航又称为手风琴式导航,是为了避免界面一屏以内信息展示过长而设计的界面导航形式,其目的是在一个界面内展示更多内容。导航框内展示的信息以两级列表的形式进行分组,两级列表之间存在从属关系。用户能通过父级导航展开其子级项目,通过父级信息与子级信息的设置与分类,不仅能使用户灵活地隐藏或显示所需要的信息,还能减小信息对屏幕的占用率,整个界面的功能和布局也一目了然。抽屉导航在设计时需要注意两个问题,第一:把用户常用的信息设置为默认展开,其它的信息则收缩至抽屉内。这样能避免由于页面过长和信息过广而导致的用户浏览负担过重的问题。第二:抽屉的展开和收起状态需要在视觉上进行明显的区分,以便于用户查找需要的信息。


        (6)侧滑导航:侧滑导航是一种较新的导航模式,它由左屏、主屏和右屏三个部分组成。在


        智能手机移动互联网应用中,移动社交应用Path最早釆用该种导航形式。侧滑导航能使用户能将视线聚焦于查看主界面的信息,而其它操作功能则通过点击左右屏幕中的信息或条目而完成。这使得主界面内容更加简约和清晰,也使左右屏幕中的信息和操作项目更具有扩展性,例如当用户添加好友后便能在右侧屏幕中查看最新列表信息。除了社交应用以外,新闻应用、浏览器应用、电子商务应用等都纷纷釆用侧滑导航的形式。但侧滑导航并不一定适用于每一种应用类型,盲目的追风并不能带来更好的用户粘着度,因此设计团队和设计师还是要根据应用的实际情况而进行导航设计。


        (7)复杂导航:面对日益多样化的移动互联网应用,其界面导航可以根据应用的具体情况将多种导航形式进行组合。集合两种或两种以上导航形式都称为复杂导航,它一般针对信息量广,并且操作项目多的移动应用界面。例如:电子商务应用淘宝网集合了九宫格导航和旋转导航的形式,使运营内容与重要操作入口同时出现在主界面中;数字媒体应用网易新闻则集合了旋转导航、列表导航与侧滑导航的形式,使头条新闻、其它新闻摘要与切换新闻主题的列表能基于一个主界面全部展现出来,降低了用户跳转界面的成本。


        (8)全景图导航:全景图导航是微软公司于2010年推出的Windows Phone OS 7.0 (WP7)系统的导航概念。全景图导航没有明显的导航边界,内容本身就是界面,给用户提供一种阅读杂志的全新体验。这种以内容为核心的导航能使用户快速沉浸在应用中,并且不会迷失方向。


        (9)全屏导航:全屏导航是实用工具型应用与沉浸式应用常用的导航形式,其界面需要展现的信息较为扁平,只包含了必要信息而没有深层次的信息架构。通常情况下,一个实用型应用只解决某一个方面的问题,如iPhone中的原生应用指南针、天气预报、记事本等均通过全屏导航的形式突出了应用的核心功能,使用户能快速浏览信息或完成某项操作。


        沉浸型应用分为游戏类应用、媒体类应用与特点任务类应用,其导航形式略有不同。游戏类应用为了给用户增加更真实的游戏情境体验,一般采取占满整个屏幕的界面布局形式使用户聚焦于游戏内容,不受其它元素的干扰。媒体类应用最常见的便是视频播放和电子阅读,为了使用户更好地沉浸于情节中,其界面导航会删减一切多余的信息而只显示当前内容,只有当用户点击屏幕时才会在浮动层上显示操作控件。特定任务类应用常见的有录音、拍照、图片处理等,界面导航多以突出特定任务为主,在界面的下方辅以任务的操作按键,通常使用自定义的界面以配合环境。


相关文章
  • 预约专家

    为您提供一对一解决方案
    立即预约
  • 售前咨询

    周一至周五9:00——17:30
    立即咨询
  • 联系方式

    13919049954

    全国7×24小时热线服务
  • 免费报价

    专属专业顾问1对1报价
    免费报价