product-ux-spec

Community

Turn PRDs into implementable UX specifications

AuthorAutisticAF
Version1.0.0
Installs0

System Documentation

What problem does it solve?

Many product teams struggle to convert product requirement documents and architecture outlines into developer-ready UI/UX specifications, resulting in ambiguous designs, implementation delays, and accessibility regressions. This skill bridges the gap by producing clear, actionable UX_SPEC and DESIGN_SYSTEM documents that developers and designers can use to implement consistent interfaces across iOS and macOS.

Core Features & Use Cases

  • Full spec generation: Produces a complete docs/UX_SPEC.md with screen inventories, wireframes, interaction patterns, states, and accessibility guidance.
  • Design system output: Creates docs/DESIGN_SYSTEM.md detailing components, typography, color modes, and behavior for consistent implementation.
  • Context-aware: Reads docs/PRD.md and docs/ARCHITECTURE.md to align UI, data model displays, and navigation with platform conventions (iOS/macOS).
  • Use case: Convert a product PRD and architecture file into a developer-ready UX spec and component library for an iOS app release.

Quick Start

Ask the skill to generate a UX spec by providing the PRD and ARCHITECTURE.md and request outputs as docs/UX_SPEC.md and docs/DESIGN_SYSTEM.md.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: product-ux-spec
Download link: https://github.com/AutisticAF/claude-code-apple-dev-plugin/archive/main.zip#product-ux-spec

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.