手機(jī)分辨率比桌面平臺(tái)小很多，所以設(shè)計(jì)手機(jī)網(wǎng)站或是移動(dòng)應(yīng)用的時(shí)候，導(dǎo)航菜單都需要考慮周全，盡量保持簡(jiǎn)約和易用性高，這里我們整理了5種實(shí)用的移動(dòng)手機(jī)App導(dǎo)航菜單設(shè)計(jì)方案，你可以嘗試這些菜單設(shè)計(jì)模式用在你的新設(shè)計(jì)項(xiàng)目上，好用而且有新鮮感。
這5種App菜單設(shè)計(jì)方案也許有很多設(shè)計(jì)師已經(jīng)在使用，但不能否認(rèn)它是目前實(shí)用的，而且能提高用戶體驗(yàn)的菜單設(shè)計(jì)方案。下面摘選移動(dòng)手機(jī)UI設(shè)計(jì)美觀、時(shí)尚，希望你看了后會(huì)有靈感收獲，能把你的菜單設(shè)計(jì)得更棒，好好學(xué)習(xí)吧。
導(dǎo)航類好文推薦：
《在網(wǎng)頁中設(shè)計(jì)導(dǎo)航菜單的三個(gè)原則（附案例）》
《不容錯(cuò)過！30個(gè)風(fēng)格出眾的網(wǎng)頁導(dǎo)航欄設(shè)計(jì)》
《2014網(wǎng)頁菜單新趨勢(shì)！21例時(shí)尚創(chuàng)新的側(cè)邊欄菜單網(wǎng)頁設(shè)計(jì)》
APP導(dǎo)航設(shè)計(jì)類型：
- 列表式菜單
- 矩陣、網(wǎng)格式菜單
- 底部菜單
- 頂部菜單
- 擴(kuò)展菜單
一、列表式菜單
列表式菜單設(shè)計(jì)這個(gè)從網(wǎng)站到手機(jī)APP上都很常用的，遵循由上至下的閱讀習(xí)慣方式，所以使用起來用戶不會(huì)覺得困難。另外我們可以通過漂亮的配色、圖標(biāo)組合來設(shè)計(jì)，使得菜單更多加美觀。
GIF Aimation
Elevatr
HabitClock App
Instagrab for iOS
二、矩陣、網(wǎng)格式菜單設(shè)計(jì)
網(wǎng)格式菜單就類似于metro UI的堆砌色塊，優(yōu)點(diǎn)簡(jiǎn)約而不簡(jiǎn)陋，導(dǎo)航清晰、明顯，并能提高效率。但設(shè)計(jì)時(shí)切記不分青紅皂白的去使用色彩哦，這可能會(huì)讓用戶不知所措和產(chǎn)生疲倦感。
Vectra
Arrivo Mobile App
Abracadabra App
TRAVERSE
三、底部菜單
底部菜單主要是列出應(yīng)用程序重要的功能。
Badoo concept
Animated sliding tab bar
四、頂部菜單
頂部菜單和底部意義差不多，把菜單放在頂部，可以遵循上至下的閱讀習(xí)慣，不過我認(rèn)為有個(gè)缺點(diǎn)就是不能單手操作。
Horner
Discovery Channel
Air flow calculation app
Shario App
五、擴(kuò)展菜單
擴(kuò)展式菜單設(shè)計(jì)現(xiàn)在連網(wǎng)站也很常用，當(dāng)我們覺得菜單比較點(diǎn)用位置的時(shí)候，可以嘗試用這種方式來隱藏菜單，需要注意的是設(shè)計(jì)展開菜單按鈕大部設(shè)計(jì)在左或右上角這些顯示的位置。
MuSeek
Univit UI
SVOY app design
Id?kép
總結(jié)
從上面5個(gè)菜單設(shè)計(jì)方案中可以看出都有自己的優(yōu)缺點(diǎn)，所以我們應(yīng)該選擇對(duì)你項(xiàng)目最為有效的方案，并能提高用戶體驗(yàn)。
原文地址：shejidaren
================關(guān)于優(yōu)設(shè)網(wǎng)================
"優(yōu)設(shè)網(wǎng)uisdc.com"是一個(gè)分享網(wǎng)頁設(shè)計(jì)、無線端設(shè)計(jì)以及PS教程的干貨網(wǎng)站。
【特色推薦】
設(shè)計(jì)師需要讀的100本書：史上最全的設(shè)計(jì)師圖書導(dǎo)航：http://hao.uisdc.com/book/。
設(shè)計(jì)微博：擁有粉絲量68萬的人氣微博@優(yōu)秀網(wǎng)頁設(shè)計(jì) ，歡迎關(guān)注獲取網(wǎng)頁設(shè)計(jì)資源、下載頂尖設(shè)計(jì)素材。
設(shè)計(jì)導(dǎo)航：全球頂尖設(shè)計(jì)網(wǎng)站推薦，設(shè)計(jì)師必備導(dǎo)航：http://hao.uisdc.com
———————————————————–
想在手機(jī)上、被窩里獲取設(shè)計(jì)教程、經(jīng)驗(yàn)分享和各種意想不到的"福利"嗎？
添加 優(yōu)秀網(wǎng)頁設(shè)計(jì) 微信號(hào)：【youshege】?jī)?yōu)設(shè)哥的全拼
您也可以通過掃描下方二維碼快速添加：
復(fù)制本文鏈接 文章為作者獨(dú)立觀點(diǎn)不代表優(yōu)設(shè)網(wǎng)立場(chǎng)，未經(jīng)允許不得轉(zhuǎn)載。
發(fā)評(píng)論！每天贏獎(jiǎng)品
點(diǎn)擊 登錄 后，在評(píng)論區(qū)留言，系統(tǒng)會(huì)隨機(jī)派送獎(jiǎng)品
2012年成立至今，是國(guó)內(nèi)備受歡迎的設(shè)計(jì)師平臺(tái)，提供獎(jiǎng)品贊助 聯(lián)系我們
AI輔助海報(bào)設(shè)計(jì)101例
已累計(jì)誕生 753 位幸運(yùn)星
發(fā)表評(píng)論 為下方 1 條評(píng)論點(diǎn)贊，解鎖好運(yùn)彩蛋
↓ 下方為您推薦了一些精彩有趣的文章熱評(píng) ↓