design-consultation

Generate a complete design system and DESIGN.md covering typography, color, layout, spacing, and motion.

Updated Aug 23, 2026

Search Tags:#typography #layout #color #design-system #motion #design-research #design-consultation

Ready to run

npx skills add https://github.com/gfires/motion-analysis --skill design-consultation-gfires

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: design-consultation
Source: https://github.com/gfires/motion-analysis/tree/main/design-consultation
Command: npx skills add https://github.com/gfires/motion-analysis --skill design-consultation-gfires

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Assists product teams in crafting cohesive design systems that scale across products. It analyzes your product, researches design landscape, and proposes a complete system covering typography, color, layout, spacing, and motion. It outputs DESIGN.md as the single source of truth and can infer a system for existing sites via /plan-design-review.

Core Features & Use Cases

Proposes a complete design system including aesthetic, typography, color, layout, spacing, and motion.
Outputs DESIGN.md as the project design source of truth; for existing sites use /plan-design-review to infer.
Proactively assists when starting a new UI with no DESIGN.md.

Quick Start

Describe your product and I will generate a complete design system plus DESIGN.md as your source of truth.

Frequently Asked Questions about design-consultation

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

FAQPage Schema

How do I create a complete design system for a new product UI?▼

Generate a design system for existing sites by using the /plan-design-review workflow to infer the current design source. This process analyzes the existing UI to construct or extract a cohesive system and outputs it into a DESIGN.md file.

What is a DESIGN.md file used for in product development?▼

A DESIGN.md file serves as the single source of truth for your project's design system. It documents the aesthetic decisions, typography, color palettes, layout structures, spacing rules, and motion guidelines to ensure UI consistency across the product.

Can I generate typography and color guidelines for an existing website?▼

Yes, you can generate typography and color guidelines for an existing website by initiating the /plan-design-review workflow. This infers the current design system from your existing site and documents the complete UI rules into a DESIGN.md file.

What do I need to provide to generate a design system covering layout and motion?▼

To generate a design system covering layout and motion, you simply need to provide a description of your product. The system researches the design landscape and proposes a complete aesthetic framework without requiring external dependencies or components.

Does this design system generation work without any external component libraries?▼

Yes, design system generation works without external component libraries or dependencies. It proactively assists by generating the foundational design rules, including spacing and motion, directly from your product description into a DESIGN.md document.