ui-ux-pro-max_skill

Overview

This skill provides UI/UX design intelligence for web and mobile projects, combining style systems, color palettes, typography pairings, chart recommendations, and stack-specific guidance. It returns a prioritized, searchable design system and actionable implementation rules to speed design decisions. Use it to generate consistent visual systems, anti-pattern checks, and developer-ready recommendations.

How this skill works

When called, the skill analyzes product type, style keywords, industry, and target technology stack to search multiple domains (product, style, color, typography, ux, chart, landing). It composes a complete design system (--design-system) that includes patterns, colors, typography, effects, anti-patterns, and optional persistence for hierarchical overrides. Domain and stack flags let you request focused results (charts, accessibility, tailwind/react guidance) for implementation-ready output.

When to use it

• Kick off a new product UI or landing page and need a complete design system fast
• Standardize visual language across pages or teams and create a Master + page overrides workflow
• Choose color palettes, font pairings, and chart types tailored to industry and product type
• Audit an existing UI for anti-patterns, accessibility, and interaction issues
• Get stack-specific implementation tips when implementing in Tailwind, React, Next.js, Flutter, etc.

Best practices

• Always begin with --design-system to get holistic recommendations and anti-patterns
• Be specific with keywords (e.g., "healthcare SaaS dashboard") to improve relevance
• Persist the design system when working across multiple pages to enable hierarchical overrides
• Combine domains (style + typography + color) to produce coherent systems rather than isolated choices
• Run UX checks (animation, accessibility, focus states) before final delivery and test both light/dark modes

Example use cases

• Generate a design system for a SaaS dashboard with color, typography, and chart recommendations
• Create a landing page visual system for a beauty/spa service and persist page-specific overrides
• Audit a mobile app for interaction rules: hover/focus feedback, cursor behavior, and reduced-motion support
• Request chart recommendations and libraries for a real-time analytics dashboard with accessibility constraints