PluginBench
Skill
Review
Audit score 70

app-store-screenshots

101-skills/superpowers

Create App Store and Google Play screenshots with exact platform specs, device mockups, and preview videos.

What is app-store-screenshots?

Generate optimized app store screenshots and preview videos for iOS and Android with precise platform dimensions, device frames, and caption guidelines. Use this to create professional app listings that maximize visibility and conversions on Apple App Store and Google Play.

  • Generate device mockups and screenshots at exact iOS/Android dimensions (iPhone 6.7" at 1290×2796, iPad Pro 12.9" at 2048×2732, Android 16:9 or 9:16 aspect ratios)
  • Create up to 10 iOS screenshots and 8 Android screenshots per device type with proper ordering (hero, differentiator, popular feature, social proof, additional features)
  • Design benefit-focused captions (max 2 lines, 30pt+ font) that communicate value rather than features
  • Generate preview videos (15-30s for iOS, 30s-2min for Android) with hook, feature demonstrations, and call-to-action segments
  • Support multiple screenshot styles: device frames with captions, full-bleed UI, lifestyle context, and feature highlights with callouts

How to install app-store-screenshots

npx skills add https://github.com/101-skills/superpowers --skill app-store-screenshots
Prerequisites
  • Install the belt CLI skill: npx skills add belt-sh/cli
  • Install inference.sh CLI and run belt login to authenticate
  • Access to inference.sh models (falai/flux-dev-lora, bytedance/seedream-4-5, google/veo-3-1-fast, infsh/stitch-images)
Claude Code
Cursor
Windsurf
Cline

How to use app-store-screenshots

  1. 1.Run belt login to authenticate with inference.sh
  2. 2.Use belt app run with falai/flux-dev-lora to generate device mockups at exact platform dimensions (1024×1536 for iPhone, 2048×2732 for iPad)
  3. 3.Create captions using benefit-focused language (max 2 lines, 30pt+ font) for the first 3 critical screenshots
  4. 4.Order screenshots strategically: position 1 = hero/core value, position 2 = differentiator, position 3 = popular feature, positions 4-8 = additional features
  5. 5.Generate preview videos using google/veo-3-1-fast with segments: hook (0-3s), feature 1 (3-10s), feature 2 (10-18s), feature 3 (18-25s), CTA (25-30s)
  6. 6.Export screenshots as PNG or JPEG at exact dimensions and upload to App Store Connect (iOS) or Google Play Console (Android)

Use cases

Good for
  • Create a hero screenshot showing your app's core value proposition to stop users from scrolling past the first three visible screenshots
  • Generate localized screenshots for multiple markets (English, Japanese, Korean, Chinese, German, French, Spanish, Portuguese) with translated captions
  • Design before/after comparison screenshots to demonstrate app outcomes and transformations
  • Produce lifestyle context images showing the device in real-world settings to increase emotional appeal
  • A/B test different screenshot orders, device frames, and captions on Google Play to optimize conversion rates
Who it's for
  • App developers and product managers launching or updating iOS and Android apps
  • App store optimization (ASO) specialists optimizing app visibility and conversion rates
  • Marketing teams creating app store listings and promotional materials
  • Indie developers with limited design resources needing quick, professional screenshots

app-store-screenshots FAQ

What are the exact screenshot dimensions I need?

iOS: iPhone 6.7" (1290×2796), iPhone 6.5" (1284×2778), iPad Pro 12.9" (2048×2732). Android: 320-3840px per side, 16:9 or 9:16 aspect ratio. Use the platform specifications table in the skill for complete details.

Why do the first 3 screenshots matter so much?

80% of App Store impressions show only the first 3 screenshots before users scroll. These must communicate core value, show your differentiator, and highlight your most popular feature to maximize conversion.

Should I use device frames or full-bleed screenshots?

Device frames with captions are standard and work best for most apps. Use full-bleed UI for immersive apps, lifestyle context for emotional appeal, and feature highlights with callouts to draw attention to specific functionality.

How do I write effective screenshot captions?

Use benefit-focused language (not feature-focused), keep to max 2 lines, use 30pt+ font size for readability. Example: 'Never Miss a Deadline Again' instead of 'Push Notification System'.

Can I A/B test different screenshots?

Yes, Google Play Console supports store listing experiments. Test different screenshot orders, device frames, captions, and color schemes for 7+ days with 50%+ traffic to measure impact on conversion rates.

Full instructions (SKILL.md)

Source of truth, from 101-skills/superpowers.


name: app-store-screenshots description: "App Store and Google Play screenshot creation with exact platform specs. Covers iOS/Android dimensions, gallery ordering, device mockups, and preview videos. Use for: app store optimization, ASO, app screenshots, app preview, play store listing. Triggers: app store screenshots, aso, app store optimization, play store screenshots, app preview, app listing, ios screenshots, android screenshots, app store images, app mockup, device mockup, app gallery, store listing" allowed-tools: Bash(belt *)

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 list