图标在产品应用常要，不位图标有不设计思路。本文将从品和设计两个度底部导航栏的图标进行分析。阅读之前，请先浏览章的大纲。
01 导航栏图标重要性及维
- 重性
- 三个重要评估维度
02 底部导航口的数量
- 认知心决定最数值
- 品框架决定具体数值
03 底部导航栏的模式
- 权重平分
- 强调信息
- 引导操作
04 底部导航栏的表现形式
- 线性图标的优势
- 其它图标趋势
05 图标设计思与创意
- 权平分模示例
- 强信息模式示例
- 引导操作模式示例
1. 重要性
导航栏的图标是路牌，承担着指路的作，给户指明进入产后可分别通往么页面。早期的导航栏是单一的指路功，经过多年的交互设计迭代后，附了「信息展示」和「引导操作」的作，这点会在中详细阐述。
2. 三个重要评估维度
品牌调性
品牌调性决定了图标的体量、差异化和创延展。怎评估图标计能够体现出品牌调性呢？最简直的方法：截屏首页，不顶部栏，仅从底部导航栏能出来这是什产品，就算成功体现了品牌调性。
识别度
识别度决了用户辨识其它页面功能的速度。高识别度的图标能协用户辨识，低识别度的图标会阻碍用户辨识。选择这部分图标的时候，一考虑识别度的问题，行创新建立高识别度的基础。
观
导航栏图标观的义：统一、精致。统一不表绝对统一，精致不表过于精细。到观，可以遵循以下几点：小统一谐、线条粗细一致、圆角视觉统一、内繁简平衡。
将三个维度按重要程度来排序，是品牌调性>识别度>美观。有的计会选择以美观度作为优先标准。但站在产品的角度来说，应该以体现品牌调性和识别度为重要标准，在这基础上再进行美观计。下图中，新书APP的底部导航栏图标略显年代，图标细节表现不一显得不够统一和致，然而用户还是能够根据图标一眼各个导航入的功能。它可能不是计眼中好的图标，但它是用户眼中好用的图标。
底部导航入口一般3-5，常见的4-5。这数由什么决呢？
1. 高数由认知理学决
在认心理学理论中，人的忆系统由三个储存器组成：感寄存器，短时忆和长时忆。来自境的刺激经滤首先进感寄存器，通选择直，信息被临时传短时忆（STM）。它是一个渡的忆缓冲期，容量有，只能录7+-2个信息组块，且只能持大约15-30秒。
在使用APP的时，底部导航栏使用到的是人忆系统中的感寄存器和短时忆。考虑到APP面对的人群非常，短时忆容量不一，选择7-2（也就是5）为底部导航口的最高数值。
2. 具数值由产品的框架决定
产品经理通项目背和用户研，决定产品的功能结构。而功能结构图划分的类别决定底部导航口数量。有的产品功能非常单一，结构也单一，三个导航口已经能够满需求；有的产品功能复，则需要更的导航口，用以划分APP功能，帮助用户快速识别。
底部导航栏有权平分、强调信息、引导操作这三模。本深度分析采用了30个品作为象进研究，其大部分为知名社交电商类品。为这类型品比较多，迭代完善，可参考性强。
1. 权平分
品功能结构权比较平均，不希望突出其某个结构时，般采用权平分模，即个底部入口分量都是平均。常规品会采用这样形。
2. 强调信息
当产需要强调某些信息引起户注意或同一个按钮承担两个功时，设计可择在某个入口添明显的信息指示或功。增功的导航入口一定是首页，可是它入口。
严的首页按钮承担着「到顶/快速定位推荐模/牌展示」的功；淘宝、飞猪的首页按钮承担着「到顶/牌展示」的功；微博的视频按钮承担着「视频/注的人更容示」的功。
3. 引导操作
当产品希望用户能够行某操作，需行强操作提醒时，可以选择引导操作的导航栏模式，中突出操作按钮。众点、果园、转转、星巴克、闲鱼都采用这种模式。
1. 线性图标优势
从大多数APP设计来看，未选状态下，线性图标占有优势。相性图标来说，线性图标有更多可能性，选与未选区分落较大，比明显。
2. 它图标趋势
未中状态的图标线性方式，目前的要趋势还是在图标表意上功夫；中状态的图标面性、微质感、立体、插画等方式。
为了直观表现图标设计的思路，我为权重平分模式、强调信息模式、引导操作模式分别设定同的产背景，把图标设计的过程写来供大参考。
1. 权重平分模式示例
2. 强调信息模式示例
3. 引导操作模示例
图标对而言最有趣的地方在于，它是由不同的变量组出来的结果，每一次的计都会有惊喜。不同的品牌、不同的产品背景、不同的产品框架…这些千变万化，让图标有了生命，也让每一次的计都有义。也欢迎你使用这的方式，组变量，做更多突破性的计。
注作者微信公众号：「一点牙线」
浙公网安备33011002017549号