一、最终效果图 原图效果: 临摹效果: 二、临摹过程 在临摹前,简单分析了下原图的优缺点,以及我能做的优化修改: 优点: 原图部分图标有创意点,例如购物车与分享……
一、最终效果图
原图效果:
临摹效果:
二、临摹过程
在临摹前,简单分析了下原图的优缺点,以及我能做的优化修改:
优点:
- 原图部分图标有创意点,例如购物车与分享图标的结合;电脑+购物袋+鼠标;
- 双色线条图标,颜色搭配合理,深色+亮色,吸睛+突出重点;
缺点:
- 图标统一性问题,大小不统一、颜色占比不统一等;
- 复杂度不统一,例如一排左三的电脑,视觉效果比较复杂,一排左二造型十分简洁;
- 断点太多,每个图标的断点的位置不一样,图标线条比较散;乍一看原图,大部分是断点形成的线条,造型容易不够整体,影响观感;
基于以上的分析,临摹时我想从图标的统一性、整体性两个方面来优化,最后希望能从颜色上形成有别于原图的差异化;
临摹时需要注意的问题:
原图中的图标大部分是比较圆润的,所以设定4px的圆角作为基础,并以4的倍数来进行变化,例如较小的矩形会用2px的圆角;
线条使用3px居中描边,圆滑边角,圆头端点;
断点是图标的特色,但原图断点太多且位置不统一,所以在临摹时统一为45°角处进行断点,遇到关键结构时,需要调整断点位置,避免影响图标的识别度;
临摹时遇到的难点:
- 1. 一排左一的图标中,手很难绘制,最初想用钢笔勾出基本线条后,再根据原图调整,可这样做出来的图标难免不规范,所以开始分析原图,手掌的部分可以是一个矩形,通过加锚点和挪动锚点位置可以画出来,大拇指同理,即可绘制,在这过程中经历了多次的锚点调整,需要耐心一些,另外,需要注意的是,调整锚点前,如果对锚点设置了圆角,需要将圆角改为0后再进行调整,否则调整后的圆角则无法被修改;
- 2. 尽量不影响关键结构,在临摹一排右三的店铺图标时,原图的橙色比较亮眼,所以橙色放在房顶的位置没什么问题,但在我当时调整的颜色中,将黄色放在房顶位置就不合适了,乍一看像是图标缺失了一部分,影响辨识度,所以重新修改了异色的位置让图标更好识别;
- 3. 制作的方法不要想复杂了,有时看似很复杂的图标,其实稍微缓缓思路就能很容易做出来,例如二排左五的购物车分享图标,分享图标的小尾巴起初想的是一个圆角矩形和圆形相减,但其实没有那么麻烦,两个圆形相减即可:
还有二排左六的礼物盒上的丝带,刚开始我认为应该是圆角矩形+圆形拼成的,后来才发现一个圆角矩形分别设置不同数值的圆角就能画出来:
所以呀,不能先把问题复杂化,先试试有没有简单的方法;
临摹后的调整:
每次临摹后我会把临摹结果发在彩云姐的知识星球里,根据彩云姐的优化建议调整成最终效果:
优化后:
根据我的临摹,彩云姐也提出了一些我没注意到的细节问题:
修改后的最终效果:
三、总结
这次的临摹问题还是比较多,图标的疏密度问题还是没有处理好,有两层边框的图标明显更密,空间更狭小,看着不是很舒服,可我不知道这个应该怎么处理,是直接改成一层还是调整两层边框中间的空间?——这个问题有结果了我就告诉大家;
这次的临摹极大提升了我对图标的临摹程度,也收获了一些图标的制作方法,总体来说还是收获满满的,希望看到这篇文章的你们也有一些收获呀~
Powered by Froala Editor
还没有评论呢,快来抢沙发~