app-store-screenshots

作者: 101-skills

App Store和Google Play截图制作,符合精确的平台规格。涵盖iOS/Android尺寸、图库排序、设备模型和预览视频。用途:应用商店优化、ASO、应用截图、应用预览、Play商店列表。触发词:应用商店截图、aso、应用商店优化、Play商店截图、应用预览、应用列表、iOS截图、Android截图、应用商店图片、应用模型、设备模型、应用图库、商店列表

npx skills add https://github.com/101-skills/skills --skill app-store-screenshots

Install the belt CLI skill: npx skills add belt-sh/cli

App Store Screenshots

Create app store screenshots and preview videos via inference.sh CLI.

Quick Start

Requires inference.sh CLI (belt). Install instructions

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
}'

Platform Specifications

Apple App Store (iOS)

DeviceDimensions (px)Required
iPhone 6.7" (15 Pro Max)1290 x 2796Required
iPhone 6.5" (11 Pro Max)1284 x 2778Required
iPhone 5.5" (8 Plus)1242 x 2208Optional
iPad Pro 12.9" (6th gen)2048 x 2732If iPad app
iPad Pro 11"1668 x 2388If iPad app
  • Up to 10 screenshots per localization
  • First 3 screenshots are visible without scrolling (critical)
  • Formats: PNG or JPEG (no alpha/transparency for JPEG)

Google Play Store (Android)

SpecValue
Min dimensions320 px (any side)
Max dimensions3840 px (any side)
Aspect ratio16:9 or 9:16
Max screenshots8 per device type
FormatsPNG or JPEG (24-bit, no alpha)
  • Feature graphic: 1024 x 500 px (required for featuring)
  • Promo video: YouTube URL (optional but recommended)

The First 3 Rule

80% of App Store impressions show only the first 3 screenshots (before the user scrolls). These three must:

  1. Communicate the core value proposition
  2. Show the best feature/outcome
  3. Differentiate from competitors

Screenshot Gallery Order

PositionContentPurpose
1Hero — core value, best featureStop the scroll, communicate what the app does
2Key differentiatorWhat makes you unique vs competitors
3Most popular featureThe thing users love most
4Social proof or outcomeRatings, results, testimonials
5-8Additional featuresSupporting features, settings, integrations
9-10Edge casesSpecialized features for niche users

Screenshot Styles

1. Device Frame with Caption

The standard: device mockup showing the app, caption text above/below.

┌──────────────────────────┐
│   "Track Your Habits     │  ← Caption (benefit-focused)
│    Effortlessly"         │
│                          │
│   ┌──────────────────┐   │
│   │                  │   │
│   │   App Screen     │   │  ← Actual app UI in device frame
│   │   Content        │   │
│   │                  │   │
│   │                  │   │
│   └──────────────────┘   │
│                          │
└──────────────────────────┘

2. Full-Bleed UI (No Device Frame)

The app UI fills the entire screenshot. Works for immersive apps.

3. Lifestyle Context

The device shown in a real-world context (person holding phone, on desk, etc.).

4. Feature Highlight with Callouts

UI screenshot with arrows/circles pointing to specific features.

Caption Writing

Rules

  • Max 2 lines of text
  • Benefit-focused, not feature-focused
  • 30pt+ equivalent font size (must be readable in store)

Examples

❌ 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"

Generating Screenshots

Hero Screenshot (Position 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 Highlight

# 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"
}'

Lifestyle Context

# 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
}'

Before/After

# Split comparison
belt app run infsh/stitch-images --input '{
  "images": ["before-screenshot.png", "after-screenshot.png"],
  "direction": "horizontal"
}'

Preview Videos

Apple App Store

SpecValue
Duration15-30 seconds
OrientationPortrait or landscape (match app)
AudioOptional (loops silently in store)
FormatH.264, .mov or .mp4

Google Play

SpecValue
SourceYouTube URL
Duration30s-2min recommended
OrientationLandscape preferred

Preview Video Structure

SegmentDurationContent
Hook0-3sShow the core outcome/wow moment
Feature 13-10sDemonstrate top feature in action
Feature 210-18sSecond key feature
Feature 318-25sThird feature or social proof
CTA25-30sEnd screen with app icon
# 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"
}'

Localization

Each language gets its own set of screenshots. Priorities:

MarketLocalization Level
Primary marketsFull: new screenshots + translated captions
Secondary marketsTranslated captions, same screenshots
OtherEnglish defaults

Key localization markets: English, Japanese, Korean, Chinese (Simplified), German, French, Spanish, Portuguese (Brazilian)

A/B Testing (Google Play)

Google Play Console supports store listing experiments:

  • Test different screenshot orders
  • Test with/without device frames
  • Test different captions
  • Test different color schemes
  • Run for 7+ days with 50%+ traffic for significant results

Common Mistakes

MistakeProblemFix
Settings screen as screenshotNobody cares about settingsShow core value, not infrastructure
Onboarding flow screenshotsShows friction, not valueShow the app in-use state
Too much textUnreadable in storeMax 2 lines, 30pt+ font
Wrong dimensionsRejected by storeUse exact platform specs
All screenshots look the sameNo reason to scrollVary composition and content
Feature-focused captionsDoesn't communicate benefit"Never Miss a Deadline" > "Push Notifications"
Outdated UILooks abandonedUpdate screenshots with each major release
No hero screenshotWeak first impressionPosition 1 = your best shot

Checklist

  • Correct dimensions for target platform
  • First 3 screenshots communicate core value
  • Captions are benefit-focused, max 2 lines
  • No onboarding or settings screens
  • Preview video is 15-30s with hook in first 3s
  • Localized for top markets
  • Feature graphic (1024x500) for Google Play
  • Screenshots updated for current app version
  • A/B test variant prepared

Related Skills

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

Browse all apps: belt app store

来自 101-skills 的更多技能

ai-avatar-video
101-skills
通过inference.sh CLI创建AI虚拟形象和说话头像视频。推荐:P-Video-Avatar(最快、最便宜、内置TTS)。其他选项:OmniHuman、Fabric、PixVerse。音频:Inworld TTS-2(支持100+语言、角色情感控制)、ElevenLabs、Kokoro。功能:音频驱动虚拟形象、文本转虚拟形象、唇形同步视频、说话头像生成、虚拟主持人、UGC内容。用途:AI主持人、解说视频、虚拟网红、配音、营销视频、UGC广告、游戏虚拟形象等。
creativevideomedia
ai-video-generation
101-skills
通过 inference.sh CLI,使用 Google Veo、Seedance 2.0、HappyHorse、Wan、Grok 及 40 多个模型生成 AI 视频。模型包括:Veo 3.1、Veo 3、Seedance 2.0、HappyHorse 1.0、Wan 2.5、Grok Imagine Video、OmniHuman、Fabric、HunyuanVideo。功能涵盖:文生视频、图生视频、参考视频生成、视频编辑、唇形同步、虚拟人动画、视频增强、拟音音效。适用于:社交媒体视频、营销内容、解说视频、产品演示、AI 虚拟人。触发词:视频生成、AI 视频……
creativevideomedia
ai-image-generation
101-skills
通过 inference.sh CLI 使用 GPT-Image-2、FLUX、Gemini、Grok、Seedream、Reve 及 50 多个模型生成 AI 图像。模型包括:GPT-Image-2、FLUX Dev LoRA、FLUX.2 Klein LoRA、Gemini 3 Pro Image、Grok Imagine、Seedream 4.5、Reve、ImagineArt。功能:文生图、图生图、图像修复、LoRA、图像编辑、图像放大、文本渲染。用途:AI 艺术、产品模型、概念艺术、社交媒体图形、营销视觉、插图。触发词:flux、图像生成、AI 图像、文本转...
creativemediaimage
remotion-render
101-skills
通过inference.sh从React/Remotion组件代码渲染视频。传入TSX代码,获取MP4文件。支持所有Remotion API:useCurrentFrame、useVideoConfig、spring、interpolate、AbsoluteFill、Sequence。可配置分辨率、帧率、时长、编码器。用途:程序化视频生成、动画图形、动态设计、数据驱动视频、React动画转视频。触发词:remotion、从代码渲染视频、tsx转视频、react视频、程序化视频、remotion渲染、代码转视频、动画...
videocreativedevelopment
web-search
101-skills
通过inference.sh CLI使用Tavily和Exa进行网络搜索与内容提取。应用:Tavily搜索、Tavily提取、Exa搜索、Exa回答、Exa提取。功能:AI驱动搜索、内容提取、直接回答、研究。用途:研究、RAG管道、事实核查、内容聚合、智能体。触发词:网络搜索、tavily、exa、搜索API、内容提取、研究、互联网搜索、AI搜索、搜索助手、网页抓取、rag、perplexity替代方案
researchweb-scrapingapi
agent-tools
101-skills
通过inference.sh CLI运行AI应用——图像生成、视频创作、大语言模型、搜索、3D、Twitter自动化。模型包括:FLUX、Veo、Gemini、Grok、Claude、Seedance、OmniHuman、Tavily、Exa、OpenRouter等众多模型。适用于运行AI应用、生成图像/视频、调用大语言模型、网络搜索或自动化Twitter操作。触发词:inference.sh、infsh、ai model、run ai、serverless ai、ai api、flux、veo、claude api、image generation、video generation、openrouter、tavily、exa search、twitter api、grok
infsh-cli
101-skills
通过 inference.sh CLI 运行 AI 应用——图像生成、视频创作、大语言模型、搜索、3D、Twitter 自动化。模型包括:FLUX、Veo、Gemini、Grok、Claude、Seedance、OmniHuman、Tavily、Exa、OpenRouter 等。适用于运行 AI 应用、生成图像/视频、调用大语言模型、网络搜索或自动化 Twitter 时使用。触发词:inference.sh、infsh、ai model、run ai、serverless ai、ai api、flux、veo、claude api、image generation、video generation、openrouter、tavily、exa search、twitter api、grok
landing-page-design
101-skills
着陆页转化优化,涵盖布局规则、首屏设计及CTA心理学。包含首屏公式、社交证明放置、移动端设计及F型阅读模式。适用场景:创业公司着陆页、产品页面、SaaS营销、转化优化。触发词:着陆页、首屏、首屏以上、转化优化、着陆页设计、CTA按钮、首屏图片、着陆页布局、SaaS着陆页、产品页面设计、转化率、着陆页……
designmarketingcreative