抽屉式（菜单）导航实例模板，设计师喜欢哪款？

抽屉式导航

抽屉式导航也叫汉堡式菜单，一般出现在APP页面的左右两侧。用户停留在可以唤出导航的页面时，用手指向左右侧滑动或点击左右上角的图标显示导航页面。

菜单 - 导航UI移动版模板

菜单 - 导航UI移动版模板

抽屉式导航的动画效果也有比较简单的，如点击小红书APP首页左上角的用户头像后，页面会从左向右浮出抽屉式导航，背景也会出现一层黑色透明的遮罩效果

菜单 - 导航UI移动版模板

抽屉式导航页面常见的表现形式有两种：一种是主页面缩小并浮动在抽屉式导航页面上，另一种是导航页面隐藏在主页面后。

 

优势：

由于抽屉式导航页面是可以自定义的，而且用户可以用手指在纵向进行上下滑动，承载的信息量也比较大，因此可以放比较多的功能入口和信息。

 

汉堡菜单

劣势：

由于导航列表是隐藏在主页面的侧边，信息过多时导航列表上功能的可发现性比较低，因此用户需要花较多的注意力去找到目标入口。

 

跟标签式导航相比，使用抽屉式导航，用户对APP功能的结构就没有那么清楚。另外，用户点击进入某个入口后，侧边导航列表会被收起，所以不具备标识用户所在位置的作用，而且用户在不同功能间进行切换的操作步骤会变多。

 

延伸应用：

抽屉式导航有个好处，就是不用跳转到新的页面，并且信息承载能力较好。在有货APP和京东APP上对某一类商品进行筛选时，抽屉式导航就比较适合，在导航面板里选择查询选项后点击“确认”按钮，就会把商品按筛选条件重新排序。

 

互动汉堡菜单

另外，抽屉式导航在游戏类APP中也比较常见，有复杂成长系统和任务系统的手游都把内容放在页面的左右两侧，用户点击悬浮在页面上的入口就能唤出页面，再次点击入口或页面上的收起按钮就可以隐藏页面。

搜UI(SOOUI) 有更多导航的案例，可以临摹学习。

通过临摹，一则用来强化技法层面的能力，二来也能提升初学者的创新能力。

临摹的内容，可以有两方面选择：一种是系统自带的图标，另一种则是行业牛人的设计作品，

捉摸他们的设计风格、思想和细节，都能加深对设计的认识。

本文地址：https://blog.csdn.net/awayaya1/article/details/107889630