Illustrator绘制简约风格的MBE图标教程

UI / UI设计教程 / UI图标教程 /      

uimaker
UI设计师 / 江苏 南京

来源:网络   作者:佚名

关键词

能修炼到自创一种风格的人绝不简单,Dribbble大神MBE就开创了一种新的视觉风格,现在学UI,大家于是把这种风格叫做MBE风格,用这种风格来创作图标或小型插画,看上去简洁、圆润、可爱。几乎是瞬间,这样的风格就风靡了整个互联网UI界。

我们今天就来一起学习一下这类风格,并且运用这类风格绘制一枚图标

认识MBE风格

这类风格目前的运用之广泛,只要大家都在关注各大网站或APP的界面,就会发现这一趋势。但就只是表面的对元素的借用和拼装,其实并不能完全学会这一风格。

MBE风格的特点我们刚刚已经讲到了,是简洁圆润可爱,一个个看来如下:

1、一般是以粗而圆的线条勾勒轮廓,这一点类似于简笔画,也类似于单线条画。其线条粗细适中,越粗的线条在表现力方面会越接近可爱感,线条的转折过渡很圆润,几乎看不到尖锐的直角。

Illustrator绘制简约风格的MBE图标教程,PS教程,思缘教程网

2、填色方面的特点非常明显,填色的色块要偏移原有轮廓一些,以此来塑造高光和阴影效果。再填色色块和线条所形成轮廓之间的偏移所形成的白色会成为一道高光留白,而相对的一方则是阴影。

Illustrator绘制简约风格的MBE图标教程,PS教程,思缘教程网

3、配色是简单的橙色、黄色、蓝色,以高饱和度的亮色为主,表现鲜明可爱的特点。适当时候在这个色彩上进行强弱变化,以体现色彩的层次。

Illustrator绘制简约风格的MBE图标教程,PS教程,思缘教程网

4、线条大多采用一定的“断线”处理,并运用圆点增加线条的丰富感。

Illustrator绘制简约风格的MBE图标教程,PS教程,思缘教程网

5、如果作为插画运用,大都增加许多几何状小装饰。我们把这些小装饰分别命名为“十字形”、“烟花形”、“小圆点”和“小圆圈”,它们以一种随机分散的状态点缀在主题周围。当然,如果用于图标的话,这个装饰会显得累赘。

Illustrator绘制简约风格的MBE图标教程,PS教程,思缘教程网

另外,还有其他的特征,比如水平线的存在,以及物体对象的拟人表情。但我个人觉得这些并非一定的要件,可以适当增删。通过了解了这些造型特征,才会知道,看上去简单的风格,实质上并不简单。接下,让我们实际动手来个现场感受。

 收藏