app-icon-optimization

应用图标优化

帮助设计、审核和 A/B 测试应用图标，以最大限度提高点击率（TTR）——即用户在搜索结果或浏览页面中看到应用后点击它的比例。

为什么图标是影响力最大的素材

图标是用户在搜索结果中最先看到的内容——早于标题、评分或截图。引人注目的图标无需其他改动，就能将点击率提高 20–40%。在浏览页面或排行榜中，图标往往是吸引注意力的唯一视觉元素。

图标设计原则

1. 在小尺寸下保持简洁

图标会以 60×60pt 的尺寸显示（iPhone 搜索结果）。在这个尺寸下，细节会消失。

• 最多 2 个元素
• 不要包含文字（小尺寸下难以辨认；Apple 不建议这样做）
• 轮廓鲜明，一眼就能认出
• 定稿前在 60×60px 尺寸下进行测试

2. 与 App Store 背景形成颜色对比

App Store 在浅色模式下使用白色／浅色背景，在深色模式下使用深色背景。

• 在两种模式下都要有高对比度
• 避免使用白色图标——在浅色模式下会消失
• 避免使用过深的图标——在深色模式下会消失
• 可考虑在图标背景上添加微妙的阴影或边框

3. 类别视觉语言

符合所属类别的常见风格，同时展现差异化：

类别	常见风格	脱颖而出的方法
生产力	蓝色、简洁、极简	使用更温暖的颜色和更醒目的标记
健康／健身	绿色、橙色、充满活力	使用高级深色风格，显得精致
金融	蓝色、绿色、保守	采用大胆、鲜明的标记
游戏	明亮、角色、动作感	如果竞品风格张扬，可采用高级／深色风格
社交	圆润的形状、柔和的颜色	如果信息流风格柔和，可采用利落、鲜明的设计
冥想	紫色、蓝色、平静	使用出人意料的对比色
照片／视频	渐变、相机	使用单一醒目的标记

规则： 查看排名前 20 的竞品图标，然后设计出能让人一眼区分的图标。

4. 醒目的标记

图标需要一个独特、令人难忘的标记，而不是一幅场景或一组构图。请思考：

“有人能用 3 个词描述这个图标吗？”

• ✅“红色对话气泡” | ❌“有人在渐变背景前使用手机”
• ✅“醒目的橙色火焰” | ❌“抽象的彩色形状”

5. 品牌一致性

图标是你在 App Store 中的品牌标记。它应该：

• 与应用的主色调一致
• 与启动画面、推送通知和营销素材保持一致
• 可用作网站图标、社交媒体头像和新闻资料包素材

所需图标尺寸

平台	尺寸
iPhone（App Store）	1024×1024px（主图）
iPhone（主屏幕）	60×60pt @1x、@2x、@3x
iPad	76×76pt @1x、@2x
Watch	40×40pt – 44×44pt
Android 自适应图标	108×108dp（安全区域为 66×66dp）

提交一张 1024×1024px 的 PNG（不透明、无圆角——Apple 会应用遮罩）。

A/B 测试图标

iOS — 产品页面优化

1. App Store Connect → Your App → Product Page Optimization → Create Test
2. 创建最多 3 个图标变体
3. 设置流量分配（每个变体占 20–33%）
4. 至少运行 7 天，或持续到达到统计显著性

访问路径： App Store Connect → App Store → Product Page Optimization

Android — Play Store 实验

1. Play Console → Store listing experiments → New experiment
2. 上传最多 3 个图标变体
3. 设置流量分配比例
4. Google 会报告每个变体的安装转化率

测试内容

每次只测试一个变量：

测试	变体
配色方案	使用相同标记，搭配 3 种不同的背景色
标记风格	扁平风格 vs 插画风格 vs 3D 风格
深色 vs 浅色	深色背景 vs 浅色背景
角色 vs 抽象	基于角色的设计 vs 几何／抽象设计
有文字 vs 无文字	仅标记 vs 标记 + 简短文字

解读结果

• 主要指标： 安装转化率（展示次数 → 安装次数）
• 最低样本量： 每个变体至少 1,000 次展示，才能获得可靠信号
• 显著性阈值： p < 0.05，或 Appeeky／Play Console 的置信度指标

图标审核

根据以下内容评估当前图标：

Clarity at 60×60px:        [1–10]
  - Recognizable mark at small size?
  - No illegible text?

Color contrast:            [1–10]
  - Works on white (light mode)?
  - Works on dark backgrounds (dark mode)?

Category differentiation:  [1–10]
  - Stands out from top 10 competitor icons?

Simplicity:                [1–10]
  - Max 2 elements?
  - Describable in 3 words?

Brand alignment:           [1–10]
  - Consistent with app's visual identity?

Overall: [N]/50

图标设计师需求说明

向设计师说明需求时：

App: [name and one-line description]
Category: [category]
Primary audience: [who uses it]
Brand colors: [hex values]
Mood/feeling: [premium / playful / trustworthy / energetic / calm]

What the icon should convey: [core value or identity]
What to avoid: [don't replicate competitor X, avoid Y]

Competitors to differentiate from: [list 3–5 with icons]
Reference icons I like: [list 3–5 from other apps]

Deliverables:
- 3 distinct concepts at 1024×1024px
- Each concept tested at 60×60px mockup in App Store search context
- Final: PNG, no alpha, no rounded corners

相关技能

• ab-test-store-listing — 完整的 A/B 测试方法
• screenshot-optimization — 通过出色的屏幕截图为图标增色
• android-aso — Android 自适应图标要求
• aso-audit — 图标是完整 ASO 评分的影响因素之一