MBE风格是什么?MBE风格图标设计

　　1.什么是MBE风格?

　　MBE风格的原创作者是法国设计师MBE于2015年底在dribble网站上发布的MBE风格。从线框Q版卡通画演变而来的MBE风格采用了更大更粗的画面。与没有画面的扁平风格插图相比，它去除了不必要的色块区分，更简单、更通用、更容易识别。粗线描边绝对隔离界面，突出内容，表现清晰，简化复杂性;所有这类图标和作品都被称为MBE风格。

　　二、MBE风格的特点

　　描边

　　MBE风格最明显的特点是简单而容易地偏移填充粗线描述的插图风格。在使用描述线时，我们不仅要结合色彩学，而且要对作品有更透明的情感理解，当然，我们也不能缺乏对审美的认知。

　　断点式描边

　　黑线的优点是可以突出内容，缺点是会产生压抑感，削弱内容主题，使物体失去生动特征。MBE用断线处理解决了这个问题。这些断线的处理不是根据图形来限制数量的，它们的数量直接关系到位置。

　　益出

　　除断线外，MBE风格最大的特点是色块的溢出。它的意思应该是表达物体通过光线反射的阴影，因为溢出的方向通常是高光的对面。MBE早期使用更多的色块溢出工作基本上很难看到，因为早期工作图形偏向于简单的色块溢出处理可以创造纹理来增加风格的印象，后期工作复杂性提高溢出部分在颜色或分类难以整合，让图形本身突然破坏最初想要传达设计理念。

　　单色系

　　当分析物体包含的内容是否属于上述特征属性(材料、数量、介质)时，可以使用单色匹配方法找出物体的深度关系，创造纹理，图片表达将更加完整和清晰。

　　相邻色+补色

　　在色彩系统方面，作者MBE有时会使用不同的色彩系统来营造图形氛围。颜色的基本范围将控制在三种颜色以下，分别由相邻颜色和补色组成。下图中包含的红色、黄色和绿色在色环上的角度分别为22.5°在两种颜色之间，色差为1的配色属于相邻的配色。蓝色角度为180°左右，色差为8的配色，称为补色配色

　　相似色+相似色

　　相邻颜色是指色环上的两种相似颜色。在色彩学中，也有类似的色调配色和对比色调配色。在模仿和研究MBE风格时，设计之王不必遵循作者的设计元素。找到规则后，可以灵活使用。

　　写实风格

　　在色调的使用上，设计师会遵循色调的基本原理，但在不同的环境下，为了更清晰地表达物体本身之间的关系，在艺术形式上会更加具体。

　　三、MBE图标制作流程

　　(1)如何选择合适的图标绘制

　　在绘制图标时，我们应该根据产品定位、产品视觉风格和应用场景来制作，因为mbe风格主要是可爱和柔软。

　　一般来说，在设计时，我们应该注意轮廓，如果轮廓是粗而圆的，这类似于简单的笔画和单线画。线条厚度适中，线条越厚，表现力越接近可爱。线条的转弯过渡非常圆，几乎看不到尖锐的直角。

　　(2)我们需要绘制图标

　　01.我们在设计时主要用ai绘制，这样才能以矢量图的形式出现。

　　02.建造一个画布。我们的初始尺寸是800*800像素画布，因为我们不建造出血，因为我们不印刷。

　　03.我们用形状工具绘制基本形状(注意我们先画黑白，这样不会扰乱我们的视觉，做mbe风格的时候主要是圆角。

　　(01)我们首先用形状拼出我们想要的基本形状(必须使用形状工具，如果形状不规则，可以使用钢笔)

　　(02)绘制完成后，我们应该用它的方式(防止裁剪出错)

　　04.我们画完造型后，要把所有的画面都变成形状，在对象-路径-轮廓化的画面中，或者在对象-扩展中都可以变成填充。

　　05. (01)转换为填充色后，我们可以错位色块

　　(02)使用路径搜索器进行切割

　　(03)添加辅助色块

　　06. (01)我们用路径橡胶擦路径线上的断点

　　(02)断点后，我们在周围加入小元素进行点缀，让画面更加可爱圆润

　　四、MBE图标总结

　　MBE风格图标主要用于插图、APP指南页面、UI图标和海报的制作。制作图标时，我们主要是可爱圆润的，不要使用太重的颜色。绘制时，在封闭路径中不要有太多的断点，这也会影响视觉!