當(dāng)前位置:首頁>ps實例教程>ps網(wǎng)頁設(shè)計>網(wǎng)頁圖片>教程內(nèi)容

Photoshop教程:制作網(wǎng)頁文字效果圖片

來源:未知 作者:bbs.16xx8.com 學(xué)習(xí):220人次

我這篇教程將圍繞2個關(guān)鍵字:“漸變”,“陰影”.

  1.更有質(zhì)感的字

  Photoshop制作網(wǎng)頁文字效果圖片 

   我們先看圖片里這個LOGO,它顯得更有質(zhì)感,文字有一張向外伸展,不會死板地貼在網(wǎng)頁上.如果你仔細(xì)觀察,你會很容易發(fā)現(xiàn)文字的brightkite 都使用了色彩“漸變”.是的,文字的顏色都不是單色填充,而是“漸變”.”漸變”為什么看起來更有質(zhì)感呢?這是因為這里模擬了大自然光照中的效果,即高光 部分在文字的上方,而低光在下.同時也不要忽略了另一個細(xì)節(jié),就是文字的“陰影”,.

  那到底要怎么做呢?

  Photoshop制作網(wǎng)頁文字效果圖片 

  留意圖中的2跟3,如果你還不懂如何添加漸變.請在圖層面板中雙擊”圖層名”右邊的空白處,或是點擊下圖中的第2個按鈕(在圖層面板下方)打開樣式面板.

  Photoshop制作網(wǎng)頁文字效果圖片 

  “漸變疊加”,然后按下圖設(shè)置.漸變的顏色選擇2個同色系但是有”深淺對比”的顏色.例如例子中,一個淺綠跟深綠.這樣才能模擬光照效果.

  Photoshop制作網(wǎng)頁文字效果圖片 

  好了,剩下陰影.還是一樣在樣式面板左側(cè)點”投影”,然后按下圖設(shè)置:

  Photoshop制作網(wǎng)頁文字效果圖片 

  再看其他使用了這個方法的網(wǎng)站設(shè)計:

  Photoshop制作網(wǎng)頁文字效果圖片 

  2.凹陷的字

  照例我們看一個例子:

  Photoshop制作網(wǎng)頁文字效果圖片 

  ALEX BUGA網(wǎng)站的LOGO,我覺得是凹陷字體的典范.而這樣的字體效果很明顯有一種凹陷在背景里的感覺,甚至文字像是刻在石頭上一般. 如果你已經(jīng)完成了第一個文字效果,那么接下來的內(nèi)容對你是相當(dāng)簡單的.

  Photoshop制作網(wǎng)頁文字效果圖片 

  1.首先輸入文字,顏色填充為較背景更深的顏色,例子中為#4e3400

  2.添加”內(nèi)陰影”樣式,設(shè)置如下圖:

  Photoshop制作網(wǎng)頁文字效果圖片 

  3.添加”斜面和浮雕”樣式,設(shè)置如下:

  Photoshop制作網(wǎng)頁文字效果圖片 

  作品完成. 該效果需注意:

  字體顏色選擇與背景色要搭配

  第2部的內(nèi)陰影設(shè)置時,”大小”與”距離”可以根據(jù)你的文字大小來調(diào)整

  添加內(nèi)斜面只為增強白色的光照效果,可以選擇不加

  接下來看一些使用”凹陷”效果的網(wǎng)站設(shè)計:

  Photoshop制作網(wǎng)頁文字效果圖片 Photoshop制作網(wǎng)頁文字效果圖片

  額外贈送

  在這里推薦一個下載英文字體很好的網(wǎng)站,而且是全免費的:www.sucaipan.net.

  同時也在最后說明一下,雖然字體的效果可以有很多種,但是也要注意使用的場合,不是什么地方,什么類型的網(wǎng)站都適合我上面介紹的方法.有時候就是不加修飾的字體,也可以做出很好的效果.

學(xué)習(xí) · 提示

  • 一定要打開PS,跟著教程做一遍,做完的圖到這交作業(yè):提交作業(yè)
  • 建議練習(xí)時,大家自己找素材,盡量不要用教程提供的素材。
  • 教程有看不懂的地方,可以到論壇發(fā)帖提問:新手求助
  • 加官方微信,隨時隨地,想學(xué)就能學(xué):ps_bbs,或掃右側(cè)二維碼!
  • 關(guān)注我們學(xué)更多,每天都有新教程:新浪微博 抖音視頻 微信小程序
- 發(fā)評論 | 交作業(yè) -
最新評論
暫無評論,交個作業(yè)支持一下吧~

關(guān)注大神微博加入>>

網(wǎng)友求助,請回答!