卡卡網(wǎng)

透明水晶質(zhì)感圖片在網(wǎng)頁(yè)圖片設(shè)計(jì)中非常常見(jiàn)，尤其是按鈕的設(shè)計(jì)上。網(wǎng)上有許多素材，但是現(xiàn)成的有時(shí)并不能滿足自己的需求，例如圖片尺寸及顏色的設(shè)計(jì)方面。本文將詳細(xì)介紹怎樣使用Fireworks制作透明水晶質(zhì)感的圖片，其實(shí)做起來(lái)一點(diǎn)都不復(fù)雜。

漂亮的透明水晶質(zhì)感按鈕

透明水晶質(zhì)感按鈕

本教程制作的無(wú)鋸齒透明水晶質(zhì)感圖片

無(wú)鋸齒透明水晶質(zhì)感效果圖

制作步驟

一、新建文檔，畫(huà)布顏色選擇透明

二、畫(huà)一個(gè)圓角長(zhǎng)方形，實(shí)心顏色為：#870136，然后屬性點(diǎn)擊“符合畫(huà)布”，讓長(zhǎng)方形布滿整個(gè)畫(huà)布。

三，畫(huà)一個(gè)橢圓，注意邊寬為0，實(shí)心顏色為：#932C57，得到如下圖所示的效果。

橢圓疊加在長(zhǎng)方形上

橢圓疊加在長(zhǎng)方形上——效果圖

四、我們現(xiàn)在要把橢圓上半部分的顏色弄透明，只保留下半部分，這樣就是我們要達(dá)到的質(zhì)感效果了。怎么處理呢？其實(shí)是巧妙的利用了漸變填充來(lái)完成的。

1）、橢圓填充改為漸變-線性，起端顏色設(shè)為長(zhǎng)方形的顏色：#870136，末端顏色設(shè)為橢圓的顏色：#932C57，如下圖所示：

橢圓填充改為漸變-線性

2）、拖動(dòng)和轉(zhuǎn)動(dòng)漸變指示的兩個(gè)節(jié)點(diǎn)，改為由上到下的漸變方式，

改變橢圓漸變方向

3）、通過(guò)不斷調(diào)整，同時(shí)調(diào)整下透明度，最終得到自己想要的效果，如下圖：

無(wú)鋸齒透明水晶質(zhì)感效果圖

至此，大功告成！

設(shè)計(jì)各種質(zhì)感線條效果圖

在此基礎(chǔ)上，配合鋼筆工具，你還可以設(shè)計(jì)出各種質(zhì)感線條的效果圖片來(lái)，參考文章《介紹Fireworks用鋼筆工具畫(huà)出有質(zhì)感的直線或曲線條》，效果圖如下面這些：

質(zhì)感線條的效果圖（1）

質(zhì)感線條的效果圖（2）

質(zhì)感線條的效果圖（3）

質(zhì)感線條的效果圖（4）

質(zhì)感線條的效果圖（5）

質(zhì)感線條的效果圖（6）

質(zhì)感線條的效果圖（7）

您可能對(duì)以下文章也感興趣

• 介紹Fireworks用鋼筆工具畫(huà)出有質(zhì)感的直線或曲線條
• 兩種方法使Fireworks畫(huà)的線條圖形變平滑無(wú)鋸齒
• 用Fireworks制作立體按鈕
• Fireworks制作gif動(dòng)畫(huà)圖片 非常簡(jiǎn)單
• Fireworks設(shè)計(jì)星形多邊爆炸圖素材

標(biāo)簽: 技巧教程  無(wú)鋸齒  透明效果  質(zhì)感效果