萬盛學電腦網

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

PS 手把手繪製寫實音樂播放器圖標:從金屬質感到拉絲細節

想練習圖標寫實質感?這個音樂播放器圖標案例涵蓋圓角矩形結構、金屬漸變、斜面浮雕、拉絲紋理、剪貼蒙版等核心技法,適合進階學習者精進材質表現力。

成品效果

畫布與背景

  • 新建 600 × 600 px,背景白到灰徑向漸變,營造柔和環境光。

機身主體(圓角矩形)

  1. 圓角矩形工具畫 300 × 300 px 正圓,圓角 30 px。
  2. 直接選擇工具(A)選中左右兩側錨點,自由變換(Ctrl+T)寬度輸入 80 px,上下錨點高度同樣輸入 80 px,形成標準圓角矩形。
  3. 置中、微調大小至視覺平衡。
  4. 圖層樣式:投影(距離 3、大小 8)、漸變疊加(深灰→淺灰→深灰,角度 90°)、內陰影(距離 2、大小 5)、斜面浮雕(深度 150%、大小 8 px、軟化 3 px),建立立體金屬框感。

光碟區(同心圓結構)

  1. 外圈:橢圓工具畫圓,漸變疊加(金屬環漸變:深灰→銀→深灰),加斜面浮雕(內部凹陷感)與投影。
  2. 中圈:較小圓,漸變疊加(較亮金屬),投影、內陰影、斜面浮雕疊加,形成凸起邊緣。
  3. 內圈:最小圓,同樣加漸變、投影、內陰影、斜面浮雕,模擬光碟反射面。

關鍵技法:拉絲紋理製作

  1. 新建圖層,橢圓選區填白 → 濾鏡 → 雜色 → 添加雜色(量 40%、高斯、單色)。
  2. 濾鏡 → 模糊 → 徑向模糊(量 100%、放射狀、最佳)。
  3. 建立剪貼蒙版(Alt+點擊圖層間),模式改「疊加」,不透明度 15~20%。
  4. 若蒙版顯示異常,開啟下層圖層樣式 → 混合選項 → 取消勾選「將內部效果混合成組」。

紅色播放鍵與指示燈

  • 紅色圓形:填紅 #CC0000,投影、內陰影、斜面浮雕(凸起感)。剪貼拉絲圖層進入,降低不透明度。
  • 淡紅圓形:同法加拉絲,形成雙層深度。
  • 白色小圓:投影 + 內陰影,做指示燈凹陷效果。

支架細節

白色小圓放置底部中心,漸變疊加(淺灰→白)+ 斜面浮雕(凸起),模擬金屬支架反光。

整理與輸出

  • 圖層命名分組:背景、機身、光碟組、按鈕組、支架。
  • 另存 PSD 留檔,匯出 1024×1024、512×512、120×120 px 多尺寸 PNG 供 App Store / 介面使用。
copyright © 萬盛學電腦網 all rights reserved