隨著移動APP的發(fā)展至今,至少開發(fā)出了幾百個優(yōu)秀的APP。大部分的APP采用的APP導航方式就是最經(jīng)典的tabbar方式,也就是我們這節(jié)課的主題要講的——APP底部導航設計。
如下圖的APP底部導航設計:有五個標簽。
一直以來,APP導航的設計是App 設計發(fā)展過程中很值得玩味的地方,由于移動設備特別是智能手機的屏幕尺寸有限,設計者們通常會將屏幕空間盡量留給主體內(nèi)容,優(yōu)秀的導航設計會讓用戶輕松到達目的地而又不會干擾和困惑用戶。
回顧一下PC端的導航設計原則:
一般導航設計使用的都是7±2原則,即“由于人類大腦處理信息的能力有限,它會將復雜信息劃分成塊和小的單元。當然這么小的一個屏幕我們不會設計9個,而當導航支持滑動時,也不建議超過9個~
直奔主題,為什么大家都會選擇APP底部導航設計模式來作為我們的APP主要的操作入口。
第一部分:為什么選擇底部導航這樣的設計方式
原因有二:
1、這樣APP導航設計方式是由蘋果將其傳播開來。不僅很多蘋果的官方應用采用了這種設計,蘋果同樣大力推薦應用開發(fā)者優(yōu)先采用這種方式。
從某種角度來說,tabbar 基本就是導航的標準設計。而移動手機占有率最高的也是蘋果公司的產(chǎn)品。
2、把導航放在底部是更加容易操作方便。用戶學習成本較低。目前很大一部分都是喜歡單手操作的。
所以底部也是這類用戶最容易接觸的地方。
如下圖所示:
有興趣的小伙伴可以閱讀:如何做好大屏手機的APP交互設計【APP設計課程】和移動觸屏體驗設計教程:手指觸屏尺寸規(guī)范解析
以上2點可以得出結論。就是將最重要和最常用的行動放在底部是很必要的。因為他們可以很舒適的用單手和單指進行操作。
同時也是符合移動APP設計原則的。
第二部分:APP底部導航設計的優(yōu)缺點分析:
擴展閱讀:8種移動APP導航設計模式大對比
優(yōu)點:
1、讓用戶清楚整個app共有幾部分重要內(nèi)容,使內(nèi)容直觀清晰的顯示出來,方便用戶切換。
2、用戶完成切換的成本很低,只需要一次點擊操作,而放在屏幕底部對主體內(nèi)容的視覺沖擊可以說是最小的,這樣用戶就不會在瀏覽主體內(nèi)容時受到過多的干擾。
缺點:
1、會占據(jù)一定的屏幕高度。減少了手機屏幕的大小。
2、那就是受制于屏幕寬度的限制,通常只能放置 4 到 5 個功能項的,過多的話將會顯著提高用戶的切換成本。
第三部分:APP設計師必須遵守的APP底部導航設計的三個關鍵點
記住APP底部導航設計: 僅顯示最重要的四到五個標簽為最佳
☆ ? 超過五個,靠的太近,難以點擊。
☆ ? 每多加一個目的地,app就會更復雜。
☆ ? 不要嘗試在底部導航上加滾動。
今天就跟大家聊到這里,25學堂每天跟大家分享一點APP設計知識點。讓大家理解和學會每一個APP界面設計的含義。同時也是成為APP設計大神的必備基礎課程。
全站高品質(zhì)素材免費下載!