skills.rest
aws-samples
aws-samplesOFFICIAL
Explore all skills by this author →
WebsiteGitHub

ui-ux-pro-max

Generate UI/UX design systems with stack-specific implementation guidelines.

320|78|Updated Dec 13, 2019
Search Tags:#design system#ui/ux#prototyping#component library#web design#frontend development
One-click install
npx skills add https://github.com/aws-samples/designing-cloud-native-microservices-on-aws --skill ui-ux-pro-max-aws-samples
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/aws-samples/designing-cloud-native-microservices-on-aws/tree/main/.kiro/steering/ui-ux-pro-max
Command: npx skills add https://github.com/aws-samples/designing-cloud-native-microservices-on-aws --skill ui-ux-pro-max-aws-samples

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires csv, re, pathlib, math, collections, json, os, datetime, argparse, sys, io, and includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill streamlines the UI/UX design process by providing data-driven recommendations, ensuring professional, user-friendly, and technically sound designs across various platforms.

Core Features & Use Cases

  • Comprehensive Design System Generation: Creates detailed design systems including patterns, styles, color palettes, and typography based on project requirements.
  • Stack-Specific Guidelines: Offers best practices for implementation in various frontend stacks like React, Next.js, and HTML/Tailwind.
  • Use Case: A startup needs to design a new SaaS dashboard. They can use this Skill to generate a complete design system, ensuring consistency and adherence to modern UX principles from the outset.

Quick Start

Generate a design system for a 'fintech mobile app' project.

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 SaaS dashboard?▼

Yes, you can use this skill for frontend development in React and Next.js. It provides stack-specific implementation guidelines and best practices for generating UI component libraries alongside your design system.

What is the best way to ensure UI consistency across web design projects?▼

Yes, this skill supports HTML/Tailwind, React, and Next.js. It offers stack-specific implementation guidelines and best practices to help you build user-friendly and technically sound frontend interfaces.

How do I create a UI component library for a fintech mobile app?▼

You can create a UI component library for a fintech mobile app by generating a complete design system. This skill outputs detailed patterns, styles, and typography recommendations based on your specific project requirements.

Why does my web design lack professional user experience patterns?▼

Your web design may lack professional user experience patterns due to inconsistent design choices. This skill solves suboptimal design by offering data-driven UX recommendations and generating a comprehensive design system tailored to your product type.

Related Skills

Explore More Design & Creative Skills→
TheBushidoCollectiveTheBushidoCollective
187

storybook-configuration

Configure Storybook main and preview files with addons and framework-specific builders.

Official
Intermediate
jamestorrevillasjamestorrevillas
3

frontend-design

Design scalable frontend UI components and architecture across React, Next.js, Angular, and Tailwind.

Community
Advanced
sanky369sanky369
29

design-engineer-mindset

Translate UI prototypes into frontend components with optimized animation performance.

Community
Advanced
d0d012d0d012
9

figma-design

Extract tokens, styles, and constraints from Figma design files.

Community
Advanced