UI/UX Pro Max Skill
Version: 1.0.0 Source: Fork from nextlevelbuilder/ui-ux-pro-max-skill License: MIT
Module 01: Skill Identity
Core Mission
Provide AI-assisted design intelligence for UI/UX decisions, enabling developers to create professional-grade interfaces without deep design expertise.
Value Proposition
-
58+ UI styles with compatibility and performance ratings
-
95+ color palettes categorized by industry
-
56+ typography pairings with Google Fonts integration
-
24+ chart types with accessibility guidance
-
98+ UX guidelines for common anti-patterns
Applicable Scenarios
-
Creating new website/app designs
-
Filling site-design.contract.yaml for Builder system
-
Choosing color schemes for specific industries
-
Selecting typography for brand identity
-
Evaluating UX compliance
Boundaries
-
Does NOT generate code directly (use Builder for that)
-
Does NOT make aesthetic judgments (provides options, user decides)
-
Does NOT replace professional design review for production
Module 02: Capability Model
Capability Description Proficiency
Style Discovery Find UI styles matching requirements High
Color Recommendation Suggest palettes by industry/mood High
Typography Pairing Match fonts for heading/body High
Chart Selection Choose visualization types for data Medium
UX Audit Identify anti-patterns and issues Medium
Stack Guidelines Framework-specific best practices Medium
Module 03: Mental Models
BM25 Ranking
Search uses BM25 algorithm for relevance scoring:
-
TF-IDF weighting for term importance
-
Document length normalization
-
Query term frequency saturation
Domain Detection
Auto-detects search domain from keywords:
-
"color", "palette" → color domain
-
"SaaS", "dashboard" → product domain
-
"font", "typography" → typography domain
Module 04: Methods & SOPs
SOP: Contract-Driven Design
Phase 1: Discover Style
python scripts/search.py "modern SaaS dashboard" --domain style
Phase 2: Select Colors
python scripts/search.py "SaaS enterprise" --domain color
Phase 3: Choose Typography
python scripts/search.py "professional tech" --domain typography
Phase 4: Generate Contract Use results to fill site-design.contract.yaml :
tokens: colors: primary: "#3B82F6" # From color search background: "#FFFFFF" typography: primary_font: "Inter" # From typography search heading_font: "Poppins"
Phase 5: Run Builder
npx tsx builders/theme-factory/builder.ts <track-id>
Module 05: Execution Protocols
Pre-Checklist
-
User has described target audience
-
User has specified industry/domain
-
User has indicated mood/tone preference
Decision Logic
IF industry specified → search color with industry keyword ELIF mood specified → search style with mood keyword ELSE → search product with general keyword
Quality Standards
-
Always provide 3+ options for user choice
-
Include accessibility ratings in recommendations
-
Note performance implications for complex styles
Module 06: Output Structure
Style Recommendation Template
Recommended Style: [Style Name]
Why this style:
- [Reason 1]
- [Reason 2]
Colors:
- Primary: [hex] - [usage]
- Background: [hex] - [usage]
Typography:
- Heading: [font name]
- Body: [font name]
Performance: [rating] Accessibility: [rating]
Module 07: Templates & Prompts
Activation Prompt
Search UI/UX Pro Max for design recommendations:
- Industry: [specify]
- Style preference: [modern/classic/playful/professional]
- Color mood: [warm/cool/vibrant/muted]
Quick Start
Find styles for SaaS
python scripts/search.py "SaaS modern" --domain style
Find colors for healthcare
python scripts/search.py "healthcare trust" --domain color
Find typography for tech startup
python scripts/search.py "startup tech" --domain typography
Module 08: Tools Access
Required Tools
-
Python 3.x (no external dependencies)
-
CSV data files in data/ directory
Knowledge Assets
Asset File Records
Styles styles.csv
58
Colors colors.csv
95
Typography typography.csv
56
Charts charts.csv
24
UX Guidelines ux-guidelines.csv
98
Icons icons.csv
100
Integration Points
-
Builder system reads Contract, this Skill helps write Contract
-
Assembler can trigger this Skill via keywords
Module 09: Evaluation & Scoring
Output Quality Metrics
-
Relevance: Does recommendation match user intent?
-
Completeness: Are all required fields covered?
-
Actionability: Can user directly use in Contract?
Pass Criteria
-
At least 1 relevant result per search
-
Accessibility rating provided
-
Performance impact noted
Module 10: Feedback & Evolution
Evolution Triggers
-
New UI style trends emerge
-
Framework compatibility changes
-
User feedback on missing categories
Version History
Version Date Changes
1.0.0 2026-01-14 Initial fork from UI UX Pro Max
Upstream Sync
Check for updates
cd /tmp && git clone --depth 1 https://github.com/nextlevelbuilder/ui-ux-pro-max-skill.git