ui-ux-pro-max

Generate design systems and UX guidance for web and mobile applications.

Updated Jul 15, 2023
One-click install
npx skills add https://github.com/ulasalyesil/personal-website-v2 --skill ui-ux-pro-max-ulasalyesil
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/ulasalyesil/personal-website-v2/tree/main/.cursor/skills/ui-ux-pro-max
Command: npx skills add https://github.com/ulasalyesil/personal-website-v2 --skill ui-ux-pro-max-ulasalyesil

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill provides comprehensive UI/UX design intelligence, offering best practices, style recommendations, and implementation guidelines to create user-friendly and visually appealing interfaces.

Core Features & Use Cases

  • Design System Generation: Creates detailed design systems based on product type, industry, and desired style.
  • UX Rule Enforcement: Enforces critical UX principles like accessibility, performance, and interaction design.
  • Stack-Specific Guidance: Offers tailored advice for various technology stacks including React, Next.js, Vue, and more.
  • Use Case: When designing a new SaaS dashboard, use this Skill to generate a professional design system, select an appropriate color palette, and ensure accessibility compliance.

Quick Start

Use the ui-ux-pro-max skill to generate a design system for a "fintech dashboard" with a "minimalist" style.

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 design system for a web or mobile application?

To generate a design system, you specify your product type, industry, and desired style. The Skill then produces a professional design system including typography, color palettes, and component design guidelines for your web or mobile application.

How do I ensure my frontend interface meets accessibility and UX best practices?

You ensure accessibility and UX compliance by applying enforced UX rules to your interface design. The Skill provides actionable recommendations that enforce critical UX principles like accessibility, performance, and interaction design across your frontend development stack.

Does this UI/UX guidance tool support specific frontend development stacks like React or Vue?

Yes, this UI/UX guidance tool supports specific frontend development stacks including React, Next.js, and Vue. It offers stack-specific guidance to ensure design system implementation matches your technology stack requirements.

Can I use this to create a style guide for a specific industry like a fintech dashboard?

Yes, you can create a style guide for a specific industry like a fintech dashboard. By defining the industry and a minimalist style during design system generation, you receive tailored UI/UX recommendations and a matching color palette.

What is the best way to select a color palette and typography for a SaaS dashboard?

The best way to select a color palette and typography for a SaaS dashboard is to use design intelligence recommendations. This approach generates stack-specific style selections that align with your product type while ensuring accessibility compliance.

Why do I need UX rule enforcement when building user interfaces?

You need UX rule enforcement when building user interfaces to guarantee professional, accessible, and performant outcomes. Enforcing these critical UX principles during frontend development prevents usability issues and ensures visually appealing, user-friendly interfaces.