skills.rest
ralphjohn29
ralphjohn29COMMUNITY
Explore all skills by this author →
GitHub

ui-ux-designer

Create wireframes, prototypes, and design systems following WCAG 2.1 standards.

1|Updated Mar 8, 2026
Search Tags:#design#ui#accessibility#design system#prototype#ux#wireframe
One-click install
npx skills add https://github.com/ralphjohn29/my-claude-skills --skill ui-ux-designer-ralphjohn29
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-ux-designer
Source: https://github.com/ralphjohn29/my-claude-skills/tree/main/ui-ux-designer
Command: npx skills add https://github.com/ralphjohn29/my-claude-skills --skill ui-ux-designer-ralphjohn29

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill assists in creating user-friendly and visually appealing interfaces by providing guidance on UI/UX design principles, wireframing, prototyping, and design systems.

Core Features & Use Cases

  • UI/UX Design Assistance: Get help with wireframes, mockups, prototypes, and design systems.
  • Accessibility Guidance: Ensure designs meet WCAG standards.
  • Component Design: Learn best practices for creating reusable UI components.
  • Use Case: You need to design a new user dashboard. This Skill can help you create wireframes, suggest color palettes, and ensure the design is accessible.

Quick Start

Use the ui-ux-designer skill to create a wireframe for a user login page.

Frequently Asked Questions about ui-ux-designer

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

FAQPage Schema
How do I design a wireframe for a user login page?▼

To design a wireframe for a user login page, you can use this Skill to generate structural layouts, suggest UI components, and apply user-centered design principles for intuitive interfaces.

What is the best way to ensure my UI design meets accessibility standards?▼

The best way to ensure UI accessibility is to follow WCAG 2.1 standards. This Skill provides specific guidance on making your interfaces compliant, covering component design and responsive layouts.

How do I create reusable UI components for a design system?▼

You can create reusable UI components for a design system by leveraging this Skill's component design guidance, which outlines best practices for building consistent, scalable interface elements.

Can I get help with prototyping and usability testing?▼

Yes, you can get help with prototyping and usability testing. This Skill assists with building interactive prototypes and provides guidance on evaluating user experiences effectively.

Does this Skill offer guidance on responsive layouts?▼

Yes, this Skill offers guidance on responsive layouts. It helps you structure interfaces that adapt across devices while maintaining usability and adhering to accessibility standards.

What is needed to start designing a new user dashboard?▼

To start designing a user dashboard, you need a basic concept of your layout. This Skill helps by generating wireframes, suggesting color palettes, and ensuring the final design is accessible.

Related Skills

Explore More Design & Creative Skills→
adminsairolotech-bitadminsairolotech-bit

design-exploration

Generate a structured design brief and delegate to the design subagent.

Community
Advanced
mchien15mchien15

frontend-design

Convert design references into reusable HTML/CSS/JS components and design tokens.

Community
Advanced
hyperfinity-techhyperfinity-tech

hyper-design

Enforce Hyperfinity brand guidelines for AI-generated visual assets and UI components.

Official
Basic
sfinessfines

bmad-agent-ux-designer

Provide UX design consultation and UI specification assistance.

Community
Intermediate