Skip to main content

​
Overview

The product domain helps you find the right design direction for your product type. It maps product categories to recommended styles, color palettes, and landing page patterns. Database: products.csv (20+ product types)
Search columns: Product Type, Keywords, Primary Style Recommendation, Key Considerations
Output columns: All product details including styles, colors, and dashboard types

​
When to Use

  • Starting a new project and need design direction
  • Choosing between multiple style options
  • Understanding industry-specific design patterns
  • Matching styles to product categories

​
Search Examples

​
Example 1: SaaS Application

python3 skills/ui-ux-pro-max/scripts/search.py "saas b2b cloud" --domain product

{
  "domain": "product",
  "results": [
    {
      "Product Type": "SaaS (General)",
      "Keywords": "app, b2b, cloud, general, saas, software, subscription",
      "Primary Style Recommendation": "Glassmorphism + Flat Design",
      "Secondary Styles": "Soft UI Evolution, Minimalism",
      "Landing Page Pattern": "Hero + Features + CTA",
      "Dashboard Style (if applicable)": "Data-Dense + Real-Time Monitoring",
      "Color Palette Focus": "Trust blue + accent contrast",
      "Key Considerations": "Balance modern feel with clarity. Focus on CTAs."
    }
  ]
}

​
Example 2: E-commerce Store

python3 skills/ui-ux-pro-max/scripts/search.py "ecommerce store shop retail" --domain product

{
  "domain": "product",
  "results": [
    {
      "Product Type": "E-commerce",
      "Keywords": "buy, commerce, e, ecommerce, products, retail, sell, shop, store",
      "Primary Style Recommendation": "Vibrant & Block-based",
      "Secondary Styles": "Aurora UI, Motion-Driven",
      "Landing Page Pattern": "Feature-Rich Showcase",
      "Dashboard Style (if applicable)": "Sales Intelligence Dashboard",
      "Color Palette Focus": "Brand primary + success green",
      "Key Considerations": "Engagement & conversions. High visual hierarchy."
    }
  ]
}

​
Example 3: Healthcare Application

python3 skills/ui-ux-pro-max/scripts/search.py "healthcare medical patient clinic" --domain product

{
  "domain": "product",
  "results": [
    {
      "Product Type": "Healthcare App",
      "Keywords": "app, clinic, health, healthcare, medical, patient",
      "Primary Style Recommendation": "Neumorphism + Accessible & Ethical",
      "Secondary Styles": "Soft UI Evolution, Claymorphism (for patients)",
      "Landing Page Pattern": "Social Proof-Focused",
      "Dashboard Style (if applicable)": "User Behavior Analytics",
      "Color Palette Focus": "Calm blue + health green + trust",
      "Key Considerations": "Accessibility mandatory. Calming aesthetic."
    }
  ]
}

​
CSV Structure

ColumnDescriptionExample
NoRow number1
Product TypeCategory name”SaaS (General)“
KeywordsSearch terms”app, b2b, cloud, saas”
Primary Style RecommendationMain style”Glassmorphism + Flat Design”
Secondary StylesAlternative styles”Soft UI Evolution, Minimalism”
Landing Page PatternPage structure”Hero + Features + CTA”
Dashboard Style (if applicable)If product has dashboard”Data-Dense + Real-Time Monitoring”
Color Palette FocusColor strategy”Trust blue + accent contrast”
Key ConsiderationsDesign priorities”Balance modern feel with clarity”

​
Product Categories

Product TypePrimary StyleUse Case
SaaS (General)Glassmorphism + Flat DesignGeneral B2B software
Micro SaaSFlat Design + Vibrant & BlockIndie/solo SaaS
E-commerceVibrant & Block-basedOnline retail
E-commerce LuxuryLiquid Glass + GlassmorphismHigh-end retail
Service Landing PageHero-Centric + Trust & AuthorityService businesses
B2B ServiceTrust & Authority + MinimalEnterprise services
Financial DashboardDark Mode (OLED) + Data-DenseFinance/trading apps
Analytics DashboardData-Dense + Heat MapAnalytics platforms
Healthcare AppNeumorphism + Accessible & EthicalMedical/health apps
FintechDark Mode (OLED) + GlassmorphismFinancial technology
Gaming3D & Hyperrealism + Motion-DrivenGames/entertainment
PortfolioMinimal + Motion-DrivenCreative portfolios
EducationClaymorphism + AccessibleLearning platforms
Crypto/Web3Glassmorphism + Aurora UIBlockchain apps

​
Integration with Other Domains

The product domain provides recommendations that link to other domains: 
# 1. Get product recommendation
python3 skills/ui-ux-pro-max/scripts/search.py "saas" --domain product
# Returns: Primary Style = "Glassmorphism + Flat Design"

# 2. Get style implementation details
python3 skills/ui-ux-pro-max/scripts/search.py "glassmorphism" --domain style
# Returns: CSS implementation, AI prompts, design system variables

# 3. Get color palette
python3 skills/ui-ux-pro-max/scripts/search.py "saas" --domain color
# Returns: Trust blue (#2563EB) + orange CTA (#F97316)

# 4. Get typography
python3 skills/ui-ux-pro-max/scripts/search.py "modern professional" --domain typography
# Returns: Poppins + Open Sans

​
Tips for Better Results

Be Specific

Use industry-specific terms: “healthcare saas” > “app”

Combine Keywords

Mix product type + industry: “ecommerce luxury fashion”

Include Context

Add usage context: “saas dashboard analytics”

Try Variations

If no match, try different keywords: “b2b” vs “enterprise”

​
Next Steps

Explore Styles

Get implementation details for recommended styles

Choose Colors

Find color palettes for your product type

Landing Patterns

Learn landing page structures

Typography

Select font pairings

Build docs developers (and LLMs) love

Get started for freeTalk to us