• <bdo id="1ftk3"></bdo>
      <bdo id="1ftk3"></bdo>

      1. 歡迎來到合肥浪訊網絡科技有限公司官網
          咨詢服務熱線:400-099-8848

        從用戶視點動身,我們來談談移動端底部導航規劃

        發布時間:2020-12-23 文章來源:本站  瀏覽次數:2224

        移動端規劃中底部導航很重要
        有研討者在關于移動設備運用狀況的研討中發現,49%的人依靠一根手指完成手機上的操作。在下圖中,手機屏幕上的畫面表明大致的接觸范圍,不同色彩表明用戶能用拇指在屏幕上觸及的區域。綠色表明輕易觸及;黃色表明需求伸長手指;紅色表明需求用戶改動持握方法。

        圖片表明單手操作智能手機的舒適程度。
        把最重要最常用的操作放在屏幕底部十分重要,由于它們能用一只手指輕松觸及。
        標簽欄
        許多運用遵從這一規則,將底部導航(又稱作標簽欄)作為最重要的app功用。

        底部導航規劃的3個關鍵
        導航通常是搭載用戶的交通工具。底部導航應該承載重要性等同的尖端目的地。這些目的地需求在app的任何地方留有直接的入口。
        優秀的底部導航規劃遵從以下3條定律:
        1. 只顯現最重要的目的地
        在底部導航中運用3到5個尖端目的地。假如少于3個,請考慮運用標簽替代。

        底部導航防止運用5個以上,由于點擊方針相互會過于挨近。在標簽欄放置過多的項目,讓人們難以點中他們的方針。每多展示一個標簽,app的復雜性就增加一分。

        假如尖端目的地確實有5個以上,不要用底部導航來承載這些入口,請考慮放在其他方位。
        防止內容翻滾
        小屏幕上顯而易見的解決方法,便是部分躲藏式的導航——不用憂慮屏幕空間的局限,把標簽項放入翻滾的標簽欄即可??墒欠瓭L的內容功率低下,由于你得滑動一下才能看到想要的選項。


        2. 表達出當時方位
        沒有表達當時方位,可能是app菜單中最遍及的過錯?!拔以谀睦铩笔怯脩粜枨蠡卮鸬幕締栴}之一,這是順暢操作的條件。
        用戶應該在沒有任何外部引導的狀況下,一眼就看出怎么從A前往B。應該供給恰當的視覺頭緒(圖標、標簽和色彩),操作就不需求任何闡明晰。
        (1)圖標
        正由于底部導航操作以圖標方法展示,它們所表達的內容應該要適宜通過圖標來表達。有些用戶熟知的通用圖標,通常這些都表明搜索、郵件、打印等功用。不幸的是,“通用”圖標很少。app的規劃師常常用圖標來代表一些十分難以分辨的功用。


        (2)色彩
        防止在底部標簽欄運用不同色彩的圖標和文字標簽。應當運用app的主色來表明視覺焦點。


        遵從一條簡略的規律——用app的主色來提亮當時的底部導航項(包括圖標和文字標簽)。

        假如底部導航欄有布景色,就要用是非的圖標和文字標簽。

        左圖:防止運用五顏六色圖標和五顏六色布景的組合;右圖:運用是非圖形。
        (3)文字標簽
        文字標簽要為導航圖標供給簡短有意義的描述。不要用太長的標簽,由于它們不能切斷或換行。 

        防止換行、切斷和縮小文字標簽。
        菜單元素要易于閱讀。用戶要能了解他點擊某個元素時會發生什么。
        (4)點擊尺度
        方針區域足夠大,才易于點擊。將界面寬度按操作項的數量等分,核算每個底部導航操作項的寬度?;蛟S,把一切底部導航項的寬度設為最寬。

        移動端的固定導航欄。單位是邏輯像素(dp)。
        (5)標簽欄的小紅點
        可以在標簽欄顯現小紅點,表明有相關的新信息。

        可以用低調的方法給標簽欄圖標加上小紅點。
        3. 讓導航不言自明
        優秀的導航應該感覺像一只隱形的手,在操作途中指引用戶。究竟,假如用戶都無法找到,那最酷的功用和最有吸引人的內容都沒用。
        (1)表現
        每個底部導航圖標都要通向某個目的地。而不能是翻開菜單或其他彈出窗口。點按底部導航圖標應該直接通向相應界面,或許改寫當時激活的界面。

        不要用標簽欄供給控制項,用來操作當時界面或app模式中的元素。假如需求供給操作項,請改用工具欄。

        (2)堅持一致
        盡可能在每種狀況下都顯現標簽欄。這樣能給用戶一種視覺上可靠的感覺。
        不要由于功用不可用就移除某個標簽。假如你在某些狀況下移除一個標簽,其他狀況確保存,就會讓你的app界面感覺不可靠、難以預料。最佳解決方案是確保一切標簽都是可用的,然后解說為什么某個標簽沒有內容。

        (3)躲藏標簽欄
        假如界面里是翻滾的信息流,標簽欄可以在翻滾檢查更多內容時躲藏,向下滑動測驗回頂部時再顯現。

        底部導航欄可以根據翻滾,動態顯現和躲藏。
        (4)視覺愉悅
        防止運用橫向滑動的動效來切換界面。激活和未激活的界面,切換過渡作用應該運用疊加漸隱作用。

        總結
        底部導航應該:
        可見且結構合理(運用3到5個尖端目的地,并且防止可翻滾內容)
        清晰(導航欄元素要易于閱讀,點擊區域要足夠大,方便操作)
        簡略(確保每個導航圖標都通向適宜的目的地,并且通過底部導航要可以觸達一切元素)

        上一條:關于移動端規劃知識共享—...

        下一條:分享7條打造永久規劃的規...

      2. <bdo id="1ftk3"></bdo>
          <bdo id="1ftk3"></bdo>

          1. {关键词}