幼儿饰品瑜伽美体用品美文
投稿投诉
美文创意
爱情通信
用品婚姻
爱好看病
美体软件
影音星座
瑜伽周边
星座办公
饰品塑形
搞笑减肥
幼儿两性
智家潮品

种返回方法帮你做好反向导航

9月13日 生死族投稿
  如何设计好移动端的反向导航呢?本文总结了5种需要特别注意反向导航的场景以及相应的解决办法。
  又是月初,又到了跟中国移动签订合作协议的时间。但本月跟世界500强公司的续约却发现了一点体验的问题,有点不爽。
  过程是这样:在中国移动10086客户端的充值页面选择金额,然后在支付完成页面点击返回按钮,竟然又回到了充值页面。如下图:
  有同学说了,在支付成功后,这次充值任务已经完成,用户的预期应该是点击返回回到应用首页,因为很少有人会连续充值的。这难道不是产品汪需求考虑欠周到,导致影响了用户体验?
  再看一个页面跳转超出用户预期的例子。
  从微信首页(A1)依次进入订阅号消息(A2)、订阅号文章详情页(A3),在A3页点击订阅号名称后没有打开订阅号主页(A4),而是打开微信首页(A1)再自动打开订阅号首页(A4)。如下图:
  很明显,用户在A3页面点击订阅号名称,是希望进入A4公众号主页的。为什么微信要违背用户期望,自动打开一个多余的A1首面再跳转到目标页?
  上面的2个问题的答案涉及到今天讨论的内容:移动端产品的反向导航。
  一、什么是反向导航?
  materiadesign文档将导航分为3种:前进导航、横向导航、反向导航。前进导航、横向导航分别指的是页面的层级前进、水平前进;都是页面递进式的导航。而反向导航是指按时间顺序或分层向后打开页面。三者结合,给用户提供操控页面跳转的完整能力。
  应用是以页面为单位去呈现内容的。《用户体验要素》将应用分为5层,第三层结构层就是指页面之间的结构关系。毫无疑问,无论是PC产品还是移动产品,页面流都是影响用户体验的一个重要方面。反向导航作为唯一操控页面后退的导航方式,需要我们审慎视之。
  在PC时代,通过页面常驻的导航栏面包屑浏览器的返回键,用户可以很轻易地返回或者向上跳转。所以,在设计产品的时候,只要设计好常驻导航栏和面包屑,反向导航是不需要再额外关注的。
  但在移动时代,反向导航的操作形式只有一种:返回。没有了常驻导航栏和面包屑,怎样通过返回这个单一的动作,让用户在不同的场景下分别跳跃地回退到不同的页面,很多时候需要精心设计。
  如果仍然保留PC时代的工作习惯,在设计完正向流程页面之后,没有梳理反向导航的页面流,就会让用户陷入不断点击返回甚至迷路的烦恼,例如上文提到的中国移动客户端的话费充值的那种体验。
  二、如何设计移动端的反向导航?
  下文总结了5种需要特别注意反向导航的场景以及相应的解决办法。
  1。页面层级深:用常用页面隔离深层级内容
  假如微信在上面用户的操作中没有插入首页,那么从A1到A4,再在A4订阅号主页点击文章,页面有5个层级。这也就意味着,用户进入公众号阅读文章后,至少要点4次返回,才能回到首页聊天。如下图:
  按微信的线上方案,将最常用的页面(也就是首页)插到页面流里,将页面结构改成了3级。这样,从文章详情页回到首页聊天,只需要点击2次返回。如下图:
  所以,微信在进入订阅号主页前自动打开首页,可以让用户在浏览订阅号文章时,可以方便地回到首页聊天。
  用首页隔绝深层级的页面,是减少页面层级,方便用户快速返回的有效方法。
  例如:支付宝想在用户扫码支付完成之后,引导用户使用余额宝支付,也采用了同样的做法隔离了层级过深的内容,让余额宝(B5)以后的页面可以快速返回首页。
  2。任务链条长:分解成若干个子任务
  通过子流程的分段操作和分段保存,既方便用户中途退出任务后的二次操作;也可以减少页面层级,避免过多的返回操作。
  招聘类产品的用户简历,需要用户填写个人信息、若干段工作经历、项目经历等内容,任务链条是比较长的。如果采用一段式操作,不仅不便于修改某部分内容,而且导致页面层级过深。
  一段式的表单任务:把页面设计成4个以上的层级。如下图:
  同样的任务分解为多个子任务。如下图:
  把任务分解后,页面层级减少为2层,每个页面都可以快速返回个人简历页面。同时,可以选择某一个子任务单独去完成。(上面的草图只是为了说明页面关系)
  3。对内容驱动型产品,可以考虑使用内容详情页同级消除
  内容驱动型产品允许通过内容自由跳转页面,或围绕内容本身定义导航。即是说可以通过用户的兴趣标签、搜索、内容分类、同一作者等维度的内容列表与具体内容相互链接。游戏,书籍和其他沉浸式应用通常使用此导航样式。页面关系类似于这样:
  内容型产品的特点是同一个页面的入口可能很多。Android提供了向上返回上一层的功能。但是这种向上进入的列表页面很有可能是用户没点击过的,会让用户产生错愕。如果要使用向上跳转,产品必须围绕着分类去组织内容。正是由于对内容的组织限制很大,几乎没有产品使用向上跳转。
  而使用系统的返回按钮,用户在详情页n次跳转之后,又需要点击n次才能回到首页,而中途出现的内容都是已经看过的,所以不断按返回只能让用户烦躁。
  为减少这种无意义的返回操作,其实可以在进入详情页B的时候,都判断一下来源。如果来源是其他内容的详情页A,那么就自动将页面A移出页面栈(activitystack,可以认为是浏览记录)。从而保证在页面栈里只有一个详情页。所以假如打开的页面流是:首页详情页A详情页B详情页c,在详情页C点击返回,会直接返回首页。
  bilibili和网易公开课就是使用的这种做法。有兴趣的可以体验一下。
  4。对内容驱动型产品,使用弹出菜单、底部导航栏等实现反向导航
  这是苹果的人机界面指南推荐的做法。在这里就不复制轮子了,有兴趣的同学可以自己看指南。下面提供两个例子阐述上面方法的意思。
  (1)抽屉式侧边式
  点击左上角的头像,左侧划入功能入口。
  (2)点聚式
  点击一个入口,围绕其散开,并展示出其中的功能入口。
  5。如果有独立的内容模块,至少保证在浏览第二个页面之后,出现关闭第三方模块的固定按钮
  这里所指的独立内容模块包含webview(例如微信公众号、qq看点等)、小程序、插件式的第三方原生APP(支付宝里的淘票票)等等。对这个问题,腾讯的qq和微信已经完美解决,而支付宝还不是很重视。
  三、总结
  任何产品的信息都要靠页面承载,所以页面流就是信息流转的通道。在移动端,系统只提供了返回这一种操作,就很容易产生一条条断头路,迫使用户只能一步一步地点击返回回到主干道。
  通过页面流的再组织、任务的分解、导航栏的合理运用、随时关闭分流程等方法可以设计比系统默认的返回效率更高的反向导航,减少断头路的产生,或者缩短断头路的长度。
投诉 评论 转载

青少年如何克服青春期的心理障碍少年期是指12到17岁之间的年龄段,这个时期的人出现心理障碍是很危险的,因此,专家提醒我们少年需警惕心理障碍,不要以为出现声音变粗等现象是不正常的行为。对于少年需警惕心理障碍的……怎样的银行流水更容易获得签证签证申请过程中,很多国家要求提供银行流水对账单,稍有差错就会增加被拒签的风险。经常作为必选材料的银行流水,签证官主要是看些什么?怎样的银行流水,更容易获得签证?精华总结……如何钓鱼诱饵钓鱼是最简单的捕捉鱼的方法。捕捉鱼的方法有很多飞蝇钓鱼,旋式钓鱼,转轮线垂钓,用尖锐物叉式捕鱼法等等不胜枚举。诱饵钓鱼是非常适合初学钓鱼者的好方法。诱饵钓鱼不仅简单而且有效……愚人节特辑那些设计师脑洞大开下的奇葩建今天是愚人节,请允许小编不正经一回通常咱们见到的建筑基本上都是方方正正的,但是偏偏有不走寻常路的建筑师,建造了这些脑洞大开的奇葩建筑,让人大跌眼镜,不得不服!不信?那就一起来看……种返回方法帮你做好反向导航如何设计好移动端的反向导航呢?本文总结了5种需要特别注意反向导航的场景以及相应的解决办法。又是月初,又到了跟中国移动签订合作协议的时间。但本月跟世界500强公司的续约却发……新闻客户端的创新边界和创新者窘境〔核心提示〕下一代移动媒体的创新边界是什么?语音交互、弹幕、个性化推荐,这些创新点陷入了什么样的窘境?上周和搜狐新闻客户端的同学聊天,在讲到移动媒体创新这方面,给我列举了……微信隐藏的两个功能玩了这么多年才发现手机微信基本上,是我们每天使用最多的,它里面,其实有很多隐藏的小功能,很多人还不会,下面我就来分享两个非常实用的小技巧,会给我们带来很多的方便,一起来看看吧。技巧一:聊天……种植香葱怎么样施肥浇水种植香葱什么时候追肥?种植香葱要施什么肥?香葱如何浇水?以下中国三农网就作简单介绍,供网友们参考。一、浇水香葱根系不发达、分布较浅,不耐旱也不耐涝,要根据墒情、苗情适时灌……马鞭草和鼠尾草怎么区别种方法教你分辨马鞭草和鼠尾很多花友都很难区分马鞭草和鼠尾草,很容易将它们两者混在一起,那么马鞭草和鼠尾草怎么区别呢,其实马鞭草和鼠尾草它们之间的科属、形态、香气、花期都有很大的区别,如果仔细看还能发现更……雷军小米高速增长的管理秘诀在众多厂商扎堆发布新品的九月,苹果绝对不是唯一的亮点,小米手机3在还未正式发售的情况下逆市上升,获得了非常高的关注度。小米手机在国内的关注度可以说是由来已久,从雷布斯到2012……哪种爱情星座最不想要如果有人问你你的爱情幸福吗?,然后再去询问你的朋友你觉得某某的爱情幸福吗?,TA得到的两个答案肯定不一样。因为爱情长跑中的点滴感受,都是置身事外的旁观者无法得知的。每个人的性格……太岁水什么人不能喝太岁泡的水到底能不能喝长期服用太岁水的话对人体有很多的好处,但对此过敏的人群是不适合喝的,否则会容易造成身体的紊乱,同时对于湿热体质或者经期的女性来说也是不适合喝的,否则会容易起到反作用,不利于人体……
什么是近因效应近因效应最简单的例子最后印象芦君茶具有清泻积热功能如何在恋爱中识别姐姐们乘风破浪征途是哪儿番薯饼怎么做如何做家常红椒西红柿炒蛋彩光脱毛会产生色素沉着吗服装专柜销售工作总结精选多篇年落实党风廉政建设两个责任促进会工作总结安全生产直接责任人述职报告张振西致力改变保险代理人生存现状乡镇妇联立足家庭建设构建和谐乡镇
职场人走向卓越的条经验遇到鬼打墙怎么办鬼打墙的科学解释是什么地球惯力五月份总结六月份计划史铁生《庄子》原文欣赏雷军的宿命开学日冻膜可以放冰箱保存吗冻膜能不能放冰箱倒车影像不显示了黑屏怎么办倒车影像黑屏解决方法详解感伤的个性签名赘婿宁毅最大的对手不是苏文兴,也不是乌启豪,而是他大王观后感先秦散文《唐且说信陵君戒骄(魏策四)》原文及鉴赏

友情链接:中准网聚热点快百科快传网快生活快软网快好知文好找漯河衢州兴义眉山桂林阳泉玉溪简阳山东遂宁永城新余梧州洛阳泸州温州临汾清远营口常熟浙江大连桐乡宜昌