5种实用App导航菜单设计方案
- - 人人都是产品经理手机分辨率比桌面平台小很多，所以设计手机网站或是移动应用的时候，导航菜单都需要考虑周全，尽量保持简约和易用性高，这里我们整理了5种实用的移动手机App导航菜单设计方案，你可以尝试这些菜单设计模式用在你的新设计项目上，好用而且有新鲜感. 这5种App菜单设计方案也许有很多设计师已经在使用，但不能否认它是目前实用的，而且能提高用户体验的菜单设计方案.
5种实用App导航菜单设计方案
标签：
交互视觉
APP设计
导航设计
| 发表时间：2014-05-08 09:04 | 作者：yoyo
出处：http://www.woshipm.com
手机分辨率比桌面平台小很多，所以设计手机网站或是移动应用的时候，导航菜单都需要考虑周全，尽量保持简约和易用性高，这里我们整理了5种实用的移动手机App导航菜单设计方案，你可以尝试这些菜单设计模式用在你的新设计项目上，好用而且有新鲜感。
这5种App菜单设计方案也许有很多设计师已经在使用，但不能否认它是目前实用的，而且能提高用户体验的菜单设计方案。下面摘选移动手机UI设计美观、时尚，希望你看了后会有灵感收获，能把你的菜单设计得更棒，好好学习吧。
APP导航设计类型：
- 列表式菜单
- 矩阵、网格式菜单
- 底部菜单
- 顶部菜单
- 扩展菜单
一、列表式菜单
列表式菜单设计这个从网站到手机APP上都很常用的，遵循由上至下的阅读习惯方式，所以使用起来用户不会觉得困难。另外我们可以通过漂亮的配色、图标组合来设计，使得菜单更多加美观。
GIF Aimation
Elevatr
HabitClock App
Instagrab for iOS
二、矩阵、网格式菜单设计
网格式菜单就类似于metro UI的堆砌色块，优点简约而不简陋，导航清晰、明显，并能提高效率。但设计时切记不分青红皂白的去使用色彩哦，这可能会让用户不知所措和产生疲倦感。
Vectra
Arrivo Mobile App
Abracadabra App
TRAVERSE
三、底部菜单
底部菜单主要是列出应用程序重要的功能。
Badoo concept
Animated sliding tab bar
四、顶部菜单
顶部菜单和底部意义差不多，把菜单放在顶部，可以遵循上至下的阅读习惯，不过我认为有个缺点就是不能单手操作。
Horner
Discovery Channel
Air flow calculation app
Shario App
五、扩展菜单
扩展式菜单设计现在连网站也很常用，当我们觉得菜单比较点用位置的时候，可以尝试用这种方式来隐藏菜单，需要注意的是设计展开菜单按钮大部设计在左或右上角这些显示的位置。
MuSeek
Univit UI
SVOY app design
Időkép
总结
从上面5个菜单设计方案中可以看出都有自己的优缺点，所以我们应该选择对你项目最为有效的方案，并能提高用户体验。
原文地址：shejidaren
| 您可能也喜欢： | ||||
 手机界面常用导航设计分析 |
 APP 创业 煎熬生存的持久战 |
 Web导航设计二三事 |
 在屏幕上画个C—基于人机工程学的安卓导航碎片化解决方案 |
 如何输出有效的设计方案 |
| 无觅 | ||||
（关注更多人人都是产品经理观点，参与微信互动（微信搜索“人人都是产品经理”或“woshipm”）
相关 [app 导航 菜单] 推荐：
5种实用的移动手机APP导航菜单设计方案
- - 设计达人手机分辨率比桌面平台小很多，所以设计手机网站或是移动应用的时候，导航菜单都需要考虑周全，尽量保持简约和易用性高，这里我们整理了5种实用的移动手机APP导航菜单设计方案，你可以尝试这些菜单设计模式用在你的新设计项目上，好用而且有新鲜感. 扩展阅读：《 使用垂直的导航菜单设计》、《 有特色的使用大菜单的网页设计》、《 20个极简网页菜单导航设计》.
iphone Web App 导航设计探讨
- Vingel - 互联网的那点事最近在做iphone端Web App的项目. 由于产品形式新颖，技术环境不成熟，公司给与了较宽松的研发时间. 在一个月的交互设计阶段，每个环节都得到多次讨论推敲，我从中感悟颇多. 导航系统的设计是一个比较典型的点，拿出来与大家分享讨论一下. iphone Native App较常见的导航如下图所示：.
CSS导航栏/菜单教程
- Costi - 紫萝卜 | 所有与设计有关导航栏/菜单在一个网站上的作用是非常重要的，我们的访客需要的是可以快速的找到他们所需要的内容的高效导航栏/菜单，而不是一直在网站内打转. 下面与大家分享30个国外优秀的CSS导航栏/菜单教程，将教大家如何从代码和结构上构建一个高效简洁的导航栏/菜单. CSS与jQuery下拉菜单解决方案. CSS优化需要注意的15个细节.
掌上指路标 —– APP架构与导航设计
- - 百度MUX一款小小的手机应用，却包罗万象，融合这复杂的信息内容或功能逻辑. 要让用户在使用中获得最好的体验，迅速掌握应用的框架结构，其导航的设计是一个重要的环节. 手机应用的导航和现实世界中的路标或者地图的作用很类似. 它是应用软件的虚拟框架，对用户具有指示标识以及识别的功能. 比如，如同路标，导航能在使用中，定位用户当前在哪儿，为用户突出当前视图重要的功能，告知用户可以去哪儿，在不同的视图和区域迅速地切换信息，记录使用的操作轨迹防止用户迷失等.
25个漂亮的导航菜单设计
- 1625 - 前端观察原文：25个漂亮的导航菜单设计. 译自：25 Beautiful Navigation Menus. 请尊重版权，转载请注明出处，多谢. 导航菜单是网页设计中最关键的一部分，因为它们对于网站的可用性和用户体验至关重要. 导航结构比较烂或者在导航中有明显不足的网站可能会困扰用户并最终导致用户找不到想要的页面和内容而离开.
10个精致的导航菜单欣赏及点评
- 牛腩羊耳朵 - 互联网的那点事这些导航菜单来自于Dribbble网站，出自于世界各地的优秀设计师之手，涵盖了各种不同的风格，个个都非常精美. 这里我将这些导航菜单展示出来，依据自己的想法总结它们的可取之处，演示其中一些用得上的技术方法. 这样比起简单粗略的看过就忘，更能在网页设计上让我们获取很多的灵感，提高我们的设计水平. 不看这个案例话，你能想到将木质页面上的导航菜单做成类似这样抽屉式的样式吗.