1、水晶按鈕：下面我們放大來看這個水晶按鈕由哪些結構組成。按鈕構成圖：按鈕橫截面光線圖：1、任何光滑的東西都會產生鏡面反射，水晶按鈕當然不會例外。2、要讓按鈕浮出畫布，陰影是少不了的。有了正確的陰影，人們感覺才會更逼真。3、這個水晶按鈕是紫色的，但不是平板、呆板的平紫色，而是一個從紫紅到粉紅的漸變色，為什么會這樣？因為它是透明的，光線從上到下投射下來的時候，由于下部的角度問題，產生的反射越來越多（這部分可參考物理學知識），所以下面的顏色會較淺。（注：我們假設光源在正上方）4、按鈕是扁圓的，到了邊緣，這個曲度發(fā)生較大的變化（大家可以想象一下這里的橫截面），因此邊緣會變暗，于是會有這一點點的陰影。5、

2、原理如4，但這里的陰影更大，為什么？大家想想一個玻璃杯在單光源照射下的情景：如果不是有反射的話，整個杯子就會在背景中消失，對不對？因為它是透明的，光線在上面不留痕跡（除了反光），因此這里為什么暗，是因為它是透明的，把后面的陰影也透射出來了。這里要說明一點，如果要把現實中的水晶按鈕的光線反射等等完全搬過來是行不通的，不是不能做到，而是對于這樣的一個小按鈕成本太大了。我們只需要稍稍模擬得更接近就行了，因此又有一個題外的原則，對效果，要適當取舍。思考：如何把這些部分畫出來，并且組合起來？ 部分1：高光讓我們產生這個物體很光滑的感覺。但要實現很容易，我們畫一個這種形狀的白色塊，然后以一定的透明度疊加在

3、下方的按鈕實體上面就行，這個問題解決了，我們需要的是一個新圖層，一個以白色填充的圓角長矩形。具體步驟先不急，我們先要知道我們要些什么。部分5：對于下面的大圓角矩形，上部以及邊緣會發(fā)暗。如何才能讓這個大圓角矩形的上部以及邊緣有點暗呢？這里列舉兩種做法。一種是用羽化的選區(qū)把按鈕矩形的邊緣變暗。變暗有什么好辦法？色相/飽和度工具，此法用在這里有點小題大作，此外這種方法是一次性的，不能再調整的，也就是說當你確認修改后，下次要改回來可就不那么容易了。那么我們選擇第二種做法，圖層樣式。記得圖層樣式里面有一個“內陰影”嗎？對，內陰影 內陰影除了能干內陰影這件事之外，也能讓邊緣變暗我們只要讓陰影在邊緣停留就好

4、了嘛。看圖：看看第三個就是，參數怎么調整？這里先不說，大家可以根據上面的那個圖自己調整一下方向、距離與大小，試試看。這里還有一個值得注意的是，為什么用內陰影更好，是因為大家發(fā)現沒有，雖然說第三個內陰影效果是邊緣變暗，但這個暗又是上下不同的，上面的陰影寬些，下面的陰影窄些，這正是第5部分需要的效果。內陰影是有方向與距離控制的，因此我們可以把那個陰影調節(jié)得上寬下窄。這就是我們選擇內陰影樣式的理由。有了這種特殊的陰影，按鈕會產生一定的立體感了。部分4：這里還有一個較窄的、細細的邊緣變暗。因為我們剛剛已經采用了內陰影來制作按鈕的立體感，難道再增加一個內陰影效果嗎？PS里面不允許說一個圖層加幾個同樣類型

5、的樣式。那我們要換一下口味了。這個較黑較細的邊緣，應該對整個按鈕都是均勻的。整個按鈕具有變暗的模糊邊緣用色相/飽和度工具當然可行，但不能事后調整還是用樣式吧，什么樣式呢，內發(fā)光。內發(fā)光不僅能發(fā)“亮”光，也能發(fā)“暗”光?？磮D：第三個色快產生了邊緣變暗的效果，如何做到的呢？看看具體的參數設置：對，混合模式發(fā)生了變化，原本系統默認的是“濾色”，現在我們把它改成“正?！?，當然用“正片疊底”也是可以，但用正常我們可調整的就更多。我們選取一種比原來的桔色暗些的顏色作為“暗”光，因此最后出來了這種效果。部分2，3：部分2就是簡單的陰影樣式了，沒什么好說的；部分3就是一個漸變，樣式里也有漸變覆蓋，輕松做到。這

6、里都略過。好，至此，是我們應該組合這些效果的時候了?？磮D：大家注意到我原本的色塊是綠色的沒有？因為有了漸變疊加，原來用什么顏色都無所謂。我這里一開始就是亂選了一種顏色填充圓角矩形，反正到后面都能調整，方便得很反思一下剛剛得步驟與結構，究竟是那些步驟讓我們產生了按鈕得立體感？投影樣式能讓物體浮出畫布；內陰影樣式能讓物體產生玻璃般的透明立體感；內發(fā)光能讓玻璃的邊緣更加真實（我們感覺到這個按鈕的橫界面下邊緣必定是圓滑的）；漸變疊加樣式能讓按鈕的反光更為真實，也讓整個按鈕的色彩層次感更豐富，不死板；思考了這些以后，如果要做別的按鈕可以嗎？我要怎么產生立體感呢？金屬的和玻璃又有什么相同和不同之處呢？還有

7、其他的樣式，比如斜面與浮雕、光澤能做些什么嗎？這些在我接下來的后面說金屬立體感的時候就會說到，但在此之前，大家都可以先自己思考一下。好了，我們先把這個按鈕完善一下吧。基本的圖層樣式已經做好，我們以后再要做這種按鈕可就方便了?？磮D：看，各種形狀都行，只要我們復制、粘貼圖層樣式。然后大家注意到樣式產生了立體感與按鈕的折射與陰影，但高光還是要自己做的。上圖中圓形按鈕與長圓角按鈕就加了高光，高光怎么做，已經不用我再補充了吧。但有個東西需要提醒，就是高光也有層次感，注意看下圖：左邊是平色不透明度為100的白色快，當然不像高光了。右邊的就不同，白色塊是透明的，而且有上下漸變的變化。這里用的辦法是為高光加一

8、個蒙版，然后在蒙版里使用黑白漸變，使得白色塊的不透明度降低并且產生上下漸變的層次變化，更為逼真。下面我們再把這個按鈕變得更完美些吧。既然是水晶按鈕，那就是透明的。如果我們在底下墊一層網格，那就應該會透出一些來?？磮D，我們在底下加上網格。這里有兩個同樣的按鈕，都不透明。下面我們要把下面那個水晶按鈕變得透明。首先我們把按鈕的混合模式改成“柔光”，柔光能讓我們的按鈕以一種透明模式覆蓋在圖案上，但又能保留陰影與立體感。但要讓它透明，還要花點小功夫：首先要想它為什么原來不透明？是漸變疊加那里，它是一個不透明的漸變色，于是讓按鈕不透明了。打開樣式的漸變疊加對話框，看看參數有什么可變化的：對，有個不透明性。

9、原來是100，我們下降到56看看效果如何？果然，整個按鈕透明了。這個時候有人會問，為什么不把那個按鈕層全層下降不透明度呢？我們來看看比較好了。整個圖層的不透明度下降后，的確是透明了，但邊緣也模糊了，讓人覺得立體感就沒有了。原因就在于那些產生立體感的樣式：內陰影、內發(fā)光、陰影也一并透明了，因此效果就下降了。我們看第二行第一個按鈕，是有顏色的水晶按鈕，立體感仍在。把漸變樣式變成完全透明又如何呢？這里還要記住，那個內陰影是有顏色的，我們把漸變色去掉之后，也要把內陰影變成灰色（灰色就是中性色，不帶色相的），這就產生了無色彩的透明玻璃按鈕，第二行第二個。追求完美的人可能會說，玻璃會有折射的吧，下面的網格不應該是平的才對。這是對的，但考慮到我