guides/design/app-store-screenshots/SKILL.md
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
npx skillsauth add inference-sh/agent-skills app-store-screenshotsInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
Create app store screenshots and preview videos via inference.sh CLI.
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
}'
| Device | Dimensions (px) | Required | |--------|-----------------|----------| | iPhone 6.7" (15 Pro Max) | 1290 x 2796 | Required | | iPhone 6.5" (11 Pro Max) | 1284 x 2778 | Required | | iPhone 5.5" (8 Plus) | 1242 x 2208 | Optional | | iPad Pro 12.9" (6th gen) | 2048 x 2732 | If iPad app | | iPad Pro 11" | 1668 x 2388 | If iPad app |
| Spec | Value | |------|-------| | Min dimensions | 320 px (any side) | | Max dimensions | 3840 px (any side) | | Aspect ratio | 16:9 or 9:16 | | Max screenshots | 8 per device type | | Formats | PNG or JPEG (24-bit, no alpha) |
80% of App Store impressions show only the first 3 screenshots (before the user scrolls). These three must:
| Position | Content | Purpose | |----------|---------|---------| | 1 | Hero — core value, best feature | Stop the scroll, communicate what the app does | | 2 | Key differentiator | What makes you unique vs competitors | | 3 | Most popular feature | The thing users love most | | 4 | Social proof or outcome | Ratings, results, testimonials | | 5-8 | Additional features | Supporting features, settings, integrations | | 9-10 | Edge cases | Specialized features for niche users |
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 │ │
│ │ │ │
│ │ │ │
│ └──────────────────┘ │
│ │
└──────────────────────────┘
The app UI fills the entire screenshot. Works for immersive apps.
The device shown in a real-world context (person holding phone, on desk, etc.).
UI screenshot with arrows/circles pointing to specific features.
❌ 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"
# 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"
}'
| Spec | Value | |------|-------| | Duration | 15-30 seconds | | Orientation | Portrait or landscape (match app) | | Audio | Optional (loops silently in store) | | Format | H.264, .mov or .mp4 |
| Spec | Value | |------|-------| | Source | YouTube URL | | Duration | 30s-2min recommended | | Orientation | Landscape preferred |
| Segment | Duration | Content | |---------|----------|---------| | Hook | 0-3s | Show the core outcome/wow moment | | Feature 1 | 3-10s | Demonstrate top feature in action | | Feature 2 | 10-18s | Second key feature | | Feature 3 | 18-25s | Third feature or social proof | | CTA | 25-30s | End 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"
}'
Each language gets its own set of screenshots. Priorities:
| Market | Localization Level | |--------|-------------------| | Primary markets | Full: new screenshots + translated captions | | Secondary markets | Translated captions, same screenshots | | Other | English defaults |
Key localization markets: English, Japanese, Korean, Chinese (Simplified), German, French, Spanish, Portuguese (Brazilian)
Google Play Console supports store listing experiments:
| Mistake | Problem | Fix | |---------|---------|-----| | Settings screen as screenshot | Nobody cares about settings | Show core value, not infrastructure | | Onboarding flow screenshots | Shows friction, not value | Show the app in-use state | | Too much text | Unreadable in store | Max 2 lines, 30pt+ font | | Wrong dimensions | Rejected by store | Use exact platform specs | | All screenshots look the same | No reason to scroll | Vary composition and content | | Feature-focused captions | Doesn't communicate benefit | "Never Miss a Deadline" > "Push Notifications" | | Outdated UI | Looks abandoned | Update screenshots with each major release | | No hero screenshot | Weak first impression | Position 1 = your best shot |
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
development
Render videos from React/Remotion component code via inference.sh. Pass TSX code, get MP4. Supports all Remotion APIs: useCurrentFrame, useVideoConfig, spring, interpolate, AbsoluteFill, Sequence. Configurable resolution, FPS, duration, codec. Use for: programmatic video generation, animated graphics, motion design, data-driven videos, React animations to video. Triggers: remotion, render video from code, tsx to video, react video, programmatic video, remotion render, code to video, animated video, motion graphics code, react animation video
tools
Generate videos with Pruna P-Video and WAN models via inference.sh CLI. Models: P-Video, WAN-T2V, WAN-I2V. Capabilities: text-to-video, image-to-video, audio support, 720p/1080p, fast inference. Pruna optimizes models for speed without quality loss. Triggers: pruna video, p-video, pruna ai video, fast video generation, optimized video, wan t2v, wan i2v, economic video generation, cheap video generation, pruna text to video, pruna image to video
documentation
Still-to-video conversion guide: model selection, motion prompting, and camera movement. Covers Wan 2.5 i2v, Seedance, Fabric, Grok Video with when to use each. Use for: animating images, creating video from stills, adding motion, product animations. Triggers: image to video, i2v, animate image, still to video, add motion to image, image animation, photo to video, animate still, wan i2v, image2video, bring image to life, animate photo, motion from image
tools
Generate videos with Google Veo models via inference.sh CLI. Models: Veo 3.1, Veo 3.1 Fast, Veo 3, Veo 3 Fast, Veo 2. Capabilities: text-to-video, cinematic output, high quality video generation. Triggers: veo, google veo, veo 3, veo 2, veo 3.1, vertex ai video, google video generation, google video ai, veo model, veo video