DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁製作工具 >> Fireworks入門知識 >> Fireworks基礎 >> 用Fireworks做出精美的文字特效 (1)
用Fireworks做出精美的文字特效 (1)
編輯:Fireworks基礎     
本文總結了不少用Fireworks繪制各種文字特效的常用表現技巧和制作方法,希望對大家有所幫助。

  一、幾種常見文字特效

  1. 簡單、常用

兩層:一是單色字體(一般是中粗)
  第二層是文字打散(Ctrl+Shift+P),描邊(2-5px),投影(距離和柔化都在5以內)

  2. 漸變


本圖摘自騰訊網,不是偶做的

  暫時只說簡單的兩層式:在有色的背景中輸入文字,打散。然後復制一層放在後面。
  把第一層進行這三步操作:拆分組合(Ctrl+Shift+B)、聯合路徑(選中所有文字“修改”-“組合路徑”-“聯合”)、然後填充漸變色(常用比較鮮艷的顏色,注意漸變的兩個色最好一個深一個淺)
  後面那層就描邊,根據其中的顏色來描。一般是描白色和黑色,3-5個像素寬的邊。

  3. 一種常見(特別是在像素畫中)的凹凸效果

  共四層:主層是主體文字(用較粗的字體),給一個單一的色
  主層文字上面復制兩層,一層是暗層,內投影-比主文字色暗一些的顏色,2像素邊距,柔化為0,角度138左右;暗層的下面有個亮層(通常亮在暗下面,當光線不足),內投影-比主文字色亮一些的顏色,2像素邊距,柔化為0,角度為315左右。
  最後面給一層,為主體文字描個深色的邊。OK了~4. 文字特效的另一手段:突出顯示


本圖摘自騰訊網,不是偶做的

  突出顯示一些特殊的文字:比如“不錯的綠色飲料哦!”其中可以把“綠色”突出來顯示。把“綠色”文字放大一點用綠顏色顯示。
突出基本有這幾種(可以合用):

  ·字體加粗,加大
  ·文字用突出的、鮮艷的顏色(漸變色也可),以及描邊(其實描邊通常不需要鮮艷,用白色,或是淡色就不錯,當然,也可以用與文字色相襯的艷色。
  ·文字加高,傾斜,扭曲等變化,也可以相應使用。
  ·動態效果的話,就閃爍或動感效果
  ·根據文字內容,加上相應的元素。如前面提到的“綠色”,除了用綠色文字等效果,還可以在文字的上角(左右都可)添上一片 ,或是把文字用帶水珠的綠色圖片來填充。其他自己發揮,總之創意無限。
  ·改用其他字體,或是改變文字筆劃。與上面接合,可以直接把“綠色”中的“纟”文字打散,用“部分選定工具”改變筆劃路徑,變成一片葉子。或是把“色”的下勾向右拉長,在勾中放一些葉子、草、水珠之類的元素。

  這是westoy同學做的png源文件:

  5. 水晶

  水晶的文字,就主要是利用遮罩中的兩種蒙版:路徑輪廓和灰度外觀。
  另外的幾種不錯的水晶效果表現要點:
  一是高亮,我做的效果圖中“招牌動作”中的“招牌”二字,上面就有這樣的高亮。當然,我做的比較馬虎。
  二是剔透的漸變:

  就是這樣的效果。通常配上白色描邊,以及無柔化的白色/淡色半透明發化效果更佳。二、更眩的效果

  我非美專生,也沒有主動去研究過這些,但在經典裡就有不錯的帖,不用我班門弄斧了。

  其中特別是第一個和第二個,還有更多的東東值得研究,可以打造更多酷眩效果哦。 以下是我隨便做的幾個文字效果的圖片。

三、模仿別人的效果

  1. 找其他站的一些不錯的效果,把圖保存下來(保存不了的截圖也好)。

  2. 打開FW,把圖文放大數倍,看清文字到底有些什麼效果。特別重要的是,把文字實現的效果層次搞清楚。
基本的一些層次由內到外是:字內光亮->字內陰影->文字主體->描邊/發光->陰影(通常描邊和陰影可以放在一個層裡實現)->其他背景

  3. 分清層次後就可以自己來做了。要完全仿照的話,要具備幾個條件:

  ·對照圖內是中文文字
  ·圖內文字是你認識的字體(不認識的就去問吧),並且系統裝有這種字體(估計你認識的字體你系統應該就會有)
  

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved