創(chuàng)建新文檔
啟動Illustrator進行File> New（或使用Control-N鍵盤快捷鍵）操作來創(chuàng)建一個新文檔爽室，進行如下操作：
畫板數(shù)量：?12
間距：?32像素
專欄：?4
寬度：?64像素
身高：?64像素
單位：像素
調整“?高級”選項卡：
色彩模式：?RGB
光柵效果：屏幕（72 ppi）
設計是一門不斷學習、積累的過程淆攻，所以我強烈建議大家瀏覽一些優(yōu)秀的圖標網(wǎng)站積累素材阔墩。
設置圖層屬性
建立新文檔掉缺，我們需要建立幾個圖層，以便我們可以將圖標與參考網(wǎng)格分開戈擒。要執(zhí)行此操作眶明，只需打開“?圖層”面板，然后創(chuàng)建總共兩個圖層筐高，我們將重命名搜囱，如下所示：
第1層>參考網(wǎng)格
第2層>圖標
創(chuàng)建參考網(wǎng)格
步驟1
選擇矩形工具（M）創(chuàng)建一個64 x 64像素的正方形，使用＃F15A24進行著色柑土，然后使用“?對齊”面板的“?水平”和“?垂直對齊中心”選項定位到第一個畫板的中心蜀肘。
第2步
創(chuàng)建另一個較小的56 x 56像素正方形（#FFFFFF），作為有效繪圖區(qū)域稽屏，從而為我們提供全面的4 px保護填充扮宠。完成后，使用Control-G鍵盤快捷鍵選擇兩個形狀并將它們組合在一起狐榔。
第3步
使用我們剛剛完成的工作的副本（Control-C）添加剩余的參考網(wǎng)格坛增，使用（Control-F）粘貼到相鄰的畫板上。鎖定當前圖層薄腻，然后再繼續(xù)下一步收捣。
創(chuàng)建空白文件夾
當我們完成了參考網(wǎng)格的創(chuàng)建，我們可以繼續(xù)下一層（這將是第二層）庵楷，我們開始創(chuàng)建十二個圖標需要使用的空白文件夾罢艾。
步驟1
返回第一個畫板上，然后使用56 x 40像素矩形創(chuàng)建文件夾主體的主要形狀尽纽，使用＃FFCD50進行著色咐蚯，然后將中心對齊到繪圖區(qū)域，將其定位在距離為距離底邊4 px弄贿。
第2步
使用20 x 8 px矩形（＃FFCD50）添加較小的上部春锋，定位在上一個形狀的頂部，將其對齊到其左邊緣挎春。
第3步
使用36 x 4 px矩形創(chuàng)建后部看疙，使用＃FFA852進行著色，然后定位到主體的上部直奋，對齊到右邊緣能庆。
第4步
創(chuàng)建兩個2 px高的矩形（＃FFE164）給文件夾添加高光，調整邊緣長度脚线。完成后搁胆，不要忘記使用Control-G鍵盤快捷鍵將做好的圖像組合在一起。
第5步
給剛剛完成的文件夾創(chuàng)建副本（Control-C> Control-F）填充剩余的畫板，完成后繼續(xù)下一步渠旁。
創(chuàng)建音樂文件夾圖標
第1步
創(chuàng)建6 x 4 px的橢圓創(chuàng)建音符頭部的主要形狀開始創(chuàng)建音符攀例，使用＃E58C3C進行著色，然后定位到下面的文件夾顾腊，距離其左邊緣19 px底部11 px粤铭。
第2步
創(chuàng)建橢圓的副本（Control-C）來給我們剛剛創(chuàng)建輪廓的形狀，將創(chuàng)建的圖像粘貼（Control-F）杂靶，然后調整邊緣梆惯，將邊緣寬度設置為2像素。完成后吗垮，使用Control-G鍵盤快捷鍵選擇并將兩者組合在一起垛吗。
第3步
創(chuàng)建12 px高2 px寬的直線（＃E58C3C）添加音符柄部，我們將其定位到參考圖像中看到的橢圓的右錨點烁登，并將它們組合在一起（Control-G）繼續(xù)下一步怯屉。
第4步
給我們剛剛完成圖像創(chuàng)建副本（Control-C> Control-F）將其向右移動12 px的距離，然后在另一個的頂部向下移動2px的距離（右鍵單擊>變換>移動>水平> 12像素>垂直> -2像素）饵沧。
第5步
創(chuàng)建一個輪廓2 px的（＃E58C3C）12 x 4 px矩形（＃E58C3C）和音符柄部疊加锨络，將圖像進行分組（Control-G），如參考圖像中所示捷泞。
第6步
完成當前圖標足删，雙擊創(chuàng)建的圖形將其隔離（右鍵單擊>隔離所選組），然后使用直接選擇工具（A）選擇錨點锁右，將它們推到頂部2 px距離。完成后讶泰，按Esc鍵退出隔離模式咏瑟，然后選擇并組合（Control-G）所有符號的組成形狀，然后對整個圖標執(zhí)行相同操作痪署。
創(chuàng)建視頻文件夾圖標
完成第一個圖標后码泞，跳到下一個圖層，開始處理第二個圖標狼犯。
第1步
創(chuàng)建一個16 x 18像素的矩形余寥，使用＃E58C3C進行著色，然后定位距文件夾左邊緣21 px的距離悯森，距離文件夾的左邊緣11 px宋舷。
第2步
使用添加錨點工具（+）創(chuàng)建新錨點添加到其右邊緣的中心，將我們剛剛創(chuàng)建的形狀轉換為三角形瓢姻。
第3步
使用刪除錨點工具（ - ）刪除其右角錨點祝蝠，繼續(xù)調整形狀，創(chuàng)建一個指向右邊的三角形。
第4步
給剛剛創(chuàng)建的三角形添加2 px寬的輪廓（＃E58C3C）绎狭，將兩者組合在一起（Control-G）细溅，然后對整個圖標執(zhí)行相同操作。
創(chuàng)建照片文件夾圖標
第1步
創(chuàng)建18×14像素的矩形儡嘶，使用＃E58C3C著色喇聊，然后調整到距離底部11像素左邊緣15像素的位置。
第2步
將形狀轉換為三角形蹦狂，方法是使用“?添加錨點工具”（+）在其上邊緣的中心添加錨點誓篱，使用“?刪除錨點工具”（ - ）刪除其側邊錨點。使用描邊創(chuàng)建2 px寬的輪廓（＃E58C3C）鸥咖，使用Control-G鍵盤快捷鍵選擇并將兩者組合在一起燕鸽。
第3步
創(chuàng)建12 x 8 px矩形（＃E58C3C）參照上一步的方法添加一個較小的三角形。
第4步
完成當前圖標啼辣，創(chuàng)建4 x 4 px圓（＃E58C3C）和2 px寬輪廓（＃E58C3C）添加太陽的形狀啊研，分組（Control-G），然后將其放在較小的三角形上方鸥拧。完成后党远，不要忘記使用Control-G鍵盤快捷鍵選擇并分組。
創(chuàng)建聯(lián)系人文件夾圖標
第1步
首先創(chuàng)建18 x 6 px矩形創(chuàng)建人下半身的主要形狀富弦，使用＃E58C3C對其進行著色沟娱，然后將中心對齊到下面的文件夾，定位在距離其底邊11 px的位置腕柜。
第2步
打開“?變換”面板并在“?矩形屬性”中將其頂角的半徑設置為4 px济似，調整我們剛剛創(chuàng)建的形狀。
第3步
使用描邊為上一步創(chuàng)建的圖形添加2 px寬的輪廓（＃E58C3C）盏缤，使用Control-G鍵盤快捷鍵選擇并將兩者組合在一起砰蠢。
第4步
創(chuàng)建2 px寬輪廓（＃E58C3C）的8 x 8 px圓（＃E58C3C）作為頭部，分組（Control-G）然后將兩個中心對齊到較大的主體唉铜，將它們定位在距離身體2px的上端台舱。完成后，請確保選擇并分組（Control-G）所有圖標的組成形狀潭流，然后再轉到下一個圖標竞惋。
創(chuàng)建書簽文件夾圖標
第1步
使用矩形工具（M），創(chuàng)建一個12 x 18像素的矩形灰嫉，我們將使用＃E58C3C進行著色拆宛，然后將中心對齊到較大的文件夾，將其定位在距離其底邊11 px的位置熬甫。
第2步
通過使用添加錨點工具（+）將新錨點添加到其上邊緣的中心胰挑，然后選擇并使用移動將其推入內部6 px的距離來調整我們剛剛創(chuàng)建的形狀工具（右鍵單擊>變換>移動>垂直> -6 px）蔓罚。
第3步
通過使用描邊為上一步創(chuàng)建的形狀建立2 px寬的輪廓（＃E58C3C），選擇并分組（Control-G）兩者瞻颂，然后對整個圖標執(zhí)行相同操作豺谈，完成當前圖標。
創(chuàng)建安全文件夾圖標
第1步
創(chuàng)建10 x 12 px矩形做為鑰匙孔的下半部分贡这，使用＃E58C3C進行著色茬末，然后將中心對齊到較大的底層文件夾，放到距離其底邊11 px的位置盖矫。
第2步
通過使用直接選擇工具（A）單獨選擇其頂部錨點丽惭，然后使用方向箭頭鍵將它們推入內部4 px，調整我們剛剛創(chuàng)建的形狀辈双。
第3步
使用描邊為結果形狀創(chuàng)建2 px寬的輪廓（＃E58C3C）责掏，然后使用Control-G鍵盤快捷鍵選擇并將兩者組合在一起。
第4步
創(chuàng)建10 x 10 px的圓（＃E58C3C）并添加2 px寬輪廓（＃E58C3C）添加鑰匙孔的上部來完成圖標湃望，我們將分組（Control-G）然后定位在在參考圖像中换衬。完成后，將創(chuàng)建圖形進行分組（Control-G）证芭。
創(chuàng)建上傳文件夾圖標
第1步
首先使用4 x 6 px矩形（＃E58C3C）創(chuàng)建箭頭的下部瞳浦，給該矩形創(chuàng)建2 px寬的輪廓（＃E58C3C），對其進行分組（Control-G）废士，然后將中心對齊到底層文件夾叫潦，將它們定位在距離底邊10 px的位置。
第2步
使用18 x 12 px的矩形創(chuàng)建箭頭的主要形狀官硝，并使用＃E58C3C進行著色矗蕊，然后將中心對齊到之前的形狀并定位到參考圖像中看到的上邊緣。
第3步
將我們剛剛創(chuàng)建的矩形轉換為三角形來完成圖標氢架，方法是使用添加錨點工具（+）將新錨點添加到其上邊緣的中心拔妥，然后使用刪除錨點工具（ - ）。使用描邊為剛剛創(chuàng)建的形狀提供2 px寬的輪廓（＃E58C3C）达箍，選擇并將兩者組合在一起（Control-G），然后對整個圖標執(zhí)行相同操作铺厨。
創(chuàng)建下載文件夾圖標
步驟1
首先創(chuàng)建向上箭頭的副本（Control-C）缎玫，然后我們將其（Control-F）粘貼到當前的畫板上。
第2步
使用“?反射”工具（右鍵單擊>“變換”>“反射”>“水平”）水平翻轉箭頭來完成當前圖標解滓，使用Control-G鍵盤快捷鍵選擇并分組其所有合成形狀赃磨。
創(chuàng)建添加新文件夾圖標
步驟1
創(chuàng)建4 x 18 px矩形（＃E58C3C）創(chuàng)建加號的垂直部分，創(chuàng)建2 px寬輪廓（＃E58C3C）洼裤，選擇分組（Control-G）然后定位到中心底層文件夾邻辉。
第2步
創(chuàng)建2 px輪廓（＃E58C3C）的18 x 4 px矩形（＃E58C3C）添加水平部分，使用描邊，選擇圖形進行分組（Control-G）值骇，然后將兩者定位到中心莹菱。
創(chuàng)建刪除當前文件夾圖標
步驟1
首先創(chuàng)建加號的副本（Control-C），然后我們使用（Control-F）粘貼到當前的畫板上吱瘩。
第2步
首先取消組合當前的組成部分（右鍵單擊>取消組合）道伟，然后使用Delete鍵選擇并刪除其垂直部分來完成圖標。完成后使碾，不要忘記選擇并分組（Control-G）當前圖標形狀蜜徽，然后再轉到下一個圖標。
創(chuàng)建缺少的文件夾圖標
步驟1
首先創(chuàng)建添加新文件夾圖標的加號的副本（Control-C）票摇，我們將其粘貼（Control-F）到當前的畫板上拘鞋。
第2步
將加號轉換為x，選擇加號圖形變換角度（右鍵單擊>變換>旋轉>45o）矢门。
第3步
完成圖標盆色，將旋轉后的形狀的錨點復位到原位，然后將它們向外延伸1 px颅和。然后選擇并分組（Control-G）所有組成形狀傅事。
創(chuàng)建搜索當前文件夾圖標
步驟1
創(chuàng)建14×14像素寬4 PX的圓（＃E58C3C）作為放大鏡的上半部分，移動到距離文件夾圖層左邊18px底層12px的位置峡扩。
第2步
創(chuàng)建4 px寬4 px長的直線（＃E58C3C）繪制手柄蹭越，如參考圖像中所示。完成后教届，選擇并將兩者組合在一起（Control-G）响鹃。
完成
總結
圖標設計是UI設計中非常重要的一環(huán)，因為除了文字和圖片的排版之外案训，在扁平時代我們能夠傳遞給用戶情緒和設計感的通道就是頁面中的各種圖形和圖標了买置，如果做不好圖標，用戶就將在使用界面時失去樂趣强霎。所以忿项，我建議每位UI設計師都需要在平時做大量的圖標練習。
