如何画好写实图标?写实图标绘制方法
我们本期分享的主题是"写实图标"。有的同学会问,写实图标不是已经很落伍过时了吗?为什么还讲它。这缘由有个同学提出的一个问题,这类问题在初学UI时经常遇到。这个问题就是,图标画完后发出来询问需要怎样调整,是否要追加内容,又或者寻求大家的建议以便改进。
每当看到这个问题时,我很难在群用几句解答。即使是造型问题、配色问题或者细节处理问题,我也很难用几句自圆其说,听的同学也未必真能理解,还要客套地说声谢谢。所以我在群里选择了沉默,思考了一段时间,写下本文,希望能够解答这个同学的疑问,也希望能给其他人一些启发。
从UI设计出现,发展到2016年的今天,写实图标使用率已经大不如前。在收集本文资料的时候,我发现以前比较擅长设计写实图标的团队SoftFacade,其官网作品也从写实转移到扁平化;前两个月大名鼎鼎的Instagram的logo也从写实变为扁平化了。写实图标的潮流已经过去,所以近年来设计师除了做"主题"外,就很少接触写实图标的设计了。作者不是主题设计的圈内人,而且身边的同学朋友用主题的情况也比前几年少多了,所以制作写实图标的机会实在不多了。
尽管如此,写实图标还是有进化和延展的。由于传统的写实图标需求已经大不如前,但是如运营配图、前置引导、新手引导这类需要画图的需求日益增加,而里面的设计元素或多或少跟写实图标有点沾边。我在本篇文章的最后,把它定义为写实图标的延展——"运营图"。
而在这之前,我还是想说一下写实图标。
写实图标与运营图的关系本人觉得写实图标是UI设计的基础,跟现今UI设计师常做的运营图有千丝万缕的联系。就如同初学画画,都是从单个静物开始,之后画多个静物组合,再推通过构图把多个静物组成一幅图画。
写实图标设计更像画单个静物,写实图标风格很多,无法量化,以前也看到不少同事把图标画得跟实物一样,而现今都会对实物有一定的变形和精简,为求达到视觉、表意呈现最好的效果。
单个静物(图片来源于百度图片)
单个写实图标(图片来源behance)
一组静物(图片来源于百度图片)
一组写实图标(图片来源dribbble)
如下图,无论风格,要画出一个相机,我们用来呈现表意的方法有很多。
怎么样画好一个写实图标
由于画好一个写实图标的方法很多,本文只阐述"基础君"的观点。条条大道通罗马,如果读者有更好的方法,本文方法只作为一个参考。
临摹
临摹在写实图标的修炼里是非常重要的阶段。临摹并不只是让同学们直接模仿别人的优秀图标,而应该注重在临摹的过程中学习下面几件事情。
熟悉设计工具:因为大部分的效果都依赖设计工具,如投影如何做、描边如何做、高光如何打、反射光如何做,等等,这些都是软件层面的事情,临摹能让你快速掌握这些技能的实际应用。
理解作者的想法:如同是一个相机图标,别人为什么要这样画,他是怎样对物品进行变形的,他突出了图标的哪些部分,弱化了哪些部分…… 这些方面都能给自己一些启发。
了解作品的配色:对于初学者甚至可以模仿学习别人的配色,如我们要使用黑色时,并不是真的"纯黑色",往往会在黑色中加入其他颜色,让黑色"偏一点"。
通过临摹,能学习的东西还有很多很多,这里就不一一列举,就看大家在后面自行"悟"出它的好处。所以如果是UI初学者,可以多从临摹做起。
画好写实图标有一定的难度,以下是一些优秀的写实图标示例。
·美术基础
上面说到了,临摹是一种方法,但是这种方法对于每个人的成长未必是一样的。比如,有美术基础的同学进行临摹练习,效果肯定比没有美术基础的同学更好,当然"天才"不在讨论范围里。为什么说美术基础重要?简单点说,就算是按照教程进行临摹,图标达到与对比物非常高的相似度,但是很多同学还是不知道其中的精髓,如不了解为什么要加这个投影,为什么要加这个反光,配色怎么样才好看,什么是对比色,造型怎么处理……所以对于这些同学来说,美术基础的练习还是很有必要的。
如果想知道所以然,感兴趣的同学可以去找相关网络文章或者书籍学习一下,可以从几何体、静物基础、结构素描、形态与分析、造型基础等方面进行补充学习,当然也可以报一个美术基础班快速"充电"。
这些美术基础教程,我就不多介绍,在各电商就能找到很多,如果想了解可以联系作者。
这些素描看起来跟UI设计好像关系并不大,但是基础就是基础,无法逃避。
·其他方法
3D设计工具可以帮助设计师。以前也遇到一些UI设计师通过使用3D软件进行图标绘制,甚至还进行夸张的渲染。虽然作者没有深入研究,但是该方法的代价是,除了具备美术基础外,还需要掌握Photoshop或者Sketch以外的3D软件。虽然每款软件做出来的作品都有自身的优势,但是毕竟每个人的时间和精力都是非常有限的。
3D软件做出来设计元素,有可能用于UI设计上。
图片来源于dribbble
·总结和练习
如其他专业一样,如果做某件事达到一万小时的时候,就可能成为这个领域的专家。多练习、多与优秀作品对比,反复做这个简单的事情,你就可以有很大的进步。而且平时多思考为什么别人能画得比自己好,把自己的作品和优秀作品放在一起多对比一下,把问题找出来并把问题解决。
如下图,就算是两个再优秀的作品摆在一起,想法细节度的比较都能呈现,也能找出自身的问题,也可以重新思考为什么别人会这样画,东西的好坏是比出来的。
写实图标与运营图的一些联系
上面提到,作者把运营图作为写实图标的延展,为什么我要这样定义?运营图更像静物组合图画,由一个或多个物体通过有组织的合理构图进行描绘。有些同学说,那拼贴等平面设计方式也可以做运营图咯?我认为,做运营图的方法同样也有很多,如果要列出实际的制作方法,估计不是一篇文章能详细描述清楚的。但是UI设计时常遇到的新手引导、前置引导、小banner、小配图,为了达到APP实际风格效果,也会尝试使用"全绘制"方式。这些配图里的设计元素全部通过手绘、鼠绘方式制作,如果只拿其中一个设计元素来看,跟写实图标极其相似,当然这里也会存在一些风格差异。
如下图这些配图设计:
最后作者以上面几张图接受本期的分享。
以上就是写实图标绘制方法介绍,大家学会了吗?希望能对大家有所帮助!
相关文章
各类商务印刷品的尺寸怎么选? 印刷设计常用的尺寸纸张/克重都在这里了
日常经常印刷各种东西,哪些尺寸,纸张更合适呢?本文为大家整理了常用印刷尺寸,方便图文广告店、印企在日常接单生产中能够快速掌握客户关键性信息,详细请看下文介绍2024-02-10- 现如今,证件照已成为我们生活中不可或缺的一部分,无论是求职应聘,还是入学注册,亦或是办理各种证件,都需要提交符合规定格式和要求的证件照,那么,这些证件照的尺寸和2024-02-10
- 平面设计是一个注重视觉效果的设计,简单的排版方式有时候不能满足视觉突出的效果,业务很难达到吸引用户的眼球,下面我们就来看看8个平面设计技巧分享2023-10-08
- 每个设计师都有自己最喜欢的设计软件,并把软件作为自己的第二语言,今天我们来推荐10款UI设计不可或缺的工具,详细请看下文介绍2023-10-08
- 夏日电影风怎么调色调色?夏天快到了,想要调节夏季电影风的画面,该怎么操作呢?下面我们就来看看适合夏季的柔和绿色调调色分享2023-04-02
什么是真RAW 什么是伪RAW? 简单说说真 RAW 和 伪RAW
随着索尼α7RV(ILCE-7RM5)正式发售,近期有不少网友跟我咨询索尼相机“无损压缩(M)”和“无损压缩(S)”RAW的问题,今天做一个统一答复2022-12-24- 手机UI设计尺寸有哪些?作为新手在设计手机ui的页面的时候,发现自己设计的尺寸都很奇怪,如果能有元素尺寸介绍就好了,下面就来看看我们汇总的超全面的UI元素尺寸设置指南2021-08-06
- 常用照片尺寸有哪几个?我们经常说一寸照片,二寸照片,这些照片的尺寸是怎么计算的?下面我们就来看看照片标准尺寸/像素对照表汇总2021-08-06
怎么让设计更高级? 一些不受关注的小细节设计提升作品高级感的技巧
怎么让设计更高级?都一样是做设计的,一样的素材一样的文案,为什么有的设计很高级,有的很拉胯呢?在素材一样的大前提下,细节就能决定成败,下面我们就来分享一些不受关2021-08-05- 新人如何快速掌握黄金分割构图法?看到结构漂亮的图片,很多朋友都能想到黄金分割,即使不熟悉的朋友也知道黄金分割构图,什么是黄金分割构图?怎么掌握这个知识点呢?下面2021-08-05
最新评论