一、鋒利的邊緣
細微的淺灰色漸變、邊緣2個像素的內(nèi)發(fā)光、各控制按鈕內(nèi)陰影、1像素的邊緣高光的組合是最常見到的設(shè)計方案之一，很經(jīng)典，并且讓這個播放器看上去感覺邊緣鋒利，能劃破手指一般。
[Page: ]
二、輕快
圓角黑色控制條背景調(diào)整到半透明，各控制按鈕也沒添加更多的圖層樣式，當鼠標離開畫面的時候它就消失，看上去簡單輕快的感覺。
[Page: ]
三、遙控器
玻璃般光亮的控制條背景，較粗的線條描邊，各控制按鈕添加了1像素的深色描邊。讓人聯(lián)想到耳機上的線控裝置。
[Page: ]
四、清晰明了
這是我個人最喜歡的設(shè)計風格，所有元素周圍都有深色的1像素描邊和細微的內(nèi)發(fā)光效果，高光、描邊、發(fā)光效果都控制在1像素之內(nèi)，直角設(shè)計，并且添加了雜色的材質(zhì)，讓整個控制條看上去不會是光溜溜的感覺，而是清晰明了，硬朗，有質(zhì)感的心理感受。
[Page: ]
五、寬大的背景面板
寬大的面板讓這個設(shè)計方案有一種一整塊的感覺，好像一個簡單的遙控器，玻璃質(zhì)感，高飽和度的藍色讓重要的控制按鈕醒目易見，音量調(diào)節(jié)界面的設(shè)計很有特點。
[Page: ]
六、金屬的、拉絲的質(zhì)感
細看控制條背景有一種金屬般的拉絲質(zhì)感，進度條的滑動按鈕也是金屬的質(zhì)感，底部的1像素高光讓邊緣有了凸出的感覺，播放進度條中間更深層次的1像素的凹陷給設(shè)計添加了更豐富的細節(jié)。
[Page: ]
七、濃郁的黑色
濃的化不開的黑色是這個設(shè)計給人的直觀感受，面板頂部凹陷的刻痕給面板厚重、實在的感受。三種設(shè)計方案讓我們看到了控制按鈕不同的組合方式。
[Page: ]
八、清爽的味道
半透明的背景設(shè)計給了這個播放器清爽的味道。
[Page: ]
九、粗糙的、草草一做的
我個人認為這是一個反面的案例，寬于1個像素的描邊讓設(shè)計界面看上去感覺笨拙和不夠精致，很像是隨隨便便做一下的樣子。
[Page: ]
十、風格不統(tǒng)一
高飽和度和亮度的黃色在深灰色背景下格外的搶眼，但是播放器顏色和背景色的對比度不夠讓兩者有模糊在一起的感覺，另外，看上去類似顯示器的亮度、對比度、和顏色的調(diào)節(jié)圖標的玻璃質(zhì)感和整個設(shè)計的質(zhì)感不夠統(tǒng)一。所以Dribbble上的作品也不是完美的無可挑剔，個別設(shè)計，比如我這里隨便挑到的九和十應(yīng)該說是做的不夠好的設(shè)計。
[Page: ]
十一、大小不統(tǒng)一
看來，包括這個設(shè)計在內(nèi)都是不夠好的案例，可以仔細觀察這個設(shè)計，相較于狹窄的播放器來說，進度條有些過于寬了。控制按鈕圖標的大小也不夠統(tǒng)一，除了心形圖標，播放、高清、音量圖標都稍微有點小，這些都是看上去不夠用心的地方。
[Page: ]
十二、時尚
大幅的畫面，畫面的斜紋，碩大的半透明背景的播放按鈕，簡單的播放條和控制按鈕的設(shè)計，沒有過多的圖層樣式，讓這個設(shè)計多了一些時尚的感受。
[Page: ]
十三、豐富的細節(jié)
簡單的要會做，酷的炫的更要會做，注意觀察透亮的播放按鈕的細節(jié)，考慮一個問題”高光為什么要放在這里？這樣做給了這個按鈕怎樣的質(zhì)感感受？”然后把它臨摹一遍，牢牢地記在腦子里，以后你就會做按鈕了，就這么簡單！再深入一個層次，同樣的按鈕，還能做出怎么樣的質(zhì)感來？我做了另外一個樣式放在下面，看看這兩個有什么質(zhì)感上的差別？再想想還能不能做出其他的樣式？
[Page: ]
十四、中規(guī)中矩
這個設(shè)計中規(guī)中矩，時常見到的設(shè)計方案。
[Page: ]
十五、雜色的質(zhì)感
從技術(shù)上來和第一個設(shè)計方案差別不大，但是這個播放器的背景添加一定數(shù)量的雜色，讓表面從光滑變?yōu)榇植诘馁|(zhì)感。
[Page: ]
十六、還是透明
這像是一個沒做完的設(shè)計，很多設(shè)計元素，例如播放時間等都沒有添加上，但是，如果說這只是一個開頭的話，還是很不錯的，播放器界面透明的質(zhì)感和控制按鈕的玻璃質(zhì)感非常的統(tǒng)一，很漂亮。從這個案例也能感受到透明的風格總是比純色的設(shè)計更清爽那么一點點。
[Page: ]
十七、毛玻璃
高亮的邊緣和控制按鈕柔和的白色高光給了這個設(shè)計那么一點毛玻璃的質(zhì)感，很特別。
[Page: ]
十八、更高的透明度
相較于前面幾個半透明的播放器背景來說，這個設(shè)計的透明度要更高，所以會有更加清爽、透亮的感覺。
[Page: ]
十九、一個整體
這個設(shè)計有著值得借鑒的創(chuàng)意，那就是整個播放器控制按鈕融合在一起，拉近了鼠標點擊的距離，并且有著更加渾然天成的感覺。
[Page: ]
二十、發(fā)光
鼠標懸停的效果不只是高亮，還可以讓元素的四周擴散出一點點光暈出來，好像是燈被點亮的感覺，這也是細節(jié)上值得學習的地方。
