如何优化一年前的图标

今天分享一组Tab栏图标的优化，直接上干货。

上面是自己曾经做过的一组图标，当初觉得还可以，现在再看，其实还差很多意思。特别是任务和我的两个图标，太普通，没有什么出彩的点。下面是现在改完的版本，虽然不是很出彩，但是比之前会好很多。

第一个是首页，当初做的时候是把里面门给倒置了下，虽然和一般首页有点差异，但是还不够。

因为我们是做偏游戏的APP，产品希望加入一点趣味性。于是我把里面的门该成了一个微笑曲线

外面是封闭线条形成一个面，里面笑脸是一条线，线面结合，比上面好点，但还差点意思，于是我想能不能把点也加上去，点线面结合，于是就在右上角加了两个点，像这样

感觉有点奇怪，有点立不住，有点飘，我就把两个点变长一点，再加上一点错位

这样感觉就好多了。

第二个是游戏图标，我们APP里面的游戏都是一些类似小程序游戏这些，用一个手指就可以操作，所以当初我就做了这样一个食指点击的动作。也是有点普通，于是我又给它加了一条线

首页就是线面结合，刚好和首页相呼应。后来发现这样的识别度不是很好，于是直接换了一个方向，改成了游戏机手柄

识别度是有了，但是出现了一个新问题，整体不是太稳，放到他们在中间，有点不搭，就像这样

于是我选择了比较稳的圆形加了上去

把手柄放圆形里面，加一点倾斜增加生动性，圆形把手上面的线高光很重要，没了会逊色很多。而且我一开始是把线放在右边，看着总有点变扭。后来观察到，这个把手是往右倾斜，重心在右边，如果再放右边，那视觉上肯定更偏右，于是就把它转到了左边，就Nice多了。

第三个是圈子，类似于社区的功能，让用户发帖讨论的地方。

圈子改动不是很大，原版本造型我觉得还行，圆形和信息框结合，就是右上角的点加的不咋地，于是我把大的造型留着不变，仅仅把那个点换了一下。

这样刚好和首页图标有点呼应，但是和它又有差异。

第四个是任务，任务这个当初做的就有点过分了，虽然大造型可以，很稳，但是，毫无亮点，平平无奇。

于是我在原基础上把内部的两条线做成一长一短，再加一条竖线增加变化，最后把整体角度逆时针旋转了8度，感觉一下字就有了

其实有时候你只要加了一个小点可能就会使你做的东西不一样，就比如这个任务旋转和没旋转的差别。

差别是不是很明显。

最后一个是我的，其实我的没做多大变化，就是根据整体风格做了一点差异。

之前的版本头部和身体占比几乎差不多，看起来很平。于是我把头变小，身体变大增加一点变化性，更加耐看。但是身体太大，里面没东西就会导致很空，于是我又在身体里面加了一条竖线，这样即解决了很空的问题，又解决了和其它图标不搭的问题，一举两得。

以上就是五个图标的优化过程和思路，最后再看一下改版前后的差别。

后面还把他们做成了动效，先看一下效果，后面会单独出一篇文章讲解。

以上就是今天分享的内容，希望对你有帮助。