wireframe

Installation
SKILL.md

Loaded when the user wants to explore the design space quickly — many rough ideas, not one polished direction.

Output location

Write all output files to ./opendesign/mockups/<task-slug>/. Derive the slug from the task name (e.g. dashboard-redesign, onboarding-flow).

Role framing

The goal is breadth, not polish. The output is a map of the design space, not a finished artifact. Use this skill early in a project, before the user has committed to a direction.

Interview the user first to understand the problem, then generate multiple rough takes in one pass.

Quantity and spread

  • Produce 3 to 5 distinctly different approaches per idea. "Distinct" means different structural logic, not different colors of the same layout. If two wireframes could be swapped by changing a class, they are the same wireframe.
  • Lay options out side by side so the user can compare them in one glance. For small sets, use a single canvas. For larger sets, use tabbed or paginated groupings so the comparison stays readable.

Visual style

Installs
28
GitHub Stars
196
First Seen
May 10, 2026
wireframe — manalkaff/opendesign