扁平風(fēng)格的插畫可以是采用線來表現(xiàn)，這和大部分線性圖標的制作方法類似，所不同的是，圖標的規(guī)模明顯小一些，所要兼顧的圖形也要少得多。線是一種值得我們探索的圖形表現(xiàn)方式。無論是否將其進行填色，我們都能被線條所牽引進入到圖形本身，這給了我在設(shè)計產(chǎn)品海報時一些靈感。今天我們就和大家一起來制作這個由線條來作為主元素的圖形海報。

靈感來源

1、圖案的參考是來自 pinterest 上瀏覽到的線體插畫，基本是延續(xù)這個風(fēng)格，只是改變了線條表現(xiàn)方式，稍后我們在過程中再重點提示。

2、整個海報的概念是起源我們在做 pagepan 這個產(chǎn)品所產(chǎn)生的「積木」的聯(lián)想，這時選用了樂高積木來作為主要的創(chuàng)作重心。

學(xué)習(xí)建議

這篇文章適合那些已經(jīng)有軟件基礎(chǔ)想要進階扁平線體插畫的小伙伴~

工具

Adobe Illustrator CC (2019)

我已經(jīng)習(xí)慣用AI來畫線條的圖案，其他軟件不熟悉也沒有深入了解。

草圖過程

草圖是一個非常非常重要的過程，甚至它是后面所有工作的基礎(chǔ)。鑒于我們大部分人包括我自己都沒有好好對待過，所以這一次我們來彌補這一環(huán)節(jié)。草圖我畫了三次，每次都作部分優(yōu)化，最后成品如下。

毫不夸張，只有認真對待草圖的創(chuàng)作過程，才是真正享受到設(shè)計的樂趣。

畫好草圖后，大家最好能從草圖進入對圖案實現(xiàn)的分析。我們把實現(xiàn)整個圖案大致分為三個部分：

① 立體式的積木

② 設(shè)備部分

③ 背景裝飾

接下我們就分步驟來完成這些不同的圖形，要知道它是如何制作出來的。

生成立方體

這里積木的表現(xiàn)最重要的一個表現(xiàn)是：立體，并且是大家平時最常見的等距立體風(fēng)格。等距立體風(fēng)格，我們曾經(jīng)在用AI繪制3D等距立體夢幻風(fēng)格插畫中講過其畫法以及在開始繪制前的準備工作，那么這篇文章里我們就省略分步驟的講解。

STEP 01

打開AI，新建一個1200px*850px的文檔，然后再在這個新文檔中建立起等距立體風(fēng)格所需要準備的參考線。有人問參考線用處大不大?說實話，因為AI當中有默認的等距立體的3D轉(zhuǎn)換設(shè)置，因此基本不會差多少，主要是調(diào)整細節(jié)的時候用得上。

準備好的參考線如下圖：

你可以按以下的提示操作，更詳細可以進入用AI繪制3D等距立體夢幻風(fēng)格插畫中查看。

利用【矩形網(wǎng)格工具】，寬度/高度設(shè)置為1000，水平/垂直設(shè)置為：50

選中網(wǎng)格，鼠標右鍵，進入【變換>縮放】，不等比的參數(shù)設(shè)置為，水平：100%，垂直：86.602%

【變換>傾斜】，傾斜角度參數(shù)：30

【變換>旋轉(zhuǎn)】，旋轉(zhuǎn)角度參數(shù)：-30

【視圖>參考線>建立參考線】

STEP 02

要畫線體圖案，首先大家要把形體畫出來，形體是非線體的，這方便塑形，一旦形體外輪廓確定，就可以通過填充轉(zhuǎn)線條的方式做出線條圖案。

以上的思路確定好后，我們就要開始繪制立方體。第一步，我們先畫出一個尺寸為160*68的矩形。矩形填充為灰色，關(guān)閉描邊。

對于這個尺寸我建議大家最好和我的設(shè)置相同，并且記錄一下，等下我會告訴大家為什么要這樣做。

然后選中這個矩形，進入到【效果>3D>凸出與斜角】，將其轉(zhuǎn)為立方體。你需要改變這兩個參數(shù)設(shè)置：

位置：等角-右方

凸出厚度：68 (這個數(shù)值和你的矩形的高度一致)

位置一欄下拉選框里的「等角」開頭的選項，都是適用于等距立體風(fēng)格的。

STEP 03

接下復(fù)制上一步所做的立方體，雖說我們現(xiàn)在稱這個對象為立方體，其實它的本質(zhì)還是一個平面矩形(因為還沒擴展對象)，所以我們繼續(xù)改變這個平面矩形的尺寸，改變它的寬度，將其寬度從原來的160改變?yōu)?28。

這就是要求你要記住第一個矩形尺寸的原因，因為228是從160+68得到的。由于我們這里會畫出三個等高而不等長的矩形，但是我們希望它們表現(xiàn)是逐級等距增大，所以需要一個參數(shù)。有人問這里不需要這樣計算行不行?就是看著好看但不需要數(shù)學(xué)計算可不可以，我的答案是當然可以，但是數(shù)字的確是一個便捷控制形體的工具。

當你把尺寸改變后，整個立方體也就是延長了。用相同的方法，復(fù)制第三個，也是在228基礎(chǔ)上增加68，第三個矩形的寬度增加到296。于是我們得到想要的三個立方體如下：

STEP 04

將已有的立方體的位置進行調(diào)整，這時需要打開參考線，輔助將其排列成一下的樣式：