首页 分享 UI设计中的APP导航模式总结

UI设计中的APP导航模式总结

来源:花匠小妙招 时间:2024-11-13 13:47

UI设计中的APP导航模式总结

2020.09.07 07:49:44字数 1,969阅读 803

优秀的APP导航设计,能够合理地完美展示产品的功能,并快速引导用户使用,增强用户的识别度。合理的导航设计,会让用户轻松达到目的而又不会干扰和困扰用户的选择。今天我就针对UI设计中的APP导航模式进行简单的说明。

为什么需要导航?

1、我可以去哪?

导航为了清晰指引用户完成任务。建立合理的导航系统,设计顺畅的任务路径,让用户不再像无头苍蝇一样,在各模块之间迷失。

一个好的导航,能够扁平化用户的任务路径,减少用户操作成本,从而提高用户体验。

2、我现在在哪?用户当前位置要有清晰的标记,从哪里来,到哪里去。

常见的8种导航形式

标签式导航可分为 底部标签式 、舵式导航、Tab标签式导航。

一、底部标签式导航

底部标签导航是目前最常见的导航形式。底部导航一般采用3-4个标签,最多不会超过5个。

优点:

1、入口直接清晰,操作路径短,便于在不同功能模块进行跳转2、直接展示入口内容,内容曝光度高

缺点:1、功能之间无主次2、扩展性差,不利于后期的功能扩展

二、舵式导航

舵式导航是 底部导航的一种扩展形式,像轮船上用来指挥的船舵,两侧是其他操作按钮。

普通标签导航难以满足导航的需求,就需要一些扩展形式,和标签导航相比,舵式导航把核心功能放在中间,标签更加突出醒目,同时对主功能标签做了扩展功能。

使用场景:如1、产品需要特殊的引导,如58同城,引导用户发布任务。如2、社区产品引导用户发帖子如3、凸显核心功能,如百度地图、高德等

优点:

1、在默认加载的页面之外,又能够突出强调中间的入口2、入口直接清晰,操作路径短,便于不同功能模块进行跳转3、直接展示入口内容,内容曝光率高

缺点:(与标签导航存在同样的弊端)

1、功能之间无主次2、扩展性差,不利于后期的功能扩展

三、Tab标签式导航

一般 用于二级导航,当内容分类较多的时,一般采用顶部标签导航设计模式。

使用场景:

如:为当前界面内不同模块的切换,或者查看不同的分类内容优点:标签数量可以随意根据需求变化,可以左右滑动,衍生更多标签。

缺点:操作热区较小,有APP设计的交互前与后的样式差异不大,容易造成误操作的困惑。(不知道当前在哪个标签下)

四、抽屉式导航

抽屉式导航的核心思路是“隐藏”。 隐藏非核心的操作与功能,让用户更专注于核心的功能操作上去, 一般用于二级菜单。

优点:

1、节省页面展示空间2、注意力聚焦在当前页面

缺点:1、左上角的按钮存在于单手操作热区难以触达;2、降低了用户对产品部分功能的参与度。

五、宫格式导航

主要将入口全部集中在主页面中,UI设计中的APP导航模式总结https://www.aaa-cg.com.cn/ui/2645.html各个 入口相互独立,没有太多的交集,无法跳转互通。

采用这种导航的应用已经越来越少,往往用在二级页作为内容列表的一种图形化形式呈现,或是作为一系列工具入口的聚合。

优点:1、将入口进行聚合,入口也清晰直接2、操作路径较短,用户可以便捷的在不同的功能模块之间进行跳转3、扩展性好,方便增加多个入口

缺点:1、用户无法第一时间看到内容或者执行操作,选择的压力会比较大。2、返回路径较长,容易产生用户不良情绪。

六、轮播式导航

采用Banner轮播导航,当应用信息足够扁平,内容比较单薄时使用。特别是在产品初期,缺乏用户和内容,这种导航目前已经很少用。

该方式就可以 凸显产品核心功能给予用户使用。(如:较早时腾讯极光APP、应用市场等)

优点:

1、展示清晰直观,美观度高2、内容曝光度高,突出强调了展示内容3、交互动画可多样化

缺点:1、展示内容数量有限

七、列表式导航

现有APP中一种主要的信息承载模式,列表导航和宫格导航类似,属于二级导航。列表式导航分为3类: 标题式列表、内容式列表、嵌入式列表。

标题式列表:一般只显示一行文字,有的显示一行文字加一张图片等等。

内容式列表:主要以内容为主,所以在列表中就会体现出部分内容信息,点击进去就是详情。

嵌入式列表:嵌入式其实就是由多个列表层级组合而成的导航。

优点:1、结构清晰,易于理解;2、使用高效,能够帮助用户快速的定位去到对应的页面3、能够在列表上直接给出关于活动、更新的提示

缺点:1、排版方式单一2、多个入口之间不分级,没优先级之分

八、组合式导航

多用于产品本身 功能较为复杂,既需要用户能 聚焦于内容,又需要给出用户不同页面之间的入口,以便用户进行直接跳转,那就采用组合式导航,利用不同导航的特性来满足产品需求。

组合式导航目前最常见的导航方式。

如: 标签式导航+列表式 ;标签式+宫格式 ; 舵式+列表式+标签式等等;

优点:

1、组合式多样化

2、能给出用户不同页面之间的入口,方便跳转

总结一下

根据自己的产品功能和特性,采用不同导航模式。

每个产品迭代发展和变化,也会导致产品导航在过程中不停的产生变化,就必须依据用户属性和使用场景进行调整。不拘泥任何模式,解决问题才是根本。因此,您现在已经了解了与UI设计师的工作相关的主要技能。如果您想了解更多信息,请给我点个关注,我之后还会发包含有关在该领域工作的更多相关文章。

更多精彩内容,就在简书APP

"小礼物走一走,来简书关注我"

还没有人赞赏,支持一下

序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...

沈念sama阅读 203,772评论 6赞 477

序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...

文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...

文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...

正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...

茶点故事阅读 63,657评论 5赞 365

文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...

那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...

文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...

序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...

正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...

茶点故事阅读 35,611评论 2赞 321

正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...

茶点故事阅读 37,704评论 1赞 329

序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...

正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...

茶点故事阅读 38,969评论 3赞 307

文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...

文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...

我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...

正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...

茶点故事阅读 42,440评论 2赞 342

相关知识

UI设计师必备的配色理论
UI设计师必备的色彩搭配理论-中国VI设计知识网
UI设计师必备的色彩搭配理论
UI设计色彩搭配理论
UI设计师必备的配色理论(附案例演示)
探索未知,优化导航体验 —— 深入解读Cesium导航插件
华为花瓣地图App公交导航功能新升级:鸿蒙系统再添便捷出行体验
新手设计师必看:入门级 UI 设计工具推荐
自学 UI 设计:从零开始的旅程
UI设计培训

网址: UI设计中的APP导航模式总结 https://www.huajiangbk.com/newsview539939.html

所属分类:花卉
上一篇: android 布局中的单位及分
下一篇: UI 设计新人如何接私单?来看高

推荐分享