挑戰只用一個圖層完成一枚完整的相機圖標？這不僅是技巧展示，更是對矢量路徑結構、布爾運算、圖層樣式疊加邏輯的綜合考驗。掌握這招，你的圖標源文件將乾淨到極致，團隊協作、資產管理效率大幅提升。

核心思路：結構拆解 → 路徑合成 → 樣式疊加

1. 結構拆解（心中有底稿）

相機圖標拆解為：機身主體（圓角矩形）、鏡頭筒（同心圓）、閃光燈（小圓）、快門鈕（頂部矩形）、取景器窗（矩形/圓角矩形）。所有形狀共用同一圖層，靠路徑運算（合併/減去/交集/排除）組合而成。

2. 路徑合成實操

1. 選形狀工具（U），選項欄設為路徑或形狀（建議形狀，自動建圖層）
2. 繪製機身圓角矩形 → 選擇路徑面板 → 新建路徑
3. 繪製鏡頭外圓 → 路徑運算選「合併形狀」
4. 繪製鏡頭內圓 → 路徑運算選「減去頂層」（形成環狀）
5. 依序添加閃光燈、快門、取景器，均用「合併形狀」
6. 所有路徑最終在同一矢量圖層下

3. 單圖層樣式疊加材質

給這個唯一的矢量圖層添加圖層樣式：

• 斜面與浮雕：內部凹陷，深度 100%，大小 3px，軟化 0，角度 120°，高光/陰影不透明度 30%/15%
• 內陰影：距離 2px，大小 3px，模擬機身邊緣厚度
• 漸變疊加：線性漸變，深灰 #333 → 中灰 #666 → 淺灰 #999，角度 90°，模擬金屬拉絲
• 投影：距離 2px，大小 4px，不透明度 25%

進階變體：一圖層衍生多狀態

• 普通態：基礎樣式
• Hover/Active：複製圖層，調整漸變疊加亮度/對比度，或添加色彩疊加（品牌色，混合模式柔光，不透明度 20%）
• Disabled：降低填充不透明度至 40%，移除斜面浮雕

優缺點權衡

優點	缺點
圖層面板極度乾淨，文件體積小	複雜圖標路徑運算易出錯，修改靈活度降低
導出 SVG 极簡潔，前端直用	多顏色區域需靠路徑分離，受限於單圖層
強迫症福音，結構邏輯清晰	不適合極複雜插畫風圖標

建議：常用基礎圖標（Home, Search, Settings, Camera, User…）採用單圖層法，建立元件庫；複雜插畫圖標仍按常規分層。動手試做一枚，感受「乾淨」的快感！