你將要?jiǎng)?chuàng)建什么

在今天的教程中，我們將假設(shè)自己是一名室內(nèi)設(shè)計(jì)師，然后開(kāi)始創(chuàng)建一個(gè)漂亮的小現(xiàn)代廚房。使用Illustrator就可以簡(jiǎn)單完成的一個(gè)矢量插畫。

全文分為13個(gè)步驟講整個(gè)廚房的每個(gè)部分進(jìn)行流程化繪制。

（譯者注：教程比較新手向，所以從新建文檔開(kāi)始，從第4步開(kāi)始進(jìn)入插畫的開(kāi)始繪制。）

1.如何設(shè)置新的項(xiàng)目文件

首先就是打開(kāi)Illustrator，我們新建一個(gè)新文檔（文件>新建或控制N）并設(shè)置如下：

畫板數(shù)量： 1

寬度： 1200像素

身高： 600像素

單位： 像素

并從高級(jí)選項(xiàng)卡：

顏色模式： RGB

光柵效果：屏幕（72ppi）

預(yù)覽模式：默認(rèn)

2.如何設(shè)置自定義網(wǎng)格

除了繪制icon我們會(huì)用到網(wǎng)格外，我們制作插畫也將用像素完美的工作流程來(lái)創(chuàng)建，所以我們需要設(shè)置一個(gè)漂亮的小網(wǎng)格，以便我們可以完全控制我們的形狀。

第1步

轉(zhuǎn)到編輯>首選項(xiàng)>指南和網(wǎng)格子菜單，然后調(diào)整以下設(shè)置：

網(wǎng)格線每： 1像素

細(xì)分： 1

快速提示： 您可以通過(guò)閱讀關(guān)于Illustrator網(wǎng)格系統(tǒng)工作原理的深入了解，了解有關(guān)網(wǎng)格的更多信息。

第2步

當(dāng)我們建立了自定義網(wǎng)格之后，我們需要確保每個(gè)形狀都在該對(duì)齊的網(wǎng)格之內(nèi)。為了方便查看，可以打開(kāi)視圖-網(wǎng)格進(jìn)行查看。

現(xiàn)在，如果你是第一次使用“像素完美的工作流程”，我強(qiáng)烈建議您通過(guò)我的如何創(chuàng)建像素完美藝術(shù)品教程，掌握網(wǎng)格將大大縮小我們的工作時(shí)間。

3.如何設(shè)置圖層

文件網(wǎng)格設(shè)置好之后，我們?cè)陂_(kāi)始之前還需要建圖層，因?yàn)槲覀兛梢愿玫募性谝粋€(gè)圖片的某一個(gè)部分。擁有一個(gè)穩(wěn)定的工作流程是很重要的。

就是說(shuō)，打開(kāi)“ 圖層”面板，創(chuàng)建兩層，我們將重命名如下：

第1層：背景

第2層：插圖

4.如何繪制背景

我們從創(chuàng)建小瓦片背景開(kāi)始，因此請(qǐng)確保您位于正確的層（將是第一個(gè)），鎖定另一個(gè)，然后開(kāi)始使用。

第1步

畫地板：使用顏色#363C4C，拉一條440px×4px的線，然后中心對(duì)齊在畫板中，位置固定在距離底部邊緣212px處。（在這里為了計(jì)算方便提前畫好了參考線）

第2步

畫瓷鉆：畫十四個(gè)26 x 8 px矩形（#DEF8F9）創(chuàng)建第一行瓷磚。將14個(gè)矩形彼此水平分布 相距2px,然后進(jìn)行編組（Control-G），最后將它們放置在離地板左邊緣32px的位置。

第3步

畫瓷鉆背景墻：將剛編組的第一層瓷鉆復(fù)制一層后，與第一層間距為2px 然后整體向左移14px。方法如下：使用“ 移動(dòng)”工具將其向左推動(dòng)  14像素（右鍵單擊>“變換”>“移動(dòng)”>“垂直> -14像素）。使用“ 移動(dòng)”工具將其向上推動(dòng)  10像素（右鍵單擊>“變換”>“移動(dòng)”>“水平> -10像素）。

第4步

通過(guò)選擇我們已經(jīng)擁有的兩行來(lái)創(chuàng)建剩余的圖塊，然后將其拖動(dòng)到頂部，同時(shí)按住Alt-Shift鍵創(chuàng)建第一組副本，確保保持相同的2px  間隙。一旦你有第一組，按Control-D（復(fù)制）七次添加剩余的行。

第5步

花幾分鐘時(shí)間，用#C1EAEA顏色將選中的矩形填色后并編組在一起（Control-G），將所有行全部選中并分組在一起，然后再轉(zhuǎn)到下一部分。

5.如何繪制冰箱

將背景層鎖定之后，再繼續(xù)進(jìn)行第二步，我們將開(kāi)始繪制第一個(gè)廚房設(shè)備：冰箱。

第1步

使用56 x 128 px矩形創(chuàng)建冰箱右側(cè)部分的主要形狀，我們將使用彩色#E7EBF2 ，然后將這個(gè)形狀放置 在地板上方6px，距離右邊緣42px處。

第2步

將矩形復(fù)制一層（Control-C）并粘貼到前面（Control-F），填充顏色無(wú)，描邊顏色更改為#363C4C，描邊大小4px。這個(gè)方法是繪制輪廓，在后面的物體都會(huì)使用這個(gè)方法進(jìn)行繪制，下文都簡(jiǎn)稱為輪廓。

第3步

使用4 x 20px的矩形（#363C4C）添加門的手柄，將這個(gè)形狀放置距離輪廓左側(cè)8像素距底部40像素的距離處。完成后，選擇并編組（Control-G）所有三個(gè)形狀在一起。

第4步

繪制冰箱左門：在上一步的矩形塊的左邊使用48 x 128 px矩形（#E7EBF2）和描邊大小4px的輪廓（#363C4C）創(chuàng)建冰箱的較小部分，然后編組在一起（Control-G）。

第5步

繪制冰箱左門上的飲水機(jī)：我們將飲水機(jī)分為以下幾個(gè)部分以此繪制形狀并編組。

1.創(chuàng)建飲水機(jī)分配器，24×24px的正方形（#5592A0）以及它的輪廓描邊4 PX （#363C4C），編組后與左門中心對(duì)齊，放置在距離左門底邊緣40px處。

2.繪制飲水機(jī)上的底座：繪制一個(gè)8 x 3 px矩形（#363C4C），與上一步的分配器中心對(duì)齊并與其底部邊緣底對(duì)齊。

3.繪制底部托盤：繪制24 x 2 px矩形（#363C4C），與底座的間距2像素。

4.繪制給水裝置的主體：繪制12 x 10 px矩形（#363C4C），我們將其中心對(duì)齊到當(dāng)前部分的頂部邊緣。

5.繪制飲水機(jī)部分：底座完成后，我們用4 x 4 px的矩形（#363C4C），以及在右側(cè)添加2 x 8 px矩形（#363C4C），完成后編組。

之后繪制四個(gè)4 x 2 px矩形（#363C4C）添加小按鈕來(lái)完成飲水機(jī)，位置是剛才繪制的上面4px處。完成后，完成后對(duì)這個(gè)部分編組。之后再對(duì)整個(gè)冰箱進(jìn)行編組。飲水機(jī)部分就完成了。

第6步

繪制冰箱的底座：在編好組的冰箱下面繪制一個(gè)100 x 4 px的矩形（#363C4C）作為底座，同時(shí)繪制三個(gè)8 x 4 px矩形（#363C4C）放在底座下面作為冰箱的腳。在之后進(jìn)行編組，我們就完成了一個(gè)冰箱的繪制。

6.如何創(chuàng)建開(kāi)放櫥柜

我們的“廚房必需品”列表中的下一個(gè)是開(kāi)放櫥柜，讓我們開(kāi)始吧。

第一步

繪制櫥柜的主體：繪制一個(gè)72 x 52 pxx（#82868E）的矩形，以及它的輪廓描邊大小為4 x（#363C4C）。并且與冰箱的輪廓重疊對(duì)齊。

第2步

繪制櫥柜的框架

1.櫥柜的框架：繪制一個(gè)60 x24 pxx（#5A616D）的矩形，以及它的輪廓描邊大小為4 x（#363C4C）。將他與主體中心對(duì)齊，并與上邊緣間距18px。

2.繪制60 x4px（#363C4C）的矩形添加隔板，與整體碗架中心對(duì)齊后進(jìn)行編組。

3.繪制櫥柜的腳：繪制一個(gè)68 x 8 px（#4B5463）的矩形，以及它的輪廓描邊大小為4 x（#363C4C）。與櫥柜的身體邊緣對(duì)齊后進(jìn)行編組。

第3步

繪制櫥柜的內(nèi)部-毛巾架以及物品

1.毛巾架：在玩架上方10px處，繪制一個(gè)44 x4 pxx（#363C4C）的矩形，與碗架中心對(duì)齊之后進(jìn)行編組（Control-G）。

2.毛巾：在毛巾架的前面，繪制24x10pxx（#A1C689）的矩形，以及它的輪廓描邊大小為4 x（#363C4C）。中心對(duì)齊之后進(jìn)行編組（Control-G）。

3.毛巾背部：重復(fù)上一個(gè)步驟，矩形顏色改為#7D9E67，與上一步矩形對(duì)齊后放在它的后面。

4.添加小條紋繪制5個(gè)2 x 4 px（#363C4C）的矩形，其水平間距2px,編組后與毛巾背部的上邊緣中心對(duì)齊。完成后將毛巾和毛巾架進(jìn)行編組。

5.添加小碗：繪制三個(gè)矩形（12×6像素，10×6像素，10×4像素）顏色為#363C4C，然后將矩形的下面兩個(gè)錨點(diǎn)調(diào)整為圓角半徑4px，完成后將整個(gè)開(kāi)放櫥柜進(jìn)行編組進(jìn)入下一個(gè)部分的繪制。

（小編我用的aicc 2017可以直接調(diào)整圓角半徑的，如果你的不行一定是版本有點(diǎn)低了喲~）

7.如何繪制火爐

第1步

繪制火爐的外部整體

1.火爐的底座：在櫥柜的左側(cè)繪制一個(gè)56 x8 pxx（#4B5463）的矩形，以及它的輪廓描邊大小為4 x（#363C4C），編組。

2.火爐的主體：在櫥柜的左側(cè)繪制一個(gè)56 x52pxx（#E7EBF2）的矩形，以及它的輪廓描邊大小為4 x（#363C4C），編組后放在底座的前面。

第2步

繪制火爐

1.繪制一個(gè)44×32 px（#B5685B）的矩形，以及它的輪廓描邊大小為4 x（#363C4C），編組。與火爐主體中心對(duì)齊，并距離上邊緣10Px.

2.兩個(gè)烘箱擱板: 在火爐底邊邊緣上4px處 繪制一個(gè)44×4px（#363C4C）的矩形，他們間距12px,編組后與火爐門中心對(duì)齊。

3.繪制烤肉架：繪制9個(gè)2×4px（#363C4C）的矩形，彼此間距2px，編組后與烤箱門底部邊緣中心對(duì)齊。

4.繪制托盤：繪制一個(gè)24 x 4 px矩形（#363C4C），之后在它的上面添加28 x 2 px矩形（#363C4C）。編組后與烤箱底部中心對(duì)齊。

5.繪制烤箱手柄：繪制一個(gè)20 x 8 px矩形（#363C4C）添加烤箱的手柄，與門的頂部邊緣中心對(duì)齊。完成之后將整個(gè)烤箱內(nèi)部元件進(jìn)行編組。

第3步

繪制烤箱控制開(kāi)關(guān)

1.烤箱的刻度控制：繪制4個(gè)4 x 4 px的圓形（#363C4C），其間距為2px.編組后放置在距離火爐左邊緣6px 上邊緣2px處。、

2.在右邊有一個(gè)相同的表盤。復(fù)制一個(gè)4 x 4 px的圓形，右移8px,使它距離火爐右邊緣12px

3.定時(shí)器撥盤：繪制一個(gè)2 x 2 px的圓形（#363C4C），位置為第2步的右邊4px 下移2px處。在烤箱手柄與較大的撥盤之間。

4.繪制2個(gè)4 x 3 px矩形（#363C4C）放在烤箱頂部邊緣，分別與左右間距4px.將整個(gè)火爐編組即完成火爐的繪制。

8.如何繪制封閉式櫥柜

（譯者：這之后的部分和前面的方法相同只是數(shù)值上的不同。來(lái)大家繼續(xù)繪制后面的吧，前面有開(kāi)放式櫥柜了，后面肯定要有封閉式櫥柜）

第1步

櫥柜的外部

1.封閉式櫥柜的底座：繪制一個(gè)72 x 8 px（#4B5463）的矩形，以及它的輪廓描邊大小為4 x（#363C4C）。編組。

2.封閉式櫥柜的主體：繪制一個(gè)72 x 52 px矩形（#5A616D）以及它的輪廓描邊大小為4 x（#363C4C）。編組后放在底座的前面。

第2步

櫥柜的內(nèi)部

1.第一個(gè)抽屜：繪制一個(gè)60 x 12 px（#2868E）的矩形，以及它的輪廓描邊大小為4 x（#363C4C）。在它中心添加一個(gè)28 x 4 px矩形（#363C4C）。編組后與櫥柜中心對(duì)齊與上邊緣距離2px。

2.第2個(gè)抽屜：方法與第一步相同，參數(shù)分別為60 x 22 px（#82868E）的矩形，以及它的輪廓描邊大小為4 x（#363C4C），中間的矩形為28 x 4 px（#363C4C）完成后將整個(gè)封閉式櫥柜編組。

9.如何繪制廚房灶臺(tái)面

當(dāng)我們完成了前面幾步的柜子之后。開(kāi)放櫥柜，烤箱，封閉櫥柜，這些就重新組合成了一個(gè)新的柜子。這個(gè)柜子就是廚房的爐灶下面的柜子。下面我們開(kāi)始繪制廚房的灶臺(tái)面。

第1步

繪制水龍頭

1.在兩個(gè)櫥柜和烤箱上面繪制一個(gè)200 x6 px（#5A616D）的矩形，以及它的輪廓描邊大小為4 x（#363C4C），編組。

2.繪制水槽：繪制一個(gè)40 x 6 px的矩形（#363C4C），我們將其放在灶臺(tái)面上，需要注意的是確保它與開(kāi)放式櫥柜水平居中對(duì)齊。

3.繪制水龍頭：繪制一個(gè)4px厚的線條組成水龍頭的形狀，我們將中心對(duì)齊到先前創(chuàng)建的形狀的底邊。

4.繪制水龍頭的手柄：繪制一個(gè)4 x 4 px的正方形（#3634C），在它左側(cè)繪制一個(gè)2 x 8 px的矩形（#3634C）,編組后移動(dòng)到水龍頭的左側(cè)，之后將整個(gè)水龍頭包括手柄進(jìn)行編組。

第2步

繪制煤氣灶：

繪制三個(gè)8 x 4 px矩形（#363C4C）,其水平間距4px.編組后，將其與烤箱中心對(duì)對(duì)齊。最后將整個(gè)廚房灶臺(tái)編組后進(jìn)入下一個(gè)部分。

10.繪制洗衣機(jī)

方法依舊從外部到內(nèi)部開(kāi)始。

第1步

洗衣機(jī)的外部

1.繪制一個(gè)52 x8 px（#5A616D）的矩形，以及它的輪廓描邊大小為4 px（#363C4C），然后在中心繪制一個(gè)52 x 2px的矩形。以上編組（Control-G）后放在整個(gè)灶臺(tái)的左邊。

第2步

洗衣機(jī)的內(nèi)部主體

1.主體：在底座的上面繪制一個(gè)52 x 46 px的矩形（#E7EBF2）以及它的輪廓描邊大小為4 px（#363C4C）。

2.洗衣機(jī)的門：面繪制一個(gè)28x 28 px的圓形（#5592A0）以及它的輪廓描邊大小為4 px（#363C4C）。編組后放置在距離洗衣機(jī)主體上邊緣4px處。

3.洗衣機(jī)門的暗部：繪制一個(gè)20 x 20像素圓形（#363c4c）,之后與上一步的元件中心對(duì)齊，編組。

4.洗衣機(jī)門的手柄：繪制一個(gè)8 x 8像素圓形（#5592A0），在里面再繪制一個(gè)4 x 4像素圓形（#363c4c）。編組后與洗衣機(jī)門的右邊緣垂直中心對(duì)齊。

5.洗衣機(jī)門上的裝飾：首先繪制一個(gè)32 x 4 px矩形（#363C4C），與洗衣機(jī)主體的底部邊緣中心對(duì)齊。然后繪制一個(gè)稍窄的20 x 4 px矩形（#363C4C），與洗衣機(jī)主體頂部我邊緣中心對(duì)齊。 最后將裝飾與洗衣機(jī)主體編組。

第3步

洗衣機(jī)的上部

1.繪制一個(gè)52 x 12px的矩形（#82868E），以及它的輪廓描邊大小為4 px（#363C4C）。編組放置在洗衣機(jī)主體的上面。

2.繪制一個(gè)16 x 4 px的矩形（#363C4C），與剛才創(chuàng)建的上部形狀中心對(duì)齊。

3.洗衣機(jī)的控制按鈕：在洗衣機(jī)的上部距離左邊緣2px以及上邊緣2px處 繪制兩個(gè)4x 4px的圓形（#363C4C）。然后再距離右邊緣8px的地方繪制另一個(gè)4 x4px的圓形繪制右邊的按鈕。然后編組。

4.洗衣機(jī)的背板：首先繪制一個(gè)36 x 8px的矩形（#5A616D），以及它的輪廓描邊大小為4 px（#363C4C）。然后在里面中心繪制一個(gè)24 x 4 px矩形（#363C4C）。三個(gè)形狀編組之后放置在洗衣機(jī)上部的上面。

5.洗衣機(jī)上有的時(shí)候會(huì)放兩塊毛巾：

首先在距離右邊緣2px處，繪制一個(gè)26 x 8 px，圓角半徑為4px的圓角矩形（#929BDD）以及它的輪廓描邊大小為4 px（#363C4C）。

然后復(fù)制上面兩個(gè)形狀就有了第二條毛巾，將顏色改為#A1C689。最后將毛巾這元件整體編組。

11.如何創(chuàng)建貨架和裝飾元素

畫到這一步，地板上擺放的物品就全了。但是為了更好，下面來(lái)開(kāi)始裝飾背景墻。我們來(lái)繪制墻上的貨架以及其他墻飾。

第1步

繪制貨架

1.貨架：在距離水龍頭上方14px,冰箱左邊緣16px處繪制一個(gè)104 x 6px的矩形（#82898E），以及它的輪廓描邊大小為4 px（#363C4C）。

2.在貨架下方中心處 繪制2個(gè)4 x 8 px的矩形（#363C4C），其水平間距76px.  然后將1、2步整個(gè)貨架編組。

第2步

繪制貨架上的物品:

1.CD:在貨架右邊緣4px處，繪制4個(gè)6 x12px的矩形（#5592A0），以及它的輪廓描邊大小為4 px（#363C4C）,單獨(dú)編組后，使其間距8px。

2.音響外部：在貨架左邊緣8px處，繪制一個(gè)32 x16px的矩形（#929BDD），以及它的輪廓描邊大小為4 px（#363C4C）

3.音響內(nèi)部: 首先在音響外部形狀中間的中心 繪制2兩個(gè)8 x 8 px（#363C4C）的圓形，其間距為8px.(揚(yáng)聲器元件)

然后在音響的頂部和底部中心分別 繪制2個(gè)8 x 4 px矩形（#363C4C），垂直間距8px. (音響上裝飾元件)

4.音響控制按鈕：在音響上部左邊緣6px處，繪制3個(gè)高的4px的矩形（#363C4C，寬分別為6px,4px,4px），其水平間距為2px.最后將整個(gè)音響編組。

12.如何繪制窗戶

假設(shè)我們把廚房設(shè)計(jì)在一個(gè)密封的城堡里，我們需要開(kāi)一扇窗戶進(jìn)來(lái)一些空氣。

第1步

窗戶的外部：

在距離臺(tái)面上方16px,貨架左邊緣16px處，繪制1個(gè)52 x68px的矩形（#E2AA7D），以及它的輪廓描邊大小為4 px（#363C4C）。

第2步

窗戶的內(nèi)部：

1.繪制窗口：在上一步形狀的中心，繪制1個(gè)40x 56 px的矩形（#A5795B），以及它的輪廓描邊大小為4 px（#363C4C）。

2.繪制玻璃：在上一步形狀的中心，繪制1個(gè)30 x 46 px的矩形（#ABDBEF），以及它的輪廓描邊大小為4 px（#363C4C）。

3.繪制窗戶的鉸鏈：繪制2個(gè)10 x 8 px（#363C4C），其垂直距離為32px.編組之后（Control-G）與在窗口框架的左邊緣的中心對(duì)齊。

4.繪制窗外的景色：繪制3個(gè)高為4px,內(nèi)角半徑為2px的矩形（#EDF6F9）。最后畫點(diǎn)時(shí)間將三朵云編組。剩下參數(shù)見(jiàn)圖。

5.繪制窗戶的手把手：繪制一個(gè)16 x 4 px的矩形（#363c4c）,與窗戶框架的右邊緣對(duì)齊。完成后將整個(gè)窗戶的形狀編組。

13.如何創(chuàng)建天花燈

現(xiàn)在到了廚房的最后一個(gè)部分了，天花燈。

第1步

繪制天花板

1.繪制天花板：在窗戶上方18px處，繪制一個(gè)184 x 4 px的矩形（#363c4c）,并與畫板中心對(duì)齊。

第2步

繪制一個(gè)照明燈

1.在天花板的下方18px處，繪制1個(gè)12 x 16px的矩形（#E8B169），以及它的輪廓描邊大小為4 px（#363C4C）。并與上一個(gè)形狀中心對(duì)齊。

2.繪制照明燈上的電纜線: 繪制一個(gè)18x 4 px的矩形（#363C4C），與上一個(gè)形狀中心對(duì)齊后將整個(gè)照明燈編組。

第3步

繪制另外2個(gè)照明燈

將編組好的照明燈復(fù)制兩個(gè)。然后設(shè)置3個(gè)照明燈間距40px.

第4步

繪制照明燈底座

繪制一個(gè)128 x 6 px的矩形（#363C4C）做為照明燈底座，與天花板中心對(duì)齊。最后將天花板和照明燈編組后就完成了整張插畫的繪制。

14.恭喜你看到了最后

看完整個(gè)教程，你已經(jīng)掌握了如何通過(guò)每一個(gè)步驟一步一步的完成了我們的現(xiàn)代廚房。我希望在這個(gè)有趣的繪制過(guò)程中，學(xué)到一些新的和有用的方法。

——翻譯結(jié)束——

作為本文譯者，我的收獲是復(fù)雜的畫面只要理清楚順序就可以慢慢的完成同時(shí)ai的圖層分組管理也更加清晰。那么你的收獲是什么呢？

 

最新評(píng)論