有趣的微交互可以让设计显得很精致

基础原则

无论多优秀的微交互设计，如果你的基础原则没有把握住，整个体验也是一团糟。

1. 底部导航是整个 App 中最重要的部分，也是使用次数最多的区域。他其实是整个 App 的第一层级的设计。让用户知道通过导航栏的流动，来去使用你的 App

2. 雅各布定律：用户花大量的时间在其他 App 上，因此你要让自己的设计跟大众理解的一致。

3. 增加行动导航，标识出一个最显眼的，这就是希望用户去使用的

1. 了解你的用户是谁，他们如何使用你的 App，你的设计就来源于此。比如你的受众是年轻的用户，你的图标可以很简约。如果是年老的用户，那么必须带上文字来说明这个模块的作用

1. 建议图标 24 像素

1. 文字建议 12 像素

1. 导航栏不应该过低，因为会跟系统的那个切换 App 重复

1. 底部导航不应超过 5 个，太多就太拥挤了。3-5 个是最佳

2. 点击尺寸最少为 44* 44 ，然后可点击区域至少为 74px

1. 增加选中反馈，让用户知道现在在哪个模块上

1. 保持图标的简单性，使用用户直接就可以懂的图标

1. 保持描述的简洁，如果有多行会觉得很乱

1. 不要增加各种线框，保持简洁，让用户关注最重要的内容本身

1. 保持图标的统一性，要么都是线图要么都是面图

1. 不能有太多的颜色，会造成视觉混乱

1. 增加通知图标，告知用户有更新，可以是圆也可以是数字。注意具体的展示，圆跟图标是有白色的间距的

1. 使用线条、颜色区别、阴影来让导航栏跟内容分隔

1. 避免顶部和底部颜色过多，干扰主体内容的表达

1. 降低非活动 tab 的透明度，同时要保证足够的颜色对比度，让有色弱的人也可以看清。最小对比度为 3:1

如何使用微动效

1. 点击反馈，用户点击图标时有一个快速的视觉响应，如颜色变化，放大等

1. 点击 其他tab时不要直接跳转，要有丝滑的图标移动动画效果

1. tab 的内容区域也要有一些淡入淡出/侧面移入的效果，让过渡更自然