所有分类
  • 所有分类

「纯干货教程」0美术基础如何设计插画

本文转自:BIGD(ID:bigdcc)

本周除了按老规矩更新一篇原创精选译文,又偶发性的多了一篇次条更新。转载的原因是这篇文章真的干货满满,这对于很多人0基础设计师来说,算是一场及时雨。实际工作中,插画的应用已经是越来越广泛了,学会插画,刻不容缓啊。希望这篇文章能帮助到大家,也感谢原作者分享~

「纯干货教程」0美术基础如何设计插画

当下大部分App都有一个共同的问题:同类型产品,不管是操作还是视觉上,差异化很小。这是因为扁平化本身很难做出差异化,所以经过几年的沉淀,衍生出插画设计。

「纯干货教程」0美术基础如何设计插画

早期插画设计并不如现在这样大面积使用,只在引导页和空页面等地方使用。如今,插画广泛应在移动端和pc端上,既体现品牌独特标示,而且对用户的接受程度也非常高,几乎没有人会讨厌插画的存在,这也是为什么当下很多产品运营页大量运用插画的原因之一。

「纯干货教程」0美术基础如何设计插画

说到插画设计的流行,是比较为难设计师的,不是所有公司都是BAT,会有专门的插画师来进行大量的视觉美化,大部分公司不会单独招聘一位插画师来任职,所以这种风格的制作就会延伸到公司的平面设计师者ui设计来执行。

「纯干货教程」0美术基础如何设计插画

工作当中,我们可能需要完成引导页,运营页,或banner,今天或几天之内完成,对于没有学过美术,又需要画插画的设计师来说,是一个需要面对的问题。

「纯干货教程」0美术基础如何设计插画

传统方法手绘,需要长时间的练习,质量是随练习时间提升,练习时间越长,效果越好。

「纯干货教程」0美术基础如何设计插画

而设计师往往需要快速实现,手绘虽好,但时间成本会高,所以我总结了一套方法,可以让设计师在几天内做出质量较高的插画。

「纯干货教程」0美术基础如何设计插画

学习之前,要先提升一下大家的分析力,学习分析优秀作品,提取设计路径,是成长和提高的关键。

「纯干货教程」0美术基础如何设计插画

以上两组图片是比较有代表性的“设计师插画”,以建筑为元素,描绘风景,用1分钟,找出2个共通点。

「纯干货教程」0美术基础如何设计插画

上图蓝色区域为基础图形,大都是圆角矩形和椭圆形,右图红色区域为不规则形状,通过钢笔可以快速形成,难度也非常低。这里,我们总结一下这种插画的特点。

「纯干货教程」0美术基础如何设计插画

图形几何化图中展示效果偏向手绘,但图形勾出大多是用基本几何体,整体图形更加规律,各元素间产生呼应。

颜色统一化:颜色的主色调会保证在几种之内,第一眼看到就可判断出主色,这可以用户群体一个深刻的印象。

以上2点是可以概括当下比较流行的插画类型,接下来就是整体的设计思路。

「纯干货教程」0美术基础如何设计插画

《四利原则》是我针对0基础插画设计的一个思路,从构思到实现4个步骤。下面用一副我设计的插画《日式一角》,来做今天的案例。

「纯干货教程」0美术基础如何设计插画

这个插画的难度不高,整体构思到落地是用了不到一天时间,因为第一次尝试这种风格才耽误了,不然时间会更短。

「纯干货教程」0美术基础如何设计插画

第一点是前期准备工作,也就是整理素材。这里需要确定方向,寻找一切所需要的图片,获取灵感,可以在百度搜索关键词,摄影图,绘画图或者三维游戏里的截图都可以。

「纯干货教程」0美术基础如何设计插画

找图的时候,一定确定好主题,比如我做的是酒馆,就要搜日本酒馆,或者日本小馆,精确的搜索,会让你节省大量时间。

「纯干货教程」0美术基础如何设计插画

选择有代表性的内容——比如日式木栏,黑白色门帘,红色布帘,日式灯笼等等。

当找到合适的素材之后,要确定构图方式——《日式一角》,使用的对称构图法,中间放置重点元素,两边留出空间。

「纯干货教程」0美术基础如何设计插画

为什么要用先要构图?先构图可以突出高、宽、深之间的关系,加强主题,增强感染力。构图处理是否得当,是否新颖,是否简洁,对于作品的成败关系很大。对称式构图可以使画面布局更加规整,也可以保留视觉焦点。左右对称也会让画面形成对等的视觉效果,让空间布局更加合理。

「纯干货教程」0美术基础如何设计插画

如果是banner设计或活动页,通常需要留出文字区域,这里可选用九宫构图法,在左上角或者左下角的位置,留出留白部分,让文字更好的展示,以防画面对文字产生影响。

「纯干货教程」0美术基础如何设计插画

构图法的种类还有很多,这里今天就不在介绍了。要提醒的是,构图法需要长时间练习,并不一定要先确定,可以在执行的过程中进行修改。

「纯干货教程」0美术基础如何设计插画

已经有了素材之后,我们将图片放置在画布之内,最好选择可以勾画的素材图形。这里,我选择的样式很简单,栏杆式窗户,右侧为常见窗帘,中间为日本灯笼,基本大体构图就确定了。

「纯干货教程」0美术基础如何设计插画

通过图形工具,给场景进行基本构建。操作过程当中,遇到和设想效果不同的问题,比如设想中,做一个精致吉祥物,难度比预想要高,这时候建议整体搭配,选择可替代的物品从新设计,尽量避免出现某一元素反复修改的现象,先大体,在细致局部设计。

「纯干货教程」0美术基础如何设计插画

设计的同时,把色调给预设好,画面当中的房子大多数是胡桃木色的暗色调,颜色上要有亮度。

「纯干货教程」0美术基础如何设计插画

图形设计后,开始考虑材质的变化。因为要给整体添加真实感,木纹是最适合的素材,木纹效果画起来很难,用素材叠加可以解决。

「纯干货教程」0美术基础如何设计插画

选好素材以后,通过图片叠加到对应的位置上,让纹理效果更真实。并不是所有元素都要用素材叠加,大部分还是要进行图形勾绘,图形实现不了,在考虑素材。

「纯干货教程」0美术基础如何设计插画

这一步要再次整理整体的颜色统一,尽量让颜色看起来少一些。设计当中,颜色越多难度越大,所以颜色的使用通常会少一些,先确定一些大色调。

「纯干货教程」0美术基础如何设计插画

当完成整个效果后,目前还是扁平效果,这一步,就化腐朽为神奇,利用笔刷,来实现从图形到画像的转变。在这里,使用的是ps2018自带的笔刷,(KYLE额外厚实炭笔)这个笔刷的好用之处是让人惊叹的,可以通过简单的涂抹,让简单的东西,做出层次,

「纯干货教程」0美术基础如何设计插画

在涂抹的过程当中,要确定好光源位置。比如左上方是常用的光源,我们就设定为左上方,元素涂抹的时候,左边为亮色,右边为暗色,如果想要效果好,可以多添加几层。

「纯干货教程」0美术基础如何设计插画

当整体画面解决完成的时候,要整体审视一遍,尽量让画面多一些“生物”。因为这样能让画面生活感更加强烈,比如猫狗鱼鸟等,这幅作品当中,就增加了一个打瞌睡的猫,让生活氛围更加强烈。

「纯干货教程」0美术基础如何设计插画

到此,整体元素已经勾绘好,设定发生时间为下午,所以光源也是重点,我们给整体添加一个斜面,颜色选择为暗色,用画笔涂抹,最终达到了今天所看到的图像。

「纯干货教程」0美术基础如何设计插画

本篇插画完成过程当中,大部分是用图形工具来实现的,小元素可使用钢笔工具。前期一定要考虑好构图比例,如设计引导页,更适合中心构图法,要考虑文字的放置区域。

以上方法只针对于不会手绘和没有学过美术的设计师,帮助快速实现插画设计。

之前和同事聊天,说自己凭着感觉做设计,大部分设计师也确实是感觉+经验的方法来设计,但每个感觉都有理可循,只是平时没有总结和深究,今天的分享,也是这样所得,希望能给大家带来积极的帮助,更好的完成插画设计。

「纯干货教程」0美术基础如何设计插画

往期热门文章回顾

90%的设计师都认同这7个设计习惯,然而它们可能会害了你

设计师都应该掌握的设计理论知识

Uber高级产品设计师告诉你,她是如何完成100天动画设计挑战的

超全面!动效设计标准与规范

谷歌动效设计师经验,做好动效设计并不难

「纯干货教程」0美术基础如何设计插画

原文始发于微信公众号(彩云译设计):「纯干货教程」0美术基础如何设计插画

本页地址:https://www.uiya.cn/5553.html; 所有素材均来自于互联网,经网友投稿后发布,仅供学习请勿商用。如有侵权,请联系 3147141550@qq.com 或 提交工单

分享海报

评论0

站点公告

 

新注册用户福利,免费领取7~90天VIP会员

点击领取

没有账号? 注册  忘记密码?