交互設計丨移動端APP導航形式
關注?Kevin和互聯(lián)網(wǎng)產(chǎn)品經(jīng)理們，一起成長
作者?l?花溪HUAXI
來源?l 花溪HUAXI
分享 l Kevin
本文主要介紹了現(xiàn)在APP常用的五種導航形式。
01. 宮格式（也叫跳板式）導航
早期常見布局是3×3、2×3、2×2、1×2?，F(xiàn)在數(shù)量比較多變。相對而言，容納的文字標題字數(shù)有限。
應用場景：大量功能入口（支付寶）、大量內容入口（小說書架）、分類入口（騰訊視頻）
02. 選項卡式導航（標簽式導航）
標簽式導航數(shù)量一般在2-5個。最初是指底部標簽。出現(xiàn)形式多為icon+文字。適合頻繁切換的主要功能導航。
應用場景：常見APP底部、詳情頁(tab切換，電商的寶貝/詳情/評價）
與底部對應的就是頂部標簽。但屏幕頂部不便于點擊，大多是配合APP本身的左右滑動來進行切換。如果是minisite，會與“左滑退出當前頁面”的返回手勢沖突。頂部標簽的優(yōu)勢是可以延展。設計滾動標簽導航時，要注意給予用戶提示可滾動。
03.?舵（duò）式導航
舵式導航是標簽導航的一種演變形式。中間的標簽一般是APP的主要功能入口。
應用場景：主要是內容發(fā)布、開始拍照/直播、上傳作品、發(fā)布文字或照片
04.?列表導航
列表導航形式比較固定，列表式展示內容一目了然，可呈現(xiàn)多項導航，而且可呈現(xiàn)更多文字內容。常見列表導航形式如下。
應用場景：個人頁面、系統(tǒng)頁、功能類APP首頁
列表式導航除了標題，也可以呈現(xiàn)次級內容。
05.?抽屜式導航（側邊欄導航）/ 漢堡包導航
抽屜式導航可以幫助頁面節(jié)省更多空間。比標簽導航可承載更多內容。
抽屜式導航的缺點也很明顯：功能被發(fā)現(xiàn)概率低，點擊效率低（抽屜式導航比標簽導航需多一步點擊）
應用場景：個人頁 抽屜式有些隱喻的含義，不重要或者不首要的功能才會被隱藏起來。
抽屜式導航與宮格式導航相結合。
與抽屜式導航比較類似的導航是漢堡包導航。漢堡包導航點擊后通常是由上至下展開，在功能上通常承載的是單純的列表，形式不如抽屜式導航多樣化。優(yōu)缺點和抽屜導航類似。
漢堡包導航的展開與收起
關于漢堡包導航的多內容替代方案，以及正確的打開方式，可以查看下面這篇文章。是一位產(chǎn)品經(jīng)理寫的，個人覺得很詳細。
06. 全局導航
沒查到明確的命名方法，暫時稱為全局導航。這種導航可以把大量內容進行分類，并且讓用戶迅速了解平臺商品的架構，多用于教育、電商等種類豐富的平臺。
現(xiàn)有倆種使用方式：固定的一級導航+對應的二級導航；固定的一級導航+二級導航+商品列表。前者的更注重分類，幫助用戶快速找到內容；在二級導航內可以承載文字、圖片、文字＋圖片等不同的形式。后者則是通過固定的一級導航幫助用戶在不同分類之間快速切換。
07. 分段式控件導航
分段式控件小巧靈活，可以很好地融合進導航欄中而不占用過多空間。是IOS系統(tǒng)的常用控件，由于數(shù)量比較少，不適合做一級導航，常用于二級導航。
參考文獻：
術與道：移動應用UI設計必修課 余振華著
移動應用UI設計模式 Theresa Neil著
深入淺出！全方位科普移動端導航的七種設計模式
APP導航設計的對比總結 - 新聞/公告 - 騎士人才系統(tǒng)官網(wǎng)
今天的分享就到這兒啦~
END
?
?