在數(shù)字化時(shí)代的浪潮中，導(dǎo)航設(shè)計(jì)已成為提升用戶體驗(yàn)的關(guān)鍵。除了常見的頂部、側(cè)邊和混合導(dǎo)航，設(shè)計(jì)師們不斷探索創(chuàng)新，以適應(yīng)多變的業(yè)務(wù)需求和內(nèi)容架構(gòu)。本文將帶您探索四種特殊的導(dǎo)航形式，它們不僅解決了特定的設(shè)計(jì)挑戰(zhàn)，也為導(dǎo)航設(shè)計(jì)提供了全新的視角和思路。讓我們一起深入了解這些創(chuàng)新的導(dǎo)航解決方案，為用戶打造更加直觀、高效的交互體驗(yàn)。

在導(dǎo)航菜單當(dāng)中，除了我們常在工作當(dāng)中提到的 頂部導(dǎo)航、側(cè)邊導(dǎo)航、混合導(dǎo)航之外，也會(huì)有一些特殊的導(dǎo)航形式。

有的是在系統(tǒng)當(dāng)中為了去解決某種業(yè)務(wù)場(chǎng)景，有的是內(nèi)容架構(gòu)不合理需要進(jìn)行擴(kuò)充，今天就來給大家盤點(diǎn)一下最近看到的特殊導(dǎo)航形式，在導(dǎo)航設(shè)計(jì)上給大家提供更多的解決方案與思路。

下鉆導(dǎo)航

下鉆導(dǎo)航，就是需要通過下鉆的方式，將導(dǎo)航的深度進(jìn)行加深。它主要解決在特殊情況下，對(duì)于導(dǎo)航內(nèi)容進(jìn)行的臨時(shí)擴(kuò)充。

通常會(huì)使用在混合導(dǎo)航當(dāng)中，因?yàn)榛旌蠈?dǎo)航已經(jīng)很難再進(jìn)行深度的擴(kuò)展，就只能使用特殊的辦法來解決問題。

比如在導(dǎo)航菜單當(dāng)中，只有我的客戶需要有三級(jí)導(dǎo)航，并且需要展現(xiàn)「重要客戶、普通客戶、客戶標(biāo)簽 等」導(dǎo)航信息時(shí)，就可以使用下鉆的方式對(duì)內(nèi)容進(jìn)行臨時(shí)的補(bǔ)充。

在設(shè)計(jì)上，主要表現(xiàn)在點(diǎn)擊下鉆導(dǎo)航菜單過后，會(huì)將原有的導(dǎo)航面板進(jìn)行替換，呈現(xiàn)下鉆的導(dǎo)航結(jié)構(gòu)，用于給到用戶進(jìn)行選擇。

比如在支付寶的商家平臺(tái)當(dāng)中，常規(guī)的導(dǎo)航內(nèi)容我們都可以通過混合導(dǎo)航的方式進(jìn)行解決，只有在運(yùn)營中心當(dāng)中的激勵(lì)政策、市場(chǎng)服務(wù)、其他 當(dāng)中，由于本身內(nèi)容較多因此沒辦法進(jìn)行二級(jí)導(dǎo)航的平鋪展示，所以就只能通過下鉆的方式展現(xiàn)頁面。

邊欄導(dǎo)航

邊欄其實(shí)是一種導(dǎo)航擴(kuò)充的思路，比如現(xiàn)在導(dǎo)航的整體內(nèi)容結(jié)構(gòu)過于復(fù)雜，這時(shí)候我就可以使用邊欄的方式進(jìn)行導(dǎo)航模塊的呈現(xiàn)。它會(huì)在你的屏幕右側(cè)單獨(dú)開辟一個(gè)新的區(qū)域，這樣就能夠呈現(xiàn)較大的數(shù)據(jù)內(nèi)容。

比如在 Edge 瀏覽器當(dāng)中，我們就能夠通過邊欄訪問部分網(wǎng)頁，這樣就能實(shí)現(xiàn)內(nèi)容的雙屏展示。特別是邊欄打開 Kimi，整體效率會(huì)特別的高。

當(dāng)然在 B 端產(chǎn)品當(dāng)中，也會(huì)有類似的交互，比如明道云產(chǎn)品當(dāng)中，也會(huì)將其 消息、通訊錄 作為邊欄，提供給用戶進(jìn)行快速的訪問。

除了完整的布局當(dāng)中會(huì)有邊欄之外，也會(huì)有一些特殊頁面可以使用邊欄進(jìn)行拓展。比如紛享銷客就在其詳情頁當(dāng)中使用邊欄呈現(xiàn)更還多維的信息，算是除了 Tab 之外有一種信息內(nèi)容形式的補(bǔ)充。

自定義導(dǎo)航

其實(shí)準(zhǔn)確來說，應(yīng)該叫做導(dǎo)航的自定義功能，因?yàn)閷?dǎo)航本身涉及到的內(nèi)容就會(huì)比較特殊，每一個(gè)人都會(huì)有自己的導(dǎo)航訴求，所以可以使用自定義的方式來進(jìn)行自主的選擇。

通常自定義導(dǎo)航會(huì)存在有兩個(gè)特點(diǎn)：

1.系統(tǒng)非常龐大，功能模塊眾多，在設(shè)計(jì)上就會(huì)有較多的掣肘地方，因此難以有一個(gè)完美的解決方案。

2.用戶的角色很難進(jìn)行抽象。就很難用那么 2-3 個(gè)角色來對(duì)系統(tǒng)當(dāng)中整體的導(dǎo)航進(jìn)行歸類，這時(shí)候只能將這個(gè)權(quán)限開放給到用戶，讓他們進(jìn)行自定義。

關(guān)于自定義導(dǎo)航的部分，已經(jīng)有非常多 B 端產(chǎn)品進(jìn)行普及，這里我簡(jiǎn)單羅列一下我知道的導(dǎo)航，大家也可以在評(píng)論區(qū)進(jìn)行補(bǔ)充：Salesforce、Coding、ONES、騰訊云、薪人薪事…

客戶端導(dǎo)航

客戶端導(dǎo)航在我看來就是為了兼容客戶端應(yīng)用所涉及出來的樣子，它整體結(jié)構(gòu)基本上以側(cè)邊導(dǎo)航為主，通過側(cè)邊導(dǎo)航一層層進(jìn)行多級(jí)內(nèi)容的延展。

這類型產(chǎn)品都會(huì)有一些相似的地方，都是想通過瀏覽器進(jìn)行封裝，進(jìn)而產(chǎn)出一個(gè)客戶端版本。所以在設(shè)計(jì)之初，很多內(nèi)容都是為了應(yīng)用封裝考慮，讓它看起來像是一個(gè)客戶端。

比如 Notion、Follow、Figma 很多產(chǎn)品都是按照這個(gè)思路進(jìn)行的設(shè)計(jì)。

當(dāng)然，這是我搜集的比較特殊的導(dǎo)航形式，你有遇到過哪些特殊的情況，可以在評(píng)論區(qū)補(bǔ)充～