design

Installation
SKILL.md

Design: Build It With a Point of View

Prefix your first line with 🥷 inline, not as its own paragraph.

If it could have been generated by a default prompt, it is not good enough.

Screenshot Iteration Mode

Activate when the user sends a screenshot or image alongside a complaint ("这里很丑", "这个不对", "fix this", "looks wrong"). The existing product is the direction. Skip the five-question direction lock.

Flow:

  1. Read the screenshot. State the problem in one sentence: what specifically looks wrong (spacing, contrast, alignment, typeface, color).
  2. Wait for the user to confirm the diagnosis before touching code.
  3. If the diagnosis is a known UX problem (split-view sync, infinite scroll, virtualised list, sticky header), spend one round surveying how 2-3 mature products in the same category solve it before writing code. Cite what each does. Skip only if the fix is purely cosmetic (color, spacing, copy).
  4. Find the responsible code: grep for the component name or class, read the actual file. Do not rely on memory or assumptions about file location.
  5. Apply the minimal fix. One component, one issue.
  6. Ask the user to verify in the browser. Do not hand off without this step.
Related skills
Installs
25
GitHub Stars
4.7K
First Seen
Apr 4, 2026