UI設計中的APP導航模式總結

優(yōu)秀的APP導航設計丐箩,能夠合理地完美展示產品的功能,并快速引導用戶使用汞窗,增強用戶的識別度。合理的導航設計赡译,會讓用戶輕松達到目的而又不會干擾和困擾用戶的選擇仲吏。今天我就針對UI設計中的APP導航模式進行簡單的說明。

為什么需要導航?

1蝌焚、我可以去哪?

導航為了清晰指引用戶完成任務裹唆。建立合理的導航系統(tǒng),設計順暢的任務路徑综看,讓用戶不再像無頭蒼蠅一樣品腹,在各模塊之間迷失岖食。

一個好的導航红碑,能夠扁平化用戶的任務路徑,減少用戶操作成本泡垃,從而提高用戶體驗析珊。

2、我現(xiàn)在在哪?用戶當前位置要有清晰的標記蔑穴,從哪里來忠寻,到哪里去。

常見的8種導航形式

標簽式導航可分為 底部標簽式 存和、舵式導航奕剃、Tab標簽式導航衷旅。

一、底部標簽式導航

底部標簽導航是目前最常見的導航形式纵朋。底部導航一般采用3-4個標簽柿顶,最多不會超過5個。

優(yōu)點:

1操软、入口直接清晰嘁锯,操作路徑短,便于在不同功能模塊進行跳轉2聂薪、直接展示入口內容家乘,內容曝光度高

缺點:1、功能之間無主次2藏澳、擴展性差仁锯,不利于后期的功能擴展

二、舵式導航

舵式導航是 底部導航的一種擴展形式翔悠,像輪船上用來指揮的船舵扑馁,兩側是其他操作按鈕。

普通標簽導航難以滿足導航的需求凉驻,就需要一些擴展形式腻要,和標簽導航相比,舵式導航把核心功能放在中間涝登,標簽更加突出醒目雄家,同時對主功能標簽做了擴展功能。

使用場景:如1胀滚、產品需要特殊的引導趟济,如58同城,引導用戶發(fā)布任務咽笼。如2顷编、社區(qū)產品引導用戶發(fā)帖子如3、凸顯核心功能剑刑,如百度地圖媳纬、高德等

優(yōu)點:

1、在默認加載的頁面之外施掏,又能夠突出強調中間的入口2钮惠、入口直接清晰,操作路徑短七芭,便于不同功能模塊進行跳轉3素挽、直接展示入口內容,內容曝光率高

缺點:(與標簽導航存在同樣的弊端)

1狸驳、功能之間無主次2预明、擴展性差缩赛,不利于后期的功能擴展

三、Tab標簽式導航

一般 用于二級導航撰糠,當內容分類較多的時峦筒,一般采用頂部標簽導航設計模式。

使用場景:

如:為當前界面內不同模塊的切換窗慎,或者查看不同的分類內容優(yōu)點:標簽數量可以隨意根據需求變化物喷,可以左右滑動,衍生更多標簽遮斥。

缺點:操作熱區(qū)較小峦失,有APP設計的交互前與后的樣式差異不大,容易造成誤操作的困惑术吗。(不知道當前在哪個標簽下)

四尉辑、抽屜式導航

抽屜式導航的核心思路是“隱藏”。 隱藏非核心的操作與功能较屿,讓用戶更專注于核心的功能操作上去隧魄, 一般用于二級菜單。

優(yōu)點:

1隘蝎、節(jié)省頁面展示空間2购啄、注意力聚焦在當前頁面

缺點:1、左上角的按鈕存在于單手操作熱區(qū)難以觸達;2嘱么、降低了用戶對產品部分功能的參與度狮含。

五、宮格式導航

主要將入口全部集中在主頁面中曼振,UI設計中的APP導航模式總結https://www.aaa-cg.com.cn/ui/2645.html各個 入口相互獨立几迄,沒有太多的交集,無法跳轉互通冰评。

采用這種導航的應用已經越來越少映胁,往往用在二級頁作為內容列表的一種圖形化形式呈現(xiàn),或是作為一系列工具入口的聚合甲雅。

優(yōu)點:1解孙、將入口進行聚合,入口也清晰直接2务荆、操作路徑較短妆距,用戶可以便捷的在不同的功能模塊之間進行跳轉3、擴展性好函匕,方便增加多個入口

缺點:1、用戶無法第一時間看到內容或者執(zhí)行操作蚪黑,選擇的壓力會比較大盅惜。2中剩、返回路徑較長,容易產生用戶不良情緒抒寂。

六结啼、輪播式導航

采用Banner輪播導航,當應用信息足夠扁平屈芜,內容比較單薄時使用郊愧。特別是在產品初期,缺乏用戶和內容井佑,這種導航目前已經很少用属铁。

該方式就可以 凸顯產品核心功能給予用戶使用。(如:較早時騰訊極光APP躬翁、應用市場等)

優(yōu)點:

1焦蘑、展示清晰直觀,美觀度高2盒发、內容曝光度高例嘱,突出強調了展示內容3、交互動畫可多樣化

缺點:1宁舰、展示內容數量有限

七拼卵、列表式導航

現(xiàn)有APP中一種主要的信息承載模式,列表導航和宮格導航類似蛮艰,屬于二級導航间学。列表式導航分為3類: 標題式列表、內容式列表印荔、嵌入式列表低葫。

標題式列表:一般只顯示一行文字,有的顯示一行文字加一張圖片等等仍律。

內容式列表:主要以內容為主嘿悬,所以在列表中就會體現(xiàn)出部分內容信息,點擊進去就是詳情水泉。

嵌入式列表:嵌入式其實就是由多個列表層級組合而成的導航善涨。

優(yōu)點:1、結構清晰草则,易于理解;2钢拧、使用高效,能夠幫助用戶快速的定位去到對應的頁面3炕横、能夠在列表上直接給出關于活動源内、更新的提示

缺點:1、排版方式單一2份殿、多個入口之間不分級膜钓,沒優(yōu)先級之分

八嗽交、組合式導航

多用于產品本身 功能較為復雜,既需要用戶能 聚焦于內容颂斜,又需要給出用戶不同頁面之間的入口夫壁,以便用戶進行直接跳轉,那就采用組合式導航沃疮,利用不同導航的特性來滿足產品需求盒让。

組合式導航目前最常見的導航方式。

如: 標簽式導航+列表式 ;標簽式+宮格式 ; 舵式+列表式+標簽式等等;

優(yōu)點:

1司蔬、組合式多樣化

2邑茄、能給出用戶不同頁面之間的入口,方便跳轉

總結一下

根據自己的產品功能和特性葱她,采用不同導航模式撩扒。

每個產品迭代發(fā)展和變化,也會導致產品導航在過程中不停的產生變化吨些,就必須依據用戶屬性和使用場景進行調整搓谆。不拘泥任何模式,解決問題才是根本豪墅。因此泉手,您現(xiàn)在已經了解了與UI設計師的工作相關的主要技能。如果您想了解更多信息偶器,請給我點個關注斩萌,我之后還會發(fā)包含有關在該領域工作的更多相關文章。

?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
  • 序言:七十年代末屏轰,一起剝皮案震驚了整個濱河市颊郎,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌霎苗,老刑警劉巖姆吭,帶你破解...
    沈念sama閱讀 219,270評論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異唁盏,居然都是意外死亡内狸,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,489評論 3 395
  • 文/潘曉璐 我一進店門厘擂,熙熙樓的掌柜王于貴愁眉苦臉地迎上來昆淡,“玉大人,你說我怎么就攤上這事刽严“毫椋” “怎么了?”我有些...
    開封第一講書人閱讀 165,630評論 0 356
  • 文/不壞的土叔 我叫張陵,是天一觀的道長倔既。 經常有香客問我恕曲,道長鹏氧,這世上最難降的妖魔是什么渤涌? 我笑而不...
    開封第一講書人閱讀 58,906評論 1 295
  • 正文 為了忘掉前任,我火速辦了婚禮把还,結果婚禮上实蓬,老公的妹妹穿的比我還像新娘。我一直安慰自己吊履,他們只是感情好安皱,可當我...
    茶點故事閱讀 67,928評論 6 392
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著艇炎,像睡著了一般酌伊。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上缀踪,一...
    開封第一講書人閱讀 51,718評論 1 305
  • 那天居砖,我揣著相機與錄音,去河邊找鬼驴娃。 笑死奏候,一個胖子當著我的面吹牛,可吹牛的內容都是我干的唇敞。 我是一名探鬼主播蔗草,決...
    沈念sama閱讀 40,442評論 3 420
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼疆柔!你這毒婦竟也來了咒精?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 39,345評論 0 276
  • 序言:老撾萬榮一對情侶失蹤旷档,失蹤者是張志新(化名)和其女友劉穎模叙,沒想到半個月后,有當地人在樹林里發(fā)現(xiàn)了一具尸體彬犯,經...
    沈念sama閱讀 45,802評論 1 317
  • 正文 獨居荒郊野嶺守林人離奇死亡向楼,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 37,984評論 3 337
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了谐区。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片湖蜕。...
    茶點故事閱讀 40,117評論 1 351
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖宋列,靈堂內的尸體忽然破棺而出昭抒,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 35,810評論 5 346
  • 正文 年R本政府宣布灭返,位于F島的核電站盗迟,受9級特大地震影響,放射性物質發(fā)生泄漏熙含。R本人自食惡果不足惜罚缕,卻給世界環(huán)境...
    茶點故事閱讀 41,462評論 3 331
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望怎静。 院中可真熱鬧邮弹,春花似錦、人聲如沸蚓聘。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,011評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽夜牡。三九已至与纽,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間塘装,已是汗流浹背急迂。 一陣腳步聲響...
    開封第一講書人閱讀 33,139評論 1 272
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留氢哮,地道東北人袋毙。 一個月前我還...
    沈念sama閱讀 48,377評論 3 373
  • 正文 我出身青樓,卻偏偏與公主長得像冗尤,于是被迫代替她去往敵國和親听盖。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 45,060評論 2 355