Peter徐

会做设计的那么多,凭什么你脱颖而出!

导航设计模式


导航对于App就是基本框架,有着举足轻重的关系,之前想总结一下移动端导航模式,奈何4月份时间紧凑只能拖到现在,废话少说,直接上干货。

基本主流的导航就是如下图,但是没有区分成一级导航和二级导航!因为可能次级导航模式还有很多,所以说针对特定的场景需要特定的导航布局。


一、列表式

                                    

列表式导航适用于条目或者层次比较多的标题导航,可以帮助用户快速的定位到相应位置去,也可以在同级页面展示二级页面内容。但是由于条目众多,容易产生审美疲劳,所以如何做好导航设计引导和列表层级设计是列表式导航的重点。目前的列表式导航多用于二级页面,比较常见的是个人中心页面。

                              大众点评(个人中心)

                    

二、抽屉式

                                                                 
抽屉式导航由于高逼格的动效侧滑受到许多用户的喜爱,主要适用于核心功能单一或者是功能切换不频繁的产品,主要优点是增加了展示空间,让用户聚集于当前页面内容,缺点就是功能可见性比较差,在运营设计大行其道的今天,遵循所见即所得的原则情况下,抽屉式导航越来越不受待见!

                                    饿了么

                          

三、菜单式
                           

                                     

菜单式导航一般适用于二级导航,即在同页面进行不同主题的快速切换,相对于抽屉式导航,其功能可见性更明显一点,不同主题的切换比较自然,阅读类App常采用这种导航模式,并由此延伸出了像网易新闻之类的超级菜单式。

                                      新浪微博

                              

四、点聚式

                                   

点聚式导航将多个功能模块聚集一个入口,节省了大量的页面空间,动效也非常灵动有趣。弱点便是功能可见性比较差,此外任务流也要过渡的自然,不然很容易中断用户的操作。

                                         Path

                             

五、宫格式

                                   

宫格式导航适用于功能模块较多,且功能模块关联性不高的产品,其优点便是产品布局明确,功能可见性强,功能模块能按需定序,缺点便是功能模块之间切换不方便,所以单个模块的层级不能太深,即使流程很多,也要做好全局设计。

                                     支付宝

                           

六、标签式

                                   

标签式导航是目前app的主流导航,优点便是几个功能模块明确,能够快速切换,且开发成本较低,一般3-5功能模块适宜,缺点便是占据了页面空间。此外还延伸出了Tab形式的二级导航。

                                         微信

                             


七、轮播式

                                   
 

轮播式导航作为内容驱动型的导航模式,凸显内容,但是不能快速定位,缺乏全局控制,且一般是轮播个数受限,但也有例外,如最美应用。

                                   最美应用

                           

八、隐喻式


                                     

隐喻式导航在扁平盛行的今天已经比较少了,其拟物化的页面导航与现实物体相对应,起到了快速引导的作用。相对而言,成本也就大了。

                                    iReader

                     


九、陈列式

                                 
陈列式导航适用于图片、视频类的产品,其特点就是运用卡片的元素进行规则或者不规则的编排,布局方式比较灵活。

                                     优酷

                        

总结:产品导航模式并不是固定的,其可以是单一导航模式,也可以是几种导航模式的结合,重要的是跟产品目标和用户场景完美匹配,随着App的增多,必然产生更多有趣,符合人性的导航设计。

最后祝大家521快乐!




上一篇 下一篇
评论
热度(3)
©Peter徐 | Powered by LOFTER