skills.rest
Yanick-mj
Yanick-mjCOMMUNITY
Explore all skills by this author →
GitHub

mb-skill-ux-design

Provide UX design guidance for mobile and web interfaces.

Updated Apr 6, 2026
Search Tags:#ui#accessibility#ux#design-systems#mobile-patterns#form-design#web-patterns
One-click install
npx skills add https://github.com/Yanick-mj/mb-framework --skill mb-skill-ux-design
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: mb-skill-ux-design
Source: https://github.com/Yanick-mj/mb-framework/tree/main/skills/ux-design
Command: npx skills add https://github.com/Yanick-mj/mb-framework --skill mb-skill-ux-design

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Provides clear, actionable UX guidance to help teams design consistent, accessible, and user-friendly interfaces so implementations match product goals and accessibility standards.

Core Features & Use Cases

  • Principles: Consistency, feedback, forgiveness, discoverability, and accessibility to guide design decisions.
  • Patterns: Mobile (bottom sheets, pull-to-refresh, skeleton loaders), Web (responsive breakpoints, loading and error states, breadcrumbs), and Form design (inline validation, smart defaults).
  • Visuals & Typography: Contrast ratios, limited font families, recommended line heights, and max line length guidance.
  • Use Case: Frontend engineers and product designers can request a focused audit of a screen or component to receive prioritized UX and accessibility improvements.

Quick Start

Ask the skill to audit the signup screen and return prioritized UX, accessibility, and responsive recommendations.

Frequently Asked Questions about mb-skill-ux-design

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

FAQPage Schema
How do I ensure my UI meets WCAG 2.1 AA contrast ratios and accessibility standards?▼

To ensure UI meets WCAG 2.1 AA accessibility standards, apply contrast ratio checks and typography limits like recommended line heights and max line lengths. This provides clear, actionable UX guidance for accessible interface design.

What are common mobile interaction patterns like bottom sheets and pull-to-refresh?▼

Mobile interaction patterns like bottom sheets and pull-to-refresh are standard UI components that provide consistency and feedback. They guide user expectations by offering familiar, discoverable gestures for native-feeling mobile interfaces.

How do I design forms with inline validation and smart defaults?▼

Design forms with inline validation and smart defaults to provide immediate feedback and forgiveness. This approach reduces user input errors by validating data entry in real-time while pre-filling logical default values.

What responsive breakpoint conventions should I use for web interfaces?▼

Responsive breakpoint conventions for web interfaces structure layouts across screen sizes by applying consistent loading and error states. These conventions ensure responsive design adaptability while maintaining visual consistency.

Can I get a UX audit for a specific screen or component?▼

You can request a focused UX audit for a specific screen or component to receive prioritized recommendations. This audit evaluates mobile and web interfaces, returning actionable improvements for accessibility and responsive behavior.

What UX principles guide consistent and user-friendly interface design?▼

UX principles of consistency, feedback, forgiveness, discoverability, and accessibility guide user-friendly interface design. These principles direct design decisions to ensure implementations match product goals and accessibility standards.

Related Skills

Explore More Design & Creative Skills→
blakeoxblakeox

product-design-review

Analyze product interfaces and user flows for usability and visual design deficiencies.

Community
Intermediate
pingwupingwu
12

frontend-ui-ux

Design accessible, mobile-first frontend UI/UX for modern web apps.

Community
Advanced
jac007xjac007x

design-system-validator

Audit Walmart design-system compliance across tokens, components, and spacing.

Community
Advanced
timsvoicetimsvoice

specimin-ui-accessibility

Audit and fix generated UI code for WCAG 2.1 AA compliance.

Community
Advanced