brand-design

Convert brand strategy into tokenized design specifications and WCAG AA-informed guidelines.

110|14|Updated May 12, 2026
One-click install
npx skills add https://github.com/EliasOulkadi/shokunin --skill brand-design-eliasoulkadi
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: brand-design
Source: https://github.com/EliasOulkadi/shokunin/tree/main/.pack/skills/brand-design
Command: npx skills add https://github.com/EliasOulkadi/shokunin --skill brand-design-eliasoulkadi

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

It helps teams turn brand strategy into consistent, production-ready design guidelines and a design system, reducing misalignment, rework, and accessibility issues across channels.

Core Features & Use Cases

  • Brand strategy to guidelines: Converts positioning, personality, and tone-of-voice into a complete set of brand guidelines.
  • Design tokens in W3C format: Produces color, spacing, typography, radius, and motion tokens suitable for token pipelines and consistent implementation.
  • Design briefs with measurable success criteria: Structures briefs with scope, deliverables, constraints, and SMART objectives.
  • Design system audit + anti-pattern prevention: Includes checklists for parity, accessibility (WCAG AA), dark mode, states, and common failure modes.

Quick Start

Ask the AI to generate a full brand guideline and design token set (W3C format) for your product using your brand story, target audience, and accessibility requirements.

Frequently Asked Questions about brand-design

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

FAQPage Schema
How do I generate design tokens in W3C format from brand strategy?

Generate W3C design tokens from brand strategy by converting positioning and tone-of-voice into tokenized JSON specifications. The process outputs color, spacing, typography, radius, and motion tokens suitable for token pipelines and consistent implementation across channels.

What is included in a design brief with measurable success criteria?

A design brief with measurable success criteria includes structured scope, deliverables, constraints, and SMART objectives. It structures project parameters to align stakeholder expectations and establish explicit metrics for evaluating creative direction outcomes.

Can I create WCAG AA-informed color palettes for a design system?

Yes, you can create WCAG AA-informed color palettes for a design system. The process generates accessible color and palette systems that ensure contrast compliance across web, print, social, and product touchpoints.

How do I audit a design system for accessibility and dark mode anti-patterns?

Audit a design system for accessibility and dark mode anti-patterns using built-in checklists for parity, WCAG AA compliance, dark mode, and common failure states. This prevents inconsistencies and accessibility issues across implementation touchpoints.

What is the best way to turn brand guidelines into production-ready specifications?

Turn brand guidelines into production-ready specifications by converting brand strategy into tokenized, implementation-ready specifications. This approach reduces misalignment and rework by producing structured W3C design token JSON and typography/spacing/motion architecture.