View on GitHub

Claude Skills

Ready-to-use Claude skills for design workflows

ai-component-metadata cover
Design System

AI Component Metadata

Generate AI-ready metadata for design system components to enable intelligent UI generation

Install Command

npm
npx giorris-claude-skills install ai-component-metadata
spec-ideation cover
Workflow

Spec Ideation

Structured framework for working with AI through expansion, contraction, and documentation phases

Install Command

npm
npx giorris-claude-skills install spec-ideation
ai-ds-composer cover
Design System

AI DS Composer

Strategic guide for consuming design system metadata to compose components intelligently

Install Command

npm
npx giorris-claude-skills install ai-ds-composer
codebase-index cover
Development

Codebase Index

Automatically generates relationship and dependency maps for codebases. Creates JSON indexes of component usage, npm dependencies, data flow, and utility relationships to help AI understand project structure.

Install Command

npm
npx giorris-claude-skills install codebase-index
figma-variables-generator cover
Design System

Figma Variables Generator

Generate JSON files for creating Figma variable collections from text descriptions or design token data. Supports multiple modes, code syntax, variable references, and hierarchical organization.

Install Command

npm
npx giorris-claude-skills install figma-variables-generator

Claude Desktop Skills

Skills designed for Claude Desktop — download and load via Settings.

crazy-8s cover
Workflow

Crazy 8s

Solo rapid ideation method based on Google Design Sprint Crazy 8s. Generate 8 distinct solution ideas through rapid-fire ideation with visual HTML/CSS prototypes.

Download Only

Download the .skill file and load it in Claude Desktop via Settings > Capabilities > Skills.

problem-mapping cover
Workflow

Problem Mapping

Foundational problem framing based on Google Design Sprint methodology. Define problem statements, identify stakeholders, set success criteria, and document constraints.

Download Only

Download the .skill file and load it in Claude Desktop via Settings > Capabilities > Skills.

personal-dna-generator cover
Workflow

Personal DNA Generator

Analyze your conversation history and generate a Personal DNA profile — a unique fingerprint of your thinking style, patterns, and evolution over time.

Download Only

Download the .skill file and load it in Claude Desktop via Settings > Capabilities > Skills.

Getting Started with Claude Code

Install Claude Code skills directly to your project using npx:

npx giorris-claude-skills

Or install a specific skill:

npx giorris-claude-skills install ai-component-metadata