恭喜你成为UI中国推荐设计师 (详情)

您的意见是我们 UI 中国进步的动力!
点击立即反馈按钮,发表您的意见!
立即反馈
QQ群反馈
您也可以加入UI中国官方反馈群进行反馈!
群号:302892100
备注:反馈问题后@管理员能让我们及时了解您的意见

提交需求

赛事与广告咨询合作,请填写需求表单,我们会在第一时间与您联系!

0/20
0/200

设计大赛

  • 设计大赛
  • 发布广告
  • 发布招聘
  • 其它需求

提交完成
感谢您对UI中国的支持和信赖!
轻松上手,描边插画海报速成法
81.1°
原创文章 / 经验/观点 / / 举报
14323 180 261 3

2021-10-21

近几年来,描边插画成为流行趋势。那么如何在工作中轻松上手描边插画?接下来我将分享一些经验。


前言

在各大平台的运营活动、品牌宣传、UI界面中涌现出很多优秀的描边插画作品。以下我将分享在工作中如何轻松上手描边插画


目录

一、作品赏析
二、4大步骤

       1.灵感

       2.构图草稿

       3.构型

       4.刻画主体
三、举一反三
四、总结


一、作品赏析

设计师MBE,他整体的设计非常简洁可爱、易上手


设计师Rami Niemi擅长线性人物插画的设计,他的设计简约有趣、幽默顽皮感


(图片来自网络,如侵请告知删除)


从出现到现在,描边插画经历了不断的演变。针对画面,设计师们对插画进行优化升级,沉淀出一些具有代表性的风格。观察分析以上优秀的描边插画,我们可以提炼出一些共性:


二、4大步骤


1.灵感

前期准备:从接到需求开始,一步步拆解分析、找到关键词、记录设计灵感、运用合适的手法,我们可以用2W1H思维模型-根据主文案《招募骑士》分析,提炼出关键词:骑士、金币奖励、福利

 

1.1联想

从关键词“骑士、金币奖励、福利”进行联想,描绘一个故事情节,增加画面生动性。讲好故事,利于品牌的传播,所以一个运营活动也可以有属于他的故事,让画面注入灵魂,更具说服力。


1.2照片素材

找一些高质量的图或者照片,从中借鉴构图、动态、光影,也可运用公司已有的图片资源。最好不要凭空想象人物的比例、动态,徒然增加设计难度。

 (迪士尼动画师角色创作)


根据联想好的故事情节及关键词展开搜索,选照片的时候可以根据马斯洛需求理论,尽量挑选活力、健康、阳光的形象来满足骑士的尊重需求。

货物箱的灵感、右手臂的灵感、整体形象的灵感


2、构图和草稿

 简单勾勒草图,确定画面主体。提前做好构思,可以节约软件操作的时间。画好草图后可与需求方尽早确定视觉主画面,进一步提升效率。


2.1.构图方式

这里介绍6种常用的设计构图:曲线、中心、三角形、斜线、三分、向心式构图,建议选用更合适的方式构图。

(图片来自网络,如侵请告知删除)


在《招募骑士》的海报设计中,我运用了中心构图:主体骑士放在中心线的位置,起到突出主体的作用,氛围元素分散在周围,丰富画面,同时让画面更具冲击力。


2.2.初步草图

根据找好的素材进行融合设计,注意构图、比例、动态的体现,最后再次调整。


根据活动需求对整个画面进行排版设计,增加标题、内容文案、Logo等信息,注意区分主次,明确景深关系


3.构型

画好草图后,接下来一般会在PS/AI中进行构型上色。


 3.1.描边

对照草图,在新的图层用矢量工具勾一遍物体的形状,勾线描边的颜色默认黑色。建议前期草图画得较精细,这样在描边时对照勾线就行。如果前期草图比较潦草,勾线的同时需参考照片再次仔细优化造型。


3.2.色彩

配色的技巧原理:从摄影照片中提取物体的固有色,找到协调的配色方案。饱和度高的颜色能表现强烈的色彩感,更容易传达冲击力和吸引力,所以整体的配色可以在吸取的固有色上提高一些饱和度。


一般我们会依次按照主体物、辅助物体、氛围元素、背景的顺序上色,也可按物体面积的大小依次上色。


场景色可根据画面需求进行调整。为协调画面,场景色一般使用与主体物主色调相近的色系,并相应降低饱和度,亦或使用主体物主色调的对比色系做场景色来突出主体。整体颜色搭配好后,继续调整排版设计。


讲到上色,这里简要的说下我的配色技巧。详细查看我之前的教程《3步打造扁平插画》

配色小技巧

1.用色感性一点,构图造型理性一点
2.平时多欣赏好的油画、摄影、服装、自然美景,从中提取好的配色与构图
3.多欣赏好的电影、动画片、游戏作品

 

A. 同色系、类似色、临近色是我经常使用的配色,这样配出来的颜色会比较统一。要注意的就是整体降低纯度用颜色明度来拉开空间关系。


B. 对比色的配色技巧就是大统一、小对比。在大的暖色调或者冷色调确定之后,来一点冷色或者暖色作为互补,避免暖色系的颜色过于火,冷色过于冷淡。在暖色调中,处理冷色的方法就是降低冷色的纯度,使其更协调,反之亦然。

《Weather story》

C. 中性色的配色技巧就是注意整个颜色的融合,对比度。

4.刻画主体

刻画方法:添加暗部、添加亮部、修饰描边、画面调整、局部刻画

4.1明暗刻画

添加暗部添加亮部


4.2轮廓

调整外轮廓的描边颜色及粗细,可以用黑色作为描边,也可将物体固有色明度加深作为描边,具体方案可根据画面的效果来选择。

 

画面调整:画面的排版,氛围元素的调整、标题的调整刻画,注意整个画面保持统一的刻画程度。

4.3局部刻画

头部、手臂、衣服、箱子依次进行刻画:增加高光、环境色、投影等。为了凸显骑士主体,可在描边外整体再次增加一层白色轮廓描边。


《骑士招募》的描边插画海报完成。


三、举一反三

整体梳理下操作方法,同样的配方用在了618系列设计中。

1:灵感(联想+照片素材)

根据活动主题联想好画面场景,搜索合适的照片素材。

(左边图片来自网络,如侵请告知删除)


2:构图和草稿(构图方式+初步草图)

运用构图技巧做好照片素材的构图,画出草图原型。

   

3:构型(描边+色彩)

将画面做好描边,再一步步铺大色,也就是先大面积上固有色。


4:刻画主体(明暗部+轮廓+局部刻画)

从明暗部开始塑造,再增加轮廓描边,最后刻画重点局部。

     

四、总结

这种运用照片找到主体及构图的方法,能够非常高效的解决设计中灵感匮乏、主体物不够吸引、透视等一些问题。运用好照片素材,轻松上手插画设计。这种方法不仅适用于描边插画,其他扁平插画、复古插画、潮流插画等均可适用。

以上观点均是个人技能心得,欢迎补充交流。希望这次分享对大家有些帮助,不要局限于某个当下流行的教程,放开自己的脑洞去创作吧。

希望大家能在这篇教程中受益,最后祝大家乘风破浪、扬帆起航!

    




Powered by Froala Editor

创建于:2021-10-21
收藏

180人已收藏

DXC设计体验中心

Experience Design Center

  • 24

    作品

  • 670

    粉丝

  • 21

    关注

  • 京东到家品类组Q3作品集
  • 达达快送积分体系 · 项目总结
  • 京东到家品类组Q2作品集
  • 2021年会设计总结

猜你喜欢

    DXC设计体验中心

    DXC设计体验中心

    Experience Design Center

    小有见解首页新秀原创达人
    • 670

      粉丝

    • 292

      人气

    • 5038

      颜值

    作品

      最新推荐

      2021 | 造梦狂欢 DREAM MAKER

      3995 2 1

      相关佳作
      换一换

        DXC设计体验中心

        点赞:261

        收藏:180

        评论:3

        轻松上手,描边插画海报速成法

        你确定要举报轻松上手,描边插画海报速成法

        如果查出恶意举报,十天内禁止提交任何举报申请。

        0/200

        上传证据: 超过10M的附件请使用网盘地址

        点击上传附件

        对谁可见:

        全部设计师
        • 全部设计师
        • 推荐设计师和认证设计师

        您确认要推荐?

        该作品发布时间:2021年10月21日

        评分

        完整度

        启发性

        勤奋性

        排版布局

        推荐心得

        建议20-200字以内

        0/200

        账号或密码错误,请重新输入

        账号或密码错误,请重新输入

        登录

        账号或密码错误

        发送验证码 120s 验证码错误

        登录

        可云端编辑的专业级UI设计工具

        立即体验