当前位置:网站首页 > 开发资讯

十五年核心团队 · 值得信赖

小程序定制开发咨询热线:13066724006 /

小程序开发中常用到的几种导航设计形式

来源:网辉科技 发布时间:2015-12-22浏览

小程序开发是这几年来大连移动端发比较火热的一个方面,而小程序开发中导行是不可少的一个组成部分,导行的设计与布局是比较重要的组成部分,所以在选择小程序的导行之前,要对其做下分类,选择合适用户体验的才是我们小程序开发人员和小程序设计人员要考虑的。根据导行的不同展现形式可以将导行分成这几类:列表式、侧边栏式、下拉筛选式、顶部Tab式、底部Tab式、抽屉式以及九宫格式。下面我们来总结一下其优缺点,也方便大家在日后的设计、开发中能够更方便使用。

1、列表式

列表式小程序导航

列表式小程序导航在开发时比较常用到,比如在小程序用户中心,其展现就是用的列表式。

优点:这种导航的优点就是扩展性非常好,可以随时且方便的加入新的菜单,或功能;可以展示的功能入口会比较多。

缺点:只能做为比较单纯的入口展示,不能更多展示内容,且排布比较多的时候,用户会出现不好找入口的情况。

2、侧边栏式

侧边栏式小程序开发

这种导航在手机小程序以及手机端中并不经常用到,在PC站中应用会比较多,尤其是一种音乐网站上。

优点:可扩展性强;可见性比较好。

缺点:在屏幕上占比比较多,所以小程序中应用不多的原因之一;一般菜单会出现在左上角位置,对于喜欢单手操作又是大屏的用户来说,不太方便。

3、下拉筛选式

下拉筛选式小程序开发导航

在一些应用商店中常见。

优点:占据屏幕空间比较小,比较容易与小程序的皮肤嵌套,好设计。

缺点:操作步骤多,且可见性比较差。

4、底部Tab式

底部Tab式小程序开发导航

这种导航展现形式是由ios提出的,而且已经延续了很多年,所以这种导航是最为常见的。

优点:可见性强,在底部用户体验比较好,使用方便;现在该种导航已经不仅仅只是导航,而是兼顾了导航与可操作性的导航栏。

缺点:可扩展性差,单个菜单占屏幕大,最好用户体验只能展示5个。

5、顶部Tab式

顶部Tab式小程序开发导航

这种导航的展示形式是谷歌提出的,是为了与ios区别开,因为其是在顶部所以会出现操作不便的情况,但现在已经解决了这个问题,通过手势滑动来解决菜单显示不全的问题。

优点:扩展性极强,没有标签菜单的个数限制;占据屏幕空间小,比底部Tab占屏更小,可以展现更多内容;手势操作比较方便。

缺点:因为空间占屏比较小,所以可见性会有一定的折损;如果扩展的菜单项过多,则越往后页面渗透率就会越低。

6、抽屉式

抽屉式小程序开发导航

这种导航也是由谷歌提出的,因为现在很多安卓手机多是没有物理按键的,会有双导航的感觉,所以为了避免这种感觉,谷歌就提出了这种侧边抽屉式导航,可以通过折叠按钮来触发导航。

优点:可扩展性好,不占用屏幕太多固定位置;

缺点:其是通过折叠按钮来打的,所以可见性也就比较差了,所以这种可能导致导航的渗透率会比较低;用户操作时可能会觉得召唤菜单比较麻烦。

7、九宫格式

九宫格式小程序开发导航

支付宝和财付通等小程序就是用的这种形式的导航,看起来就是有什么都摆上来,任君挑选的意思。

优点:扩展性好;可展示性强;

缺点:只能做入口展示用,过多排放会有杂乱感。

不同的小程序可以根据用户的不同来选择不周的导航展现形式,拿腾讯来讲,QQ采用的就是抽屉式,而微信用的而是底部Tab式,财付通小程序用的是九宫格式,所以小程序设计时一切从用户角度出发,用户使用习惯是小程序开发一定要注重的方面。