App Store Screenshots: an agent skill that builds a screenshot editor instead of a one-off page
end to end app store screenshot creation using AI
At a glance
- What is it?
- ParthJadhav's app-store-screenshots is an MIT-licensed skill for Claude Code, Cursor, Codex and other coding agents. Instead of generating a few static images, it scaffolds a Next.js editor with real device frames, a connected canvas and one-click export at App Store and Google Play sizes.
- Who is it for?
- Use app-store-screenshots if you ship an iOS or Android app, already work with a coding agent and want store screenshots you can edit and regenerate rather than redraw each release. Install it with npx skills add, give the agent real simulator captures and a clear brief, and commit app-store-screenshots.json with the uploaded images so the deck survives a fresh clone.
- Can I use it commercially?
- Yes. MIT is a permissive licence: you can use, modify and sell software built on it, as long as you keep its copyright and licence notices.
- Is it still maintained?
- Yes. The repository last received commits 11 days ago.
- What is it written in?
- Mainly TypeScript, according to GitHub's language statistics.
Answers come from the project's GitHub data, last synced on September 15, 2026, and from our analysis. They are not legal advice.
DEEP OPEN-SOURCE ANALYSIS
What the skill builds, and who it is for
Most tools for store screenshots either give you a design template or produce a finished image. This skill takes a third route: it guides a coding agent to scaffold a full Next.js project that is itself a screenshot editor. The README lists what that editor includes: a connected canvas, real device frames, inspector controls, persistent project state and export bundles at store-ready sizes. The agent turns raw app captures into ad-style slides with big readable copy, and you then refine them by hand in the editor.
The README points to a real result: screenshots generated with the skill were accepted for the Bloom Coffee Shelf Recipe app on the App Store. The people who benefit most are indie developers and small teams who publish on both stores, update screenshots with every release and would rather keep them as a project in git than as a folder of exported files from a design tool.
Installing the skill with npx skills or git
The README's main route uses the skills tool from Vercel Labs:
npx skills add ParthJadhav/app-store-screenshotsTo install it globally, or for one specific agent:
npx skills add ParthJadhav/app-store-screenshots -g
npx skills add ParthJadhav/app-store-screenshots -a claude-codeThe README says this works with Claude Code, Cursor, Windsurf, OpenCode, Codex and other agents the skills tool supports. For Claude Code there is also a manual route that clones the repository straight into the skills folder:
git clone https://github.com/ParthJadhav/app-store-screenshots ~/.claude/skills/app-store-screenshotsThe repository itself is small: a skills/ directory, the README, a contributing guide and an example image. The editor code is not something you install; the agent generates it into your project when you ask for screenshots.
How to create App Store screenshots with it
Once the skill is installed, the request is plain language:
Build App Store and Google Play screenshots for my app.The skill makes the agent ask for app context, source screenshots, platforms, locales, visual direction and slide count before it generates anything. The README's prompt tips say what a good brief contains: what the app does in one sentence, the top three to five features in priority order, the platforms and devices, the visual style, the number of slides, any locales or right-to-left languages, and paths to source screenshots, the app icon and style references.
The editor workflow then has six steps: capture real screenshots from a simulator, emulator or device; ask the agent to scaffold or migrate the project; run the dev server; organise screens in the sidebar and edit copy, layouts and elements in the inspector; choose Connected or Isolated mode; and click Export bundle. A practical tip from the README: for iPhone source captures, the 6.1-inch simulator is usually the easiest starting point because it needs the least manual adjustment inside the frames.
Connected canvas, isolated mode and localisation
The connected canvas is the feature that sets this editor apart. You see the whole strip of screenshots at once and can drag a phone, a caption or a decorative element across the boundary between two screens; on export, each screen is cut out as a precise crop. That is how the panoramic store listings that flow from one screenshot into the next are made, and it is awkward to do with separate images.
Isolated mode exists for older decks, where elements that sit offscreen should not leak into the neighbouring export. The README says older projects stay in isolated mode until you opt into connected crops, so upgrading an existing deck does not silently change its output.
Localisation is built in. Decks support multiple locales, the skill carries right-to-left copy and layout guidance, and themes are reusable. One of the README's example prompts asks for English, German and Arabic sets with two themes, clean-light and dark-bold, and asks that the Arabic slides feel native to right-to-left reading rather than simply translated.
App Store and Google Play screenshot sizes it exports
Export produces a zip organised by platform, device, resolution and locale. For the Apple App Store the README lists four iPhone display sizes: 6.9 inches at 1320 x 2868, 6.5 inches at 1284 x 2778, 6.3 inches at 1206 x 2622 and 6.1 inches at 1125 x 2436.
For Google Play it covers a phone in portrait at 1080 x 1920, a 7-inch tablet at 1200 x 1920 in portrait and 1920 x 1200 in landscape, a 10-inch tablet at 1600 x 2560 in portrait and 2560 x 1600 in landscape, and the 1024 x 500 feature graphic. iPad decks are supported too.
Screenshots are designed at the largest size for each platform and scaled down for the smaller exports. Android frames are drawn in CSS, while the iPhone frame uses the included mockup.png bezel. The sizes are the README's list; store requirements change, so compare them with App Store Connect and the Play Console before a release that depends on a new device class.
Project state, git and the limits of the approach
Every deck is saved to app-store-screenshots.json, which the README calls the source of truth for app name, active platform and device, locales, theme, canvas mode, slides, screenshot paths and transforms. Uploaded captures go to public/screenshots/uploaded/ under a hashed file name. The editor autosaves to disk through its /api/project route and mirrors to localStorage for instant reloads. Commit the JSON file and the uploads together and anyone can clone the repository and regenerate the same screenshots.
The approach has costs. You end up maintaining a Next.js project for your marketing images, the quality of the first draft depends on how well the agent follows the skill and how good your brief is, and the repository has no tagged releases to pin, so updates arrive whenever you pull the skill again. The last push was on 2026-09-05. For a team that already lives in a coding agent, those costs are small next to the benefit of screenshots that are versioned, localised and reproducible.
Editorial conclusion
Use app-store-screenshots if you ship an iOS or Android app, already work with a coding agent and want store screenshots you can edit and regenerate rather than redraw each release. Install it with npx skills add, give the agent real simulator captures and a clear brief, and commit app-store-screenshots.json with the uploaded images so the deck survives a fresh clone.
Frequently asked questions
How do I create App Store screenshots with this skill?
Install it with npx skills add ParthJadhav/app-store-screenshots, then ask your coding agent to build App Store and Google Play screenshots for your app. It asks for context and source captures, scaffolds an editor, and exports a zip of store-sized PNGs.
What size are App Store screenshots in the export?
The README lists four iPhone sizes: 1320 x 2868 (6.9 inch), 1284 x 2778 (6.5 inch), 1206 x 2622 (6.3 inch) and 1125 x 2436 (6.1 inch). Designs are made at the largest size and scaled down.
How do I design App Store screenshots that work?
The README's tips: describe the app in one sentence, list the top three to five features in order, name platforms and devices, describe the style and slide count, mention locales, and supply real screenshots, the app icon and style references.
Community notes