ui-ux-pro-max

Generates prioritized UI/UX and accessibility recommendations for web and mobile interfaces.

Updated Mar 27, 2026
One-click install
npx skills add https://github.com/NoManPlay/my-skills --skill ui-ux-pro-max-nomanplay
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/NoManPlay/my-skills/tree/main/skills/ui-ux-pro-max
Command: npx skills add https://github.com/NoManPlay/my-skills --skill ui-ux-pro-max-nomanplay

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

It helps you avoid inconsistent, inaccessible, or poorly structured UI by providing a prioritized design and UX guideline workflow for web and mobile.

Core Features & Use Cases

  • Design-system recommendations from intent: Turn a brief (product type, style keywords, industry, and optional project name) into a cohesive pattern, style, colors, and typography.
  • Priority-based UX guardrails: Focus first on critical accessibility and touch interaction guidance before moving to performance, responsive layout, and animation.
  • Implementation-aware guidance via stacks: Use stack-specific searches (defaulting to html-tailwind when unspecified) for practical code-aligned recommendations.
  • Example: When building a SaaS dashboard, use it to select an accessible layout pattern, an appropriate design style, a color palette that supports readable contrast, and typography pairings aligned to a professional tone.

Quick Start

Ask: “Design a SaaS dashboard UI for fintech with an elegant professional style, including accessibility and responsive layout guidance; default to html-tailwind.”

Frequently Asked Questions about ui-ux-pro-max

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

FAQPage Schema
How do I generate a UI design system for a web or mobile interface?▼

Generate a UI design system by providing a brief with product type, style keywords, and industry. This produces cohesive patterns, accessible color palettes, and typography pairings tailored to your project intent. It applies priority-based UX guardrails to ensure structured interfaces.

What is the best way to ensure color palette accessibility and touch interaction in responsive layouts?▼

The best way to ensure accessibility is using priority-based UX guardrails that focus first on critical contrast and touch interaction guidance. It evaluates color palettes for readable contrast and responsive layouts before addressing performance and animation.

Can I use this to design a SaaS dashboard with html-tailwind constraints?▼

Yes, you can design a SaaS dashboard using stack-specific searches, defaulting to html-tailwind when unspecified. It provides practical code-aligned recommendations for accessible layout patterns, professional typography pairings, and readable color palettes.

How do I select typography pairings and UX guidelines for a fintech landing page?▼

Select typography pairings by defining an elegant professional style and fintech industry in your brief. It generates UX-ready recommendations prioritizing accessibility, responsive layout, and performance to build cohesive landing page structures.

Does this UX workflow support reviewing existing component structures for accessibility issues?▼

Yes, the UX workflow supports reviewing existing component structures for accessibility issues. It applies prioritized design intelligence to evaluate touch interaction, readable contrast, and performance constraints across web and mobile interfaces.