三界文学阁

手机浏览器扫描二维码访问

第八十三章 七个导航的经典设计（第1页）

四、九宫格导航，九宫格是一种最简单直白的导航方式，把所有的具体导航类目平铺在一个页面中，这样的做法优缺点有显而易见，优点在于，不需要任何操作就可以看见所有的类目细节，并且可以占满屏幕，非常直观。但是缺点依然也是很明显，我们一下子看见这么多类目，很难一下子就找到我们想要的那一个类，所以通常九宫格导航的做法，都是在一些次重要的导航中呈现，并且这些导航类目之间的联系并不大，无法用体系关系把他们联系到一起，平铺直叙是最简单粗暴，也可能是最好的展示方法。通常，九宫格导航并不会单纯的文字或者in的展示，都会是两者结合起来的展示方式，目的就是能让用户更容易一点找到想要找的具体标签。

五、悬浮导航，悬浮导航这种表现形式，顾名思义就是一直悬浮在固定的地方，这样的交互方式，主要是想凸显功能特点，比如app通常会把自己最亮点的功能点做的最显眼，而这个功能点要是在功能体系里面找起来又不是很方便，于是就做成了这种悬浮导航的交互，方便用户的点击。

原型实现，这里为了更好的演示悬浮的样式，b站的交互是：点击悬浮的直播button，显示的是直播设置详情页。

这个交互实现的思路是，点击直播button，会弹出两个入口，并且出现一个半透明的背景；当再次点击直播button或者点击黑色背景，隐藏黑色背景及两个直播入口。

六、船舵导航，船舵的导航类型与悬浮导航极其类似，船舵导航主要会出现在底部导航的正中间，通常以一个加号的形式展示，主要的作用在于可以凸显主要功能，并且可以在首页节省空间。把重要或者在功能体系中不好找到的功能点设置成船舵导航，易于用户的发现，并且增加app交互的多样性，使用户不会出现使用疲劳的情况。

b站中的船舵导航，并不是传统的出现在底部导航的正中间，而是出现在news页面的右角。和微信右角的加号位置及功能点都极其类似，我们暂且归结为船舵导航的形式。

七、tab导航，tab导航和顶部导航极其相似，都是出现在app的顶端，通过不同的分类对app自有的内容进行分类呈现。但是现在的tab导航中，多了许多的花样，由于app的内容不断地增多，一级分类已经不够让用户足够清晰地看到自己想看到的内容，很多内容型的app的内容信息，需要二级分类才能更好的展示出自有的内容信息。

这就需要tab导航衍生更多的功能，在顶级tab分类下，每个tab点击进去后，会展示二级分类方式，选好二级分类tab之后，才能更好的展示出相应的内容，就如目前大型内容型app，携程，大众点评等呈现的那样。

陆小逸也对这些导航设计提出了不少建议，觉得可行，只是后续还需要继续细化。

写在前面一点，原型用得到所有元部件，都并非截取的app的截图，都可以在fontawe图标字体axure部件库中找到。这个元件库的in可以任意的修改样式和颜色，很强大很方便。

需要从头开始画原型，要先理清整个app的样式架构方式，底部的四个导航是整个app里面最大的分类，所以整体被分成了四部分：ho、category、dynaic、news。在交互由于同时存在顶部导航，所以这四个导航之间只是通过点击button切换，没有左右滑动的实现。有些导航没有交互方式的难度，但不证明原型就可以随便画画了事。

夏妍忙完了手头的工作，一扭头看到陆小逸正在开挂的做app设计方面的工作。

“哇，这也太硬核了吧，七个导航真的能用的吗？”

夏妍有点意外，别人的app至多就两三个导航，小破站这app居然有七个导航。

夏妍只是看了一眼，也没追问，只是说自己的事情：“陆小逸啊，咱们接下来的客户端怎么安排？”

陆小逸对夏妍和徐珊珊说道：“你们有没有认识的外包公司？靠谱一点的那种。”

夏妍想了想：“我认识一家，有几个朋友都是里面的app设计师，水平还可以。”

陆小逸点点头：“行，你把联系方式给我，另外你们有熟人吗？”

夏妍与徐珊珊都摇了摇头：“虽然认识几个外包公司，但是的确没有什么熟人。”

陆小逸说道：“行吧，那就这样，你们先把我刚才设计出的七个导航的细纲给搞定吧。”

陆小逸转身楼。

夏妍说道：“等等，站长，做出了手机端以后，我们下一步路到底该怎么走啊？需要用到这么多导航？”

陆小逸说道：“别急，等app做出来以后你就知道这个七导航的设计多么经典了。”

……

回到家，陆小逸已经有点犯困了，看来是工作太久的原因。

按照夏妍给的联系方式，陆小逸找到了那家外包公司的负责人，然后谈了一下需求。

陆小逸提供app的设计方案，这样就可以省掉定制设计和创意思考这些过程的成本，时间也可以相应的缩短。

但这家外包公司的实力可能达不到陆小逸的要求，于是这一单并没有谈好，主要是对方的需要的时间了，而陆小逸仅仅只需要一个完整的大框架，有点bug不要紧，他可以直接用系统升级app，所以根本无法接受对方的那些要求。

毕竟设计好app才仅仅是第一步，慢慢来。

框架都还没搭起来，陆小逸打算后面再处理，能外包外包，不能外包就自己亲自手。

现在还有个比较严峻的问题，得找个靠谱的外包制作公司。

对于这个世界的app设计公司来说，在有设计图与app概念图的情况下，复现前世的b站应该是没什么问题的，不过陆小逸还想做得更细致一些，至少达到顶尖的水准，如果能超越前世阿b就更好了。

陆小逸自己也不认识制作公司的人，他想了一下，决定给陆小璃打个电话。

这种事情还是得看陆小璃，在人脉方面，陆小璃可比陆小逸强多了，而且也开过几家互联网公司，平时也经常接触许多公司，找一家靠谱的app制作公司应该不难。

电话里，陆小逸简单地说了一下自己的要求，陆小璃很快就给陆小逸发来一个联系电话。

这家公司在业内还算是小有名气，也有几部还不错的app设计作品，实力方面应该没问题。

陆小逸简单说了一下自己的要求，和那边的负责人谈好了小破站的app开发工作。

等都谈完了，陆小逸已经快累死了。

魔盗神座  全球骑士战争：我！开紫灯的帝骑  人在东京，绝世猛龙也怕柴刀  小区浪漫修仙记  洪荒：碰瓷鸿钧，我成道祖首徒  都市：我嬴政，开局复苏杀神  人在食戟:我来自中华小当家  我的一生只喜欢你  重生最狂女学生  我的妄想能成真  当教授恋爱时  人在局中人，狱友沈放  救命！她被病态前男友缠上了  都市之无限选择系统  直播速通诸天：三天打穿西游  某恶魔高校的神龙果实  重生从小作坊开始  绝世神女惊天下  破案打妖妖灵，找我吃瓜群众干嘛  开局前女友组团重生