shape

Plan UX and UI into a handoff-ready design brief.

Updated Apr 13, 2026
One-click install
npx skills add https://github.com/julianromli/dikara-portfolio --skill shape-julianromli
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: shape
Source: https://github.com/julianromli/dikara-portfolio/tree/main/.cursor/skills/skills/shape
Command: npx skills add https://github.com/julianromli/dikara-portfolio --skill shape-julianromli

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Many features are implemented without sufficient design thinking, causing UX mismatches, unclear priorities, and rework; Shape prevents this by running a structured discovery that captures purpose, users, constraints, and success criteria before any code is written.

Core Features & Use Cases

  • Structured Discovery Interview: Guided questions for purpose, users, content, goals, constraints, anti-goals, and edge cases.
  • Design Brief Generation: Produces a handoff-ready brief covering feature summary, primary action, design direction, layout strategy, key states, interaction model, content requirements, references, and open questions.
  • Handoff & Confirmation: Prompts user confirmation and lists open questions for implementers, making it ideal for early-stage feature planning, PM–designer handoffs, and design-led scoping sessions.

Quick Start

Run a discovery interview and generate a confirmed design brief for the new feature using the Shape protocol.

Frequently Asked Questions about shape

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

FAQPage Schema
How do I create a design brief for a new feature before writing any code?

To create a design brief before coding, run a structured discovery interview to capture purpose, users, constraints, and success criteria. This process generates a handoff-ready document covering layout strategy, interaction models, and explicit open questions for engineers.

What is the best way to structure UX discovery interviews for product features?

The best way to structure UX discovery interviews is using guided questions that address feature purpose, target users, content needs, goals, anti-goals, and edge cases. This ensures comprehensive requirements gathering before moving into UI layout strategy and design direction.

How do I prepare implementation-ready design handoffs for engineers and designers?

You prepare implementation-ready design handoffs by mapping key states and defining interaction models during discovery. The resulting design brief includes a feature summary, primary actions, content requirements, and a list of open questions for implementers to resolve.

Can I use a structured design brief to prevent UX mismatches and rework in early-stage planning?

Yes, you can use a structured design brief to prevent UX mismatches and rework. By applying design thinking early to define constraints, anti-goals, and success criteria, you ensure clear priorities and alignment before feature implementation begins.

What should be included in a UI design brief for PM to designer handoffs?

A UI design brief for PM to designer handoffs should include a feature summary, primary action, articulated design direction, layout strategy, key states, interaction model, content requirements, references, and explicit open questions to guide implementation.

When do I need to run a structured discovery process before UI design?

You need to run a structured discovery process before UI design when a feature is in early-stage planning. It captures purpose and edge cases, ensuring that design direction and layout strategy are fully defined and confirmed before development starts.