Screenshot Teardown Skill
Marketing pages say what a competitor claims; screenshots show what they shipped. This skill reads real UI evidence — layout, copy, defaults, friction, what's promoted and what's buried — and turns it into competitive insight you can defend, because every claim points at pixels.
What This Skill Produces
- A screen-by-screen read: what each screenshot shows, what the design is optimising for, where the friction is
- Strategic inferences — pricing/packaging signals, target-user signals, maturity signals — each labelled as inference and tied to its visual evidence
- Learn / steal / avoid recommendations for your own product
Required Inputs
- The screenshots (up to ~5 per pass; more → ask which flow matters most). If none attached, ask — never tear down from memory of the product.
- Your product and angle (ask if missing): who's analysing, and for what decision (pricing? onboarding redesign? battlecard?)
Reading Method
- Anchor every claim to pixels. "Their onboarding asks for a credit card at step 1" — only if the screenshot shows it. Cite which screenshot each observation comes from.
- Read the hierarchy, not just the content. What's biggest, first, pre-selected, and colourful is what they want used; what's behind a "More" menu is what they don't. Defaults are strategy.
- Count the friction. Fields, steps, decisions, permission asks — visible effort before value is a measurable choice.
- Read the copy as positioning. Button labels, empty states, and upgrade nags reveal the audience and the monetisation pressure better than their homepage does.
- Separate the two registers strictly:
- Observed — on screen, citable
- Inferred — a reading of intent ("the pre-selected annual plan suggests LTV pressure"), always labelled
[inference]
- Mind the screenshot's limits. One user's session, one plan tier, one moment. Note what state the shots can't show (A/B variants, other tiers, mobile vs desktop).
Output Format
Screenshot teardown: [competitor] — [flow examined]
Evidence base: [n] screenshots of [what], captured [date if known]. What this evidence can't show: [limits].
Screen-by-screen:
[#1 — screen name] — Shows: [observed]. Optimised for: [read]. Friction: [count/notes]. Notable copy: "[verbatim]".
What they're optimising for overall: [2-3 lines synthesising the design intent]
Strategic signals:
| Signal |
Evidence (screenshot #) |
Observed / Inference |
For us — learn / steal / avoid:
- Learn: [pattern worth understanding]
- Steal: [specific, adaptable pattern — with what to change]
- Avoid: [their visible mistake and why we think it's one]
Quality Checks
Anti-Patterns
1---2name: screenshot-teardown3description: Tear down a competitor's product from screenshots of its actual UI — onboarding, pricing page, core flows. Use when given screenshots of a rival's app or website and asked what they're doing, how their flow works, or what to learn/steal/avoid. Produces a UX-and-strategy teardown grounded in what is visibly on screen, with an inferences-vs-observations split. Requires image input. For a market-level teardown without screenshots use competitor-teardown.4---5
6# Screenshot Teardown Skill
7
8Marketing pages say what a competitor claims; screenshots show what they shipped. This skill reads real UI evidence — layout, copy, defaults, friction, what's promoted and what's buried — and turns it into competitive insight you can defend, because every claim points at pixels.
9
10## What This Skill Produces
11
12- A **screen-by-screen read**: what each screenshot shows, what the design is optimising for, where the friction is
13- **Strategic inferences** — pricing/packaging signals, target-user signals, maturity signals — each labelled as inference and tied to its visual evidence
14- **Learn / steal / avoid** recommendations for your own product
15
16## Required Inputs
17
18- **The screenshots** (up to ~5 per pass; more → ask which flow matters most). If none attached, ask — never tear down from memory of the product.
19- **Your product and angle** (ask if missing): who's analysing, and for what decision (pricing? onboarding redesign? battlecard?)
20
21## Reading Method
22
231. **Anchor every claim to pixels.** "Their onboarding asks for a credit card at step 1" — only if the screenshot shows it. Cite which screenshot each observation comes from.
242. **Read the hierarchy, not just the content.** What's biggest, first, pre-selected, and colourful is what they *want* used; what's behind a "More" menu is what they don't. Defaults are strategy.
253. **Count the friction.** Fields, steps, decisions, permission asks — visible effort before value is a measurable choice.
264. **Read the copy as positioning.** Button labels, empty states, and upgrade nags reveal the audience and the monetisation pressure better than their homepage does.
275. **Separate the two registers strictly:**
28 - **Observed** — on screen, citable
29 - **Inferred** — a reading of intent ("the pre-selected annual plan suggests LTV pressure"), always labelled `[inference]`
306. **Mind the screenshot's limits.** One user's session, one plan tier, one moment. Note what state the shots can't show (A/B variants, other tiers, mobile vs desktop).
31
32## Output Format
33
34### Screenshot teardown: [competitor] — [flow examined]
35
36**Evidence base:** [n] screenshots of [what], captured [date if known]. What this evidence can't show: [limits].
37
38**Screen-by-screen:**
39**[#1 — screen name]** — Shows: [observed]. Optimised for: [read]. Friction: [count/notes]. Notable copy: "[verbatim]".
40
41**What they're optimising for overall:** [2-3 lines synthesising the design intent]
42
43**Strategic signals:**
44| Signal | Evidence (screenshot #) | Observed / Inference |
45|---|---|---|
46
47**For us — learn / steal / avoid:**
48- **Learn:** [pattern worth understanding]
49- **Steal:** [specific, adaptable pattern — with what to change]
50- **Avoid:** [their visible mistake and why we think it's one]
51
52## Quality Checks
53
54- [ ] Every observation cites its screenshot; every inference is labelled `[inference]`
55- [ ] Copy is quoted verbatim where it carries the point, not paraphrased
56- [ ] The friction count is actual (fields/steps visible), not vibes
57- [ ] The teardown states what the screenshots *cannot* show
58- [ ] Recommendations name what to change when stealing a pattern — context transplants fail
59
60## Anti-Patterns
61
62- [ ] Do not analyse a product from training-data memory when screenshots are provided — the pixels are the source of truth, and the product has probably changed
63- [ ] Do not proceed without images — that's `competitor-teardown`'s job
64- [ ] Do not present inferences as facts — "they're struggling with churn" is a reading, not a screenshot
65- [ ] Do not sneer — "cluttered" is not analysis; name what the clutter costs and whom it serves
66- [ ] Do not extrapolate a whole strategy from one screen — say when the evidence is thin