萬盛學電腦網

您现在的位置: 萬盛學電腦網 >> 軟體知識 >  >> 影像處理 >> Photoshop 教學 >> Photoshop 入門教學

Photoshop 製作磨砂玻璃質感文字說明條教程

磨砂玻璃效果近年來在 UI、網頁、海報設計中大熱,兼具質感與可讀性。本教程詳細拆解如何用圖層樣式、高斯模糊、高光繪製與文字混合模式,打造半透明、邊緣柔光、文字疊加的磨砂玻璃資訊條。

基礎結構建立

1. 開啟背景圖(如秋葉圖),背景圖層雙擊解鎖命名「Leaves」。
2. 新建圖層「Frosted Bar」,矩形選區工具(M)拉出橫跨畫面寬度的選區,置於畫面底部。油漆桶(G)填白 #FFFFFF,取消選區(Ctrl+D)。

圖層樣式構建磨砂質感

對「Frosted Bar」圖層添加樣式:
• 混合選項 > 進階混合 > 填充不透明度:20%(關鍵!僅保留樣式效果,隱藏白色填充)。
• 描邊:白色 #FFFFFF、大小 2px、位置「外部」、不透明度 50%。

背景模糊與高光疊加

1. 複製「Leaves」圖層(Ctrl+J),Ctrl+點擊「Frosted Bar」縮圖載入選區,執行 濾鏡 > 模糊 > 高斯模糊,半徑 20px。
2. 新建圖層「Highlights」置於「Frosted Bar」上方,再次載入選區,大柔邊白筆刷(500px、硬度 0%)在條帶上下邊緣繪製高光,圖層不透明度 60%。

文字排版與最終整合

文字工具(T)輸入說明文字,字號視畫面而定。文字圖層不透明度 40%,混合模式「疊加」,使文字與磨砂底完美融合,既清晰可讀又不破壞質感。

此技法廣泛適用於 App 導航欄、網頁 Banner 說明、海報資訊條等場景,掌握核心邏輯即可靈活變體。

copyright © 萬盛學電腦網 all rights reserved