design-consultation

Name: design-consultation
Availability: InStock
Author: tiosavich

Plan a complete design system with typography, color, spacing, and motion.

Updated Sep 10, 2024

Search Tags:#typography #design #layout #design-system #motion #color-palette

Ready to run

npx skills add https://github.com/TioSavich/UMEDCTA --skill design-consultation-tiosavich

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: design-consultation
Source: https://github.com/TioSavich/UMEDCTA/tree/main/.claude/skills/gstack/design-consultation
Command: npx skills add https://github.com/TioSavich/UMEDCTA --skill design-consultation-tiosavich

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Design teams often struggle to align product goals with a consistent visual language. This Skill provides a complete plan, artifacts, and a working workflow to build a unified design system, DESIGN.md, and a preview page that demonstrates the system in action.

Core Features & Use Cases

Complete design-system proposal covering aesthetics, typography, color, spacing, and motion.
Generates a DESIGN.md and CLAUDE.md guidance to enforce design decisions.
Phase-based workflow including context gathering, research (optional), and final design documentation.

Quick Start

Describe your product goals and I'll deliver a complete design-system direction, a color and typography palette, and a live preview.

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?▼

A design system aligns product goals with a consistent visual language by defining typography, color, spacing, and motion rules. It functions as a single source of truth to eliminate visual inconsistencies across product interfaces.

What is the best way to document typography and color palettes for development?▼

You start by providing your product goals, which triggers a phased workflow of context gathering and optional research. This produces an aesthetic direction, color and typography palettes, and a live preview page demonstrating the system.

Can I build a design system for an existing product without starting from scratch?▼

Yes, this workflow supports existing products by evaluating current interfaces and generating updated typography, color, and motion guidelines. It outputs a DESIGN.md and preview page to align your current product with a unified visual language.

How do I generate a preview page for my design system?▼

You generate a preview page by defining your product goals and aesthetic direction. The workflow automatically produces a live preview page demonstrating your typography, color palettes, spacing, and motion guidelines in action.

Do I need design research before generating a design system?▼

Design research is optional. The workflow includes a phased approach where you can skip research and use context gathering to directly produce typography palettes, color schemes, and your DESIGN.md documentation.