parthjadhav-app-store-screenshots

App Store & Google Play Screenshots Generator

A skill for AI coding agents that scaffolds a production-ready Next.js editor for App Store and Google Play marketing screenshots. It gives you a connected canvas, real device frames, inspector controls, persistent project state, and one-click export bundles at store-ready sizes.

Example screenshots generated with this skill were accepted for Bloom Coffee Shelf Recipe on the App Store.

What It Does

• Builds a full screenshot editor instead of a static one-off page
• Turns raw app captures into ad-style slides with big readable copy
• Lets phones, captions, and decorative elements span adjacent screenshots on one connected canvas
• Keeps older projects safe with isolated-screen export mode until you opt into connected crops
• Saves every deck to app-store-screenshots.json, so the project is git-trackable and resumable
• Uploads picked screenshots into public/screenshots/uploaded/<hash>.png
• Supports iOS, iPad, Android phone, Android tablet, and Play Store feature graphic decks
• Exports exact PNG bundles for all required App Store and Google Play sizes
• Supports locales, RTL-aware copy/layout guidance, reusable themes, and in-place project migration

Current Editor UI

• Connected canvas - view the whole screenshot strip at once, drag elements across screen boundaries, then export each screen as a precise crop.
• Isolated mode - preserve legacy decks where offscreen elements should not leak into neighboring exports.
• Screen sidebar - add, select, and drag-to-reorder screens with live thumbnails.
• Inspector - edit layout, labels, headlines, screenshots, element stacking, and transforms from the right panel.
• Platform switcher - keep iOS and Android decks side by side while sharing the same editor workflow.
• Device selector - design for iPhone, iPad, Android phone, Android tablets, and feature graphic formats.
• Autosave - writes to disk through /api/project and mirrors to localStorage for instant reloads.
• Export bundle - downloads a zip organized by platform, device, resolution, and locale.

Tip: when capturing source iPhone screenshots, the 6.1-inch simulator is usually the easiest starting point because it reduces manual image adjustment inside the frames.

Install

Using npx skills

npx skills add ParthJadhav/app-store-screenshots

Install globally:

npx skills add ParthJadhav/app-store-screenshots -g

Install for a specific agent:

npx skills add ParthJadhav/app-store-screenshots -a claude-code

This works with Claude Code, Cursor, Windsurf, OpenCode, Codex, and other agents supported by skills.

Manual install

git clone https://github.com/ParthJadhav/app-store-screenshots ~/.claude/skills/app-store-screenshots

Usage

Once installed, ask your coding agent for store screenshots:

Build App Store and Google Play screenshots for my app.

The skill guides the agent to ask for your app context, source screenshots, platforms, locales, visual direction, and slide count before generating the editor project.

Example Prompts

Build App Store screenshots for my habit tracker.
The app helps people stay consistent with simple daily routines.
I want 6 slides, clean minimal style, warm neutrals, and a calm premium feel.

Generate App Store screenshots for my personal finance app.
The main strengths are fast expense capture, clear monthly trends, and shared budgets.
I want a sharp modern style with high contrast and 7 slides.

Build App Store screenshots for my language learning app.
I need English, German, and Arabic screenshot sets.
Use two reusable themes: clean-light and dark-bold.
Make sure Arabic slides feel RTL-native, not just translated.

Better Prompt Tips

• Say what the app does in one sentence
• List the top 3-5 features in priority order
• Mention the platforms and devices you need
• Describe the visual style you want
• Say how many slides you want
• Mention required locales or RTL languages
• Provide source screenshot paths, app icon, and style references when available

What Gets Scaffolded

If starting from an empty folder, the skill creates a Next.js project like this: