iOS 7 界面里那種細膩的毛玻璃效果如何在 Photoshop 上實現?

請各位老師指導細節,因為本人基礎不好,以前真沒學到過。


額···回答一下~~鄙人菜鳥 輕噴~

1.導入的底圖,ctrl+j 複製一層

2 -模糊-高斯模糊-參數:半徑3~5左右(適個人喜好)

3濾鏡-雜色-添加雜色:數量1.4/高斯分布/單色

4.選擇做了效果的圖,用選取工具框選一個選區,點按圖層面板下方的"添加圖層蒙版"按鈕

5把圖層 和 蒙版 中間的鎖解除

5.點擊圖層蒙版拖動就是可移動的毛玻璃效果

位置1:

位置2:


如何用 Photoshop 製作「毛玻璃」效果?呃~道理應該是一樣的


差不多這樣,我再細緻一點點。

首先是高斯模糊(60像素)

區域的色相調整:飽和度和明度+25

最後稍微調整曲線或者色階就可以了

(蘋果應該是應用的某種類似圖層疊加方式來實現的)


上視頻:https://www.youtube.com/watch?v=uquFBOONuKQ


我PS也很渣,大概想了一下,可以通過對原圖層進行高斯模糊,然後覆蓋一個半透明的前景圖層來實現近似的效果:

完成品是這樣的:

再加上那些控制項的圖標後大概差不多……吧……


據我觀察,這種效果要百分之百模仿出來不一定,但類似效果還是能達到。

題主沒提供覆蓋毛玻璃特效前的原圖,沒的參考,所以嘗試用其他圖片替代一下:

1、首先利用選框工具『快捷鍵 M』確定需要特效的區域,然後將該部分圖片複製下來新建一層為特效層,同時在通道里保存選框範圍以便特效完成後切割邊緣(在通道選項板新建一個通道,將選區反相填充『Ctrl + I』);

2、在複製的圖層中將圖片進行強化處理,使用菜單中圖像【Image】→調整【Adjust】→亮度/對比度【Bright/Contrast】『快捷鍵 Alt + A + C』,選中預覽選項以便及時觀察效果,適當提高亮度和對比度;

3、使用菜單濾鏡【Filter】『快捷鍵 Alt + T』中的高斯模糊【Gaussian Blur】,選中預覽選項以便及時觀察效果,適當增加模糊參數,完成高亮蒙版特效;

4、載入新通道中的選區,反相選擇『Ctrl + Shift + I』,清除特效層中溢出的模糊邊緣;

5、利用該選區,在原圖上切下另一半圖片,複製新圖層生成遮擋層,進行弱化處理,按照第二步程序『快捷鍵 Alt + A + C』調出對比度設置,適當降低亮度和對比度,產生遮擋效果;

6、拼合圖層保存為新命名圖片。

原圖:

效果圖:

Tips:

題主提供的高亮蒙版效果一個重要特點是,色彩飽和度和對比度很強,因此顏色看起來更鮮艷,比如蒙版下的粉色、紅色、綠色等均有光線衍射感。所以要對毛玻璃區域進行色彩強化處理,通過提高亮度和對比度強化效果,如此一來再經過高斯模糊,就可以模仿光線衍射感。


推薦閱讀:

字母W為何要這樣設計?
為什麼翻譯軟體和語言選項喜歡使用中文、日文(漢字)和英文(拉丁字母)元素作為圖標?
插奶茶吸管的正確手法是什麼?
如果本科沒有學設計,還可以成為設計師嗎?
AI如何製作類似下圖這樣的多線條文字?

TAG:AdobePhotoshop | 設計 | 用戶體驗設計 | Photoshop使用技巧 | iOS7 |