app-screenshots

Automate app store screenshot testing and PNG asset generation via headless browser.

23|3|Updated May 25, 2025
One-click install
npx skills add https://github.com/dotnetdreamer/open-screenshot-generator --skill app-screenshots-dotnetdreamer
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: app-screenshots
Source: https://github.com/dotnetdreamer/open-screenshot-generator/tree/main/.claude/skills/app-screenshots
Command: npx skills add https://github.com/dotnetdreamer/open-screenshot-generator --skill app-screenshots-dotnetdreamer

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires puppeteer-core, and includes scripts (resource) components.

What problem does it solve?

This Skill solves the manual, error-prone process of capturing, formatting, and verifying app store screenshots and preview assets across multiple device types and languages.

Core Features & Use Cases

  • Headless UI Verification: Drives the application in a headless browser to verify UI changes, capture screenshots, and perform pixel-level quality checks.
  • Automated Asset Generation: Regenerates 3D device thumbnails, skeleton screens, and card-thumbnail previews for the entire template gallery.
  • Use Case: When updating the app's UI, use this Skill to automatically regenerate all 156 3D device thumbnails and export updated App Store screenshots for every template, ensuring consistent rendering and quality.

Quick Start

Use the app-screenshots skill to run the example flow and verify the current UI by executing the example-flow script.

Frequently Asked Questions about app-screenshots

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I automate app store screenshot generation for multiple device types?

Automate app store screenshot generation by driving a headless browser to interact with the application UI, capturing screenshots, and exporting PNG assets formatted for diverse device types programmatically.

Can I use puppeteer-core to verify UI changes and capture pixel-level screenshots?

Yes, puppeteer-core drives the application in a headless browser to verify UI changes, capture screenshots, and perform pixel-level quality checks for consistent rendering across templates.

Do I need ffmpeg to generate app store graphics and device mockups?

Yes, ffmpeg is required alongside puppeteer-core to perform browser automation, screenshot capture, and the image processing tasks needed to generate 3D device thumbnails and exported PNG assets.

What is the best way to regenerate 3D device thumbnails and skeleton screens for an app template gallery?

Regenerate 3D device thumbnails and skeleton screens by running automated scripts that drive a headless browser to programmatically create and export updated preview assets for the entire template gallery.

How does automated headless UI testing handle screenshot capture across different device formats?

Headless UI testing handles screenshot capture by programmatically driving the application UI in a browser, performing pixel-level quality checks, and exporting PNG assets tailored for diverse device formats.

Why does automated app store asset generation reduce manual screenshot formatting errors?

Automated app store asset generation reduces manual formatting errors by programmatically driving a headless browser to capture, verify, and export consistent screenshots across multiple device types and languages.