前段时间在pmcaff上看到并回答了一个问题,关于返回键设计的一个问题,只是说了个大概,后来又重新参考实际的产品重新整理出来
iOS人机界面指南中关于返回键的相关内容如下:当前标题左侧应有返回按钮,需要的话,返回按钮可以以前一层级的标题命名。导航栏的一般作用就是告诉用户在哪儿以及可以回到哪里去,将“返回”置于导航栏上,不会占用页面中多余的空间,与导航栏构成页面导航的基础,让用户畅行于应用之中,也是市面上产品最习以为常的设计方式,长期以来用户养成的习惯也是如此(点击导航栏左侧返回按钮返回上一层级界面),但是随着手机屏幕的日益增大,非常不利于单手操作。于是,iOS7在传统的左上角返回键之外,提供了右滑返回上一级界面的手势操作,这一小的举动对于大屏手机上的产品使用体验来说还是非常贴心。
注:LOFTER & 微信以下几款产品采用底部返回按钮的交互方式:好奇心日报、知乎日报、MONO、pmcaff,这几款应用的内容详情页面都是用底部返回的设计,而共同特点是:
注:好奇心日报 & 知乎日报都是内容详情页面
页面中没有导航栏
返回键位于底部(工具栏上面)
将返回键置于底部有什么优点?参考实际页面来看,返回键置于底部工具栏上,更利于大屏手机的单手操作,并且将返回键与针对页面内容常用的操作按钮放置在同一栏上,更利于频繁操作之间的快速切换
注:MONO & PMCaff大部分场景下不适用这种交互方式?
首先,将返回键置于导航栏上,符合设计规范以及用户长久以来的认知,导航栏+返回构成页面导航的基础,告诉用户在哪里、可以回到哪里去,导航栏的作用就非常明显,就像马路上路标一样不会让你迷失在城市之中。根据上面总结,返回键置于底部式,页面通常会省略掉导航栏,应用中大量页面省略导航栏,势必会造成导航系统失效。
其次,此种形式将返回键置于底部工具栏上,而工具栏是用来放置针对此页面内容的操作按钮, 在此基础上再增加一个返回按钮比较合理,如果是其他的列表页或者导航页,并没有针对此页面的操作按钮,或者导航栏足够承载仅有的操作按钮,只是将返回键置于页面底部,增加一个工具栏或者再添加一两个其他操作按钮,页面的整体布局会显得不合理。
需要说明的是本篇讨论针对主要针对iOS中相关交互方式,由于Android中有虚拟的物理返回键,不受限制于上操作栏中的“向上”键,更多的虚拟的物理返回键进行返回操作。还需注意的的是,虚拟的物理返回键基于用户最近查看的历史页面,采用时间倒序的方式,连接界面间的关系。而“向上键”是基于层级关系,连接界面间的关系。
12/20更新:最新版搜狐新闻客户端产品设计采用
网友评论