在平面設計與 UI 圖標創作中，擁有質感與立體感的標志能瞬間提升視覺專業度。本教程將帶領你從零開始，運用 Photoshop 的形狀工具、圖層樣式與筆刷技巧，繪製一枚兼具金屬質感與空間深度的立體標志。無論是應用於 App 圖標、品牌 Logo 還是網頁裝飾元素，這套工作流都能助你高效產出高質量成果。

教程預覽

最終效果展示一枚帶有倒角邊緣、金屬拉絲紋理與真實高光陰影的立體標志，視覺上極具重量感：

核心技能點

• 矢量形狀工具精確構建基礎幾何
• 圖層樣式組合：斜面浮雕、內陰影、漸變疊加、投影
• 智能濾鏡製作可編輯的金屬拉絲紋理
• 蒙版與剪貼蒙版實現非破壞性細節控制

制作流程概覽

步驟 1：建立基礎形狀與透視

新建 1024×1024 px 畫布。使用「圓角矩形工具」或「鋼筆工具」繪製標志主體輪廓，轉為形狀圖層。若需透視效果，可對形狀執行 Ctrl+T → 右鍵選「透視」調整角點。

步驟 2：套用金屬基礎樣式

雙擊圖層開啟「圖層樣式」面板，依序啟用：

• 斜面浮雕：風格「內部斜面」，技巧「鑿刻清晰」，深度 150%，大小 8 px，柔化 3 px，光源角度 120°，高光模式「線性減淡」（不透明度 70%），陰影模式「線性加深」（不透明度 50%）
• 內陰影：距離 3 px，大小 5 px，噪點 3%
• 漸變疊加：混合模式「疊加」，不透明度 40%，角度 90°，自定義金屬漸變（深灰 #333 → 亮銀 #ccc → 深灰 #333）
• 投影：距離 5 px，展開 10%，大小 8 px

步驟 3：製作可編輯拉絲紋理

1. 新建圖層，填充 50% 灰，轉為智能對象
2. 執行 濾鏡 → 雜色 → 添加雜色（數量 25%，高斯分布，單色）
3. 執行 濾鏡 → 模糊 → 動感模糊（角度 0°，距離 40 px）
4. 將圖層混合模式改為「疊加」，不透明度 30%
5. 按住 Alt 點擊圖層間建立剪貼蒙版，使紋理僅顯示於標志形狀內

步驟 4：精修高光與邊緣細節

新建圖層組「高光細節」。使用 1-2 px 硬邊白筆刷，在頂部邊緣、倒角轉折處繪製鋒利高光；再用 5-8 px 柔邊筆刷、不透明度 15% 添加大面積柔和高光。利用蒙版柔化過渡，避免生硬筆觸。

步驟 5：添加環境投影與地面倒影

複製標志主體圖層組，合併為單圖層，填充純黑，執行 濾鏡 → 模糊 → 高斯模糊（半徑 8 px），縱向縮放 40%，不透明度 20%，置於標志底部。再複製一次，垂直翻轉，添加漸變蒙版從底部淡出，形成地面倒影。

進階技巧與避坑指南

• 像素對齊：繪製矢量形狀時開啟「對齊像素」，防止邊緣虛化
• 非破壞工作流：善用智能對象、調整圖層、蒙版，保留隨時修改彈性
• 光源一致性：全圖統一光源方向（建議左上 120°），高光、陰影、投影角度必須對應
• 紋理尺度：拉絲紋理方向應與物體長軸平行，動感模糊距離視物體大小調整

應用拓展

掌握此工作流後，你可以：

• 快速產出系列化 App 圖標套裝
• 設計金屬質感品牌 Logo 展示圖
• 結合 3D 功能（3D → 從形狀層新建 3D 擠出）生成更真實的透視圖
• 導出 SVG 或多倍圖 @2x/@3x 適配不同螢幕密度

練習建議：先模仿教程完成一枚標志，再嘗試自定義形狀（六邊形、盾形、字母造型），並嘗試不同金屬質感（拉絲鋁、鍍鉻、黃銅）。持續觀察工業設計實物的光影表現，將大幅提升你的質感刻畫能力。