一、鎖屏界面
可以觀察到，iphone的鎖屏界面在時(shí)間和解鎖部分有著透明強(qiáng)高光風(fēng)格的背景，高光部分有非常明顯的界限，邊緣部分1像素的高光也是非常醒目的，整體感覺整個(gè)表面非常光滑，如同玻璃般的質(zhì)感。透明的使用讓整個(gè)界面不被硬生生的劃分為三個(gè)部分，而是讓桌面圖片從后面透過來，擴(kuò)大了視線的范圍，讓整個(gè)界面感覺更加透氣�；瑒�(dòng)按鈕使用了灰色的漸變，但是依然延續(xù)了這種風(fēng)格，你可以清晰的看到高光和陰影部分的分界線。在整體的顏色上選擇了不同層次的灰色，便于搭配各種桌面圖片。
這里我們主要來了解一下透明的高光背景所使用的技術(shù)。通過查看源文件我們可以發(fā)現(xiàn)，其中最主要的部分實(shí)際上是技巧性的應(yīng)用了圖層樣式中的漸變疊加。上半部分的高光應(yīng)用了從頂部到底部由淺至深的灰色漸變，而下半部分只是單純的黑色。下面圖片顯示了具體的顏色值，當(dāng)然，這并不是唯一的數(shù)值，只是讓大家做一個(gè)參考。完成漸變疊加后，再將漸變疊加的不透明度降低到55%，然后在圖層面板中將圖層的填充不透明度降低至0%就可以了。
這是我按照上面的方法做出來的效果，你也可以自己動(dòng)手試一試。
相較于iphone的界面，安卓的看上去就要柔和一些，那是因?yàn)樵乇砻鏇]有高光和陰影的顯著差別，但是注意觀察安卓各元素的陰影部分，卻要比iphone強(qiáng)烈許多。如果說iOS的設(shè)計(jì)師偏好于運(yùn)用高光的話，安卓的設(shè)計(jì)師可能更鐘情于陰影的巧妙運(yùn)用�？梢钥吹皆跁r(shí)間文字部分、解鎖按鈕以及背景部分、音量按鈕以及背景部分都使用了非常顯著的陰影效果。另外，不像iOS整體偏灰色的設(shè)計(jì)，安卓的界面在灰色中使用了飽和度和亮度較高的偏黃色的綠色，讓使用這個(gè)色彩的元素非常醒目。
這里我們來重點(diǎn)學(xué)習(xí)安卓系統(tǒng)解鎖按鍵的創(chuàng)建方法，音量按鍵創(chuàng)建方法完全相同只是顏色不同而已。這些效果全都是運(yùn)用圖層樣式來實(shí)現(xiàn)的。先來看灰色的背景部分，其中的陰影是用外發(fā)光樣式來實(shí)現(xiàn)的，元素表面是一個(gè)深灰色至深灰色的微弱的漸變，斜面和浮雕樣式勾勒出頂部的高光和底部的陰影，最后將圖層不透明度降低到85%。綠色的解鎖按鍵使用內(nèi)陰影做高光，由上到下從黑至白，混合模式為正片疊底的漸變完成的內(nèi)陰影，也就是凹陷效果。具體的參數(shù)設(shè)置你可以通過查看PSD文件了解。
出處：藍(lán)色理想
責(zé)任編輯：bluehearts
上一頁 蘋果iOS和谷歌安卓界面風(fēng)格對比 [1] 下一頁 蘋果iOS和谷歌安卓界面風(fēng)格對比 [3]
|
第 1 頁 
第 2 頁 蘋果iOS和谷歌安卓界面風(fēng)格對比 [2]
