skills.rest
Dsantiagomj
DsantiagomjCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

ui-ux

Create accessible, user-centered interfaces for web and mobile projects.

Updated Aug 27, 2026
Search Tags:#design#ui#accessibility#responsive#ux#design-systems#component-patterns
One-click install
npx skills add https://github.com/Dsantiagomj/DSMJ-Ai-Toolkit --skill ui-ux
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-ux
Source: https://github.com/Dsantiagomj/DSMJ-Ai-Toolkit/tree/main/skills/domain/ui-ux
Command: npx skills add https://github.com/Dsantiagomj/DSMJ-Ai-Toolkit --skill ui-ux

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill helps designers craft accessible, user-centered interfaces that perform well across devices and contexts.

Core Features & Use Cases

  • Establishes accessibility best practices (contrast, focus, keyboard navigation) in UI components.
  • Guides responsive design and design-system consistency across themes.
  • Use cases include building, reviewing, and refining UI components, visual patterns, and interaction flows for web and mobile apps.

Quick Start

Start by auditing existing components for accessibility and responsiveness, then apply these guidelines to new UI elements.

Frequently Asked Questions about ui-ux

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

FAQPage Schema
How do I make UI components accessible and meet WCAG guidelines?▼

To make UI components accessible, enforce color contrast, keyboard navigation, and focus management to meet WCAG guidelines. Review existing elements for these accessibility best practices before applying them to new interface designs.

What is the best way to establish consistency across a design system?▼

Establishing design system consistency requires applying standardized visual patterns and theming rules across all components. Guide responsive design behaviors to maintain uniform interactions and layouts across different web and mobile themes.

How do I audit existing UI elements for responsiveness and accessibility?▼

Audit existing UI elements by checking their responsive layout behavior and accessibility compliance. Review visual patterns and interaction flows against WCAG contrast and keyboard navigation standards, then apply refinements to meet user-centered design criteria.

Can I use these UX guidelines for both web and mobile app projects?▼

Yes, these UX guidelines apply to both web and mobile app projects. The approach supports designing, reviewing, and refining user-centered interfaces, ensuring responsive layouts and accessibility across various devices and contexts.

Why does my UI design system need responsive layout enforcement?▼

Your design system needs responsive layout enforcement to ensure interfaces perform well across different device contexts. Applying consistent patterns and theming rules prevents visual fragmentation and maintains accessibility standards throughout the application.

Related Skills

Explore More Design & Creative Skills→
fajjarnrfajjarnr

product-designer

Codify a premium UI/UX system with tokens and audit patterns for design governance.

Community
Advanced
GrishaAngelovGHGrishaAngelovGH
15

frontend-ui-designer

Design and refine frontend interfaces for clarity, usability, and visual hierarchy.

Community
Intermediate
flpbaladaflpbalada
280

code-architecture-tailwind-v4-best-practices

Guide Tailwind v4 component abstraction choices among utilities, CVA, and Tailwind Variants.

Community
Intermediate
blakeoxblakeox

a11y-audit

Audit web interfaces for WCAG 2.2 AA accessibility compliance.

Community
Advanced