做移动端产品的人大概都有过这样的体验：功能开发完了，界面调好了，临上线前突然发现——图标还没做。于是临时找个素材拼一拼，或者让设计师赶工出一版，结果上线后在一堆 App 里显得格格不入。图标虽小，却是用户接触产品的第一触点，它决定了用户会不会点开你。今天这篇文章，就把 App 图标制作这件事从头到尾讲清楚。
一、为什么图标值得认真对待
App 图标在手机桌面上的显示尺寸通常只有 60×60 到 120×120 像素，但它的作用远不止"好看"两个字。它是品牌识别的延伸，是用户记忆的锚点，也是应用商店里决定点击率的关键因素之一。一个清晰、有辨识度的图标，能让用户在一屏几十个应用里一眼锁定你；而一个模糊、杂乱或者跟风设计的图标，很可能永远淹没在桌面角落。
更现实的一点是：图标是应用商店审核的必查项，尺寸不对、透明通道处理不当、圆角规范不符合平台要求，都可能导致审核被拒，白白耽误上线时间。所以图标制作不是"差不多就行"的环节，而是需要按规范认真对待的工程。
二、好图标的三条设计原则
1. 简洁优先，一个视觉焦点
小尺寸决定了图标不能承载太多信息。一个图标里塞进文字、多个图形、渐变背景和阴影，放大看也许精致，缩到桌面尺寸就只剩一团模糊。好的做法是：确定一个核心视觉元素，把它放大到占据图标的主要面积，其余部分做减法。微信的绿色气泡、支付宝的"支"字、网易云音乐的黑胶唱片，都是这个思路。
2. 高对比度，保证小尺寸可读
图标在桌面上会被各种壁纸包围，对比度不足的图标很容易"消失"。建议主体图形与背景之间保持明显的明度差，避免使用低饱和度的相近色。同时注意图形轮廓要清晰，细线条在缩小后容易断裂或糊成一片，线条宽度需要按最终显示尺寸来校验。
3. 与品牌调性一致
图标是品牌视觉系统的一部分。主色、图形语言、圆角风格都应该和产品内部的界面设计保持呼应。如果产品整体是扁平化、轻量感的风格，图标却做成拟物化的重质感，用户会产生认知割裂。制作前先确认品牌色板和视觉规范，再动手设计，能省掉大量返工。
三、主流平台的尺寸与规范
不同平台对图标的要求差异不小，制作时务必对照官方文档核对。以下是常见的核心要求：
- iOS：需要提供 1024×1024 的 App Store 图标，且不能包含透明通道（alpha channel）。系统会自动应用圆角遮罩，因此设计时请输出完整的方形图，不要自己画圆角或加投影。设备端尺寸由系统从 1024 版本自动生成，但建议在 Xcode 的 Asset Catalog 中配置完整。
- Android：采用自适应图标（Adaptive Icon）机制，需要提供前景层和背景层两张图，前景层内容要控制在安全区域内（约占画布中心 66% 的范围），否则在不同厂商的遮罩形状下可能被裁切。同时建议准备 512×512 的 Google Play 商店图标。
- HarmonyOS 及其他国内安卓定制系统：多数沿用自适应图标规范，但部分厂商对图标圆角、阴影有自己的处理方式，上架前需要按各应用市场的要求逐一适配。
- Web / PWA：至少提供 192×192 和 512×512 两个尺寸，并配置 manifest 文件。
一个实用建议：设计源文件以 1024×1024 为基准制作，导出时再用工具批量生成各平台所需尺寸，避免从小图放大导致的模糊。
四、制作流程：从草图到交付
规范的图标制作流程大致分五步：
- 需求确认：明确品牌色、核心图形概念、目标平台清单和交付时间。
- 草图与概念：在纸上或矢量软件里快速画几版方向，重点测试缩小到 60px 时的识别度。
- 矢量绘制：使用 Figma、Illustrator 或 Sketch 等工具以矢量方式绘制，保证任意尺寸缩放不失真。注意图层命名和分组，方便后续修改。
- 多尺寸导出：按平台规范导出，iOS 注意去除透明通道，Android 拆分前景与背景层。可以用图标生成工具（如 Icon Kitchen、App Icon Generator）辅助批量输出。
- 实机校验：把图标装到真机桌面上看效果，检查在浅色壁纸、深色壁纸、不同厂商遮罩下的表现，这一步能发现很多设计稿上看不出来的问题。
五、几个容易踩的坑
透明通道问题：iOS 图标带透明通道是常见的审核被拒原因，导出时务必检查。用 Photoshop 导出 PNG 时容易保留 alpha 通道，建议导出后用工具确认，或在导出设置中明确关闭。
文字滥用：图标里放文字在小尺寸下几乎不可读，除非文字本身就是品牌标志（如单个汉字或字母），否则尽量用图形表达。
安全区忽视：Android 自适应图标的前景内容如果贴边，在圆形、方形、水滴形等不同遮罩下会被裁掉关键部分。记住"重要内容放中间"这条铁律。
只做一版不测多场景：设计稿在白色背景上好看，不代表在深色壁纸、彩色壁纸、系统深色模式下同样成立。交付前至少做一轮多场景预览。
六、工具推荐
- 设计绘制：Figma（协作方便）、Adobe Illustrator（矢量精细控制）、Sketch（Mac 生态成熟）。
- 批量导出：App Icon Generator、Icon Kitchen、MakeAppIcon，可一次生成多平台多尺寸。
- 预览校验：各平台官方的图标预览工具，以及直接装真机看效果——后者永远最可靠。
图标制作看起来是件小事，但它横跨设计与工程两端，既考验审美判断，也考验对平台规范的熟悉程度。把上面这些原则和流程走一遍，你的 App 至少能在用户桌面上体面地"站"住。下次再遇到图标需求，别再临时抱佛脚了，按流程来，一次做对。