css app菜单,5种实用的移动手机APP导航菜单设计方案

5种实用的移动手机APP导航菜单设计方案

5月 2, 2014

评论 (2)

Sponsor

手机分辨率比桌面平台小很多，所以设计手机网站或是移动应用的时候，导航菜单都需要考虑周全，尽量保持简约和易用性高，这里我们整理了5种实用的移动手机APP导航菜单设计方案，你可以尝试这些菜单设计模式用在你的新设计项目上，好用而且有新鲜感。

这5种APP菜单设计方案也许有很多设计师已经在使用，但不能否认它是目前实用的，而且能提高用户体验的菜单设计方案。下面摘选移动手机UI设计美观、时尚，希望你看了后会有灵感收获，能把你的菜单设计得更棒，好好学习吧:)

APP导航设计类型：

1. 列表式菜单

列表式菜单设计这个从网站到手机APP上都很常用的，遵循由上至下的阅读习惯方式，所以使用起来用户不会觉得困难。另外我们可以通过漂亮的配色、图标组合来设计，使得菜单更多加美观。

GIF Aimation by Sergey Valiukh

Elevatr by Fueled

HabitClock App by Kutan

Instagrab for iOS by Davis Yeung

2. 矩阵、网格式菜单设计

网格式菜单就类似于metro UI的堆砌色块，优点简约而不简陋，导航清晰、明显，并能提高效率。但设计时切记不分青红皂白的去使用色彩哦，这可能会让用户不知所措和产生疲倦感。

Vectra  by Michal

Arrivo Mobile App by Marco

Abracadabra App by Sergey

T R A V E R S E by Willis

3. 底部菜单

底部菜单主要是列出应用程序重要的功能。

Badoo concept by Jakub Antalík

Animated sliding tab bar by Virgil Pana

4. 顶部菜单

顶部菜单和底部意义差不多，把菜单放在顶部，可以遵循上至下的阅读习惯，不过我认为有个缺点就是不能单手操作。

Horner by Cüneyt ŞEN

Discovery Channel by Enes Danış

Air flow calculation app by HAMZAQUE

Shario App by MING Labs&Pierrick Calvez

5. 扩展菜单

扩展式菜单设计现在连网站也很常用，当我们觉得菜单比较点用位置的时候，可以尝试用这种方式来隐藏菜单，需要注意的是设计展开菜单按钮大部设计在左或右上角这些显示的位置。

MuSeek by Al Power

Univit UI by Mohammed Alyousfi & Àlex Casabò

SVOY app design by Alexandre Efimov

Időkép by Attila Szabó

总结

从上面5个菜单设计方案中可以看出都有自己的优缺点，所以我们应该选择对你项目最为有效的方案，并能提高用户体验。

推荐：查看最受欢迎的 301 个设计网站 → http://hao.shejidaren.com

交流：为设计新人提供的设计交流群，请加入UI设计交流群，分享经验、接单、求职、聊设计。

赞助商链接

赞助商链接

喜欢这篇文章吗？欢迎分享到你的微博、QQ群，并关注我们的微博，谢谢支持。

版权：除非注明，本站文章均为原创文章，转载请联系我们授权，否则禁止转载。

猫喵喵oo -

2015 年 04 月 07 日 下午 1:25

福祉_樱花瓣 -

2014 年 05 月 06 日 上午 10:48

怎么下载或购买？

{ 发表评论 }

姓 名 (必填)

邮 件 (必填)

网 站