赞助商
立即赞助

如何系统性优化一组图标?我总结了这五个方面!

UI设计3年前 (2021)更新 流光
2.7K 0 0

和大分享一,在年前做的一套年题图标,整个过程成长很大,希望给大一些启发。

其一套主题图标对一个刚毕业的大学生来说,难度不小,但只要愿意学习,还是以攻克重重困难,最把需求做的。

新年嘛,关键词的发散就不多说了,无非就是鞭炮、对、福、灯笼等等。

我们说:

  • 风格如何选取
  • 找不足维度
  • 透视角度优化
  • 颜色优
  • 怎么增加亮点

风格如何选取

对于风格,应该如何选择呢,比如描扁平风格:

如何系统性优化一组图标?我总结了这五个方面!

△ Martin David作品

有轻质感的拟物格:

如何系统性优化一组图标?我总结了这五个方面!

△ Man King作

里以给大家一个参考度:

界面常驻功能性图标一会使用描边、扁风格的图标,而对于节日主题图标,图标如果会显得比较冷静,所以加一些质的渲染会更有气氛。

而增加质感定程度上可以弥补造型上不足,而很出效,于时有限需求,是个不选择。

所以这次新主题图标的需求,我们选择了轻质感的风格。

找不足的维度

由于图标的验,所以第一版的样式犯了一些基础型的问题:

如何系统性优化一组图标?我总结了这五个方面!

不足不可怕,可怕的不知道不足哪里,所以清晰条理的找到问题也我们设必须具备的能力。

我们从个维进行问题拆解,供大参考

  • 厚度的一致性:既然轻质感风格,那就需让图标一的立体感,也就厚度,图中的鞭炮、小鼓看起些平,体出厚度。
  • 颜色的一致性:一组图标颜色一定要看起来是和谐,的色相要保持一种,如现在鞭炮的红色有些偏暗红,而小鼓的颜色偏红,这是较明显的问题。
  • 创意亮点的掘:图标中有一个老鼠的形象,想表达一定的创意,但是老鼠的造型还不够爱饱满,并且个创意点和平台品牌关联不强,果用在别的平台也以的,就证明还以想象独特。

灯笼是五个图标中做的相对较稳的一个。

问题和优化方向有,接下来就是整!

造型方面的优化

首先我们来优化造型方面的。

既然要做立体化质的图标,那图标就不能,有的鞭炮角度正,所以在角度上进行了优化。

并为个鞭炮有些太单调,所以把数量增多,优化如下:

如何系统性优化一组图标?我总结了这五个方面!

除了鞭炮以,我们认为那个鼓造型本身不够饱满,短时内比较难出效,所以及时更换了元素——锦鲤(锦鲤和荐貌似关系):

如何系统性优化一组图标?我总结了这五个方面!

多调后,图标在立体化有了很要突破。

颜色方面的规范

前颜色有些偏暗,有些发黄,所以我们定了个颜色规范,在主色上都使用统颜色,这样在延展时候,不容易跑偏:

如何系统性优化一组图标?我总结了这五个方面!

要严格保持颜色规范使用,不比调,定可以让套图标颜色不跑偏。

创意方面的优化

咱不说组图标,个都有亮,至少有个是相比较特,这是常有必要,否则体看起来会常平庸。

产亮点的方法很多,比如风格、透视、颜色、品牌基因。

由于我们在格、颜色等方面都已经固定,择在牌基因的维发进行优。

一说到品牌基因,我们就以联想到吉祥物,由又是鼠年的新年主题,所以我们将自己的吉祥物黑子与老鼠的元素结合,让「吉祥物黑字」穿上「老鼠外」,并且手举春联:

如何系统性优化一组图标?我总结了这五个方面!

谓是整组图标最大的亮点,个生产创意的方法其很常用,大家一定要练习。

最后一下优化前后的效果:

优化前:

如何系统性优化一组图标?我总结了这五个方面!

优化后:

如何系统性优化一组图标?我总结了这五个方面!

体算ok,关键是能在执过程有所成长,也期待杨杨后续更加成熟作品。

欢迎关注作者的微信公众:「设」

如何系统性优化一组图标?我总结了这五个方面!

© 版权声明
您必须登录才能参与评论!
立即登录
暂无评论...

相关文章

小桔车服成立于2018年4月,是滴滴旗下的车主服务平台,提供驾考、购车/租车、金融服务、能源消耗、维修保养、二手车置出等线...
中台设计
万能螺丝刀也拧不开眼镜框上的螺丝。如同万能螺丝刀一样,QQ 也是一个通用的沟通工具,在针对游戏、粉丝、家校等垂类场景下,...
QQ家校群
一、使用栅格 界面上的 icon 一般都能近似成一个基本形式,比如各个方向的长方形、圆、三角形、正方形。如果你把他们进行模糊...
ICON
概述 今天给大家分享海外浏览器视觉风格升级的案例。希望可以把整个产品改版过程中的沉淀以及总结经验分享给大家。整个项目从...
vivo设计
UI 在拿到产品原型时该如何思考?如何着手设计界面?最近跟一些设计师朋友交流 UI 设计方案,总结了一下在方案优化的思考过程...
UI设计师
一、概览 品牌讲述产品的故事,并建立产品和用户之间的关系。设计师的部分职能是翻译、桥梁、联结者的作用,因而对于业务的梳...
丁香医生
图标是几乎任何网站都需要的重要组成部分,无论是用来传递信息、导航还是用来装饰,图标和类似图标的元素都是一种富有吸引力...
图标设计
设计师可能会觉得 B 端设计少有发挥空间。一是产品风格严肃专业,不像 C 端产品风格多种多样,可以调动起用户丰富细腻的情绪...
B端产品