Store Asset Generation Skill
A reusable generation skill that generates Chrome Web Store screenshots from real product UI and features, reused across 15 published extensions.
- Year
- 2026
- My role
- Product definition · UX · Development · Launch
- Platform
- Skill / Workflow
01
The problem
Every extension needs store screenshots, small promos and a marquee, and they must stay consistent across languages. Doing this by hand for each of 15 products meant repeated layout work, easy overflow mistakes and drift between the English and Chinese listings.
02
Product approach
I treated store assets as a generated output rather than a design task. A scripted skill renders each capture from the real UI, applies a shared layout system and a self-check list, then exports language-specific screenshots and bilingual promos from one source.
03
Key product decisions
01
One source, many sizes
A single layout definition drives 1280x800 screenshots, 440x280 tiles and 1400x560 marquees, so dimensions never drift.
02
Bilingual by construction
Screenshots are generated per language and promos carry both languages in one image, matching the store's multilingual requirements without duplicate manual work.
03
QA before delivery
An automated checklist catches overflow, misalignment and spacing issues, replacing the trial-and-error of manual export.
04
From need to launch
01
Consolidate
Turned the repeated store-asset work from 14 extensions into one shared, scripted skill.
02
Standardize
Defined a scale-aware layout system and a self-check list so every output passes the same QA bar.
03
Reuse
Each new extension now reaches the store with consistent, bilingual assets in a fraction of the previous time.
05
What I learned
Shipping many products exposes the real bottleneck: not building the first one, but repeating the surrounding work. Turning that repetition into a system pays back across the whole portfolio.
06
Assets generated by the skill
Bilingual screenshots, marquee promos and product captures produced from one skill.
