隨著移動(dòng)APP的發(fā)展至今，至少開發(fā)出了幾百個(gè)優(yōu)秀的APP。大部分的APP采用的APP導(dǎo)航方式就是最經(jīng)典的tabbar方式，也就是我們這節(jié)課的主題要講的——APP底部導(dǎo)航設(shè)計(jì)。

如下圖的APP底部導(dǎo)航設(shè)計(jì)：有五個(gè)標(biāo)簽。

一直以來(lái)，APP導(dǎo)航的設(shè)計(jì)是App 設(shè)計(jì)發(fā)展過(guò)程中很值得玩味的地方，由于移動(dòng)設(shè)備特別是智能手機(jī)的屏幕尺寸有限，設(shè)計(jì)者們通常會(huì)將屏幕空間盡量留給主體內(nèi)容，優(yōu)秀的導(dǎo)航設(shè)計(jì)會(huì)讓用戶輕松到達(dá)目的地而又不會(huì)干擾和困惑用戶。

回顧一下PC端的導(dǎo)航設(shè)計(jì)原則：

一般導(dǎo)航設(shè)計(jì)使用的都是7±2原則，即“由于人類大腦處理信息的能力有限，它會(huì)將復(fù)雜信息劃分成塊和小的單元。當(dāng)然這么小的一個(gè)屏幕我們不會(huì)設(shè)計(jì)9個(gè)，而當(dāng)導(dǎo)航支持滑動(dòng)時(shí)，也不建議超過(guò)9個(gè)~

直奔主題，為什么大家都會(huì)選擇APP底部導(dǎo)航設(shè)計(jì)模式來(lái)作為我們的APP主要的操作入口。

第一部分：為什么選擇底部導(dǎo)航這樣的設(shè)計(jì)方式

原因有二：

1、這樣APP導(dǎo)航設(shè)計(jì)方式是由蘋果將其傳播開來(lái)。不僅很多蘋果的官方應(yīng)用采用了這種設(shè)計(jì)，蘋果同樣大力推薦應(yīng)用開發(fā)者優(yōu)先采用這種方式。

從某種角度來(lái)說(shuō)，tabbar 基本就是導(dǎo)航的標(biāo)準(zhǔn)設(shè)計(jì)。而移動(dòng)手機(jī)占有率最高的也是蘋果公司的產(chǎn)品。

2、把導(dǎo)航放在底部是更加容易操作方便。用戶學(xué)習(xí)成本較低。目前很大一部分都是喜歡單手操作的。

所以底部也是這類用戶最容易接觸的地方。

如下圖所示：

有興趣的小伙伴可以閱讀：如何做好大屏手機(jī)的APP交互設(shè)計(jì)【APP設(shè)計(jì)課程】和移動(dòng)觸屏體驗(yàn)設(shè)計(jì)教程：手指觸屏尺寸規(guī)范解析

以上2點(diǎn)可以得出結(jié)論。就是將最重要和最常用的行動(dòng)放在底部是很必要的。因?yàn)樗麄兛梢院苁孢m的用單手和單指進(jìn)行操作。

同時(shí)也是符合移動(dòng)APP設(shè)計(jì)原則的。

第二部分：APP底部導(dǎo)航設(shè)計(jì)的優(yōu)缺點(diǎn)分析：

擴(kuò)展閱讀：8種移動(dòng)APP導(dǎo)航設(shè)計(jì)模式大對(duì)比

優(yōu)點(diǎn)：

1、讓用戶清楚整個(gè)app共有幾部分重要內(nèi)容，使內(nèi)容直觀清晰的顯示出來(lái)，方便用戶切換。

2、用戶完成切換的成本很低，只需要一次點(diǎn)擊操作，而放在屏幕底部對(duì)主體內(nèi)容的視覺(jué)沖擊可以說(shuō)是最小的，這樣用戶就不會(huì)在瀏覽主體內(nèi)容時(shí)受到過(guò)多的干擾。

缺點(diǎn)：

1、會(huì)占據(jù)一定的屏幕高度。減少了手機(jī)屏幕的大小。

2、那就是受制于屏幕寬度的限制，通常只能放置 4 到 5 個(gè)功能項(xiàng)的，過(guò)多的話將會(huì)顯著提高用戶的切換成本。

第三部分：APP設(shè)計(jì)師必須遵守的APP底部導(dǎo)航設(shè)計(jì)的三個(gè)關(guān)鍵點(diǎn)

記住APP底部導(dǎo)航設(shè)計(jì)： 僅顯示最重要的四到五個(gè)標(biāo)簽為最佳

☆ ? 超過(guò)五個(gè)，靠的太近，難以點(diǎn)擊。

☆ ? 每多加一個(gè)目的地，app就會(huì)更復(fù)雜。

☆ ? 不要嘗試在底部導(dǎo)航上加滾動(dòng)。

今天就跟大家聊到這里，25學(xué)堂每天跟大家分享一點(diǎn)APP設(shè)計(jì)知識(shí)點(diǎn)。讓大家理解和學(xué)會(huì)每一個(gè)APP界面設(shè)計(jì)的含義。同時(shí)也是成為APP設(shè)計(jì)大神的必備基礎(chǔ)課程。