skills.rest
changgenglu
changgengluCOMMUNITY
Explore all skills by this author →
GitHub

ux-designer

Provide UX guidance for design systems, responsive layouts, and WCAG accessibility.

Updated Jul 13, 2023
Search Tags:#accessibility#wcag#ux-design#design-system#responsive-design#usability-testing
One-click install
npx skills add https://github.com/changgenglu/changgenglu-blog --skill ux-designer-changgenglu
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ux-designer
Source: https://github.com/changgenglu/changgenglu-blog/tree/main/prompt_engineering/gemini/skills/ux-designer
Command: npx skills add https://github.com/changgenglu/changgenglu-blog --skill ux-designer-changgenglu

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Provides expert guidance across UX design, design-system architecture, responsive design, and accessibility (WCAG) to accelerate user-centered product decisions.

Core Features & Use Cases

  • Design System Architecture guidance to establish foundations, components, and patterns for scalable interfaces.
  • Accessibility and WCAG compliance checks focusing on contrast, keyboard navigation, and screen-reader semantics.
  • Usability testing planning and evaluation to identify friction and validate design choices.
  • Use Case: guiding a checkout flow redesign to improve clarity, inclusivity, and conversion.

Quick Start

Run a UX design review of a specific screen and generate a concise design-system outline with accessibility checks.

Frequently Asked Questions about ux-designer

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

FAQPage Schema
How do I check my web interface for WCAG accessibility compliance?▼

To check WCAG accessibility compliance, evaluate your web interface for color contrast ratios, keyboard navigation flows, and screen-reader semantics. This identifies inclusivity gaps and ensures your product meets usability standards for users with disabilities.

What is included in a design system architecture foundation?▼

A design system architecture foundation includes color system recommendations, spacing tokens, component classifications, and responsive breakpoints. Establishing these scalable foundations ensures interface consistency and accelerates user-centered product decisions across web and mobile platforms.

How do I plan usability testing for a checkout flow redesign?▼

Plan usability testing for a checkout flow redesign by defining evaluation workflows that identify user friction and validate design choices. This testing approach improves clarity, inclusivity, and conversion rates by validating interface optimizations before deployment.

Can I get responsive design guidance for both web and mobile platforms?▼

Yes, you can get responsive design guidance for both web and mobile platforms. The guidance covers responsive breakpoints and layout optimizations to ensure your product interface adapts correctly and maintains usability across different device sizes.

What's the best way to review a specific screen for UX design improvements?▼

The best way to review a specific screen for UX design improvements is to run a structured UX evaluation. This generates a concise design-system outline with integrated accessibility checks to identify friction and optimize interface clarity.

Related Skills

Explore More Design & Creative Skills→
k2worksk2works

developing-uiux-review

Review UI/UX deliverables for usability, accessibility, and Material Design 3 compliance.

Community
Advanced
h4vzzh4vzz
33

Frontend Design

Generate accessible React, Vue, Svelte, or HTML components with design tokens.

Community
Advanced
xcrrrxcrrr
4

frontend-design

Generate frontend design specifications with CSS custom properties and component states.

Community
Advanced
fsollafsolla

ux-heuristics

Evaluate interface usability against Nielsen's 10 heuristics and Krug's principles.

Community
Intermediate