关于 app-store-screenshots
app-store-screenshots 是使用 inference.sh 命令行工具 belt 制作应用商店截图和预览视频的技能。内容涵盖商店规格、视觉布局、文案、本地化及商品页实验。
主要功能
- 01通过 belt 生成截图场景
- 02规划商店截图画廊布局
- 03制作预览视频场景
- 04遵循平台尺寸与格式要求
- 05规划本地化商品页和 A/B 测试
适用场景
- 01准备 iOS 和 Google Play 截图素材
- 02制作设备模型图和功能标注
- 03安排截图以呈现应用价值
- 04规划本地化商店视觉并测试变体
安装
复制下面的命令,在终端中运行。
$
npx skills add https:/ / github.com/ halt-catch-fire/ superpowers --skill app-store-screenshots安装后在 Claude Code 中输入/app-store-screenshots确认已加载。
详细介绍
安装 belt CLI 技能:
npx skills add belt-sh/cli
App Store 截图
通过 inference.sh CLI 创建 App Store 截图和预览视频。
快速开始
需要 inference.sh CLI(
belt)。安装说明
belt login
# Generate a device mockup scene
belt app run falai/flux-dev-lora --input '{
"prompt": "iPhone 15 Pro showing a clean modern app interface with analytics dashboard, floating at slight angle, soft gradient background, professional product photography, subtle shadow, marketing mockup style",
"width": 1024,
"height": 1536
}'
平台规格
Apple App Store(iOS)
| 设备 | 尺寸(px) | 必需 |
|---|---|---|
| iPhone 6.7"(15 Pro Max) | 1290 x 2796 | 必需 |
| iPhone 6.5"(11 Pro Max) | 1284 x 2778 | 必需 |
| iPhone 5.5"(8 Plus) | 1242 x 2208 | 可选 |
| iPad Pro 12.9"(第 6 代) | 2048 x 2732 | 如果是 iPad 应用 |
| iPad Pro 11" | 1668 x 2388 | 如果是 iPad 应用 |
- 每种本地化最多 10 张截图
- 无需滚动即可看到前 3 张截图(至关重要)
- 格式:PNG 或 JPEG(JPEG 不支持 alpha/透明度)
Google Play 商店(Android)
| 规格 | 值 |
|---|---|
| 最小尺寸 | 320 px(任意边) |
| 最大尺寸 | 3840 px(任意边) |
| 宽高比 | 16:9 或 9:16 |
| 每种设备类型最多截图数 | 8 |
| 格式 | PNG 或 JPEG(24 位,不含 alpha) |
- 特色图片:1024 x 500 px(设为精选内容时必需)
- 宣传视频:YouTube URL(可选,但建议提供)
前 3 张规则
80% 的 App Store 曝光只会展示前 3 张截图(用户滚动之前)。这三张必须:
- 传达核心价值主张
- 展示最佳功能/效果
- 与竞品形成差异
截图库顺序
| 位置 | 内容 | 目的 |
|---|---|---|
| 1 | 主视觉 — 核心价值、最佳功能 | 吸引用户停下滚动,说明应用的用途 |
| 2 | 关键差异点 | 展示你相较竞品的独特之处 |
| 3 | 最受欢迎的功能 | 展示用户最喜欢的内容 |
| 4 | 社会认同或效果 | 评分、结果、用户评价 |
| 5-8 | 其他功能 | 辅助功能、设置、集成 |
| 9-10 | 边缘场景 | 面向小众用户的专用功能 |
截图风格
1. 带说明文字的设备边框
标准样式:展示应用的设备模型,上方或下方配有说明文字。
┌──────────────────────────┐
│ "Track Your Habits │ ← Caption (benefit-focused)
│ Effortlessly" │
│ │
│ ┌──────────────────┐ │
│ │ │ │
│ │ App Screen │ │ ← Actual app UI in device frame
│ │ Content │ │
│ │ │ │
│ │ │ │
│ └──────────────────┘ │
│ │
└──────────────────────────┘
2. 全屏 UI(无设备边框)
应用 UI 填满整个截图。适用于沉浸式应用。
3. 生活场景
在真实环境中展示设备(例如有人手持手机、手机放在桌面上等)。
4. 带标注的功能重点展示
在 UI 截图中使用箭头/圆圈指向特定功能。
编写说明文字
规则
- 文案最多 2 行
- 以用户收益为重点,而非功能本身
- 字号需相当于 30pt 以上(在商店中必须清晰可读)
示例
❌ Feature-focused:
"Push Notification System"
"Calendar View with Filters"
"Data Export Functionality"
✅ Benefit-focused:
"Never Miss a Deadline Again"
"See Your Week at a Glance"
"Share Reports in One Tap"
生成截图
主视觉截图(位置 1)
# Clean device mockup with hero feature
belt app run falai/flux-dev-lora --input '{
"prompt": "modern iPhone showing a beautiful fitness tracking app with activity rings and workout summary, device floating at slight angle against soft purple gradient background, professional product shot, clean minimal composition, subtle reflection",
"width": 1024,
"height": 1536
}'
功能重点展示
# Feature callout style
belt app run bytedance/seedream-4-5 --input '{
"prompt": "app store screenshot style, iPhone showing a messaging app with AI writing suggestions highlighted, clean white background, subtle UI callout arrows, professional marketing asset, modern design",
"size": "2K"
}'
生活场景
# Device in real-world setting
belt app run falai/flux-dev-lora --input '{
"prompt": "person holding iPhone showing a cooking recipe app, kitchen background with ingredients, warm natural lighting, over-the-shoulder perspective, lifestyle photography, authentic feeling",
"width": 1024,
"height": 1536
}'
前后对比
# Split comparison
belt app run infsh/stitch-images --input '{
"images": ["before-screenshot.png", "after-screenshot.png"],
"direction": "horizontal"
}'
预览视频
Apple App Store
| 规格 | 值 |
|---|---|
| 时长 | 15-30 秒 |
| 方向 | 纵向或横向(与应用一致) |
| 音频 | 可选(在商店中会静音循环播放) |
| 格式 | H.264,.mov 或 .mp4 |
Google Play
| 规格 | 值 |
|---|---|
| 来源 | YouTube URL |
| 时长 | 建议 30 秒至 2 分钟 |
| 方向 | 优先横向 |
预览视频结构
| 环节 | 时长 | 内容 |
|---|---|---|
| 吸引点 | 0-3 秒 | 展示核心效果/惊艳时刻 |
| 功能 1 | 3-10 秒 | 演示顶级功能的实际效果 |
| 功能 2 | 10-18 秒 | 展示第二个关键功能 |
| 功能 3 | 18-25 秒 | 展示第三个功能或社会认同 |
| 行动号召 | 25-30 秒 | 以应用图标结束 |
# Generate preview video scenes
belt app run google/veo-3-1-fast --input '{
"prompt": "smooth screen recording style, finger tapping on a modern mobile app interface, swiping between screens showing charts and data visualizations, clean UI transitions, professional app demo"
}'
本地化
每种语言都有自己的一套截图。优先级:
| 市场 | 本地化级别 |
|---|---|
| 主要市场 | 完整:新截图 + 已翻译的说明文字 |
| 次要市场 | 已翻译的说明文字,使用相同截图 |
| 其他 | 默认使用英语 |
重点本地化市场:英语、日语、韩语、简体中文、德语、法语、西班牙语、葡萄牙语(巴西)
A/B 测试(Google Play)
Google Play Console 支持商店商品详情页实验:
- 测试不同的截图顺序
- 测试是否添加设备边框
- 测试不同的说明文字
- 测试不同的配色方案
- 运行 7 天以上,并确保流量占比达到 50% 以上,以获得显著结果
常见错误
| 错误 | 问题 | 修正方法 |
|---|---|---|
| 将设置界面作为截图 | 没人关心设置 | 展示核心价值,而非基础设施 |
| 使用引导流程截图 | 展示的是阻力,而非价值 | 展示应用的实际使用状态 |
| 文字过多 | 在商店中难以阅读 | 最多 2 行,字体至少为 30pt |
| 尺寸错误 | 被商店拒绝 | 使用平台规定的精确规格 |
| 所有截图看起来都一样 | 没有继续浏览的理由 | 让构图和内容有所变化 |
| 说明文字聚焦于功能 | 未能传达益处 | “再也不错过截止日期” > “推送通知” |
| UI 过时 | 看起来像是已停止维护 | 每次重大版本发布时更新截图 |
| 没有主打截图 | 第一印象不够有力 | 位置 1 = 你最好的截图 |
检查清单
- 符合目标平台的尺寸要求
- 前 3 张截图传达核心价值
- 说明文字聚焦于益处,最多 2 行
- 不包含引导流程或设置界面
- 预览视频时长为 15-30s,且前 3s 内有吸引点
- 已针对主要市场完成本地化
- Google Play 的功能图片尺寸为 1024x500
- 截图已更新为当前应用版本
- 已准备 A/B 测试变体
相关技能
npx skills add inference-sh/skills@ai-image-generation
npx skills add inference-sh/skills@ai-video-generation
npx skills add inference-sh/skills@image-upscaling
npx skills add inference-sh/skills@prompt-engineering
浏览所有应用:belt app list
评论
支持 Markdown