在5分鐘內(nèi)就能制作出Web2.0風(fēng)格的網(wǎng)頁圖標(biāo)

在5分鐘內(nèi)就能制作出Web2.0風(fēng)格的網(wǎng)頁圖標(biāo)
文章出處：cfan 作者：miniworm　
我指燈發(fā)誓：包你在5分鐘內(nèi)就能制作出Web2.0風(fēng)格的網(wǎng)頁圖標(biāo)。Web2.0網(wǎng)站現(xiàn)在正如火如荼，所以蟲蟲決定從這期開始，全面轉(zhuǎn)向Web2.0風(fēng)格的網(wǎng)頁設(shè)計(jì)。圖標(biāo)作為一個(gè)網(wǎng)站的點(diǎn)睛之筆，在網(wǎng)頁中占有十分重要的位置，所以今天我們就從網(wǎng)頁圖標(biāo)的設(shè)計(jì)說起。
如圖1所示，是不是驚訝于Web2.0網(wǎng)站圖標(biāo)之美？下面的方法，能讓你在Photoshop中輕松套用這些網(wǎng)站的圖標(biāo)風(fēng)格，并加上一些創(chuàng)意，快速構(gòu)建出自己的Web2.0圖標(biāo)出來。

1256140.jpg (104.93 KB)
2007-8-12 08:21

第1步：首先下載一個(gè)現(xiàn)有的樣式文件: web20.asl (23.12 KB) web20.asl (23.12 KB)
下載次數(shù): 15
2007-8-12 08:22。如果你使用的是Photoshop CS2簡體中文版，可將下載的樣式文件保存到Photoshop安裝目錄下的“.\Adobe Photoshop CS2\預(yù)置\樣式\”文件夾中。
第2步：啟動(dòng)Photoshop，點(diǎn)擊菜單“窗口→樣式”調(diào)出樣式面板，再單擊面板右上角的箭頭按鈕，從彈出菜單中選擇“載入樣式”命令，從對話框中選擇打開上面下載的web20.asl文件加入新的樣式。再單擊箭頭按鈕，從彈出菜單中選擇“大列表”項(xiàng)�，F(xiàn)在樣式面板將如圖2所示。

1256141.jpg (41.18 KB)
2007-8-12 08:21

第3步：如圖3所示，輸入文字“CFan”，畫一個(gè)圓角的黑色方框作為背景，右下角再添加兩個(gè)裝飾性的小圓點(diǎn)。每個(gè)元素都占獨(dú)立的一個(gè)圖層。

1256142.jpg (67.01 KB)
2007-8-12 08:21

第4步：從樣式面板中，將“mixd-label”樣式依次拖放到背景、紅色圓點(diǎn)、藍(lán)色圓點(diǎn)圖層上，這幾個(gè)圖層就被添加上一層好看的特效。再找到“mixd-font”樣式，把它拖到“CFan”文字層上�，F(xiàn)在整個(gè)圖標(biāo)的效果如圖4所示。怎么樣，好看吧！

1256143.jpg (18.77 KB)
2007-8-12 08:21

上面是一個(gè)混合型風(fēng)格的實(shí)便，接下來乘熱打鐵再制作一個(gè)Skype風(fēng)格的圖標(biāo)：新建一個(gè)圖像文件，用文字工具（快捷鍵為T）輸入“CFanBlog”，字體設(shè)置為lucida Handwrit，大小為48點(diǎn)；選中這個(gè)文字圖層，然后單擊樣式面板上的“skype”樣式，文字立即變成如圖5所示的效果，非常漂亮。

1256144.jpg (23.15 KB)
2007-8-12 08:21

其他風(fēng)格的圖標(biāo)，借鑒上面的操作步驟即可完成，這里就不一一介紹了。制作上面兩個(gè)的圖標(biāo)，我前前后后用了不到5分鐘時(shí)間，沒騙你吧，是不是夠快！