Can I use this for mobile app design?

Yes, the skill is platform-agnostic and includes specific fields for platform constraints including web, iOS, Android, and desktop targets.

Why does it ask questions instead of just writing the brief?

While it harvests what it can from code, critical design decisions like 'target user' or 'product differentiator' often reside in the developer's head; the skill asks targeted questions to ensure these are documented.

What information does it extract from my codebase?

It looks for tech stack signals in package managers (like package.json), UI component libraries (like Tailwind or Radix), and existing route structures to understand your project's current state.

Does this skill modify my existing application code?

No, this skill is a scoping and documentation tool. It generates files within a .design-crit directory to store briefs and metadata, but does not alter your source code.

Design Brief Architect

Name: Design Brief Architect
Author: metedata

bymetedata

0•

Herramientas de Diseño

Generates structured design briefs by harvesting codebase context and conducting targeted user interviews to align UI/UX goals.

The Design Brief skill is the essential first step in the design-crit pipeline, designed to bridge the gap between technical requirements and visual design. It intelligently scans your repository to detect tech stacks, UI libraries, and existing screen patterns, then conducts a conversational interview to fill in gaps regarding user personas, core interaction loops, and project differentiators. By formalizing these constraints into a standardized markdown brief and a read-only HTML dashboard, it ensures that subsequent design iterations are focused, relevant, and technically feasible.

Características Principales

01HTML Reference Generation: Produces a clean, non-interactive overview dashboard for quick visual reference.

020 GitHub stars

03Automated Codebase Harvesting: Scans package managers and UI directories to identify existing design systems and constraints.

04Project State Management: Tracks design progress and metadata in a structured JSON format for the design-crit pipeline.

05Standardized Schema: Generates comprehensive briefs covering personas, core loops, accessibility, and platform constraints.

06Context-Aware Branching: Dynamically adjusts interview depth based on available project information.

Casos de Uso

01Standardizing design documentation across a team by generating consistent project briefs.

02Defining the scope and core user actions for a new feature before writing any UI code.

03Extracting hidden design constraints from an existing codebase to guide future visual iterations.

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add metedata/design-crit design-brief

For use in Claude.ai and ChatGPT

Download Skill