skills.rest
mikemyl
mikemylCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

ui-spec

Generate UI design specifications covering brand, design system, and accessibility.

1|Updated Mar 22, 2026
Search Tags:#branding#accessibility#design system#competitive research#ui specification
One-click install
npx skills add https://github.com/mikemyl/verified-development --skill ui-spec-mikemyl
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-spec
Source: https://github.com/mikemyl/verified-development/tree/main/skills/ui-spec
Command: npx skills add https://github.com/mikemyl/verified-development --skill ui-spec-mikemyl

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill addresses the challenge of inconsistent UI designs, ensuring brand consistency, design system adherence, and usability across different user-facing features.

Core Features & Use Cases

  • Brand and Design System Contracting: Ensures every feature adheres to the project's design system.
  • User Interface Specifications: Helps in outlining detailed UI specifications before implementation.
  • Competitive Research: Incorporates competitor UI analysis for design inspiration.
  • Accessibility and Responsiveness: Ensures UI specifications are accessible and responsive across various devices.

Quick Start

Start a new UI specification by running ui-spec new [feature-name].

Frequently Asked Questions about ui-spec

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

FAQPage Schema
How do I create a UI specification that ensures design system consistency?▼

To create a UI specification ensuring design system consistency, use this Skill to establish a brand and design system contract. It guides you from initial specification through review, enforcing project-wide adherence across all user-facing features.

What is the best way to include competitive research in UI design?▼

The best way to include competitive research in UI design is using this Skill to incorporate competitor UI analysis directly into your specification workflow, providing design inspiration alongside brand and accessibility requirements.

How do I ensure my user interface specifications meet accessibility compliance?▼

To ensure user interface specifications meet accessibility compliance, this Skill integrates accessibility checks into the UI specification workflow, ensuring designs remain accessible and responsive across various devices before implementation.

Can I use this UI specification workflow for an existing software product?▼

Yes, you can use this UI specification workflow for an existing software product. It is intended for UI/UX designers, developers, and product managers working on new or existing user-facing features to enforce design consistency.

How do I start a new UI specification for a specific feature?▼

To start a new UI specification for a specific feature, run the command `ui-spec new [feature-name]`. This initiates the comprehensive workflow encompassing brand, design system, and user interface specifics.

Related Skills

Explore More Design & Creative Skills→
yonetim258852yonetim258852

generate-ui-from-brand

Convert a URL or DESIGN.md into a structured UI specification with design tokens.

Community
Advanced
Vortex4047Vortex4047

frontend-developer

Build and repair React and Next.js frontend features for web applications.

Community
Advanced
1479089714790897
7

kwp-design-design-system

Audit component libraries for naming inconsistencies and missing documentation.

Community
Intermediate
Victory-HugoVictory-Hugo
1

markitdown

Convert PDF, DOCX, PPTX, XLSX, and other documents to Markdown.

Community
Advanced