skills.rest
joaquimscosta
joaquimscostaCOMMUNITY
Explore all skills by this author โ†’
WebsiteGitHub

extracting-stitch-mockups

Extract Stitch mockup images from Google Stitch project pages via Playwright.

21|4|Updated Oct 24, 2025
One-click install
npx skills add https://github.com/joaquimscosta/arkhe-claude-plugins --skill extracting-stitch-mockups
Or copy as Structured Prompt for Agentโ–ผ
Please help me install this Agent Skill.
Skill: extracting-stitch-mockups
Source: https://github.com/joaquimscosta/arkhe-claude-plugins/tree/main/google-stitch/skills/extracting-stitch-mockups
Command: npx skills add https://github.com/joaquimscosta/arkhe-claude-plugins --skill extracting-stitch-mockups

SYSTEM DOCUMENTATION & REQUIREMENTS

๐Ÿ’ก This Skill requires playwright>=1.50.0, uv, and includes scripts (resource) and references (resource) components.

What problem does it solve?

Automates extraction of generated Stitch mockups (images) from Stitch project pages and saves them into the repository for quick reference and handoff.

Core Features & Use Cases

  • Auto-detect feature directory and export path based on project title
  • Filter for Stitch mockups via image URLs (lh3.googleusercontent.com/aida/)
  • Save images to .google-stitch/<feature>/exports/
  • Generate a succinct summary with paths for handoff

Quick Start

Run the extraction script against a Stitch project URL to save mockups into the appropriate feature directory.

Frequently Asked Questions about extracting-stitch-mockups

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

FAQPage Schema
How do I automatically extract mockup images from Google Stitch projects?โ–ผ

Extract mockups by running the Skill against a Stitch project URL. It auto-detects the feature directory, filters images from lh3.googleusercontent.com/aida/, and saves them to `.google-stitch/<feature>/exports/` with an optional custom output path.

What are the requirements for extracting Stitch mockups programmatically?โ–ผ

You need an authenticated Chrome profile, Playwright browser automation (โ‰ฅ1.50.0), URL validation for Stitch project pages, and generation-status verification. The Skill handles these automatically during extraction.

Can I customize where Stitch mockup images are saved?โ–ผ

Yes. The Skill auto-detects the export path based on project title into `.google-stitch/<feature>/exports/`, but you can override the destination with a custom `--output` path parameter.

How do I know which images are actual Stitch mockups during extraction?โ–ผ

The Skill filters images by URL source, including only those from lh3.googleusercontent.com/aida/ to ensure only genuine Stitch-generated mockups are saved, excluding unrelated images.

Does the extraction process provide output documentation for handoff?โ–ผ

Yes. After extraction completes, the Skill generates a concise summary report with file paths, making it easy to reference and hand off extracted mockups to team members.

What happens if a Stitch project hasn't finished generating mockups?โ–ผ

The Skill includes generation-status checks to verify mockups are ready before extraction. It will report the status so you know whether images are available or still in progress.

Related Skills

DevXojeDevXoje

extracting-stitch-mockups

Download Stitch mockup images from Google Stitch project pages.

Community
Intermediate
KunCheng-HeKunCheng-He
8

wechat-gzh-skill

Convert Markdown documents to WeChat-compatible HTML and publish drafts via the WeChat MP API.

Community
Advanced
bilalmkbilalmk
1

browsing-with-playwright

Automate browser interactions with Playwright MCP for navigation, form filling, and data extraction.

Community
Advanced
jiunbaejiunbae
12

appstore-connect

Automate App Store Connect tasks via API and Playwright browser automation.

Community
Advanced