PhotoShop設(shè)計(jì)制作Web2.0質(zhì)感文字圖標(biāo)
今天我將帶大家學(xué)習(xí)這篇PS教程,教程主要講述了如何使用Photoshop去制作一個(gè)簡(jiǎn)約美觀的文件圖標(biāo)。
在開始之前看參考一下最終效果,如圖所示
1、首先我們新建一個(gè)圖片文件,尺寸大小可以自由決定,在這里我使用512*512px的尺寸。接著新建一個(gè)圖層,
使用“圓角矩形工具”,半徑大約為20像素左右,畫出一個(gè)正方形,如圖所示。
2、選擇“圖層—圖層樣式—漸變疊加”,雙擊漸變調(diào)色板,設(shè)置漸變顏色。接著設(shè)置(樣式:徑向、角度90、
縮放:150),然后在圖片中向上拖動(dòng)漸變的中心,使它靠近頂部,如圖所示。
3、設(shè)置“內(nèi)發(fā)光”圖層樣式,如圖所示。在這里你可以嘗試使用不同的等高線,這樣會(huì)得到一個(gè)明顯的內(nèi)發(fā)光薄膜,
如圖所示
4、設(shè)置“描邊”圖層樣式,大?。?、混合模式:疊加、不透明度:43%、顏色:黑色、填充類型:顏色,如圖所示。
5、下面制作絲帶。新建一個(gè)圖層,使用“矩形工具”畫出一個(gè)暗紅色的長(zhǎng)方形,選擇“編輯—變換—旋轉(zhuǎn)”
調(diào)整其角度,并把它置于正方形的右上角,如圖所示。調(diào)整好角度和位置后不要按下Enter或雙擊確定。
(當(dāng)使用Ctrl+T調(diào)整角度時(shí),按著Shift鍵,可以獲得完美的45度旋轉(zhuǎn),)
6、按下Ctrl+'顯示網(wǎng)格,然后選擇“編輯—變換—斜切”參考下圖所示調(diào)整其形狀,如圖所示。
7、調(diào)整好以后,我們可以使用方向鍵微調(diào)一下得到最佳位置
8、接下來(lái),我們制作絲帶的背面。在正方形圖層的下面創(chuàng)建新圖層,然后參照下圖所示,使用鋼筆工具畫出路徑,
并填充黑色即可
9、返回絲帶正面的圖層,為它添加漸變疊加、投影兩個(gè)圖層樣式,如圖所示
10、如果你發(fā)現(xiàn)絲帶的投影超出了正方形的邊界,那么你就必須把超出的部分處理掉
11、對(duì)細(xì)節(jié)進(jìn)行處理后,我們將得到下圖所示的效果
12、下面我們來(lái)為這個(gè)圖標(biāo)制作一個(gè)名稱標(biāo)簽。按著Ctrl鍵單擊圖層面板中“正方形圖層”的“縮略圖”,
載入其選區(qū)。接著選擇“矩形選框工具”在屬性欄設(shè)置“從選區(qū)減去”,然后刪除選區(qū)的大半部分,如圖所示
得到如下選區(qū)。
13、現(xiàn)在創(chuàng)建一個(gè)新圖層位于正方形圖層上面,然后使用漸變工具在選區(qū)中填充一個(gè)線性漸變效果,如圖所示
14、參考下圖所示,為圖層添加內(nèi)發(fā)光圖層樣式
效果如圖所示
15、最后,我們?cè)趫D標(biāo)上添加文字就大功告成了
標(biāo)簽(TAG) UI設(shè)計(jì)教程