app-store-screenshots-generator — скилл для Claude Code
Собирает рекламные скриншоты iOS-приложения в Next.js и экспортирует PNG для размеров App Store. Подходит для локализованных наборов.
npx skills add reason-machines/trending-skills --skill app-store-screenshots-generator -a claude-codeЧто делает app-store-screenshots-generator
Скилл сначала спрашивает о бренде, функциях и стиле приложения, затем создаёт минимальный проект на Next.js, TypeScript и Tailwind. Каждый экран оформляется как рекламный слайд со встроенной рамкой iPhone, а не как обычный показ интерфейса.
Генератор использует html-to-image и выгружает PNG в четырёх размерах Apple: 6.9, 6.5, 6.3 и 6.1 дюйма. Доступны наборы для разных локалей, RTL-макеты и пресеты тем. В проекте нужны public/mockup.png и изображения приложения в public/screenshots/, потому что они используются при сборке слайдов.
Какие задачи решает
- собрать рекламные слайды для страницы iOS-приложения
- экспортировать PNG под размеры App Store
- оформить скриншоты с рамкой iPhone
- подготовить локализованные наборы изображений
- задать тему и стиль слайдов в Next.js
Примеры запросов агенту
- Собери скриншоты App Store для моего трекера привычек в минималистичном стиле.
- Создай набор из шести слайдов для iOS-приложения, используя изображения из
public/screenshots/en/. - Подготовь локализованные рекламные экраны с RTL-макетом и экспортом PNG.
Как установить app-store-screenshots-generator
1Через Skills CLI (Vercel)
npx skills add reason-machines/trending-skills --skill app-store-screenshots-generator -a claude-code2Вручную: положить файлы
~/.claude/skills/app-store-screenshots-generator/SKILL.mdПапка скилла целиком; для одного проекта — .claude/skills/app-store-screenshots-generator/
1Через Skills CLI (Vercel)
npx skills add reason-machines/trending-skills --skill app-store-screenshots-generator -a codex2Вручную: положить файлы
.agents/skills/app-store-screenshots-generator/SKILL.mdДля всех проектов — ~/.agents/skills/
1Через Skills CLI (Vercel)
npx skills add reason-machines/trending-skills --skill app-store-screenshots-generator -a cursor2Вручную: положить файлы
.cursor/skills/app-store-screenshots-generator/SKILL.mdCursor читает и .agents/skills/, и .claude/skills/
1GitHub CLI
gh skill install reason-machines/trending-skills app-store-screenshots-generator2Вручную: положить файлы
.github/skills/app-store-screenshots-generator/SKILL.md1Через Skills CLI (Vercel)
npx skills add reason-machines/trending-skills --skill app-store-screenshots-generator -a gemini-cli2Командой платформы
gemini skills install https://github.com/reason-machines/trending-skills --path skills/app-store-screenshots-generatorВручную: положить файлы
.devin/skills/app-store-screenshots-generator/SKILL.mdСтарый путь .windsurf/skills/ тоже читается
Через Skills CLI (Vercel)
npx skills add reason-machines/trending-skills --skill app-store-screenshots-generator -a opencodeClaude.ai
Упакуйте папку в zip и загрузите в Settings → Capabilities → Skills
По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов
Вопросы о app-store-screenshots-generator
Как установить app-store-screenshots-generator в Claude Code?
Выполните npx skills add reason-machines/trending-skills --skill app-store-screenshots-generator -a claude-code, затем используйте файл ~/.claude/skills/app-store-screenshots-generator/SKILL.md.
Что делает app-store-screenshots-generator?
Скилл создаёт Next.js-проект для рекламных слайдов iOS-приложения, добавляет рамку iPhone и экспортирует PNG в размерах, нужных App Store.
Какие технологии и размеры использует скилл?
В основе проекта Next.js, TypeScript, Tailwind и html-to-image. Экспорт рассчитан на размеры 6.9, 6.5, 6.3 и 6.1 дюйма, включая локали и RTL-макеты.