移動端產(chǎn)品導(dǎo)航設(shè)計(jì)模式

1、常見移動端產(chǎn)品導(dǎo)航設(shè)計(jì)模式APP導(dǎo)航承載著用戶獲取所需內(nèi)容的快速途徑，它看似簡單，卻是產(chǎn)品設(shè)計(jì)中最需要考量的一部分。APP導(dǎo)航的設(shè)計(jì)，會直接影響用戶對APP的體驗(yàn)感受。一個(gè)好的導(dǎo)航設(shè)計(jì)能讓用戶快速了解該產(chǎn)品的功能和信息組織架構(gòu)?？梢哉f導(dǎo)航設(shè)計(jì)有著舉足輕重的作用。雖然不同的產(chǎn)品需求和商業(yè)目標(biāo)決定了不同的導(dǎo)航框架的設(shè)計(jì)模式，但縱觀應(yīng)用市場上的APP，導(dǎo)航設(shè)計(jì)的模式總是幾種的組合使用。下面我們來看一下常見的幾種導(dǎo)航設(shè)計(jì)模式。一、標(biāo)簽式導(dǎo)航標(biāo)簽式導(dǎo)航又叫Tab式導(dǎo)航，是目前移動端市場上最為廣泛的導(dǎo)航設(shè)計(jì)。標(biāo)簽導(dǎo)航通常分為底部，頂部，頂、底混合使用這三種模式1、底部導(dǎo)航，采用文字加圖標(biāo)的方式展現(xiàn)。一般有

2、3-5個(gè)標(biāo)簽，適合在相關(guān)的幾類信息中間頻繁的切換使用。這類信息優(yōu)先級較高、用戶使用頻繁，彼此之間相互獨(dú)立，通過標(biāo)簽式導(dǎo)航的引導(dǎo)，用戶可以迅速的實(shí)現(xiàn)頁面之間的切換且不會迷失方向，簡單而高效。它的缺點(diǎn)是會占用一定高度的空間，如果用戶是小屏幕手機(jī)，則視覺體驗(yàn)不太好。底部標(biāo)簽導(dǎo)航2、頂部導(dǎo)航當(dāng)內(nèi)容分類比較多的時(shí)候，經(jīng)常會采用頂部導(dǎo)航設(shè)計(jì)模式，如一些資訊類的APP天天快報(bào)，推酷就采用頂部導(dǎo)航。頂部標(biāo)簽導(dǎo)航3、頂部，底部雙tab導(dǎo)航標(biāo)簽式導(dǎo)航除了設(shè)在底部和底部，另外有些產(chǎn)品內(nèi)容比較多會采用頂部，底部混合使用標(biāo)簽式導(dǎo)航，如簡書、微票兒。頂部，底部雙tab導(dǎo)航二、抽屜式標(biāo)簽抽屜導(dǎo)航指的是一些功能菜單按鈕隱藏在

3、當(dāng)前頁面后，如網(wǎng)易郵箱、QQ、知乎等。點(diǎn)擊入口或側(cè)滑即可像拉抽屜一樣拉出菜單。這種導(dǎo)航設(shè)計(jì)比較適合于那么不需要頻繁切換的次功能，例如對設(shè)置、關(guān)于、會員、皮膚設(shè)置等功能的隱藏。抽屜式導(dǎo)航的優(yōu)點(diǎn)在于節(jié)省頁面展示空間，使主頁面更加簡潔美觀，讓用戶將更多的注意力聚焦到當(dāng)前頁面。缺點(diǎn)在于次功能入口比較隱蔽，用戶不容易發(fā)現(xiàn)；使用次功能需要二次點(diǎn)擊，增加用戶使用成本。三、宮格式導(dǎo)航這種宮格導(dǎo)航是將主要入口全部聚合在主頁面中，每個(gè)宮格相互獨(dú)立，它們的信息間也沒有任何交集，無法跳轉(zhuǎn)互通。因?yàn)檫@種特質(zhì)，宮格式導(dǎo)航被廣泛應(yīng)用于各平臺系統(tǒng)的中心頁面。這樣的組織方式無法讓用戶在第一時(shí)間看到內(nèi)容，選擇壓力較大，除了常見a

4、pp如支付寶和美圖秀秀，其他的app采用這種導(dǎo)航的應(yīng)用已經(jīng)越來越少，往往用在二級頁作為內(nèi)容列表的一種圖形化形式呈現(xiàn)，或是作為一系列工具入口的聚合。四、列表式導(dǎo)航列表式導(dǎo)航作為信息組織框架，是我們在產(chǎn)品設(shè)計(jì)中必不可少的一個(gè)信息承載模式。列表導(dǎo)航與宮格導(dǎo)航類似，常用于二級頁面，不會默認(rèn)展示任何實(shí)質(zhì)內(nèi)容，所以通常app不會在首頁使用它。這種導(dǎo)航結(jié)構(gòu)清晰，易于用戶理解，能夠幫助用戶快速的定位去到對應(yīng)的頁面。五、舵式導(dǎo)航在有些情況下，簡單的底部tab式導(dǎo)航難以滿足更多的操作功能，這個(gè)時(shí)候我們就需要一些擴(kuò)展形式來滿足需求 ，新浪微博、lofter、閑魚底部采用的就是舵式導(dǎo)航，舵式導(dǎo)航（之前看到別人這么叫所以我也就這么稱呼吧）跟標(biāo)簽式導(dǎo)航相比，區(qū)別在于舵式導(dǎo)航把類似生產(chǎn)內(nèi)容的主功能按鈕放在中間，標(biāo)簽更加突出醒目，同時(shí)該主功能標(biāo)簽做了功能擴(kuò)展，也因此給設(shè)計(jì)增加了一些個(gè)性化的亮點(diǎn)。總結(jié)以上幾種是最常見導(dǎo)航設(shè)計(jì)模式，真正的產(chǎn)品設(shè)計(jì)時(shí)往往根據(jù)產(chǎn)品層次的深度和廣度采用多種模式的混合使用，在做到界面簡潔美觀的同時(shí)還要滿足用戶的使用習(xí)慣。移動端產(chǎn)品導(dǎo)航的設(shè)計(jì)沒有最好之說，只有最合適，根據(jù)你的產(chǎn)品采取最合適的導(dǎo)航設(shè)計(jì)。除了當(dāng)下已有的設(shè)計(jì)模式，未來一定會有更多更新的導(dǎo)航設(shè)計(jì)和交