技術(shù)頻道導(dǎo)航
HTML/CSS
.NET技術(shù)
IIS技術(shù)
PHP技術(shù)
Js/JQuery
Photoshop
Fireworks
服務(wù)器技術(shù)
操作系統(tǒng)
網(wǎng)站運(yùn)營

贊助商

分類目錄

贊助商

最新文章

搜索

詳細(xì)介紹Fireworks制作無鋸齒透明水晶質(zhì)感效果圖片

作者:admin    時間:2017-12-7 17:50:37    瀏覽:

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

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

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

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

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

制作步驟

一、新建文檔,畫布顏色選擇透明

二、畫一個圓角長方形,實(shí)心顏色為:#870136,然后屬性點(diǎn)擊“符合畫布”,讓長方形布滿整個畫布。

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

橢圓疊加在長方形上

 

橢圓疊加在長方形上——效果圖

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

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

橢圓填充改為漸變-線性

2)、拖動和轉(zhuǎn)動漸變指示的兩個節(jié)點(diǎn),改為由上到下的漸變方式,

改變橢圓漸變方向

3)、通過不斷調(diào)整,同時調(diào)整下透明度,最終得到自己想要的效果,如下圖:

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

至此,大功告成!

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

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

 

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

 

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

 

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

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

 

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

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

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

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

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

您可能對以下文章也感興趣

 

x
  • 站長推薦
/* 左側(cè)顯示文章內(nèi)容目錄 */