MBE圖標是追波上MBE大神開始設計的圖標風格，然后就掀起了一股時尚風潮。閑話少說先看我們要做的案例的最終效果：

在繪制之前，我們先分析并總結一下上面圖標的特點：

• 圖形外觀圍繞著深色描線,也可以叫描邊，描線與圖形偶爾錯位開。
• 描邊有斷線
• 圖形線條簡單，比較圓潤，基本上都是圓角，圖形容易繪制，也很可愛，十分的萌萌噠。
• 色澤比較鮮艷大膽，幾乎都是明亮色，明黃色，藍色為主。

了解了MBE分風格小圖標的特點，那么下面我們就開始講如何繪制了。

繪制工具

AI,PS SKETCH。這里就用PS來舉例。

繪制步驟

1、打開PS-新建畫布750*1334px(IOS設計尺寸)，命名“APP引導頁-web風格”，隨時命名是種好習慣哦;

2、運用矩形、橢圓工具畫出下圖的形狀圖層，然后調(diào)整圖層順序和位置，并填充上顏色，描邊5px,矩形圓角6px(見紅箭頭指示處);

3、合并上方填充顏色為藍色的圓和圓角矩形，把下邊橙色圓用小白工具減去上邊部分，最后效果如下圖;

4、用鋼筆工具畫如圖的線段，然后當中添加錨點，用小白工具間隔刪除點與點之間的線段，形成當中圖的效果，然后復制--水平翻轉--變換長度--重復剛才步驟，最后得到圖三的效果;

5、在大圓頂部畫一個6px白色描邊的圓，在圓上添加錨點，與第四步一樣，用小白工具刪除不要的線段，燈泡的高光就做好了，然后移動到合適的位置，結果參見下圖;

6、加上裝飾元素和切換小圖標如圖

7、最后加上關閉按鈕和文案，一個簡單的mbe風格的APP引導頁就完成了

同套APP引導頁欣賞

海淘科技小編還為你整理了：

《MBE的食物圖標設計欣賞》

《MBE的水果圖標設計欣賞》

《一組MBE風格的交通工具圖標欣賞》

不僅有MBE風格圖標設計欣賞，還有MBE風格圖標設計教程。想知道MBE風格圖標設計教程，可直接點擊：MBE風格圖標設計資訊，可直接跳轉。本文下載，點擊：10分鐘繪制MBE風格APP引導頁。