Illustrator繪制6組不同扁平化風(fēng)格的動物卡通頭像教程
在這篇教程中,我們將從一個(gè)相同的圓中創(chuàng)建6種不同的動物形象。 讓我們利用基本的形狀制作一組扁平化的元素來找點(diǎn)樂子,形狀生成工具,路徑查找器面板和Adobe Illustrator的其他一些有趣的功能。
先看看效果圖

1.創(chuàng)建一個(gè)優(yōu)雅的暹羅貓
第1步
首先從一個(gè)由橢圓工具(L)制作的60 x 60 px大小的圓形成貓的臉。 用淺褐色填充這個(gè)圓。

第2步
用直接選擇工具(A)選擇兩邊的錨點(diǎn)并將其向下拉動,改變臉部的形狀。

第3步
現(xiàn)在讓我們制作貓的耳朵。 選取多邊形工具并制作一個(gè)大小大約為17 x 15 px的三角形。 使用效果>變形>凸出并設(shè)置垂直方向的彎曲值為40%。
給這個(gè)形狀應(yīng)用對象>擴(kuò)展外觀的效果。 用直接選擇工具(A)選擇上面的錨點(diǎn)并在上面的屬性面板中點(diǎn)擊轉(zhuǎn)換角為平滑按鈕制作平滑的角。 縮短這個(gè)錨點(diǎn)的錨柄并將其向上拖動,使耳朵更尖。

第4步
選中鼻子,復(fù)制并粘貼在前面(Control-C > Control-F)。 使新拷貝形狀的更小并用巧克力棕色填充它。 旋轉(zhuǎn)耳朵并將其放置在頭部的左邊,將其置于底部(Control-Shift-[),在頭部形狀的下面。 通過雙擊工具面板上的鏡像工具(O)圖標(biāo)水平軸翻轉(zhuǎn)耳朵制作一份復(fù)本,并將其放置在頭部相對的一邊。

第5步
讓我們制作扁平頭部的頂部部分。 選中頭部的形狀,選取橡皮擦工具(Shift-E)并按住Alt鍵畫一條扁長的橫跨頭部的矩形。 現(xiàn)在我們將這個(gè)形狀切成2個(gè)部分。 選擇不需要的部分并刪除它。

第6步
用多邊形工具制作一個(gè)粉色的3角形鼻子。 選中鼻子拖拽實(shí)時(shí)轉(zhuǎn)角的控制點(diǎn),使形狀變圓。 如果這個(gè)功能在你的 Adobe Illustrator的版本中不可用,使用效果>風(fēng)格化>圓角可以做到相同的效果。

第7步
制作另一個(gè)橢圓并將其放置到臉的里面,以便它碰到下鼻尖。 利用鼻子作為一個(gè)關(guān)鍵對象,將橢圓對齊到鼻子上。 要做到這一點(diǎn),需要選擇2個(gè)形狀并按住Alt鍵時(shí)點(diǎn)擊鼻子形狀。 你將會在鼻子周圍看到一個(gè)厚厚的描邊,指示關(guān)鍵對象。 前往對齊面板并點(diǎn)擊水平居中對齊。
然后選取錨點(diǎn)工具(Shift-C)并向下移動底部錨點(diǎn)的錨柄大約45°。 利用參考線將錨柄移動相同的距離(你可以從在你的畫板的標(biāo)尺上向下拉動添加參考線(Control-R))。
用與我們耳朵顏色相同的顏色填充面部,用吸管工具(I)選取顏色。 添加一個(gè)更小的淺棕色的橢圓在面部的下面,描繪為下頜。

第8步
現(xiàn)在讓我們制作眼睛! 制作一個(gè)橢圓,選擇它右邊的錨點(diǎn),用在控制面板上的轉(zhuǎn)換菜單將其轉(zhuǎn)換為尖角。 用淺藍(lán)色填充橢圓并在其上面添加另一個(gè)橢圓作為虹膜。
我們需要刪除虹膜與眼睛邊緣疊加的部分。 選中兩個(gè)橢圓,然后利用形狀生成工具(Shift-M)按住Alt鍵,點(diǎn)擊不需要的片段,擦掉虹膜上面的部分。
將眼睛旋轉(zhuǎn)一點(diǎn),并使用鏡像工具(O)創(chuàng)建一個(gè)鏡像的復(fù)本。

第9步
制作2個(gè)淺棕色的橢圓作為我們貓的眉毛,并添加2個(gè)白色的小圓作為眼睛的高光。
創(chuàng)建一個(gè)淺粉色的橢圓,將其放置在鼻子的上端的位置,然后利用形狀生成工具(Shift-M)按住Alt鍵刪除不需要的部分,因此使鼻子添加更多細(xì)節(jié)。

第10步
讓我們創(chuàng)建一個(gè)新潮的扁平的陰影,覆蓋貓的頭部的一半。 將貓所有部分編組(Control-G),復(fù)制這個(gè)編組并將其粘貼在前面 (Control-C > Control-F)。 保持復(fù)本選中,在路徑查找器面板中將這些部分合并,將它們生成一個(gè)單獨(dú)的形狀。 改變這個(gè)側(cè)影的混合模式為正片疊底,使它變?yōu)榘胪该鳌?/p>
最后,選擇側(cè)影,選取橡皮擦工具(Shift-E)并按住Alt鍵,拉動你的鼠標(biāo)在貓的頭部的左邊部分,用白色的矩形覆蓋它。 釋放鼠標(biāo)按鈕刪除覆蓋的片段。

在這里,我們就完成他了! 我們扁平化的貓已經(jīng)完成。 讓我們開始制作下一個(gè)歡快的小狗把。
2.畫一個(gè)歡快的小狗
第1步
和之前一樣,我們首先從一個(gè)60 x 60 px的圓中形成一個(gè)形象。 將2邊的錨點(diǎn)向下移動一點(diǎn),使形狀凸出,然后用橡皮擦工具(Shift-E)擦掉頂部的部分。
用直接選擇工具(A)選擇左邊的錨點(diǎn),并按下回車鍵打開移動選項(xiàng)窗口。 設(shè)置水平位置值為-5px,垂直位置值為0px并點(diǎn)擊確定,因此將這個(gè)錨點(diǎn)向左移動了5個(gè)像素。
右邊的錨點(diǎn)也用同樣的方法處理,設(shè)置水平移動值為5px 并將其向右移動5 px。

第2步
選擇兩邊的錨點(diǎn),并將它們轉(zhuǎn)換為尖角。 利用錨點(diǎn)工具(Shift-C)調(diào)整錨柄的位置并將它們向上移動,制作一個(gè)順滑曲線的面部線條。

第3步
讓我們使用多邊形工具,從一個(gè)40 x 35 px的三角形中形成耳朵。 選取曲率工具(Control-`),使三角形的邊變得更圓和更凸。 如果你用的是 Adobe Illustrator早期的版本,將不會有這個(gè)工具,如之前一樣可以任意使用效果>變形>凸出。
選擇上方的錨點(diǎn),使其順滑并向左拉動一點(diǎn),使形狀傾斜。 轉(zhuǎn)到對象>路徑>偏移路徑,并設(shè)置偏移值為-3px,形成耳朵的內(nèi)部。 用淺灰色填充。

第4步
旋轉(zhuǎn)耳朵并將其放置到頭部的左邊。 使用鏡像工具(O)在另一邊創(chuàng)建一個(gè)鏡像的復(fù)本。

第5步
從一個(gè)壓扁的橢圓中形成一個(gè)深灰色的鼻子,將其下面的錨點(diǎn)向下拖動一點(diǎn)。 制作兩個(gè)疊加的淺灰色的橢圓在鼻子的下面,將它們編組并與臉部水平對齊,將臉部形狀作為一個(gè)關(guān)鍵對象。

第6步
現(xiàn)在讓我們制作一個(gè)有趣的伸出了的舌頭! 用矩形工具(L)創(chuàng)建一個(gè)淺粉色的矩形,并將其放置在淺灰色橢圓的下面。 選擇下面的錨點(diǎn)并推動實(shí)時(shí)轉(zhuǎn)角使其達(dá)到最大,使其底部的形狀變圓。 選取線段工具(\)并按住Shift鍵畫出一個(gè)垂直的描邊。 你可以在描邊面板中使線段端點(diǎn)變圓。

第7步
讓我們移動到眼睛。 制作一個(gè)深藍(lán)色的橢圓并和在其下面用一個(gè)任意顏色的橢圓覆蓋住。 選擇2個(gè)形狀并用形狀生成工具(Shift-M)刪除眼睛底部被橢圓覆蓋的部分。 這樣我們會制作一個(gè)有趣的外表。 給眼睛添加一個(gè)深色的虹膜和一個(gè)白色的小高光。
將眼睛旋轉(zhuǎn)一點(diǎn)并創(chuàng)建第二個(gè),放在臉的另一邊。

第8步
創(chuàng)建2個(gè)淺灰色的正圓,覆蓋住眼睛。 然后添加2個(gè)較大的圓,疊加并覆蓋在臉的底部,如下面截圖所示的一樣。 選擇下面的圓并使用形狀生成工具(Shift-M)刪除臉外面的部分。
選擇全部4個(gè)新片段并在路徑查找器中將它們合并,制作一個(gè)面部的“面具”。 你可以在面部的中心刪除間隔,通過用直接選擇工具(A)點(diǎn)擊它的邊緣并刪除它。

第9步
制作2個(gè)小圓角矩形作為眉毛,使狗看起來友善且歡樂,最后在臉的右半部分創(chuàng)建一個(gè)微妙的陰影。

3.制作一個(gè)可愛的浣熊
第1步
首先我們從一個(gè) 60 x 60 px淺藍(lán)色的圓塑造臉部。 將其壓扁一點(diǎn)使圖形更寬。 將兩邊的錨點(diǎn)向下拉動幾個(gè)像素,并從上方工具欄的轉(zhuǎn)換菜單中將其轉(zhuǎn)換為銳角。
從我們貓的耳朵中制作一份復(fù)制,根據(jù)浣熊頭的顏色給耳朵重新上色并將其放置到頭的兩邊。

第2步
從一個(gè)18 x 10 px的深灰色的橢圓中制作一個(gè)鼻子,并將其頂部的錨點(diǎn)向上拉動一點(diǎn)。 用深灰色描邊創(chuàng)建另一個(gè)橢圓,在顏色面板中設(shè)置填充色為無。 選取剪刀工具(C)并點(diǎn)擊左邊和右邊的錨點(diǎn),水平將其分為2個(gè)相等的橢圓。 刪除下面的一半,使我們的浣熊微笑。

第3步
復(fù)制面部的形狀制作一份較小的拷貝,用白色填充并放置在鼻子的下面。 添加2個(gè)有白色高光的黑色小眼睛,將其編組并在對齊面板中水平對齊面部,將臉制作為一個(gè)關(guān)鍵對象。
再次拷貝面部形狀,制作一個(gè)較小的拷貝,用用深藍(lán)色填充,然后放置在臉的底部,形成一個(gè)面具。

第4步
讓我們將面具切分為2個(gè)橢圓,在眼睛的周圍創(chuàng)建2個(gè)斑點(diǎn)。 選取矩形工具(M)并畫一個(gè)垂直的條紋穿過臉的的中間。 選擇面具和和條紋,使用路徑查找器中的分割功能切割全部的形狀。 如果有的話,刪除不需要的片段。 將橢圓放置到你創(chuàng)建的眼睛的下面,并使角適當(dāng)?shù)刈儓A。
最后,在臉的右半部分添加一個(gè)扁平的陰影。 現(xiàn)在我們可以繼續(xù)下一個(gè)了!

4.制作一個(gè)友善熊貓
第1步
從一個(gè)60*60PX的淺米色制作一個(gè)蓬松的臉,將它兩邊的錨點(diǎn)向下移動。

第2步
從我們狗的圖標(biāo)復(fù)制鼻子區(qū)域,并設(shè)置描邊的顏色嘴唇為深灰色,以便輪廓不可見。 選擇2個(gè)橢圓輪廓(沒有鼻子),并在路徑查找器中將它們合并。
選擇剪刀工具(C)并點(diǎn)擊形狀輪廓2邊的錨點(diǎn),將其分開。 刪掉上面的一半,為我們的熊貓形成一個(gè)友善的笑容。

第3步
從我們的浣熊圖形中拷貝眼睛,讓我們在眼睛的周圍形成一個(gè)深灰色的大斑點(diǎn)。 制作一個(gè)壓扁的橢圓,并將其向左旋轉(zhuǎn)一點(diǎn)。 利用鏡像工具(O)制作一個(gè)復(fù)本并水平的翻轉(zhuǎn)到臉的另一邊。 用白色填充眼球,以便它們在深色斑點(diǎn)上可見。
保持眼球被選中,使用對象>路徑>偏移路徑并創(chuàng)建一個(gè)小瞳孔在-1px偏移值的眼睛里面。

第4步
在熊貓的頭部添加一個(gè)深灰色的耳朵,并最后在臉的右邊形成一個(gè)半透明的陰影。
做得好! 讓我們繼續(xù)!

5.創(chuàng)建一個(gè)聰明的熊
第1步
首先從一個(gè)60 x 60 px 的圓中制作一個(gè)熊的臉。 將2邊的錨點(diǎn)向下移動,頂部的錨點(diǎn)向上移動,使其看起來像一個(gè)雞蛋。
利用橡皮擦工具(Shift-E)使頭部的頂部扁平。 并使圖形的角稍許變圓。

第2步
在頭的頂部添加2個(gè)圓形的耳朵,將其編組并水平對齊,將頭作為關(guān)鍵對象。 利用路徑偏移功能給予-3px的偏移值形成耳朵的深色部分。

第3步
從一個(gè)壓扁的橢圓中制作一個(gè)寬的,深棕色的鼻子。 然后讓我們形成鼻橋。 選取矩形工具(M)并制作一個(gè)淺米色的形狀,放在鼻子的后面。 使用移動選項(xiàng)面板,將其左上方的錨點(diǎn)向右移動5px。 對右邊的錨點(diǎn)做同樣的方法,將其向相反的方向移動,然后得到一個(gè)狹窄鼻橋的頂部。
讓矩形的角變圓。 利用實(shí)時(shí)轉(zhuǎn)角功能,你可以變化每個(gè)矩形角的圓度。 舉例來說,你可以僅選擇上方的錨點(diǎn),因此通過將它們拖拽到最大值得到100%的圓度。

第4步
添加一個(gè)小橢圓在鼻橋底部的下面,形成下頜。 添加眼睛到熊的面部,如果你覺得熊的臉太暗了,可以使棕色的部分亮一點(diǎn)。
最后,給熊的臉部添加陰影。
真棒! 我們僅剩最后一個(gè)形象了!

6.制作一個(gè)狡猾的狐貍
第1步
再一次,我們先從我們熟悉的60 x 60 px的橘色圓中形成狐貍的臉。 將2邊的錨點(diǎn)向下推動一點(diǎn)并將其轉(zhuǎn)換成銳角,使臉的側(cè)面變尖。 轉(zhuǎn)換下面的錨點(diǎn)轉(zhuǎn)換成角然后形成一個(gè)尖鼻子。

第2步
從我們浣熊圖形中選取耳朵并將其放置到狐貍頭部的兩邊,調(diào)整顏色。 將黑色的橢圓放在臉的底部,覆蓋住鼻子區(qū)域。 使用形狀生成工具(Shift-M)除去臉外面的部分,形成一個(gè)黑色的尖鼻子。

第3步
創(chuàng)建一個(gè)橢圓,如下圖所示,與狐貍臉的左邊疊加。 使用鏡像工具(O)在相反的一邊制作一個(gè)翻轉(zhuǎn)的復(fù)本。 選擇橢圓并用形狀生成工具(Shift-M)刪掉臉外面的那些部分。 用淺米色填充,形成臉頰。 最后給我們的狐貍添加2個(gè)閃亮的小眼睛。

第4步
在實(shí)時(shí)轉(zhuǎn)角功能的幫助下使鼻尖變圓。 然后讓我們?yōu)楹偺砑右恍└嗟募?xì)節(jié)!
制作一個(gè)小的淺橘色的壓扁的橢圓,并將其放置到鼻橋的左邊。 選擇這個(gè)形狀,按住 Alt-Shift并向右拉動橢圓制作一份復(fù)本。 按住Control+D一次形成更多復(fù)本。 制作更多列的橢圓,將它們放在縱橫的位置上。 這樣,我們就描繪了具有風(fēng)格化的毛皮狐貍的鼻子。
不要忘記給鼻子添加一個(gè)輕柔的高光,在鼻子的頂部形成一個(gè)淺色的小圖形。

第5步
在我們狡猾狐貍的右邊添加一個(gè)輕柔的影子。

7.創(chuàng)建圖標(biāo)的長投影
第1步
現(xiàn)在我們有了6個(gè)扁平化風(fēng)格的動物形象,讓我們將其放在一套彩色的圓之上,創(chuàng)建圖標(biāo)。
制作一個(gè)106 x 106 px大小綠松石色的圓作為圖標(biāo)的底子,并將其放置到浣熊頭的中間。
創(chuàng)建一個(gè) 80 x 80 px的方形作為陰影底子,按住Shift鍵將其旋轉(zhuǎn)45°。

第2步
轉(zhuǎn)換矩形的混合模式為正片疊底,使其半透明,放置在浣熊的上面。 如果需要,使形狀窄一點(diǎn),并且移動它,找到能覆蓋頭部2個(gè)斑點(diǎn)的位置。 在我們這種情況下,它的兩端在耳朵的右邊和臉的左邊。 使用添加錨點(diǎn)工具(+)添加2個(gè)錨點(diǎn)在這些斑點(diǎn)上,然后轉(zhuǎn)到刪除錨點(diǎn)工具(-)并刪除這些矩形頂部不需要的錨點(diǎn),將頂部的形狀置于浣熊頭部的下面。
將陰影放置到頭部的下面,用形狀生成工具(Shift-M)刪除圖標(biāo)外面不需要的的片段和-瞧-我們 一個(gè)有新潮扁平陰影的花式圖標(biāo)已經(jīng)完成! 對剩下的動物圖標(biāo)用相同的技術(shù)創(chuàng)建圓形圖標(biāo)。

很好! 我們一套扁平化動物圖標(biāo)已經(jīng)完成!
很有趣吧?我希望你會喜歡創(chuàng)建這些可愛的扁平動物圖標(biāo),并且學(xué)習(xí)一些新的點(diǎn)子和方法,使用橢圓,路徑查找器面板,和形狀生成工具!請繼續(xù)關(guān)注新教程,并不要忘記在下面的評論展示你的結(jié)果!

教程結(jié)束,以上就是Illustrator繪制6組不同扁平化風(fēng)格的動物卡通頭像教程,大家學(xué)會了嗎?希望能對大家有所幫助!
相關(guān)文章
AI繪制一套扁平化風(fēng)格的職業(yè)頭像圖標(biāo)
這篇教程是向腳本之家的朋友分享AI繪制一套扁平化風(fēng)格的職業(yè)頭像圖標(biāo)方法,教程繪制出來的圖標(biāo)非常漂亮,難度也不是很大,推薦到腳本之家,喜歡的朋友快快來學(xué)習(xí)吧2016-01-12- 這篇教程是向腳本之家的朋友介紹AI結(jié)合PS兩分鐘制作扁平化長投影方法,教程非常簡單,對于新手來說是個(gè)很不錯的學(xué)習(xí)教程,推薦到腳本之家,喜歡的朋友一起來學(xué)習(xí)吧2015-10-18
- 這篇教程是向腳本之家的朋友介紹AI 1分鐘5步簡單快速制作扁平化長投影方法,教程制作出來的長投影非常的不錯,方法也很簡單,推薦過來,大家一起來學(xué)習(xí)吧2015-05-01
- 本篇教程是向腳本之家的朋友介紹利用AI繪制漂亮質(zhì)感的扁平化寶石圖標(biāo)過程,教程制作出來的寶石圖標(biāo)非常的漂亮,難度也不是很大,推薦到腳本之家,喜歡的朋友可以跟著教程一2014-10-18
Illustrator繪制時(shí)尚扁平化風(fēng)格的復(fù)活節(jié)彩蛋圖標(biāo)
本教程主要使用Illustrator繪制時(shí)尚扁平化風(fēng)格的復(fù)活節(jié)彩蛋圖標(biāo),里面有很多的AI繪制技巧和基本知識,教程很不錯,推薦到腳本之家,一起來學(xué)習(xí)吧2016-03-28Illustrator繪制扁平化風(fēng)格的黑色皮膚外科醫(yī)生頭像
這篇教程是向腳本之家的朋友分享Illustrator繪制扁平化風(fēng)格的黑色皮膚外科醫(yī)生頭像方法,教程繪制出來的效果還是挺不錯的,很值得大家學(xué)習(xí),推薦過來,大家快快來學(xué)習(xí)吧2016-01-18Illustrator繪制清新簡單的扁平化風(fēng)格的海報(bào)字體教程
這篇教程是向腳本之家的朋友介紹Illustrator繪制清新簡單的扁平化風(fēng)格的海報(bào)字體方法,教程繪制出來的字體非常漂亮,難道也不是很大,推薦到腳本之家,大家一起來看看吧2015-11-09- 這篇教程是向腳本之家的朋友介紹利用Illustrator制作超酷的字母扁平化長陰影效果方法,教程制作出來的效果非常地不錯,教程難度不是很大,推薦到腳本之家,喜歡的朋友可以2014-11-25
用Illustrator設(shè)計(jì)扁平化風(fēng)格的飛鏢圖標(biāo)
本教程是向大家介紹利用Illustrator設(shè)計(jì)扁平化風(fēng)格的飛鏢圖標(biāo)火車,繪制效果非常不錯,教程難度一般,介紹的也非常詳細(xì),喜歡的朋友可以跟著一起學(xué)習(xí)一下2014-07-02Illustrator繪制漂亮的扁平化風(fēng)景插畫教程
這篇教程是向腳本之家的朋友分享Illustrator繪制漂亮的扁平化風(fēng)景插畫方法,教程繪制出來的插畫非常漂亮,操作很簡單的,一起來學(xué)習(xí)吧2016-05-27

