聊天 App 圖標聯想到「送信鴿/信使鳥」。本教程完整呈現草圖發散 → 風格定調 → 幾何構形 → 圖層架構 → 系統配色 → 細節豐富 → 模板驗證 → 多尺寸導出的商業級 App 圖標設計全流程，符合 iOS/Android 設計規範，適合獨立開發者、UI 設計師參考。

最終效果

完整設計流程

階段 1：草圖發散與風格定調

• 手繪/數位草圖多版嘗試，核心意象鎖定「鳥頭 + 郵差帽」；
• Dribbble/Behance 搜尋參考，確定扁平化 + 微投影 + iOS 7 系配色視覺語言。

階段 2：文檔規範建立

• 新建 1024×1024 px（最大尺寸），RGB，72 ppi；
• 編輯 > 偏好設定 > 參考線與網格：網格線間距 10 px，細分 10；
• 視圖 > 顯示網格、對齊網格，保證像素級對齊。

階段 3：幾何構形與圖層架構

• 置入草圖 50% 透明度鎖定；
• 鋼筆/形狀工具 + 路徑尋找器，將草圖拆解為基本幾何體（圓、矩形、三角、曲線）；
• 不同顏色描邊區分部件；
• 圖層命名規範：帽子/頭髮/眼睛/嘴/頸/頭/背景圈/素描，自下而上對應視覺層級。

階段 4：iOS 7 系統配色體系應用

• 色板面板建立 iOS 7 官方色值庫（吸管吸取官方指南色值）；
• 左右對稱部件採用左右不透明度差異（左 75% / 右 100%）打破扁平感；
• 形狀生成器工具 快速合併/減去複雜形狀。

階段 5：細節豐富與視覺層次

• 眉毛、眼部陰影、髮絲高光、嘴唇立體、帽子質感；
• 主體複製合併 → 外觀面板添加：白描邊 6pt + 紅描邊 12pt + 風格化 > 投影，形成醒目輪廓光暈；
• 細節克制：扁平風格忌過度裝飾。

階段 6：模板驗證與多尺寸導出

• 置入 iOS 7 圖標模板（圓角矩形蒙版），驗證視覺重心、邊緣呼吸區、小尺寸辨識度；
• Photoshop 動作腳本批量導出 29pt~1024pt 全套尺寸。

設計師檢查清單

• ☐ 1024px 原圖銳利無模糊
• ☐ 58px/87px/120px/180px 小尺寸關鍵特徵可辨
• ☐ 色值符合平台規範（iOS 7 色板 / Material Design 色板）
• ☐ 圖層命名規範、結構清晰，便於團隊協作與後期維護
• ☐ 導出 PNG 透明背景，無多餘像素邊緣

標準化流程不僅提升效率，更能保證交付品質穩定。下一個爆款 App 圖標，就從這套流程開始。