繪圖教程

]

Illustrator繪制精致iTunes矢量圖標(biāo)

本帖最后由 cleandj270 于 2012-4-15 12:47 編輯

　圖標(biāo)是UI(用戶界面)設(shè)計(jì)領(lǐng)域的一個(gè)重要組成部分，本文以繪制iTunes圖標(biāo)為例，介紹如何使用Illustrator CS2中文版打造出精致的軟件圖標(biāo)。其它版本的Illustrator在操作步驟上可能會(huì)略有差異

具體繪制步驟如下:
　　1. 繪制基本外形　　首先需要使用Illustrtor的矢量繪圖工具(如橢圓工具、鋼筆工具等)繪制出如圖1所示的基本外形，或者找一幅現(xiàn)成的圖標(biāo)圖片置入到Illustrator中，描摹出輪廓。圖1

2. 繪制音符
　　制作一個(gè)平滑的橢圓。如圖2所示，先繪制出3個(gè)基本外形，然后分別填充以由亮到暗的不同顏色，選擇菜單命令“對(duì)象&gt;混合&gt;混合選項(xiàng)”，將“間距”設(shè)置為“指定的步數(shù)”，并將步數(shù)設(shè)置為128。選中3個(gè)對(duì)象后，按快捷鍵Ctrl Alt B或者執(zhí)行菜單命令“對(duì)象&gt;混合&gt;建立”。圖2 反射光

　　繪制一個(gè)橢圓形，填充以黑白漸變色，確認(rèn)黑色為全黑(C,M,Y,K=100)，將它拖動(dòng)到圖2所示橢圓的上方，并在“透明度”調(diào)板中將混合模式設(shè)置為“濾色”(假如使用的是英文版，則選擇混合模式為screen，有些朋友在讀網(wǎng)上的教程文章時(shí)“濾色”和Screen對(duì)不上號(hào)，這里順便幫您解決一下這個(gè)問(wèn)題)，如圖3所示。
圖3

　高光
　　繪制一個(gè)較長(zhǎng)的垂直矩形，以及一個(gè)拉長(zhǎng)的橢圓，填充為深淺不同的顏色，并使用上面用過(guò)的方法混合兩個(gè)圖形，選中混合后的圖形，移動(dòng)到音符的左邊，再按住Alt鍵的同時(shí)將其復(fù)制到右邊，如圖4所示。
圖4

繪制一條路徑，并填充以三色的漸變色，移動(dòng)到如圖5所示的位置。
圖5

使用相同的混合方法繪制其它高光部分，同樣要將顏色模式設(shè)置為“濾色”，如圖6所示。

圖6

3. 繪制CD
　使用工具箱中的“漸變工具”填充CD圖形，設(shè)置為白色到灰色的漸變色，如圖7所示。
圖7

　　彩虹漸變
　　繪制如圖8左圖所示的多個(gè)線條，并設(shè)置不同的描邊顏色。確認(rèn)第1條和最后1條為白色，因?yàn)檫@兩條將要設(shè)置為透明。使用“混合工具”從左到右依次單擊每個(gè)線條的邊緣，制作出彩虹漸變，效果如圖8右圖所示。

圖8

　　蒙版
　　使用CD圖形蒙版上面制作出的彩虹漸變圖形，方法是選中圖形后，按快捷鍵Ctrl 7或執(zhí)行菜單命令“對(duì)象&gt;剪切蒙版&gt;建立”。在“透明度”調(diào)板中將混合模式改為“正片疊底(Multiply)”，并將“不透明度”設(shè)置為26%，如圖9所示。
圖9

　重復(fù)上面的步驟，制作另一個(gè)彩虹漸變，如圖10所示。
圖10

4. 繪制音符的倒影
　　繪制3個(gè)橢圓形，填充以不同的顏色，如圖11左圖所示，確認(rèn)最外面的路徑為白色，這將導(dǎo)致一個(gè)發(fā)光效果。選擇所有3條路徑，然后執(zhí)行菜單命令“對(duì)象&gt;混合&gt;建立”，或者按快捷鍵Ctl Alt B。

圖11

　將混合得到的圖形拖動(dòng)到左邊音符的下方，將在“透明度”調(diào)板中將混合模式設(shè)置為“正片疊底”，“不透明度”設(shè)置為37%，如圖12所示。按住Alt鍵的同時(shí)拖動(dòng)該圖形，將其復(fù)制到右側(cè)音符的下方。這里可能需要修改音符倒影的排列順序，方法是在圖形上單擊右鍵，從彈出的菜單中選擇“排列&gt;后移一層”。
圖12

5. 繪制投影效果
　　最后一步是為CD圖形應(yīng)用投影效果。選中CD路徑，然后執(zhí)行菜單命令“效果&gt;風(fēng)格化&gt;投影”，并在“投影”對(duì)話框應(yīng)用如圖13所示的設(shè)置。
圖13

最終效果這就是最終的iTune圖標(biāo)

訂閱 TOP

返回列表

用微信登錄百圖匯

繪圖教程

Illustrator繪制精致iTunes矢量圖標(biāo)