AI圖標設計，用AI制作太陽系的行星圖標(4)

繪制過很多圖標，我們本次來制作一下宇宙廣袤空間里的太陽系行星，用的是AI中最基礎(chǔ)的繪圖工具，那么我們是如何用基礎(chǔ)工具去繪制形態(tài)不同的行星呢？通過教程來學習一下，相信同學們就知道如何做，教程比較長，制作的時候要有耐心，希望同學們在制作當中找到學習的樂趣，具體通過教程來操作一下吧。

效果圖：

m.theoat.com.cn

操作步驟：

一、設置新文檔

首先，打開文件>新建或使用Control-N快捷鍵創(chuàng)建新文檔，并進行以下設置

畫板數(shù)量：1

寬度：800像素

高度：600像素

單位：像素

進入“高級”選項卡

色彩模式：RGB

光柵效果：屏幕（72ppi）

選中對象與像素網(wǎng)格對齊

二、設置圖層

文檔建立后，進行分層項目，這將通過關(guān)注一個圖標來幫助我們保持穩(wěn)定的工作流程

因此，使用圖層面板，創(chuàng)建九個圖層，重新命名如下

第1層：reference grids參考網(wǎng)格

第2層：mercury水星

第3層：venus金星

第4層：earth地球

第5層：mars火星

第6層：jupiter木星

第7層：saturn土星

第8層：uranus天王星

第9層：neptune海王星

注意：在開始繪制圖像前，我們需要單擊眼睛圖標旁的小圓圈（Toggles Lock）鎖定除我們當前正在處理的圖層之外的所有圖層

三、設置自定義網(wǎng)格

進入編輯>首選項>參考線和網(wǎng)格子菜單，并做如下調(diào)整

網(wǎng)格線：1px

細分：1

四、創(chuàng)建參考網(wǎng)格

參考網(wǎng)格的建立可以方便我們繪制過程中觀察圖形的水平和對齊，網(wǎng)格的大小一般決定了圖標的大小，每個圖標的創(chuàng)建就是以參考網(wǎng)格為準則

第1步

鎖定除參考網(wǎng)格之外的所有圖層，選擇矩形工具（M）繪制一個128×128像素的紅色（#F97373）方塊，定義圖標的大小進行調(diào)整

第2步

添加另一個較小的116×116px矩形（#F2F2F2），作為我們的活動繪圖區(qū)域，從而為我們提供6px的邊緣填充

第3步

使用Control-G快捷鍵將兩個矩形組合在一起，然后創(chuàng)建七個間隔40px的副本，將它們堆疊成兩行（每行四個），并與畫板中心對齊

五、創(chuàng)建默認“空白”圖標

正如預覽圖像中觀察的那樣，所有圖標都遵循相似但不完全相同的構(gòu)圖或基礎(chǔ)，八個圖標中存在一些共同的元素

這意味著我們可以構(gòu)建一個“空白”圖標，然后我們可以通過添加或刪除其組成元素中的細節(jié)來創(chuàng)建剩余的圖標，從而使創(chuàng)作過程非常方便快捷。

第1步

選擇第一個參考網(wǎng)格，放大（以便觀察），使用圓角矩形工具(M),創(chuàng)建一個22×14像素，7像素角半徑的形狀，顏色設置為#656370，定位在繪圖區(qū)域的左上角，左側(cè)留下6像素，頂部留下11像素的距離

注意：建議打開“像素預覽”模式（視圖>像素預覽>Alt-Control-Y），以便更輕松的根據(jù)基礎(chǔ)像素網(wǎng)格確定形狀

第2步

創(chuàng)建一個7px角半徑68×14px的圓角矩形（#656370），并將其放置在先前創(chuàng)建的形狀的右側(cè)，六處4px的間隙

第3步

創(chuàng)建云中間連接的形狀

首先，創(chuàng)建3px角半徑58×6px的圓角矩形，使用#656370進行著色，然后兩個6×6px圓圈（用紅色突出顯示），使用路徑查找器里的減去功能對圓形進行調(diào)整

第4步

將調(diào)整后的形狀放在先前創(chuàng)建的形狀下方，水平居中（對齊面板）

第5步

創(chuàng)建7px角半徑110×14px的圓角矩形#656370，將其放置在連接器的下方，將其對齊到可繪制區(qū)域的左側(cè)

第6步

添加86×6px的連接形狀，并將其放置在前一個形狀的下方，放置在可繪制區(qū)域右側(cè)14px的位置

第7步

使用圓角矩形工具，創(chuàng)建一個108×14像素7px角半徑的形狀，使用#656370進行著色，將其放置在我們剛剛創(chuàng)建好的形狀下方，將其對齊到可繪制區(qū)域的右側(cè)

第8步

留出6px間隙，添加一個90×14px、7px角半徑的圓角矩形（#656370），然后再繪制一個18×14px的圓角矩形（#656370），將它們之間的距離調(diào)整為4像素，并將它們對準到可繪制區(qū)域的左側(cè)

第9步

創(chuàng)建一個52×6px連接形狀，使用#656370進行著色，并將其放置在我們前一步創(chuàng)建的形狀下方（朝向右側(cè)），放置在距離右側(cè)32px的位置

第10步

創(chuàng)建一個76×14、7px角半徑的圓角矩形（#656370），將它放置在第三個連接形狀的下方，距離可繪制區(qū)域右側(cè)6px

第11步

使用橢圓工具（L），創(chuàng)建一個16×16像素的圓圈，使用#e2d388進行著色，然后將其放置在背景的左上角，距離可繪制區(qū)域頂部5px的位置

第12步

制作它的副本（Control-C> Control-F），然后對其應用-2px位移，為我們剛剛創(chuàng)建的小太陽添加一個微妙的高光（選擇副本并選擇對象>路徑>偏移路徑> - 2 px），然后選擇路徑查找器的減去功能

第13步

選擇生成的形狀并將其顏色更改為白色（#FFFFFF），將其混合模式更改為柔光，將不透明度更改為80%

第14步

添加高光后，使用4像素偏移為太陽提供外部陰影（選擇黃色形狀并選擇“對象”>“路徑”>“偏移路徑”> 4像素）

使用黑色（#000000）為生成的形狀著色，并將其不透明度降低至10%

完成后，選擇所有三個形狀（陰影，黃色和高光）并使用Control-G快捷鍵對他們進行分組

第15步

由于我們希望小太陽位于底層背景區(qū)域內(nèi)，我們將創(chuàng)建圓角矩形（Control-C）的副本將其粘貼到行星前面（Control-F）

給副本創(chuàng)建剪貼蒙版，方法是選擇它和我們在上一步中分組的對象，然后右鍵單擊>制作剪貼蒙版

第16步

向下移動到背景的底部，并創(chuàng)建一個稍大（24×24px）稍暗（#d8ca8b）的行星，使用相同的方法添加高光和陰影，然后使用更大的圓形遮住它

第17步

使用橢圓工具（L），繪制一個68×68px圓（#d0d0d8）創(chuàng)建一個“空白”的行星，我們稍后再對這八個行星的基礎(chǔ)形狀進行定制與調(diào)整

由于行星將成為主要焦點，因此要確保將行星定位到參考網(wǎng)格的中心

第18步

首先創(chuàng)建三個連續(xù)的4px偏移的大圓圈，為行星添加三個陰影，然后將其顏色設置為黑色（#000000）并將它們的不透明度降低到10%

第19步

選擇背景的副本將所有圖形進行分組，創(chuàng)建副本，然后轉(zhuǎn)到對象>復合路徑并點擊“建立”將背景副本變?yōu)榭捎玫募糍N蒙版

完成后，選擇它和陰影，然后右鍵單擊>制作剪貼蒙版，遮住多出的陰影部分

第20步

完成了默認“空白”圖標，我們創(chuàng)建七個副本并將它們定位到剩余的參考網(wǎng)格上

第21步

由于我們不希望所有圖標看起來都是一樣的，我們可以選擇第二個、第四個、第六個和第八個圖像并水平映射它們（右鍵單擊>變換>反射>水平）讓整個合集看起來更加豐富

六、創(chuàng)建水星圖標

跳轉(zhuǎn)到水星圖層同時將其余的圖層鎖定起來后，開始繪制水星圖標

第1步

由于水星的表面具有大量的隕石坑，我們可以通過創(chuàng)建一堆大小不一的圓圈表現(xiàn)這一特征，使用稍暗的灰色陰影（#aaaab2）進行著色

第2步

接下來，創(chuàng)建一個環(huán)狀的高光使這個星球更加有層次感

首先，選擇灰色環(huán)狀并創(chuàng)建它的副本（Control-C> Control-F），然后對副本應用2px偏移

選擇生成的偏移和復制的形狀，使用路徑查找器的減去功能來創(chuàng)建一個缺口，將它的顏色設置為白色（#FFFFFF）,改變它的混合模式為柔光將不透明度更改為68%

七、創(chuàng)建金星圖標

第1步

定位到第二層，然后放大第二個參考網(wǎng)格

將行星顏色從灰色變?yōu)槟帱S色（#d8ca8b）

第2步

使用鋼筆工具（P）,繪制一個略微彎曲的部分放置到行星的中心，使用#bcaf75進行著色

第3步

選擇鋼筆工具（P），繪制兩條彎曲的線條，一條朝向頂部，另一條延伸到我們之間創(chuàng)建的較大的線條下面，使用#sadba0進行著色

第4步

創(chuàng)建行星主體形狀的副本使用剪貼蒙版遮住行星多余形狀

第5步

使用橢圓工具（L）,向行星表面的中心和頂部添加幾個細長的橢圓，并使用#a59862進行著色

第6步

接下來對行星表面添加2px的環(huán)狀高光，如同對水星的操作

第7步

將左下方行星的顏色更改為#d0d0d8，將右上方的行星顏色更改為#78d2ea,并添加一個綠色部分（#80e5c8）使其類似于地球，完成

八、創(chuàng)建地球圖標

第1步

與金星圖標一樣，我們需要做的第一件事是調(diào)整“空白”行星的顏色，將它的顏色更改為#78d2ea

第2步

選擇鋼筆工具（P）繪制“地球”的地貌#80e5c8然后使用較大的圓圈的副本進行遮罩

第3步

使用前面的圖標副本，或者使用之前相同的步驟創(chuàng)建新副本，為行星賦予環(huán)狀陰影

第4步

接下來，用與背景的繪制相同步驟添加一堆云，使用白色（#FFFFFF）進行著色，并將混合模式改為柔光

第5步

給左側(cè)較小的天體著色#c1c1c6并給它建立一個2×2像素沖擊坑（#a0a0a8），使其看起來像月亮，然后將第二個顏色更改為#d8ca8b

完成后，使用Control-G快捷鍵選擇所有圖標元素并將其組合在一起

九、創(chuàng)建火星圖標

第一步

將較大圓圈的顏色更改為#ea7d7d

第2步

使用橢圓工具（L）創(chuàng)建顏色為#bf6262的形狀座位隕石坑，并將它們分散到行星的中心與右上方

第3步

添加一個18×6px的橢圓（#FFFFFF）作為冰層放在行星頂部，使用下方較大的圓圈遮住多余形狀

第4步

為行星創(chuàng)建淺色的輪廓并將白色冰層放置在星球頂層

第5步

將左側(cè)較小行星的顏色更改為#27959（給它一個小細節(jié)#d3674f）作為金星，創(chuàng)建迷你地球替換右上角的行星來完成圖標

十、創(chuàng)建木星圖標

第1步

跳轉(zhuǎn)到下一個圖層，放大我們當前的參考網(wǎng)格，并將行星的顏色從暗灰色更改為#e27959

第2步

使用鋼筆工具（P）繪制幾條#ff9b73較亮的線條和#d3674較暗的線條，使用行星副本創(chuàng)建剪切蒙版遮蓋它們，使線條不會突出到行星表面之外

第3步

使用橢圓工具（L）在行星底部和上部創(chuàng)建一些橢圓

第4步

給行星創(chuàng)建環(huán)形輪廓，使其與其余圖標的樣式保持一致

第5步

將左上角的星球顏色改為#ea7d7d，右下角的行星顏色改為#d8ca8b，并在行星表面創(chuàng)建一些小的斜線（#bcaf75）

注：不要忘記使用Control-G快捷鍵選擇所有圖標元素將其組合在一起

十一、創(chuàng)建土星圖標

第1步

跳轉(zhuǎn)到第7層，放大參考網(wǎng)格，將較大圓圈的顏色更改為#d8ca8b

第2步

使用矩形工具（M），創(chuàng)建高度不一樣的矩形，并分別賦予#eadba0、#bcaf75和#59862的顏色，使用直接選擇工具（A）選擇所有矩形一邊的錨點將它們略微向頂側(cè)移動約12px的距離調(diào)整矩形

第3步

按照之前添加行星輪廓一樣的方法給行星創(chuàng)建較淺顏色的輪廓

第4步

添加行星的行星環(huán)，創(chuàng)建一個98×26像素（#ffe9a4）和一個較小的74×18px（#ffe9a4）的橢圓，使用路徑查找器減去行星中心的形狀

將生成的形狀定位到行星的中心。確保將較大的圓圈放在它前面（右鍵單擊>排列>置于前面），然后將其旋轉(zhuǎn)24°（右鍵單擊>變換>旋轉(zhuǎn)>24）

第5步

創(chuàng)建行星環(huán)和行星的副本（Control-C）并將其粘貼到所有元素（Control-F）上，然后，使用“路徑查找器”的“相交”選項，創(chuàng)建一個兩者的交點產(chǎn)生的新形狀，移除頂部創(chuàng)建行星環(huán)繞的感覺

第6步

改變左側(cè)行星的顏色#e27959，并將右邊的行星顏色設置為#5ad6e0并添加一些細長的線條（#73ecef）

十二、創(chuàng)建天王星圖標

第1步

跳轉(zhuǎn)到天王星圖層，改變行星的顏色#5ad6e0

第2步

使用鋼筆工具（P）繪制三個垂直線段，并使用#73ecef 給較大的圓圈進行著色和遮罩

第3步

使用橢圓工具（L），創(chuàng)建兩個垂直細長形狀，使用#e1ffff給它們著色，并將它們定位在行星的右上角

第4步

正如我們對之前的圖標所做的那樣，給行星添加環(huán)狀的高光

第5步

接下來給行星創(chuàng)建垂直的行星環(huán)，首先給行星需要添加垂直線條，通過創(chuàng)建一個12 x 90 px橢圓（#e1ffff）和另一個較小的8 x 86 px（#e1ffff）橢圓，使用路徑查找器的減去選項將中間的橢圓從較大的橢圓中切出來完成

將生成的形狀定位在行星的中心，放置在較大圓圈的下方，然后向右側(cè)移動幾個像素

第6步

創(chuàng)建一個行星環(huán)和另一個較大的圓圈的副本（Control-C> Control-F），然后使用路徑尋找器的相交選項創(chuàng)建一個繞著行星圓周運動的行星環(huán)

第7步

使用#d8ca8b給右下角行星著色。完成后，選擇所有圖標元素并將其組合在一起（Control-G）

十三、創(chuàng)建海王星圖標

第1步

接下來跳轉(zhuǎn)到最后一個圖層，將較大圓圈的顏色更改為#77afe0

第2步

使用鋼筆工具（P），繪制兩個不規(guī)則形狀，使用#e1ffff給它們著色，將它們一個放置在頂部，另一個放置在底部

第3步

選擇橢圓工具（L）并創(chuàng)建一對淺色斑點（#e1ffff）和一個較暗（#5fa1d3）橢圓陰影，放置在行星的中心

第4步

給行星添加2 px厚的環(huán)狀高光以保持視覺上的一致性

第5步

通過從我們的土星圖標中選取右側(cè)較小行星的副本替換我們現(xiàn)在圖層中右上角的星球來完成圖標

并且使用Control-G快捷鍵選擇所有圖標元素并將其組合在一起

十四、創(chuàng)建漸變背景

接下來我們需要給背景創(chuàng)建平滑的漸變效果，這將使圖標更具視覺吸引力

第1步

創(chuàng)建所有圖標的背景副本（Control-C），將其粘貼在原圖層的前面（Control-F）

然后，選擇副本，轉(zhuǎn)到“對象”>“復合路徑”并單擊“建立”將所有圖形變?yōu)橐粋�整體

第2步

選擇副本，然后對其應用線性漸變，調(diào)整左側(cè)顏色為#93278f、右側(cè)顏色為#0071bc，將角度設置為90°

第3步

在仍選擇副本的情況下，打開“透明度”面板，并將“混合模式”設置為“疊加”，將“不透明度”降低到80％

完成

一旦你完成了疊加層，不要忘記選擇它和底層圖標，并將它們進行分組（Control-G），確保它們不會被錯誤地分開

這樣，我們的圖標就完成啦

（本教程由尋圖標icon.52112.com提供）

這些行星是不是看起來萌萌噠，小巧又可愛，同學們快來制作一下吧。