2018-12-6 资深UI设计者
如果您想订阅本博客内容,每天自动发到您的邮箱中, 请点这里
我们每天都在设计图标,并且保持这样的状态超过15年。身为设计师,想必你已经阅读过很多关于图标设计的文章,但是今天的文章不一样,今天我们的文章不会花费很长时间来单独介绍某一个图标的设计,而是设计任何一套图标应当遵循的基本流程,以及一定要注意的8个关键的注意事项,你可以将这些东西带入到一些现成的案例当中去验证。
这个注意事项清单,也可以被视作为给设计师所编写的图标设计指南,即使设计趋势发生变化,这些规则和经验依然适用。遵循这些规则和技巧,能够确保图标从设计到使用都可以更加无缝和顺畅。
我们并没有重新发明轮子,相反,我们会以这种方式来呈现我们的工作流程细节,希望它也能帮你有效地组织工作。
像我们需要系统而大量地设计图标,设计流程是最重要的事情。正如你所看到的,绘制流程在图标绘制之前,就已经开始了。
按照上面的流程,能够绘制出不同样式足够优秀的图标合集。下面是我们在这样的流程下所设计出来的图标示例。
▲ Material, Outline: Science and Studies Icons
如果你像我们一样每天设计图标的话,也会碰到各种各样的问题。其中最重要的是下面的注意事项清单,它们能够确保我们不同的人在不同的时期不同状态下,设计出来的图标能够协调到一个主题、一个系统当中。如果你也要设计图标的话,可以将下面的清单打印出来,贴在自己的桌子旁边作为参考。
1. 像素完美
让图标踩在每个像素点上,确保清晰不模糊。
2. 视觉重量
用斜视的方法来感知图标,看看成套的图标是否都具有相同的大小。斜视、调整、再看、再调整,直至均匀理想。为了保持总体视觉重量的一致性,我们会使用「完美的圆形和正方形」来和所有的新图标进行对比。
3. 几何图形
尽量使用简单坚实的几何形状来绘制所有必要的线条,它们会让你的图标显得更加牢固可靠,具有吸引力和说服力。
4. 清晰简洁
删除所有无法传达图标概念的细节,避免让图标显得沉重而复杂。
5. 足够的空间
确保图标内每个细节和元素都有足够的空间,不会显得过于拥挤或者空旷。
6. 对比度
在黑色和白色的背景上检查图标的全部细节,看看是否其中的每种颜色都是可见的,以及元素之间的对比是否足够。
7. 视觉统一
检查线条的粗细重量,边角的大小,配色方案,细节层次和设计元素在整个合集中是否是不变且一致的。
8. 图层排序
确保图标中图层顺序清晰而规整。这是一种良好的习惯和专业的精神。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务。