[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"project-75093":3},{"id":4,"name":5,"fullName":6,"owner":7,"repo":5,"description":8,"homepage":9,"htmlUrl":10,"language":11,"languages":10,"totalLinesOfCode":10,"stars":12,"forks":13,"watchers":14,"openIssues":15,"contributorsCount":16,"subscribersCount":16,"size":16,"stars1d":17,"stars7d":18,"stars30d":19,"stars90d":16,"forks30d":16,"starsTrendScore":20,"compositeScore":21,"rankGlobal":10,"rankLanguage":10,"license":22,"archived":23,"fork":23,"defaultBranch":24,"hasWiki":25,"hasPages":23,"topics":26,"createdAt":10,"pushedAt":10,"updatedAt":44,"readmeContent":45,"aiSummary":46,"trendingCount":16,"starSnapshotCount":16,"syncStatus":47,"lastSyncTime":48,"discoverSource":49},75093,"app-store-screenshots","ParthJadhav\u002Fapp-store-screenshots","ParthJadhav","end to end app store screenshot creation using AI","https:\u002F\u002Fskills.sh\u002Fparthjadhav\u002Fapp-store-screenshots\u002Fapp-store-screenshots",null,"TypeScript",5547,383,19,1,0,70,278,456,210,38.75,"MIT License",false,"main",true,[27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43],"agentic-ai","apple","appstore","automate","claude","cursor","design","generate","ios","ios-app","marketing","screenshot","skills","skills-sh","swift","swiftui","ui","2026-06-12 02:03:32","[![bloom-banner-01-light-tags-1500x500](https:\u002F\u002Fgithub.com\u002Fuser-attachments\u002Fassets\u002F31139b9d-1b89-44e8-b563-5bb7ba150b7b)](https:\u002F\u002Fbloom.parthjadhav.com)\n\n### NOTE: MAKE SURE TO USE 6.1 INCH simulator to capture starting screenshots\nthis will save u from adjusting the images later\n\n# App Store & Google Play Screenshots Generator\n\nA skill for AI-powered coding agents (Claude Code, Cursor, Windsurf, etc.) that generates production-ready **App Store and Google Play** screenshots for iOS and Android apps. It scaffolds a Next.js project, designs advertisement-style screenshots, and exports them at all required Apple and Google resolutions.\n#### Screenshots & App approved by Apple - https:\u002F\u002Fapps.apple.com\u002Fus\u002Fapp\u002Fbloom-coffee-shelf-recipe\u002Fid6759914524\n![Example output — Bloom coffee tracking app](example.png)\n\n## What it does\n\n- Asks you about your app's brand, features, and style preferences\n- Scaffolds a minimal Next.js project (or works within an existing one)\n- Designs each screenshot as an **advertisement** — not a UI showcase\n- Writes compelling copy using proven App Store \u002F Play Store copywriting patterns\n- Renders screenshots at full resolution with a built-in iPhone mockup and CSS-based Android device frames\n- Exports PNGs at all required sizes for **both stores**\n- Supports **Android Phone, 7\" Tablet, 10\" Tablet** (portrait + landscape) and **Feature Graphic** (1024×500)\n- Supports locale-based screenshot sets and localized copy\n- Supports reusable theme presets so you can swap art direction quickly\n- Supports RTL-aware layouts and bulk export across locale\u002Fdevice\u002Ftheme combinations\n\n## Included assets\n\n- `mockup.png` — Pre-measured iPhone frame with transparent screen area\n- Android device frames are rendered with **CSS only** — no additional mockup PNGs needed\n\n## Install\n\n### Using npx skills (recommended)\n\n```bash\nnpx skills add ParthJadhav\u002Fapp-store-screenshots\n```\n\nThis works with Claude Code, Cursor, Windsurf, OpenCode, Codex, and [40+ other agents](https:\u002F\u002Fgithub.com\u002Fvercel-labs\u002Fskills#available-agents).\n\nInstall globally (available across all projects):\n\n```bash\nnpx skills add ParthJadhav\u002Fapp-store-screenshots -g\n```\n\nInstall for a specific agent:\n\n```bash\nnpx skills add ParthJadhav\u002Fapp-store-screenshots -a claude-code\n```\n\n### Manual (git clone)\n\n```bash\ngit clone https:\u002F\u002Fgithub.com\u002FParthJadhav\u002Fapp-store-screenshots ~\u002F.claude\u002Fskills\u002Fapp-store-screenshots\n```\n\n## Usage\n\nOnce installed, the skill triggers automatically when you ask Claude Code to:\n\n- Build App Store or Google Play screenshots\n- Generate marketing screenshots for an iOS or Android app\n- Create exportable screenshot assets for both stores\n\nOr just tell Claude Code what you need:\n\n```\n> Build App Store and Google Play screenshots for my app\n```\n\nClaude will ask you about your app's screenshots, brand colors, font, features, style direction, and number of slides before building anything.\n\n## Example prompts\n\nThese are good starting prompts because they provide product context while still leaving room for the skill to guide the design process.\n\n### Habit tracker\n\n```text\nBuild App Store screenshots for my habit tracker.\nThe app helps people stay consistent with simple daily routines.\nI want 6 slides, clean\u002Fminimal style, warm neutrals, and a calm premium feel.\n```\n\n### Finance app\n\n```text\nGenerate App Store screenshots for my personal finance app.\nThe app's main strengths are fast expense capture, clear monthly trends, and shared budgets.\nI want a sharp, modern style with high contrast and 7 slides.\n```\n\n### AI productivity tool\n\n```text\nCreate exportable App Store screenshots for my AI note-taking app.\nThe core value is turning messy voice notes into clean summaries and action items.\nI want bold copy, dark backgrounds, and a polished tech-forward look.\n```\n\n### Wellness app\n\n```text\nBuild marketing screenshots for my meditation app.\nThe app focuses on sleep, stress relief, and short guided sessions.\nUse a soft, warm, organic style and prioritize emotional outcomes over feature lists.\n```\n\n### Multi-language \u002F multi-theme\n\n```text\nBuild App Store screenshots for my language learning app.\nI need English, German, and Arabic screenshot sets.\nUse two reusable themes: clean-light and dark-bold.\nMake sure Arabic slides feel RTL-native, not just translated.\n```\n\n## Better prompt tips\n\n- say what the app does in one sentence\n- list the top 3-5 features in priority order\n- describe the visual style you want\n- mention how many slides you need\n- mention if you need multiple languages or RTL locales\n- mention if you want one art direction or reusable theme presets\n- provide references if you want the output to match a certain App Store style\n\n## What gets scaffolded\n\nIf starting from an empty folder, the skill creates:\n\n```\nproject\u002F\n├── public\u002F\n│   ├── mockup.png          # iPhone frame (copied from skill)\n│   ├── app-icon.png        # Your app icon\n│   ├── screenshots\u002F        # iOS screenshots (locale folders optional)\n│   │   └── android\u002F        # Android screenshots (when targeting both)\n│   └── screenshots-ipad\u002F   # Optional iPad screenshots\n├── src\u002Fapp\u002F\n│   ├── layout.tsx          # Font setup\n│   └── page.tsx            # Screenshot generator (single file)\n├── package.json\n└── ...\n```\n\nWhen targeting both stores, the skill uses a platform-based folder structure to keep iOS and Android screenshots separated.\n\nThe entire generator is a **single `page.tsx` file**. Run the dev server, open the browser, click any screenshot to export it as a PNG.\n\nThe latest version of the skill also guides the agent to generate:\n\n- locale tabs and locale-specific screenshot folders\n- reusable theme presets backed by design tokens\n- RTL-aware layouts for languages like Arabic and Hebrew\n- bulk export flows for locale\u002Fdevice\u002Ftheme combinations\n\n## Export sizes\n\n### Apple App Store\n\n| Display | Resolution |\n|---------|-----------|\n| 6.9\" | 1320 x 2868 |\n| 6.5\" | 1284 x 2778 |\n| 6.3\" | 1206 x 2622 |\n| 6.1\" | 1125 x 2436 |\n\n### Google Play Store\n\n| Device | Resolution |\n|--------|-----------|\n| Phone (portrait) | 1080 x 1920 |\n| 7\" Tablet (portrait) | 1200 x 1920 |\n| 7\" Tablet (landscape) | 1920 x 1200 |\n| 10\" Tablet (portrait) | 1600 x 2560 |\n| 10\" Tablet (landscape) | 2560 x 1600 |\n| Feature Graphic | 1024 x 500 |\n\nScreenshots are designed at the largest size per platform and scaled down for smaller sizes. Android device frames are CSS-rendered.\n\n## Advanced capabilities\n\n### Multi-language screenshots\n\nThe skill can generate screenshot systems for multiple locales by nesting images under locale folders such as:\n\n```text\npublic\u002Fscreenshots\u002Fen\u002Fhome.png\npublic\u002Fscreenshots\u002Fde\u002Fhome.png\npublic\u002Fscreenshots\u002Far\u002Fhome.png\n```\n\nThe generated page keeps slide structure the same and swaps only the locale base path and copy dictionary.\n\n### Theme presets\n\nInstead of hardcoding one art direction, the skill now encourages a token-driven preset system, for example:\n\n```ts\nconst THEMES = {\n  \"clean-light\": { bg: \"#F6F1EA\", fg: \"#171717\", accent: \"#5B7CFA\" },\n  \"dark-bold\": { bg: \"#0B1020\", fg: \"#F8FAFC\", accent: \"#8B5CF6\" },\n  \"warm-editorial\": { bg: \"#F7E8DA\", fg: \"#2B1D17\", accent: \"#D97706\" },\n} as const;\n```\n\nThis lets you reuse the same slide system while testing different visual directions fast.\n\n### RTL-aware design\n\nFor RTL locales such as Arabic and Hebrew, the skill now tells the agent to:\n\n- set `dir=\"rtl\"` on the screenshot canvas\n- rewrite line breaks for the target language\n- mirror asymmetric layouts intentionally\n- keep the composition feeling native instead of mechanically flipped\n\n### Bulk export matrix\n\nThe generator is now expected to support exporting not only the current slide, but also:\n\n- all slides for the current locale\u002Fdevice\u002Ftheme\n- all locales for the current theme\n- full locale + device + theme matrices when needed\n\n## Tech stack\n\n| Dependency | Purpose |\n|-----------|---------|\n| Next.js | Dev server + static image serving |\n| TypeScript | Type safety |\n| Tailwind CSS | Styling |\n| html-to-image | PNG export at exact resolutions |\n| React | Component composition |\n\n## Key design principles\n\n- **Screenshots are ads, not docs** — each slide sells one idea\n- **Copy follows the \"one second\" rule** — readable at thumbnail size in the App Store\n- **Layouts vary** — no two adjacent slides share the same phone placement\n- **Style is user-driven** — no hardcoded colors, gradients, or fonts\n\n## Quality Checklist\n\nBefore exporting, each slide should pass this quick review:\n\n- the headline communicates one idea in about one second\n- the first slide sells the strongest user benefit\n- adjacent slides do not reuse the same layout\n- decorative elements support the message instead of blocking the UI\n- text, screenshots, and framing still look correct after export sizing\n\n## Requirements\n\n- Node.js 18+\n- One of: bun, pnpm, yarn, or npm (detected automatically, bun preferred)\n\n## Contributing\n\nContributions are welcome, especially around:\n\n- screenshot generation reliability\n- skill prompt quality\n- clearer docs and onboarding\n- cross-agent compatibility\n\nIf you want to contribute, start with `CONTRIBUTING.md`. Bug reports and feature requests also have issue templates now to make reproduction and review easier.\n\n## License\n\nMIT","ParthJadhav\u002Fapp-store-screenshots 是一个利用AI技术自动生成符合App Store和Google Play要求的应用截图的工具。其核心功能包括通过询问应用的品牌、特性及风格偏好，设计出具有广告效果的截图，并以多种分辨率导出，支持iOS和Android平台以及多语言版本。此外，它还提供了内置iPhone模型渲染和基于CSS的Android设备框架，确保生成的素材既美观又实用。此项目特别适用于需要快速创建高质量应用商店展示图的开发者或营销人员，帮助提升应用在市场上的吸引力。",2,"2026-06-11 03:52:18","high_star"]