移動(dòng)端規(guī)劃中底部導(dǎo)航很重要
有研討者在關(guān)于移動(dòng)設(shè)備運(yùn)用狀況的研討中發(fā)現(xiàn)，49%的人依靠一根手指完成手機(jī)上的操作。在下圖中，手機(jī)屏幕上的畫面表明大致的接觸范圍，不同色彩表明用戶能用拇指在屏幕上觸及的區(qū)域。綠色表明輕易觸及；黃色表明需求伸長(zhǎng)手指；紅色表明需求用戶改動(dòng)持握方法。
圖片表明單手操作智能手機(jī)的舒適程度。
把最重要最常用的操作放在屏幕底部十分重要，由于它們能用一只手指輕松觸及。
標(biāo)簽欄
許多運(yùn)用遵從這一規(guī)則，將底部導(dǎo)航（又稱作標(biāo)簽欄）作為最重要的app功用。
底部導(dǎo)航規(guī)劃的3個(gè)關(guān)鍵
導(dǎo)航通常是搭載用戶的交通工具。底部導(dǎo)航應(yīng)該承載重要性等同的尖端目的地。這些目的地需求在app的任何地方留有直接的入口。
優(yōu)秀的底部導(dǎo)航規(guī)劃遵從以下3條定律：
1. 只顯現(xiàn)最重要的目的地
在底部導(dǎo)航中運(yùn)用3到5個(gè)尖端目的地。假如少于3個(gè)，請(qǐng)考慮運(yùn)用標(biāo)簽替代。
底部導(dǎo)航防止運(yùn)用5個(gè)以上，由于點(diǎn)擊方針相互會(huì)過于挨近。在標(biāo)簽欄放置過多的項(xiàng)目，讓人們難以點(diǎn)中他們的方針。每多展示一個(gè)標(biāo)簽，app的復(fù)雜性就增加一分。
假如尖端目的地確實(shí)有5個(gè)以上，不要用底部導(dǎo)航來承載這些入口，請(qǐng)考慮放在其他方位。
防止內(nèi)容翻滾
小屏幕上顯而易見的解決方法，便是部分躲藏式的導(dǎo)航——不用憂慮屏幕空間的局限，把標(biāo)簽項(xiàng)放入翻滾的標(biāo)簽欄即可。可是翻滾的內(nèi)容功率低下，由于你得滑動(dòng)一下才能看到想要的選項(xiàng)。
2. 表達(dá)出當(dāng)時(shí)方位
沒有表達(dá)當(dāng)時(shí)方位，可能是app菜單中最遍及的過錯(cuò)�！拔以谀睦铩笔怯脩粜枨蠡卮鸬幕締栴}之一，這是順暢操作的條件。
用戶應(yīng)該在沒有任何外部引導(dǎo)的狀況下，一眼就看出怎么從A前往B。應(yīng)該供給恰當(dāng)?shù)囊曈X頭緒（圖標(biāo)、標(biāo)簽和色彩），操作就不需求任何闡明晰。
（1）圖標(biāo)
正由于底部導(dǎo)航操作以圖標(biāo)方法展示，它們所表達(dá)的內(nèi)容應(yīng)該要適宜通過圖標(biāo)來表達(dá)。有些用戶熟知的通用圖標(biāo)，通常這些都表明搜索、郵件、打印等功用。不幸的是，“通用”圖標(biāo)很少。app的規(guī)劃師常常用圖標(biāo)來代表一些十分難以分辨的功用。
（2）色彩
防止在底部標(biāo)簽欄運(yùn)用不同色彩的圖標(biāo)和文字標(biāo)簽。應(yīng)當(dāng)運(yùn)用app的主色來表明視覺焦點(diǎn)。
遵從一條簡(jiǎn)略的規(guī)律——用app的主色來提亮當(dāng)時(shí)的底部導(dǎo)航項(xiàng)（包括圖標(biāo)和文字標(biāo)簽）。
假如底部導(dǎo)航欄有布景色，就要用是非的圖標(biāo)和文字標(biāo)簽。
左圖：防止運(yùn)用五顏六色圖標(biāo)和五顏六色布景的組合；右圖：運(yùn)用是非圖形。
（3）文字標(biāo)簽
文字標(biāo)簽要為導(dǎo)航圖標(biāo)供給簡(jiǎn)短有意義的描述。不要用太長(zhǎng)的標(biāo)簽，由于它們不能切斷或換行。
防止換行、切斷和縮小文字標(biāo)簽。
菜單元素要易于閱讀。用戶要能了解他點(diǎn)擊某個(gè)元素時(shí)會(huì)發(fā)生什么。
（4）點(diǎn)擊尺度
方針區(qū)域足夠大，才易于點(diǎn)擊。將界面寬度按操作項(xiàng)的數(shù)量等分，核算每個(gè)底部導(dǎo)航操作項(xiàng)的寬度。或許，把一切底部導(dǎo)航項(xiàng)的寬度設(shè)為最寬。
移動(dòng)端的固定導(dǎo)航欄。單位是邏輯像素（dp）。
（5）標(biāo)簽欄的小紅點(diǎn)
可以在標(biāo)簽欄顯現(xiàn)小紅點(diǎn)，表明有相關(guān)的新信息。
可以用低調(diào)的方法給標(biāo)簽欄圖標(biāo)加上小紅點(diǎn)。
3. 讓導(dǎo)航不言自明
優(yōu)秀的導(dǎo)航應(yīng)該感覺像一只隱形的手，在操作途中指引用戶。究竟，假如用戶都無法找到，那最酷的功用和最有吸引人的內(nèi)容都沒用。
（1）表現(xiàn)
每個(gè)底部導(dǎo)航圖標(biāo)都要通向某個(gè)目的地。而不能是翻開菜單或其他彈出窗口。點(diǎn)按底部導(dǎo)航圖標(biāo)應(yīng)該直接通向相應(yīng)界面，或許改寫當(dāng)時(shí)激活的界面。
不要用標(biāo)簽欄供給控制項(xiàng)，用來操作當(dāng)時(shí)界面或app模式中的元素。假如需求供給操作項(xiàng)，請(qǐng)改用工具欄。
（2）堅(jiān)持一致
盡可能在每種狀況下都顯現(xiàn)標(biāo)簽欄。這樣能給用戶一種視覺上可靠的感覺。
不要由于功用不可用就移除某個(gè)標(biāo)簽。假如你在某些狀況下移除一個(gè)標(biāo)簽，其他狀況確保存，就會(huì)讓你的app界面感覺不可靠、難以預(yù)料。最佳解決方案是確保一切標(biāo)簽都是可用的，然后解說為什么某個(gè)標(biāo)簽沒有內(nèi)容。
（3）躲藏標(biāo)簽欄
假如界面里是翻滾的信息流，標(biāo)簽欄可以在翻滾檢查更多內(nèi)容時(shí)躲藏，向下滑動(dòng)測(cè)驗(yàn)回頂部時(shí)再顯現(xiàn)。
底部導(dǎo)航欄可以根據(jù)翻滾，動(dòng)態(tài)顯現(xiàn)和躲藏。
（4）視覺愉悅
防止運(yùn)用橫向滑動(dòng)的動(dòng)效來切換界面。激活和未激活的界面，切換過渡作用應(yīng)該運(yùn)用疊加漸隱作用。
總結(jié)
底部導(dǎo)航應(yīng)該：
可見且結(jié)構(gòu)合理（運(yùn)用3到5個(gè)尖端目的地，并且防止可翻滾內(nèi)容）
清晰（導(dǎo)航欄元素要易于閱讀，點(diǎn)擊區(qū)域要足夠大，方便操作）
簡(jiǎn)略（確保每個(gè)導(dǎo)航圖標(biāo)都通向適宜的目的地，并且通過底部導(dǎo)航要可以觸達(dá)一切元素） |
咨詢服務(wù)熱線：400-099-8848
