移動app設計:Tab導航是否是大勢所趨?

3 評論 34073 瀏覽 64 收藏 7 分鐘

之前也寫過一篇文章《從逛商城學習產品設計:信息架構梳理如何從小白到精通?》簡單的介紹了信息架構的梳理,算是入門吧。其實產品導航方式我個人覺得是根據產品類型和階段,結合產品功能邏輯架構梳理來確定是比較合理的。個人不覺得tab導航就必然是所有產品都適用的,用大勢所趨這種表述,也覺得稍有不妥。但可以從產品發展/類型角度來談談導航方式的應用和變化。

市面上比較常見的主導航方式從大類上包括:tab導航、側邊欄抽屜導航平鋪式導航三類(三大類很容易理解:分別挖掘了屏幕的上下、左右或頁面中部)。細分的話有很多,也都是這三類導航的變體、組合等形式,在這里就不列舉了。三大導航方式,各有優劣,下面簡單談談個人對這三類導航的認知:

側邊欄(抽屜)導航:

為什么先談側邊欄導航呢?因為確實這是爭議最多的一種導航方式。缺點比較明顯:

不夠暴露、需要用戶二次點擊。

但它的優點就是:

1).側邊欄可以“收納”很多(很容易理解:因為側邊欄的面積是比上下tab肯定是大的),也比較容易使得架構比較扁平;

2).因為側邊的“隱藏”可以保證主要頁面內容的突出和沉浸式體驗。

個人覺得因為側邊欄的缺點是明顯的,因為不建議將側邊欄導航方式作為主導航,但在兩種類型產品中可以嘗試,其目的是發揮側邊欄導航的優勢

1).早期產品,功能訴求相對單一,主要功能需要突出強調,比如早期的《課程格子》(之前設計練手的產品,記憶比較深刻,學生黨比較熟悉),強調“課程表”這一核心功能,其他功能相對訴求較低,但僅限早期產品。

2).功能單一型主線產品,但內容組織分類和賽選需求明顯,典型的像《郵箱大師》這里工具類應用。側邊欄用于內容分類和篩選。

tab導航:

最常見的是底部tab,這種導航方式,目前大家的認可度比較高。很多應用也從原先的側邊欄導航變為tab導航,其根本原因在于:它確實優點大于缺點。就導航本身,它可以“精簡明了”也可以“包羅萬象”,用“發現”、“更多”這里的架構梳理,可以整合很多內容,但對于架構梳理的能力要求相對較高,并不是所有的功能都是可以用“更多”來解決的。而且tab導航在主要功能架構暴露、減少用戶點擊、保證頁面內容的突出性(相對于側邊欄要弱,但可以接受)等方面其優勢突出。唯一的缺點就是常駐帶來的沉浸式體驗減弱(好像不那么明顯吧)。

tab導航因為其優點大于缺點的明顯性,廣泛被大家接受,也越來越常見。這也就為什么會被感覺是“必然的趨勢”,但真的是普適的嘛?我想說不是的。在產品發展早期,特別是一些工具類的產品,功能單一,硬生生的整出四個tab真的很難受。另外在應用tab導航的時候,其關鍵的在于架構梳理,一定要注意幾點:

1).架構梳理很重要:主要功能(組合)要突出,次要功能要整合,但不一定所有的次要功能都可以“更多”;

2).控制tab的數量,一般不超過5個,這個點也需要納入架構梳理的思考范圍之列。

平鋪式(列表、桌面等)導航:

這類導航也比較常見,很多設計師喜歡這類導航,因為其容易被設計的很漂亮(列表式),具有視覺感,這也是這種導航方式的優點之一。另外,平鋪式導航,架構扁平,可拓展性相對較強,特別適合內容平臺類產品,功能述求一大堆的產品。其缺點也在于:不太適合早期產品或者功能單一型產品(除非列表是用來分類or篩選內容)。同時,這種導航方式通常占用一整個頁面,也容易造成用戶走失(導航不是常駐)和迷茫(架構扁平,內容多,分類不準確時不易查找)。

平鋪式導航,其實一般產品用的不多,內容型平臺類產品比較常見。應用時,一定要處理好架構扁平和分類明確這個平衡點。

另外需要說的是,導航設計,信息架構梳理是基礎。

#專欄作家#

Mr湯進er,微信公共號:chuangshe_space。人人都是產品經理專欄作家,嚴格意義上的互聯網新人,學過設計,現在做產品。關注互聯網產品、用戶體驗設計,實踐派的理論主義者,愛思考,喜歡碼字,愿意分享,希望同互聯網er一起交流學習,共同進步。

本文系作者授權發布,未經許可,不得轉載。

更多精彩內容,請關注人人都是產品經理微信公眾號或下載App
評論
評論請登錄
  1. 寫得很好,平鋪式可以舉例嗎?

    回復
  2. 從我個人來說我喜歡Drawer的導航模式,主要原因是只用手指滑動就可以切換出列表頁面,不需要看清某個圖標再去點擊,而且就我來說,走動中單手操作底部Tab確有不便。同時,使用底部Tab意味著到使用到次級功能時需要經過多次頁面切換,如:點擊“更多”-切換到更多列表-點擊“我的資料”-切換到我的資料頁面,比使用Drawer多切換了一次頁面,相對來說會有更多的延遲、停頓感以及頁面切換帶來的距離感(用戶會覺得進入到了三級頁面)。

    不過的確很多著名產品最近從Drawer改回了底部Tab,比如知乎、餓了么,可能是用戶更加習慣底部Tab的方式吧。

    我認為單一功能性較強的應用使用Drawer方式更好,比如餓了么、好奇心日報,打造簡潔酷炫的界面,促使用戶聚焦在核心功能上。
    而功能多,業務復雜的應用可以使用兩者相結合的方式,最典型的就是QQ。Tab顯示核心業務功能、Drawer中顯示次級功能。

    個人見解,還請指正。

    來自上海 回復
  3. tab可能的確是用的最多的、

    來自廣東 回復