design-intent

Generates a DESIGN-BRIEF.md that fixes visual direction before UI implementation.

1|Updated Sep 11, 2026
One-click install
npx skills add https://github.com/rebuildup/my-web-2026 --skill design-intent-rebuildup
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: design-intent
Source: https://github.com/rebuildup/my-web-2026/tree/main/skills/design-intent
Command: npx skills add https://github.com/rebuildup/my-web-2026 --skill design-intent-rebuildup

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Starting UI implementation with vague direction words like "clean" or "modern" leads to inconsistent design decisions and rework. This Skill resolves undefined visual direction by reading existing project evidence, detecting contradictions, and producing a shared DESIGN-BRIEF.md before any layout, color, typography, or motion work begins. ## Core Features & Use Cases - Evidence-first analysis: Reads README, existing design docs, tokens, components, and screens before asking the user anything, avoiding redundant questions. - Contradiction detection: Finds conflicts such as dense UI plus generous whitespace, or minimal motion plus expressive transitions, and resolves them per product surface. - Specific reference handling: Converts vague references like "Linear-like" into concrete statements about which surface, behavior, and properties to adopt or avoid. - Use Case: Before building a new dashboard UI, run this Skill to produce a DESIGN-BRIEF.md covering color direction, typography, component character, and motion level that downstream design skills consume as project evidence. ## Quick Start Analyze this project's existing context and create a DESIGN-BRIEF.md that defines the visual direction for the new settings page.

Frequently Asked Questions about design-intent

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

FAQPage Schema
How do I define a visual direction before starting UI implementation?

Read existing project evidence first, including README, design docs, tokens, and components, then resolve only decisions that materially affect design. Write the confirmed decisions into a DESIGN-BRIEF.md covering color, typography, component character, and motion.

What is a design brief and what should it contain?

A design brief is a document that fixes visual direction before implementation. It should contain product context, design intent, specific references, color and typography direction, component character, motion level, decisions made with evidence, and explicitly unresolved questions.

How do I handle vague design feedback like clean or modern?

Convert vague words into observable characteristics instead of accepting them as final evidence. For example, minimal becomes low surface count, few accent colors, high whitespace, and reduced border and shadow vocabulary.

When should I not use a design brief workflow?

Skip it when the visual direction is already established by an existing design system or confirmed brief. The brief should be updated incrementally for contradictions, not regenerated from scratch, and routine geometry or token values should not require user decisions.

How do I resolve contradictory design requirements?

Detect contradictions such as dense UI with generous whitespace or minimal motion with expressive transitions before writing the brief. Resolve them by separating concerns per product surface, for example expressive motion on marketing pages and subtle functional motion in the application.