查看原文
其他

后台产品的导航该如何设计

maye 产品刘 2022-10-16

一、导航的基本展现形式:水平、垂直、混合型

第一种 水平型

即主导航是水平的,次级导航可以以下拉菜单的形势悬浮时展开。

优点:

1) 作为传统且常见的导航 用户上手比较容易;

2) 更易读。 现代人习惯横向阅读,且眼动研究表明,眼球水平运动比垂直要容易;

《普通心理学》彭聃龄  错觉理论 : “ 眼睛做上下运动比水平运动困难一些”

3) 最不容忽视的一点 ,这种导航给页面具体内容留的版面大 尤其对于一些大型的列表页, 横向版面大是非常实用的。

4)大版面无侧边栏干扰,带来的沉浸感更强。

弊端:

1) 由于水平条的宽度有限,每个导航标题的必须起的很短(当导航变多水平条变短,有时文字真的会摆放不下,对于英文国家这也许更头痛)

2) 可扩展性不强 。

导致扩展性不强的原因有二:

一是电脑网页的横向宽度有限,业务扩展时水平导航条数目可能多到放不下,即广度限制;

二是这个导航其实只是一个主导航-次级导航的架构深度为二级的导航,即深度限制,如果后台设计的业务模块多,需要再深一层的架构,水平导航可能就不是最好解决办法了。

综上,水平型导航适用于功能较简单的,或者追求沉浸式体验的后台。


第二种 垂直型

这是目前最流行的一种后台导航方式,常见垂直导航如下图,主要区别就是信息是层级渐进显示还是一次性平铺,这点稍后分析。

垂直导航优点:即导航标题的字数限制放宽,广度上可扩展性增强—导航的数目限制放宽、设置可以开放成用户可以局部自定义导航(加一些常用操作的功能区进去,或者像微信公众号后台这样)

弊端:就是垂直排列阅读性减弱、不利于沉浸式体验;导航架构深度上仍有限制(主导航-次级导航)

垂直导航适用于功能较为专注(比如只是团购、或只是上门电商的后台)的、又有一定复杂度的后台。


第三种 混合型

混合型即综合了水平、垂直型的导航,导航深度可以更深一层,如下图:

混合型  深度为3层的导航

混合型 深度为2层的导航

适用情况:混合型适合功能模块较多、复杂度较大的后台。(比如大众点评 商家后台--既有团购 又有会员卡 预订 买单等不同功能模块的产品后台)


二、导航展现细节:是否需要信息渐进显示(层级隐藏)

用户对于导航的认知及操作的负荷主要来自于以下3种:

进入后台完成某种任务时,你需要思考和记忆(认知),需要浏览屏幕(视觉),需要点击按钮、操作鼠标和打字(行动)。

从人机工程学视角来看,负荷所花费资源从多到少排列如下:认知负荷、视觉负荷、行动负荷

——《设计师要懂心理学》  Susan Weinschenk  第四章 人如何思考

1、认知负荷:对导航归类的理解、 每次进行某项任务时猜测它是在哪个一级分类导航下       

2、视觉负荷:即导航够不够简洁

3、行动负荷:不同页面之间跳转切换的操作负荷  。

心理学的研究表明:当认知负担小(即用户能几乎不需要思考就能知道怎么点击)时,行动上的操作负荷可以忽略。

用户必须经过十几次点击才能完成任务,结果他们完成时还是会抬头笑道:“好轻松啊!”这是因为每个步骤都很合理,都提供了用户所预期的信息。他们不必动脑思考,思考的负荷比点击更沉重。

——《设计师要懂心理学》  Susan Weinschenk  第四章 人如何思考

所以,是否需要、适合信息渐进显示 要根据情况而定,大体上:

1) 当你的信息分类本身认知起来就轻松【分类边界模糊性小,确定性强(比如 数据统计包括用户量统计、访问量统计、购买量统计),且各个分类之间没有模糊的交叉语义】,那么可以考虑信息渐进隐藏式的导航,好处是视觉负担小。而认知轻松时操作上的切换交互用户几乎可以再无意识下完成,行动负荷可忽略不计。

例:信息渐进显示式 垂直导航

例:混合型导航 也是信息渐进显示式导航的一种

2) 当你的信息分类归属性模糊,需要用户记忆、学习且量较大,那么还是推荐使用 信息全部平铺式的导航。

附,对照分析表:

对照分析表

写在最后:

其实关于导航设计及后台设计,这些远远不够,以下列出其它的思考点,希望大家不吝赐教,分享一下自己的看法~

1.关于导航的分类:导航的分类依据有哪些?(语义、任务相近)

2.关于导航的排序:排序依据有哪些?是将常用功能排在前面,还是按照初始设置的流程顺序?

3.关于导航的文案:文案设计有哪些注意要点、文案长度是否最好保持一致

4.后台设计的其它要点:列表页、表单填写页、各种控件(事件控件、筛选控件) [以后再写文章总结]

作者:maye    來源:简书

帮你成长

我之前也创立过产品经理学习交流群,那个时候由于人数少,大家讨论也蛮积极的,但是微信群讨论的一大弊端就是无法将谈论的知识提炼出来,干货内容渐渐被口水话淹没,所以我建立了一个知识星球(原小密圈),在这里我会分享自己的思考感悟,你有问题可以随时像我发起提问,同时别人提的问题你也能看到,更重要的是你不论什么时候看这个回答它都在!

同时大大老师以后所有的live,小密圈的同学都可以免费学习。

为了更好的服务知识星球的小伙伴,大大老师将会在知识星球发表一些干货文章和音频供大家学习,当然这些内容公众号是没有的。

知识星球规则:

1、费用:为了保证社群的质量和活跃度,需要先付款99元,签到后会返还

2、返还费用:连续签到3天返还30元,连续签到5天返还50元,连续签到7天返还70元。

下图是返还凭证:

2、签到形式:可以是你的产品感悟,也可以是你学习中遇到的问题,也可以是你回答别人问题。(把你的感悟记录下来,把你遇到的问题提出来,帮助解决别人遇到的问题,这个过程就是成长,切记不要潜水,好歹你也是付费进来的)。

3、奖励:每周抽取最活跃的用户,(提出的问题+发表的产品感悟+回答别人问题)总数最多,即有可能获得现金红包、PRD文档、面试简历模板、原型文件等不同奖励形式。

奖励凭证:

邀请5个小伙伴加入,则本人加入的费用免除,并同时获赠68元现金奖励,当让为了保证群质量,邀请的小伙伴需要付费加入。

4、广告:社群内禁止发广告,否则即使付费,也要被T出去,如果想发广告,加入上课群,并红包走起,想加入上课群,加微信yw5201a1,拉你入群。

之前付费进入产品经理学习群的小伙伴,可以加微信(yw5201a1),免费拉你入群。

长按下方二维码加入我们吧!

送福利:截至下周一评论区点赞数最多的前5名,可以找我(加微信yw5201a1)领一份私密课干货视频,视频内容任选哦!

往期精彩文章

产品经理VS项目经理

产品经理面试一对一咨询指导

产品经理必逛社区

老司机教你做产品经理2.0



点击“阅读原文”

即可进行系统的学习 



您可能也对以下帖子感兴趣

文章有问题?点此查看未经处理的缓存