UI界面设计中的MBE风格 如何绘制

　　UI界面设计中的MBE风格是指什么? 一种简单轻松的偏移填充粗线条描边的插画风格，红遍追波。这样风格的插画是在扁平化的潮流中逐渐演变的，代表性人物就是来自法国巴黎的设计师MBE，而在追波(Dribbble)上响应他的设计师也非常多，这些设计师来自各地。

　　mbe风格zui大的特点是色彩鲜明，边框清晰，主次分明，风趣活泼。很多互联网公司都在自己的产品中融入了这种元素风格的设计。尤其在App设计中，引导页、状态页和活动页等都有它的身影。

　　今天就给同学们实际演示一下如何绘制mbe风格的插画：

　　我们先新建一个750x540的画布(这里我是用ai进行绘制)

　　再绘制296x296的圆，改为描边(12pt)，去掉填充

　　再绘制一个正方形，框选两者在路径查找器中选择减去顶层

　　得到半圆，调整一下边角的圆角半径

　　ctrl+c，ctrl+f，复制多1个半圆，去除描边，改为填充蓝色，置于底层

　　选择蓝色的那一层，再复制一次，填充改为白色，并且位置进行偏移

　　选中白色蓝色两个半圆，进行减去顶层，并且在zui底下再放置一个白色的半圆

　　用圆形绘制眼睛和嘴巴以及腮红

　　用钢笔工具在黑色描边上添加锚点

　　用直接选择工具选择不要的锚点进行删除

　　然后我们再绘制一个圆

　　用添加锚点工具进行分段

　　删除多余的锚点

　　把描边改为圆头端点

　　再绘制一个12x12的圆，并且调整一下位置

　　绘制一个圆角矩形描边，并且复制一个改为填充(白色)，得到重叠的形状。

　　复制填充图层，进行偏移，并且减去顶层

　　再复制边框图层，改为绿色填充置于底层

　　把白色的图层复制并对称一下，得到阴影

　　绘制矩形作为阴影块

　　绘制眼睛嘴巴和腮红

　　添加描边断点和点缀

　　重复这个步骤，画出其他圆角矩形图案

　　画上背景点缀和横线