App Store Screenshotsавтор ParthJadhav

App Store Screenshots Skill.

Создавайте скриншоты для страницы приложения в магазине так, чтобы каждый работал как отдельная реклама, а вместе они составляли единый набор.

Маркетинг приложений
Скриншоты
Локализация

Скачать OpenDesign Открыть руководство по использованию

Обзор источника · App Store ScreenshotsSKILL.md

Задача Маркетинг приложений Результат • Локальный редактор дизайна скриншотов с предзаполненным содержимым приложения • Файл проекта JSON, подходящий для системы контроля версий, и локальные ресурсы скриншотов • Пакеты экспорта PNG, организованные по устройству, размерам и локали Прежде чем начать Нужны готовый редактор на Next.js, поддерживаемая среда Node и менеджера пакетов, а также браузер. Экспорт PNG использует html-to-image; на исходные снимки, шрифты и другие ресурсы нужны соответствующие права использования.

Редакционное резюме · источник проверен 2026-10-07 · не сгенерированный пример

01 Возможности

App Store Screenshots

Редактор скриншотов на основе шаблонов с локальным сохранением проекта, отдельными наборами для платформ, локализованными текстами, единой композицией и проверками экспорта с упором на кадрирование.

Процесс на основе источникаНе тест выполнения

Принцип работы

App Store Screenshots разворачивает готовый редактор на Next.js и ShadCN для маркетинговых изображений страниц в магазинах. Вы предоставляете реальные снимки приложения, значок, приоритетные функции и визуальное направление; редактор предлагает рамки устройств, редактирование текста на месте, варианты макета, наложение изображений и настройки экспорта. Результат — маркетинговая графика, а не новый интерфейс приложения и не автоматический захват экранов продукта для каждой платформы.

Единый холст позволяет устройству или декоративному элементу продолжаться на соседние скриншоты, но каждый экспортируемый фрагмент всё равно должен передавать законченную мысль. Состояние проекта хранится в файле JSON рядом с локальными ресурсами, для удобства есть копия в браузере. Отдельные наборы устройств и локализованные подписи поддерживают несколько магазинов. Для существующих проектов предусмотрена миграция с упором на сохранность: она не включает молча единый экспорт, который мог бы изменить ранее обрезанные композиции.

Ожидаемые результаты

Локальный редактор дизайна скриншотов с предзаполненным содержимым приложения
Файл проекта JSON, подходящий для системы контроля версий, и локальные ресурсы скриншотов
Пакеты экспорта PNG, организованные по устройству, размерам и локали

Смотреть пример задания

От задания до проверки

01
Изучите существующую работу
Перед созданием проекта проверьте, нет ли предыдущего проекта скриншотов. Если нужна миграция, сохраните тексты пользователя, наборы, ресурсы и восстанавливаемые снимки, а не заменяйте их образцами.
02
Предоставьте реальные материалы приложения
Соберите снимки устройств, значок, название приложения, приоритетные функции, целевые платформы, языки и стилевое направление. Создание самих скриншотов при необходимости — отдельная задача.
03
Соберите набор
Используйте готовый редактор, чтобы варьировать макеты и писать по одному ясному преимуществу на изображение. Планируйте любой объект между экранами так, чтобы важный текст и интерфейс оставались читаемыми в каждом отдельном кадре.
04
Проверьте экспорт
Проверьте читаемость миниатюр, переносы строк в локализованных текстах, загрузку ресурсов и экспортированные фрагменты. Экспортируйте пакет для каждого выбранного устройства и перед отправкой сверьтесь с актуальными требованиями магазинов.

02 Когда использовать

Когда использовать

Нужны готовый редактор на Next.js, поддерживаемая среда Node и менеджера пакетов, а также браузер. Экспорт PNG использует html-to-image; на исходные снимки, шрифты и другие ресурсы нужны соответствующие права использования.

Хорошо подходит

Повторяемые материалы для страницы приложенияПолезно, когда маркетинговые изображения для магазина хранятся рядом с репозиторием продукта и другой участник должен суметь заново открыть то же содержимое и ресурсы.
Согласованные наборы скриншотовПодходит для наборов, которым нужна общая визуальная связность, но без одинаковой композиции с телефоном по центру на каждом скриншоте.

Ограничения, которые нужно проверить

Это не сервис съёмки приложенияРедактор рассчитан на реальные снимки. Источник указывает на отдельный сопутствующий инструмент для некоторых сценариев iOS; для других платформ всё равно нужен подходящий способ съёмки.
Нет гарантии одобрения магазиномРазмеры экспорта в шаблоне — данные реализации, а не обещание соответствия текущим требованиям магазинов. Перед загрузкой проверьте последние правила нужного магазина и реальные заявления о продукте.

Что подготовить

Снимки приложения и значокПредоставьте скриншоты в исходном разрешении для нужных устройств и языков, а также утверждённый значок приложения.
Приоритеты функцийПеречислите реальные преимущества по порядку и приложите подтверждения для рейтингов, наград или заявлений об использовании. Не выдумывайте социальные доказательства, чтобы заполнить главный экран.
Платформы и локалиУкажите нужные магазины, наборы устройств, языки, визуальный стиль и нужно ли переносить существующий проект.

03 Важные решения

Важные решения

Связаны, но независимы
Композиция между экранами придаёт набору связность, а проверка отдельных фрагментов не даёт заголовкам и ключевым элементам интерфейса стать непонятными вне полной ленты.
Восстанавливаемое состояние проекта
Файл JSON и загруженные ресурсы делают совместную работу надёжнее, чем макет только в браузере. Прежний изолированный экспорт остаётся отдельным, пока единая композиция не включена намеренно.

04 Пример задания

Попробуйте точное задание

Приведённое ниже задание не тестировалось. Перед использованием проверьте настройку навыка.

Проверьте настройку

Используйте всю папку навыка с шаблоном редактора и стилевыми справочниками. Команда установки сопутствующего инструмента съёмки из источника устанавливает отдельный инструмент; она не устанавливает этот редактор скриншотов.

Исходный файл в репозитории

https://github.com/ParthJadhav/app-store-screenshots/blob/82d4ebba770ce821d89e27f6a5bd30a2cb65ab23/skills/app-store-screenshots/SKILL.md

Начните с одного результата

Перед запуском навыка адаптируйте объём, исходные материалы и ограничения в этом задании.

Пример задания

Используйте App Store Screenshots, чтобы создать набор для iPhone только на английском для предоставленного приложения по формированию привычек. Используйте предоставленный значок и шесть реальных снимков, выделите недельное планирование и восстановление серий, не выдумывайте рейтинги или награды. Заполните готовый редактор разными макетами и одним ненавязчивым декоративным элементом между экранами. Держите каждый заголовок внутри своего кадра, затем проверьте экспортированные PNG в размере миниатюр. Ничего не загружайте в магазин.

Проверьте результат

Сравните фактический результат с этими наблюдаемыми критериями.

Каждое экспортированное изображение передаёт законченное преимущество без соседнего скриншота.
Все выбранные локали получают реальные тексты и корректные пути к снимкам, без необъяснимых запасных текстов.
Файл проекта и локальные ресурсы позволяют воспроизвести задуманный набор для устройства после повторного открытия.

OpenDesign предоставляет локальное рабочее пространство для дизайна с кодирующими агентами. Эта страница не означает, что навык включён в поставку или что его внешние инструменты, учётные данные и программные зависимости входят в комплект.

Скачать OpenDesign Прочитать краткое руководство

05 Источник и лицензия

Источник и лицензия

Эта страница описывает зафиксированную версию источника по ссылке ниже. Поведение и требования в оригинале могут измениться.

Владелец источника: ParthJadhav
Репозиторий: ParthJadhav/app-store-screenshots
Файл навыка: skills/app-store-screenshots/SKILL.md
Лицензия: MIT
Проверенная версия: 2026-10-07 · 82d4ebba770c

Редакционное резюме источника

Редактор скриншотов на основе шаблонов с локальным сохранением проекта, отдельными наборами для платформ, локализованными текстами, единой композицией и проверками экспорта с упором на кадрирование.

Оригинальное резюме от OpenDesign на основе указанного источника. Звёзды репозитория — датированный показатель популярности, а не использование навыка и не оценка качества.

06 Вопросы перед началом

Вопросы перед началом

Создаёт ли он реальные скриншоты приложения?

Его основная задача — составлять маркетинговые материалы из предоставленных снимков. Автоматизация съёмки, где она применима, — отдельный сопутствующий процесс.

Может ли одно устройство заходить на два скриншота?

Да, в едином режиме экспортируются фрагменты общего холста. Держите важный текст и интерфейс внутри каждого фрагмента и проверяйте изображения по отдельности.

Изменит ли обновление старого проекта его кадрирование?

Согласно источнику, прежние проекты остаются в изолированном режиме, если они уже не перешли на единую композицию. Миграция должна сохранять существующие ресурсы и тексты с восстанавливаемой резервной копией.

OpenDesign

Оставьте место для следующей итерации дизайна.

Храните задание, исходные материалы и дизайн вместе в локальном рабочем пространстве. Перед добавлением навыка в рабочий процесс проверьте его собственную настройку.

Скачать OpenDesign Смотреть навыки дизайна