@elsahafy/ux-mcp-server 2.0.0 → 4.0.0

package/dist/index.js

@@ -109,6 +109,150 @@ server.setRequestHandler(ListResourcesRequestSchema, async () => {
                 description: "Advanced React patterns for composition, state management, and performance",
                 mimeType: "application/json",
             },
+            {
+                uri: "ux://forms/patterns",
+                name: "Form Design Patterns",
+                description: "Comprehensive guide to designing accessible, user-friendly forms",
+                mimeType: "application/json",
+            },
+            {
+                uri: "ux://content/microcopy",
+                name: "Microcopy & UX Writing",
+                description: "Guide to writing clear, user-friendly interface copy and microcopy",
+                mimeType: "application/json",
+            },
+            {
+                uri: "ux://design/typography",
+                name: "Typography System",
+                description: "Type scales, font pairing, hierarchy, and responsive typography",
+                mimeType: "application/json",
+            },
+            {
+                uri: "ux://design/color-theory",
+                name: "Color Theory & Palettes",
+                description: "Color theory, palette generation, accessibility, and color usage",
+                mimeType: "application/json",
+            },
+            {
+                uri: "ux://mobile/patterns",
+                name: "Mobile-Specific UX Patterns",
+                description: "Mobile-first design, touch interactions, and mobile navigation patterns",
+                mimeType: "application/json",
+            },
+            {
+                uri: "ux://vue/patterns",
+                name: "Vue.js Patterns & Best Practices",
+                description: "Vue.js component patterns, Composition API, and state management",
+                mimeType: "application/json",
+            },
+            {
+                uri: "ux://angular/patterns",
+                name: "Angular Patterns & Best Practices",
+                description: "Angular component patterns, services, RxJS, and performance optimization",
+                mimeType: "application/json",
+            },
+            {
+                uri: "ux://data-viz/patterns",
+                name: "Data Visualization Patterns",
+                description: "Choosing, designing, and implementing accessible data visualizations",
+                mimeType: "application/json",
+            },
+            {
+                uri: "ux://ecommerce/patterns",
+                name: "E-commerce UX Patterns",
+                description: "E-commerce user experience patterns, conversion optimization, and best practices",
+                mimeType: "application/json",
+            },
+            {
+                uri: "ux://ia/information-architecture",
+                name: "Information Architecture",
+                description: "Organizing and structuring information for optimal findability and usability",
+                mimeType: "application/json",
+            },
+            {
+                uri: "ux://testing/validation",
+                name: "UX Testing & Validation",
+                description: "User experience testing methodologies, validation techniques, and research methods",
+                mimeType: "application/json",
+            },
+            {
+                uri: "ux://pwa/patterns",
+                name: "Progressive Web App Patterns",
+                description: "Building progressive web apps with optimal UX patterns and best practices",
+                mimeType: "application/json",
+            },
+            {
+                uri: "ux://ethics/dark-patterns",
+                name: "Ethical Design & Dark Patterns",
+                description: "Ethical design principles and avoiding dark patterns that manipulate users",
+                mimeType: "application/json",
+            },
+            {
+                uri: "ux://design-systems/advanced",
+                name: "Advanced Design System Patterns",
+                description: "Advanced concepts for building, scaling, and maintaining enterprise design systems",
+                mimeType: "application/json",
+            },
+            {
+                uri: "ux://saas/patterns",
+                name: "SaaS Product UX Patterns",
+                description: "UX patterns for SaaS products including onboarding, pricing, and retention",
+                mimeType: "application/json",
+            },
+            {
+                uri: "ux://analytics/metrics",
+                name: "UX Analytics & Metrics",
+                description: "Measuring user experience through analytics, metrics, and data-driven decision making",
+                mimeType: "application/json",
+            },
+            {
+                uri: "ux://voice/interface",
+                name: "Voice User Interface (VUI) Design",
+                description: "Designing voice interfaces for assistants, smart speakers, and voice-enabled apps",
+                mimeType: "application/json",
+            },
+            {
+                uri: "ux://ar-vr/interfaces",
+                name: "AR/VR Interface Design",
+                description: "Design principles and patterns for Augmented and Virtual Reality interfaces",
+                mimeType: "application/json",
+            },
+            {
+                uri: "ux://ai-ml/patterns",
+                name: "AI/ML UX Patterns",
+                description: "User experience patterns for AI and machine learning powered features",
+                mimeType: "application/json",
+            },
+            {
+                uri: "ux://haptic/feedback",
+                name: "Haptic Feedback Design",
+                description: "Design guide for tactile feedback in user interfaces across devices",
+                mimeType: "application/json",
+            },
+            {
+                uri: "ux://healthcare/patterns",
+                name: "Healthcare UX Patterns",
+                description: "UX design for healthcare applications prioritizing safety, privacy, and usability",
+                mimeType: "application/json",
+            },
+            {
+                uri: "ux://finance/patterns",
+                name: "Financial Services UX Patterns",
+                description: "UX design for banking, fintech, and financial applications",
+                mimeType: "application/json",
+            },
+            {
+                uri: "ux://neurodiversity/design",
+                name: "Neurodiversity-Inclusive Design",
+                description: "Designing for neurodivergent users including ADHD, autism, and dyslexia",
+                mimeType: "application/json",
+            },
+            {
+                uri: "ux://web-components/patterns",
+                name: "Web Components",
+                description: "Building framework-agnostic, reusable UI components with Web Components",
+                mimeType: "application/json",
+            },
         ],
     };
 });
@@ -165,6 +309,102 @@ server.setRequestHandler(ReadResourceRequestSchema, async (request) => {
             content = await loadKnowledge("react-patterns.json");
             description = "Advanced React component patterns and best practices";
             break;
+        case "ux://forms/patterns":
+            content = await loadKnowledge("forms.json");
+            description = "Comprehensive form design patterns and validation";
+            break;
+        case "ux://content/microcopy":
+            content = await loadKnowledge("microcopy.json");
+            description = "UX writing and microcopy best practices";
+            break;
+        case "ux://design/typography":
+            content = await loadKnowledge("typography.json");
+            description = "Typography system and font pairing guide";
+            break;
+        case "ux://design/color-theory":
+            content = await loadKnowledge("color-theory.json");
+            description = "Color theory, palettes, and accessibility";
+            break;
+        case "ux://mobile/patterns":
+            content = await loadKnowledge("mobile-patterns.json");
+            description = "Mobile-specific UX patterns and touch interactions";
+            break;
+        case "ux://vue/patterns":
+            content = await loadKnowledge("vue-patterns.json");
+            description = "Vue.js patterns and Composition API";
+            break;
+        case "ux://angular/patterns":
+            content = await loadKnowledge("angular-patterns.json");
+            description = "Angular patterns, services, and RxJS";
+            break;
+        case "ux://data-viz/patterns":
+            content = await loadKnowledge("data-viz.json");
+            description = "Data visualization best practices";
+            break;
+        case "ux://ecommerce/patterns":
+            content = await loadKnowledge("ecommerce-patterns.json");
+            description = "E-commerce UX patterns and conversion optimization";
+            break;
+        case "ux://ia/information-architecture":
+            content = await loadKnowledge("information-architecture.json");
+            description = "Information architecture and content organization";
+            break;
+        case "ux://testing/validation":
+            content = await loadKnowledge("testing-validation.json");
+            description = "UX testing methodologies and validation techniques";
+            break;
+        case "ux://pwa/patterns":
+            content = await loadKnowledge("pwa-patterns.json");
+            description = "Progressive Web App patterns and best practices";
+            break;
+        case "ux://ethics/dark-patterns":
+            content = await loadKnowledge("ethical-design.json");
+            description = "Ethical design and dark pattern prevention";
+            break;
+        case "ux://design-systems/advanced":
+            content = await loadKnowledge("design-system-advanced.json");
+            description = "Advanced design system patterns and scaling";
+            break;
+        case "ux://saas/patterns":
+            content = await loadKnowledge("saas-patterns.json");
+            description = "SaaS product UX patterns and strategies";
+            break;
+        case "ux://analytics/metrics":
+            content = await loadKnowledge("analytics-metrics.json");
+            description = "UX analytics, metrics, and measurement";
+            break;
+        case "ux://voice/interface":
+            content = await loadKnowledge("voice-ui.json");
+            description = "Voice user interface design and conversation patterns";
+            break;
+        case "ux://ar-vr/interfaces":
+            content = await loadKnowledge("ar-vr-interfaces.json");
+            description = "AR and VR interface design principles";
+            break;
+        case "ux://ai-ml/patterns":
+            content = await loadKnowledge("ai-ml-patterns.json");
+            description = "AI and ML UX patterns and ethical considerations";
+            break;
+        case "ux://haptic/feedback":
+            content = await loadKnowledge("haptic-feedback.json");
+            description = "Haptic feedback design for tactile interfaces";
+            break;
+        case "ux://healthcare/patterns":
+            content = await loadKnowledge("healthcare-ux.json");
+            description = "Healthcare UX design patterns and regulations";
+            break;
+        case "ux://finance/patterns":
+            content = await loadKnowledge("finance-ux.json");
+            description = "Financial services UX patterns and security";
+            break;
+        case "ux://neurodiversity/design":
+            content = await loadKnowledge("neurodiversity.json");
+            description = "Neurodiversity-inclusive design principles";
+            break;
+        case "ux://web-components/patterns":
+            content = await loadKnowledge("web-components.json");
+            description = "Web Components standards and patterns";
+            break;
         default:
             throw new Error(`Unknown resource: ${uri}`);
     }
@@ -415,6 +655,275 @@ server.setRequestHandler(ListToolsRequestSchema, async () => {
                     required: ["interaction"],
                 },
             },
+            {
+                name: "generate_color_palette",
+                description: "Generate accessible color palette from a base color. Returns primary, secondary, neutral, and semantic colors with WCAG-compliant variations.",
+                inputSchema: {
+                    type: "object",
+                    properties: {
+                        base_color: {
+                            type: "string",
+                            description: "Base color (hex, rgb, or color name)",
+                        },
+                        harmony_type: {
+                            type: "string",
+                            enum: ["monochromatic", "analogous", "complementary", "triadic", "split-complementary"],
+                            description: "Color harmony type to generate",
+                            default: "analogous",
+                        },
+                        include_neutrals: {
+                            type: "boolean",
+                            description: "Include grayscale neutrals",
+                            default: true,
+                        },
+                    },
+                    required: ["base_color"],
+                },
+            },
+            {
+                name: "generate_typography_scale",
+                description: "Calculate modular typography scale with recommended sizes for headings and body text. Returns complete type scale with line heights.",
+                inputSchema: {
+                    type: "object",
+                    properties: {
+                        base_size: {
+                            type: "number",
+                            description: "Base font size in pixels (typically 16)",
+                            default: 16,
+                        },
+                        scale_ratio: {
+                            type: "number",
+                            description: "Scale ratio (e.g., 1.2 for minor third, 1.5 for perfect fifth)",
+                            default: 1.2,
+                        },
+                        steps: {
+                            type: "number",
+                            description: "Number of steps to generate (up and down from base)",
+                            default: 5,
+                        },
+                    },
+                },
+            },
+            {
+                name: "suggest_microcopy",
+                description: "Suggest user-friendly microcopy for UI elements. Returns context-aware suggestions for buttons, labels, messages, and help text.",
+                inputSchema: {
+                    type: "object",
+                    properties: {
+                        element_type: {
+                            type: "string",
+                            enum: ["button", "label", "placeholder", "error", "success", "empty-state", "tooltip", "cta"],
+                            description: "Type of UI element needing copy",
+                        },
+                        context: {
+                            type: "string",
+                            description: "Context of the element (e.g., 'login button', 'email field', 'payment success')",
+                        },
+                        tone: {
+                            type: "string",
+                            enum: ["professional", "friendly", "casual", "formal"],
+                            description: "Desired tone of voice",
+                            default: "friendly",
+                        },
+                    },
+                    required: ["element_type", "context"],
+                },
+            },
+            {
+                name: "suggest_form_pattern",
+                description: "Recommend optimal form layout and validation pattern. Returns layout recommendations, field types, and validation strategies.",
+                inputSchema: {
+                    type: "object",
+                    properties: {
+                        form_type: {
+                            type: "string",
+                            description: "Type of form (e.g., 'login', 'registration', 'checkout', 'contact', 'search')",
+                        },
+                        field_count: {
+                            type: "number",
+                            description: "Approximate number of fields",
+                        },
+                        platform: {
+                            type: "string",
+                            enum: ["web", "mobile", "both"],
+                            description: "Target platform",
+                            default: "both",
+                        },
+                    },
+                    required: ["form_type"],
+                },
+            },
+            {
+                name: "analyze_data_viz",
+                description: "Review data visualization for accessibility and clarity. Checks chart type appropriateness, color usage, labels, and accessibility.",
+                inputSchema: {
+                    type: "object",
+                    properties: {
+                        chart_type: {
+                            type: "string",
+                            description: "Type of chart/visualization (e.g., 'bar chart', 'line chart', 'pie chart', 'scatter plot')",
+                        },
+                        data_description: {
+                            type: "string",
+                            description: "Description of the data being visualized",
+                        },
+                        purpose: {
+                            type: "string",
+                            description: "Purpose of the visualization (e.g., 'comparison', 'trend', 'composition', 'distribution')",
+                        },
+                    },
+                    required: ["chart_type", "data_description"],
+                },
+            },
+            {
+                name: "generate_accessibility_report",
+                description: "Generate comprehensive accessibility audit report. Checks WCAG compliance, keyboard navigation, screen reader compatibility, and semantic HTML.",
+                inputSchema: {
+                    type: "object",
+                    properties: {
+                        url: {
+                            type: "string",
+                            description: "URL or page identifier to audit",
+                        },
+                        wcag_level: {
+                            type: "string",
+                            enum: ["A", "AA", "AAA"],
+                            description: "WCAG compliance level to check against",
+                            default: "AA",
+                        },
+                    },
+                    required: ["url"],
+                },
+            },
+            {
+                name: "suggest_ab_variant",
+                description: "Suggest A/B test variants for optimization. Provides hypothesis, variant designs, and metrics to track.",
+                inputSchema: {
+                    type: "object",
+                    properties: {
+                        element: {
+                            type: "string",
+                            description: "Element to test (e.g., 'CTA button', 'headline', 'pricing page', 'checkout flow')",
+                        },
+                        goal: {
+                            type: "string",
+                            description: "Desired outcome (e.g., 'increase conversions', 'reduce bounce', 'improve engagement')",
+                        },
+                        current_performance: {
+                            type: "string",
+                            description: "Current metric (e.g., '2% conversion rate', '60% bounce rate')",
+                        },
+                    },
+                    required: ["element", "goal"],
+                },
+            },
+            {
+                name: "analyze_information_architecture",
+                description: "Analyze and suggest improvements to information architecture. Reviews navigation, labeling, hierarchy, and content organization.",
+                inputSchema: {
+                    type: "object",
+                    properties: {
+                        site_structure: {
+                            type: "string",
+                            description: "Description or sitemap of current structure",
+                        },
+                        user_goals: {
+                            type: "string",
+                            description: "Primary user goals and tasks",
+                        },
+                        issues: {
+                            type: "string",
+                            description: "Known issues or pain points (optional)",
+                        },
+                    },
+                    required: ["site_structure", "user_goals"],
+                },
+            },
+            {
+                name: "detect_dark_patterns",
+                description: "Detect dark patterns and ethical design violations. Identifies manipulative UI practices and suggests ethical alternatives.",
+                inputSchema: {
+                    type: "object",
+                    properties: {
+                        flow_description: {
+                            type: "string",
+                            description: "Description of user flow or interface (e.g., 'subscription cancellation', 'cookie consent', 'checkout')",
+                        },
+                        screenshot_url: {
+                            type: "string",
+                            description: "URL to screenshot (optional)",
+                        },
+                    },
+                    required: ["flow_description"],
+                },
+            },
+            {
+                name: "calculate_ux_metrics",
+                description: "Calculate key UX metrics and benchmarks. Computes SUS score, NPS, task success rate, and provides interpretation.",
+                inputSchema: {
+                    type: "object",
+                    properties: {
+                        metric_type: {
+                            type: "string",
+                            enum: ["SUS", "NPS", "CSAT", "CES", "task-success", "retention"],
+                            description: "Type of UX metric to calculate",
+                        },
+                        data: {
+                            type: "string",
+                            description: "Raw data (e.g., 'SUS responses: 4,2,5,4,3,2,5,4,4,3' or 'NPS scores: 9,8,10,7,6,9,10')",
+                        },
+                    },
+                    required: ["metric_type", "data"],
+                },
+            },
+            {
+                name: "generate_wireframe",
+                description: "Generate ASCII wireframe mockup for a page or component. Creates low-fidelity layout sketch using text characters.",
+                inputSchema: {
+                    type: "object",
+                    properties: {
+                        page_type: {
+                            type: "string",
+                            description: "Type of page/component (e.g., 'login page', 'dashboard', 'product card', 'navigation header')",
+                        },
+                        elements: {
+                            type: "string",
+                            description: "Key elements to include (e.g., 'logo, search bar, user menu, main content area')",
+                        },
+                        layout: {
+                            type: "string",
+                            enum: ["single-column", "two-column", "three-column", "grid", "sidebar"],
+                            description: "Overall layout structure",
+                            default: "single-column",
+                        },
+                    },
+                    required: ["page_type"],
+                },
+            },
+            {
+                name: "suggest_microinteraction",
+                description: "Suggest microinteractions for UI elements. Provides animation, feedback, and transition recommendations.",
+                inputSchema: {
+                    type: "object",
+                    properties: {
+                        element: {
+                            type: "string",
+                            description: "UI element (e.g., 'button', 'toggle switch', 'like button', 'form submission', 'loading')",
+                        },
+                        context: {
+                            type: "string",
+                            description: "Context of interaction (e.g., 'delete action', 'successful save', 'error state')",
+                        },
+                        platform: {
+                            type: "string",
+                            enum: ["web", "mobile", "both"],
+                            description: "Target platform",
+                            default: "web",
+                        },
+                    },
+                    required: ["element"],
+                },
+            },
         ],
     };
 });
@@ -444,6 +953,30 @@ server.setRequestHandler(CallToolRequestSchema, async (request) => {
                 return await checkSEO(args);
             case "suggest_animation":
                 return await suggestAnimation(args);
+            case "generate_color_palette":
+                return await generateColorPalette(args);
+            case "generate_typography_scale":
+                return await generateTypographyScale(args);
+            case "suggest_microcopy":
+                return await suggestMicrocopy(args);
+            case "suggest_form_pattern":
+                return await suggestFormPattern(args);
+            case "analyze_data_viz":
+                return await analyzeDataViz(args);
+            case "generate_accessibility_report":
+                return await generateAccessibilityReport(args);
+            case "suggest_ab_variant":
+                return await suggestABVariant(args);
+            case "analyze_information_architecture":
+                return await analyzeInformationArchitecture(args);
+            case "detect_dark_patterns":
+                return await detectDarkPatterns(args);
+            case "calculate_ux_metrics":
+                return await calculateUXMetrics(args);
+            case "generate_wireframe":
+                return await generateWireframe(args);
+            case "suggest_microinteraction":
+                return await suggestMicrointeraction(args);
             default:
                 throw new Error(`Unknown tool: ${name}`);
         }
@@ -1598,14 +2131,1483 @@ async function suggestAnimation(args) {
         ],
     };
 }
-// ========================================
-// PROMPTS - Pre-configured UX Reviews
-// ========================================
-server.setRequestHandler(ListPromptsRequestSchema, async () => {
-    return {
-        prompts: [
-            {
-                name: "accessibility_review",
+async function generateColorPalette(args) {
+    const baseColor = args.base_color;
+    const harmonyType = args.harmony_type || "analogous";
+    const includeNeutrals = args.include_neutrals !== false;
+    // Parse base color (simplified - would use proper color library in production)
+    const colorName = baseColor.toLowerCase();
+    let palette = {
+        base_color: baseColor,
+        harmony_type: harmonyType,
+        colors: {
+            primary: {
+                50: "#f0f9ff",
+                100: "#e0f2fe",
+                200: "#bae6fd",
+                300: "#7dd3fc",
+                400: "#38bdf8",
+                500: baseColor,
+                600: "#0284c7",
+                700: "#0369a1",
+                800: "#075985",
+                900: "#0c4a6e",
+                950: "#082f49"
+            }
+        },
+        usage_guide: {
+            50: "Lightest backgrounds",
+            100_200_300: "Light backgrounds, hover states",
+            400: "Borders, disabled states",
+            500: "Primary brand color",
+            600_700: "Interactive elements, buttons",
+            800_900: "Text on light backgrounds",
+            950: "Darkest text"
+        },
+        accessibility: {
+            text_on_50: "Use 700+ for AA contrast",
+            text_on_500: "Use white or 50 for AA contrast",
+            text_on_900: "Use 50-200 for AA contrast"
+        }
+    };
+    if (harmonyType === "complementary") {
+        palette.colors.secondary = {
+            500: "#ff6b35",
+            description: "Complementary (opposite on color wheel)"
+        };
+        palette.usage = "Use primary (60%), secondary (30%), accent (10%)";
+    }
+    else if (harmonyType === "analogous") {
+        palette.colors.secondary = {
+            500: "#8b5cf6",
+            description: "Analogous (adjacent on color wheel)"
+        };
+        palette.colors.tertiary = {
+            500: "#10b981",
+            description: "Analogous variation"
+        };
+    }
+    else if (harmonyType === "triadic") {
+        palette.colors.secondary = {
+            500: "#f59e0b",
+            description: "Triadic (120° apart)"
+        };
+        palette.colors.tertiary = {
+            500: "#10b981",
+            description: "Triadic (240° apart)"
+        };
+    }
+    if (includeNeutrals) {
+        palette.colors.neutral = {
+            50: "#f9fafb",
+            100: "#f3f4f6",
+            200: "#e5e7eb",
+            300: "#d1d5db",
+            400: "#9ca3af",
+            500: "#6b7280",
+            600: "#4b5563",
+            700: "#374151",
+            800: "#1f2937",
+            900: "#111827",
+            950: "#030712",
+            usage: "Backgrounds, text, borders, shadows"
+        };
+    }
+    palette.semantic_colors = {
+        success: { color: "#10b981", use: "Success messages, confirmations" },
+        error: { color: "#ef4444", use: "Errors, destructive actions" },
+        warning: { color: "#f59e0b", use: "Warnings, caution states" },
+        info: { color: "#3b82f6", use: "Informational messages" }
+    };
+    palette.best_practices = [
+        "Use primary color for brand identity and main CTAs",
+        "Limit to 1-2 primary colors maximum",
+        "Create 9-11 shades of each color for flexibility",
+        "Maintain 4.5:1 contrast ratio for text",
+        "Test with colorblind simulators",
+        "Use semantic colors consistently"
+    ];
+    palette.tools = [
+        "Coolors.co - Generate more variations",
+        "Colorbox.io - Accessible color systems",
+        "Stark - Test accessibility"
+    ];
+    return {
+        content: [
+            {
+                type: "text",
+                text: JSON.stringify(palette, null, 2),
+            },
+        ],
+    };
+}
+async function generateTypographyScale(args) {
+    const baseSize = args.base_size || 16;
+    const ratio = args.scale_ratio || 1.2;
+    const steps = args.steps || 5;
+    const scale = {
+        base_size: `${baseSize}px (1rem)`,
+        ratio,
+        ratio_name: getRatioName(ratio),
+        sizes: {}
+    };
+    // Generate sizes
+    for (let i = -steps; i <= steps; i++) {
+        const size = baseSize * Math.pow(ratio, i);
+        const rem = size / 16;
+        const lineHeight = size < 20 ? 1.6 : size < 32 ? 1.4 : size < 48 ? 1.2 : 1.1;
+        let name;
+        if (i === 0)
+            name = "base";
+        else if (i < 0)
+            name = `sm${Math.abs(i) > 1 ? Math.abs(i) : ""}`;
+        else
+            name = `${i > 1 ? i : ""}xl`;
+        scale.sizes[name] = {
+            px: `${size.toFixed(1)}px`,
+            rem: `${rem.toFixed(3)}rem`,
+            line_height: lineHeight.toFixed(2)
+        };
+    }
+    scale.usage_guide = {
+        "sm2-sm": "Fine print, captions, footnotes (12-14px)",
+        "base": "Body text (16px) - never go smaller",
+        "lg-xl": "Subheadings, large body text (18-20px)",
+        "2xl-3xl": "Section headings, h3-h4 (24-32px)",
+        "4xl-5xl": "Page titles, h1-h2 (40-56px)"
+    };
+    scale.recommendations = {
+        headings: {
+            h1: scale.sizes["5xl"] || scale.sizes["4xl"],
+            h2: scale.sizes["4xl"] || scale.sizes["3xl"],
+            h3: scale.sizes["3xl"] || scale.sizes["2xl"],
+            h4: scale.sizes["2xl"] || scale.sizes["xl"],
+            h5: scale.sizes["xl"],
+            h6: scale.sizes["lg"]
+        },
+        body: scale.sizes["base"],
+        small: scale.sizes["sm"],
+        tiny: scale.sizes["sm2"] || scale.sizes["sm"]
+    };
+    scale.css_example = `:root {\n  --font-size-base: ${baseSize}px;\n  --font-size-sm: ${scale.sizes.sm.px};\n  --font-size-lg: ${scale.sizes.lg.px};\n  --font-size-xl: ${scale.sizes.xl.px};\n  --font-size-2xl: ${scale.sizes["2xl"].px};\n  \n  --line-height-tight: 1.2;\n  --line-height-normal: 1.5;\n  --line-height-relaxed: 1.75;\n}`;
+    scale.best_practices = [
+        "Base size should be 16px minimum for body text",
+        "Use rem units for accessibility (respects user preferences)",
+        "Maintain consistent ratio throughout design",
+        "Larger text needs tighter line-height",
+        "Test on actual devices, not just browser resize"
+    ];
+    scale.tools = [
+        "https://typescale.com - Visualize type scales",
+        "https://www.modularscale.com - Generate scales"
+    ];
+    return {
+        content: [
+            {
+                type: "text",
+                text: JSON.stringify(scale, null, 2),
+            },
+        ],
+    };
+}
+function getRatioName(ratio) {
+    const ratios = {
+        1.067: "Minor Second",
+        1.125: "Major Second",
+        1.2: "Minor Third",
+        1.25: "Major Third",
+        1.333: "Perfect Fourth",
+        1.414: "Augmented Fourth",
+        1.5: "Perfect Fifth",
+        1.618: "Golden Ratio"
+    };
+    return ratios[ratio] || "Custom";
+}
+async function suggestMicrocopy(args) {
+    const elementType = args.element_type;
+    const context = args.context.toLowerCase();
+    const tone = args.tone || "friendly";
+    let suggestions = {
+        element_type: elementType,
+        context,
+        tone,
+        suggestions: []
+    };
+    if (elementType === "button") {
+        if (context.includes("login") || context.includes("sign in")) {
+            suggestions.suggestions = [
+                { text: "Sign in", note: "Clear and standard" },
+                { text: "Log in", note: "Alternative, equally clear" },
+                { text: "Continue", note: "If part of multi-step flow" }
+            ];
+            suggestions.avoid = ["Submit", "Enter", "OK"];
+        }
+        else if (context.includes("register") || context.includes("sign up")) {
+            suggestions.suggestions = [
+                { text: "Create account", note: "Specific and action-oriented" },
+                { text: "Sign up", note: "Common and clear" },
+                { text: "Get started", note: "Friendly, inviting" }
+            ];
+        }
+        else if (context.includes("delete") || context.includes("remove")) {
+            suggestions.suggestions = [
+                { text: "Delete permanently", note: "Clear about consequences" },
+                { text: "Remove [item]", note: "Specific about what's being removed" },
+                { text: "Yes, delete", note: "For confirmation dialogs" }
+            ];
+            suggestions.warning = "Require confirmation for destructive actions";
+        }
+        else if (context.includes("save")) {
+            suggestions.suggestions = [
+                { text: "Save changes", note: "Clear about action" },
+                { text: "Save", note: "Simple, works for most cases" },
+                { text: "Save and continue", note: "For multi-step flows" }
+            ];
+        }
+        else if (context.includes("cancel")) {
+            suggestions.suggestions = [
+                { text: "Cancel", note: "Standard and clear" },
+                { text: "Go back", note: "If returning to previous step" },
+                { text: "Discard changes", note: "If changes will be lost" }
+            ];
+        }
+    }
+    else if (elementType === "error") {
+        if (context.includes("email")) {
+            suggestions.suggestions = [
+                { text: "Please enter a valid email address (e.g., name@example.com)", note: "Specific, with example" },
+                { text: "This doesn't look like a valid email address", note: "Friendly tone" }
+            ];
+            suggestions.avoid = ["Invalid email", "Error"];
+        }
+        else if (context.includes("password")) {
+            suggestions.suggestions = [
+                { text: "Password must be at least 8 characters with one number", note: "Specific requirements" },
+                { text: "This password is too weak. Try adding numbers or symbols.", note: "Helpful guidance" }
+            ];
+        }
+        else if (context.includes("required")) {
+            suggestions.suggestions = [
+                { text: "[Field name] is required", note: "Clear and specific" },
+                { text: "Please fill out this field", note: "Polite" }
+            ];
+            suggestions.avoid = ["This field is required", "Required"];
+        }
+    }
+    else if (elementType === "success") {
+        if (context.includes("save") || context.includes("update")) {
+            suggestions.suggestions = [
+                { text: "✓ Changes saved", note: "Short and confirmatory" },
+                { text: "Your settings have been updated", note: "Specific" }
+            ];
+        }
+        else if (context.includes("send") || context.includes("submit")) {
+            suggestions.suggestions = [
+                { text: "Message sent successfully!", note: "Celebratory" },
+                { text: "✓ Submitted. We'll get back to you soon.", note: "Sets expectation" }
+            ];
+        }
+    }
+    else if (elementType === "empty-state") {
+        suggestions.suggestions = [
+            { text: "No [items] yet. [Action] to get started!", note: "Encouraging with CTA" },
+            { text: "You're all caught up!", note: "Positive framing" },
+            { text: "Nothing to show here. [Action] to add [item].", note: "Clear next step" }
+        ];
+        suggestions.structure = "Headline + Optional explanation + Call-to-action";
+    }
+    else if (elementType === "placeholder") {
+        suggestions.suggestions = [
+            { text: "name@example.com", note: "Show format example" },
+            { text: "Search...", note: "Describe action" },
+            { text: "MM/DD/YYYY", note: "Format hint" }
+        ];
+        suggestions.warning = "Never replace labels with placeholders - use both";
+    }
+    suggestions.general_guidelines = {
+        clarity: "Be specific, not vague",
+        conciseness: "Remove unnecessary words",
+        user_centered: "Use 'you' and 'your'",
+        actionable: "Start buttons with verbs",
+        tone: `Maintain ${tone} tone throughout`,
+        dont_blame: "Never blame the user for errors",
+        be_helpful: "Provide guidance on how to fix issues"
+    };
+    suggestions.reference = "See ux://content/microcopy for complete UX writing guide";
+    return {
+        content: [
+            {
+                type: "text",
+                text: JSON.stringify(suggestions, null, 2),
+            },
+        ],
+    };
+}
+async function suggestFormPattern(args) {
+    const formType = args.form_type.toLowerCase();
+    const fieldCount = args.field_count;
+    const platform = args.platform || "both";
+    let pattern = {
+        form_type: formType,
+        field_count: fieldCount || "Not specified",
+        platform
+    };
+    if (formType.includes("login") || formType.includes("sign in")) {
+        pattern.layout = "Single column, simple and focused";
+        pattern.fields = [
+            { name: "Email/Username", type: "email or text", required: true },
+            { name: "Password", type: "password", required: true, features: ["Show/hide toggle"] },
+            { name: "Remember me", type: "checkbox", required: false }
+        ];
+        pattern.additional_elements = [
+            "Forgot password link (prominent)",
+            "Social login options (optional)",
+            "Sign up link"
+        ];
+        pattern.validation = "On submit (least intrusive)";
+        pattern.submit_button = "Sign in";
+    }
+    else if (formType.includes("registration") || formType.includes("signup")) {
+        pattern.layout = "Single column, progressively disclose optional fields";
+        pattern.fields = [
+            { name: "Email", type: "email", required: true },
+            { name: "Password", type: "password", required: true, features: ["Strength indicator", "Requirements shown upfront"] },
+            { name: "Confirm password", type: "password", required: true },
+            { name: "Name", type: "text", required: true }
+        ];
+        pattern.recommendations = [
+            "Keep minimal - only essential fields",
+            "Consider social signup to reduce friction",
+            "Show password requirements before user types",
+            "Validate username availability inline (debounced)",
+            "Terms acceptance checkbox"
+        ];
+        pattern.validation = "Inline on blur + submit validation";
+    }
+    else if (formType.includes("checkout") || formType.includes("payment")) {
+        if (fieldCount && fieldCount > 10) {
+            pattern.layout = "Multi-step wizard with progress indicator";
+            pattern.steps = [
+                { step: 1, name: "Contact info", fields: ["Email", "Phone"] },
+                { step: 2, name: "Shipping address", fields: ["Address fields"] },
+                { step: 3, name: "Payment method", fields: ["Card details"] },
+                { step: 4, name: "Review & confirm", fields: ["Order summary"] }
+            ];
+        }
+        else {
+            pattern.layout = "Single page with clear sections";
+            pattern.sections = ["Contact", "Shipping", "Payment", "Order summary"];
+        }
+        pattern.features = [
+            "Address autocomplete",
+            "Save info for future",
+            "Guest checkout option",
+            "Order summary always visible",
+            "Progress saving (don't lose data)",
+            "Clear error recovery"
+        ];
+        pattern.mobile_considerations = [
+            "Use appropriate input types (tel, email)",
+            "Autocomplete attributes for autofill",
+            "Large touch targets",
+            "Single column layout"
+        ];
+    }
+    else if (formType.includes("search")) {
+        pattern.layout = "Horizontal search bar";
+        pattern.components = [
+            { element: "Input", type: "search", attributes: ["autocomplete", "placeholder"] },
+            { element: "Search button", optional: "Often submit on Enter" },
+            { element: "Clear button", show: "When input has value" }
+        ];
+        pattern.features = [
+            "Autocomplete suggestions (after 2-3 characters)",
+            "Recent searches",
+            "Debounce requests (300ms)",
+            "Keyboard navigation (arrow keys)",
+            "Escape to clear"
+        ];
+    }
+    else if (formType.includes("contact")) {
+        pattern.layout = "Single column, simple";
+        pattern.fields = [
+            { name: "Name", type: "text", required: true },
+            { name: "Email", type: "email", required: true },
+            { name: "Subject", type: "text", required: false },
+            { name: "Message", type: "textarea", required: true, rows: 4 }
+        ];
+        pattern.optional_features = [
+            "File attachment",
+            "CAPTCHA (only after suspicious activity)",
+            "Character count for message"
+        ];
+        pattern.submit_button = "Send message";
+        pattern.success = "Show confirmation message with next steps";
+    }
+    pattern.universal_best_practices = [
+        "Single column layout (especially mobile)",
+        "Mark required fields with * or (required)",
+        "Use appropriate input types for mobile keyboards",
+        "Enable autocomplete where appropriate",
+        "Provide inline validation (on blur)",
+        "Show specific, helpful error messages",
+        "Disable submit during processing",
+        "Show success confirmation",
+        "Never lose user data on errors",
+        "Support keyboard navigation"
+    ];
+    pattern.mobile_optimization = [
+        "Touch targets minimum 44x44px",
+        "Use inputmode for number/decimal inputs",
+        "Handle virtual keyboard appropriately",
+        "Full-width inputs with padding",
+        "Ample spacing between fields (8-16px)"
+    ];
+    pattern.accessibility = [
+        "All inputs have labels (visible preferred)",
+        "Use fieldset and legend for groups",
+        "aria-invalid and aria-describedby for errors",
+        "Focus management",
+        "Keyboard accessible"
+    ];
+    pattern.reference = "See ux://forms/patterns for complete form design patterns";
+    return {
+        content: [
+            {
+                type: "text",
+                text: JSON.stringify(pattern, null, 2),
+            },
+        ],
+    };
+}
+async function analyzeDataViz(args) {
+    const chartType = args.chart_type.toLowerCase();
+    const dataDescription = args.data_description;
+    const purpose = args.purpose?.toLowerCase();
+    let analysis = {
+        chart_type: chartType,
+        data_description: dataDescription,
+        purpose: purpose || "Not specified",
+        assessment: {}
+    };
+    // Assess chart type appropriateness
+    if (chartType.includes("pie") || chartType.includes("donut")) {
+        analysis.appropriateness = {
+            rating: "Caution",
+            notes: "Pie charts often not the best choice",
+            better_alternative: "Bar chart (easier to compare values)",
+            ok_when: "< 6 segments, showing parts of whole",
+            avoid_when: "> 6 segments, comparing values, need precision"
+        };
+    }
+    else if (chartType.includes("bar") || chartType.includes("column")) {
+        analysis.appropriateness = {
+            rating: "Good",
+            notes: "Bar charts are versatile and clear",
+            best_for: "Comparing categories, ranking data",
+            orientation: "Horizontal for many categories or long labels"
+        };
+    }
+    else if (chartType.includes("line")) {
+        analysis.appropriateness = {
+            rating: "Excellent for trends",
+            best_for: "Time series, continuous data, trends",
+            limit: "5-7 lines maximum for readability",
+            alternatives: "Small multiples for many series"
+        };
+    }
+    // Check purpose alignment
+    if (purpose === "comparison" && chartType.includes("pie")) {
+        analysis.purpose_alignment = {
+            rating: "Poor",
+            issue: "Pie charts are hard to compare accurately",
+            recommendation: "Use bar chart instead"
+        };
+    }
+    else if (purpose === "trend" && !chartType.includes("line") && !chartType.includes("area")) {
+        analysis.purpose_alignment = {
+            rating: "Fair",
+            recommendation: "Line chart usually better for showing trends over time"
+        };
+    }
+    // Accessibility checklist
+    analysis.accessibility = {
+        color: {
+            requirement: "Don't rely on color alone to convey information",
+            checks: [
+                "Use patterns/shapes in addition to color",
+                "Maintain 3:1 contrast ratio for chart elements",
+                "Use colorblind-safe palette",
+                "Test with colorblind simulator"
+            ]
+        },
+        alt_text: {
+            requirement: "Provide descriptive alt text",
+            example: `alt='${chartType} showing ${dataDescription} - [describe key insight]'`
+        },
+        data_table: {
+            requirement: "Provide data table alternative",
+            implementation: "Accessible HTML table with proper headers"
+        },
+        keyboard: {
+            requirement: "All interactive elements keyboard accessible",
+            checks: ["Tooltips show on focus", "Logical tab order", "Escape closes tooltips"]
+        }
+    };
+    // Design recommendations
+    analysis.design_recommendations = {
+        title: "Clear, descriptive title",
+        axes: "Label axes with units",
+        legend: "Include legend if multiple series",
+        tooltips: "Show data values on hover/tap",
+        gridlines: "Light, subtle gridlines",
+        whitespace: "Don't cram - leave breathing room",
+        data_labels: "Consider direct labels instead of just legend"
+    };
+    // Specific chart guidance
+    if (chartType.includes("bar") || chartType.includes("column")) {
+        analysis.specific_guidance = {
+            y_axis: "Start at zero (don't truncate)",
+            sorting: "Sort by value unless natural order exists",
+            colors: "Consistent color unless highlighting specific bar",
+            width: "Keep bars same width",
+            avoid: "3D effects, unnecessary decoration"
+        };
+    }
+    else if (chartType.includes("line")) {
+        analysis.specific_guidance = {
+            points: "Show data point markers",
+            lines: "Use distinct colors and patterns",
+            limit: "Maximum 5-7 lines",
+            direct_labels: "Label lines directly, not just in legend",
+            y_axis: "Can start above zero if trend matters more than magnitude (make obvious)"
+        };
+    }
+    else if (chartType.includes("pie") || chartType.includes("donut")) {
+        analysis.specific_guidance = {
+            segments: "Limit to 5-6 maximum",
+            start: "Start at 12 o'clock",
+            order: "Sort by size (largest first)",
+            labels: "Label directly with percentages",
+            avoid: "3D effects, exploding multiple segments"
+        };
+    }
+    // Performance considerations
+    if (dataDescription.toLowerCase().includes("large") || dataDescription.toLowerCase().includes("many")) {
+        analysis.performance = {
+            concern: "Large dataset may impact performance",
+            strategies: [
+                "Aggregate data (e.g., daily to weekly)",
+                "Sample representative subset",
+                "Use Canvas instead of SVG for > 1000 points",
+                "Implement virtualization for scrolling charts",
+                "Progressive loading"
+            ]
+        };
+    }
+    analysis.reference = "See ux://data-viz/patterns for complete data visualization guide";
+    analysis.recommended_tools = [
+        "D3.js (maximum flexibility)",
+        "Chart.js (simple, clean charts)",
+        "Recharts (React components)",
+        "Plotly (interactive, scientific)"
+    ];
+    return {
+        content: [
+            {
+                type: "text",
+                text: JSON.stringify(analysis, null, 2),
+            },
+        ],
+    };
+}
+async function generateAccessibilityReport(args) {
+    const url = args.url;
+    const wcagLevel = args.wcag_level || "AA";
+    const report = {
+        url,
+        wcag_level: wcagLevel,
+        timestamp: new Date().toISOString(),
+        summary: {},
+        findings: [],
+        recommendations: [],
+    };
+    // Automated checks (simulated comprehensive audit)
+    report.automated_checks = {
+        semantic_html: {
+            status: "review_needed",
+            checks: ["Proper heading hierarchy (H1 → H2 → H3)", "Semantic elements (<main>, <nav>, <article>)", "Form structure"]
+        },
+        keyboard_navigation: {
+            status: "review_needed",
+            checks: ["All interactive elements focusable", "Logical tab order", "Visible focus indicators", "No keyboard traps", "Skip links present"]
+        },
+        screen_reader: {
+            status: "review_needed",
+            checks: ["Alt text on images", "ARIA labels on icon buttons", "Form labels", "Live regions for dynamic content", "Heading structure"]
+        },
+        color_contrast: {
+            status: "review_needed",
+            minimum: wcagLevel === "AAA" ? "7:1 (normal text), 4.5:1 (large text)" : "4.5:1 (normal text), 3:1 (large text)"
+        }
+    };
+    // Common issues to check
+    report.findings = [
+        { severity: "critical", category: "Images", issue: "Check for images without alt text", wcag: "1.1.1" },
+        { severity: "critical", category: "Forms", issue: "Verify all inputs have associated labels", wcag: "3.3.2" },
+        { severity: "major", category: "Color", issue: "Ensure sufficient color contrast for all text", wcag: "1.4.3" },
+        { severity: "major", category: "Keyboard", issue: "Test all functionality is keyboard accessible", wcag: "2.1.1" },
+        { severity: "major", category: "Focus", issue: "Verify visible focus indicators on all interactive elements", wcag: "2.4.7" },
+        { severity: "moderate", category: "Headings", issue: "Check heading hierarchy is logical (no skipped levels)", wcag: "2.4.6" },
+        { severity: "moderate", category: "Links", issue: "Ensure link text is descriptive (avoid 'click here')", wcag: "2.4.4" },
+        { severity: "minor", category: "Language", issue: "Verify lang attribute on <html> tag", wcag: "3.1.1" }
+    ];
+    // Recommendations
+    report.recommendations = [
+        { priority: "high", action: "Run automated audit with axe DevTools or Lighthouse" },
+        { priority: "high", action: "Test keyboard navigation (Tab, Shift+Tab, Enter, Escape)" },
+        { priority: "high", action: "Test with screen reader (NVDA on Windows, VoiceOver on Mac)" },
+        { priority: "medium", action: "Check color contrast with Contrast Checker tool" },
+        { priority: "medium", action: "Test at 200% zoom (WCAG 1.4.4)" },
+        { priority: "medium", action: "Review with accessibility checklist" },
+        { priority: "low", action: "Test with real users who use assistive technology" }
+    ];
+    // Testing workflow
+    report.testing_workflow = {
+        step_1: "Automated testing (axe DevTools, Lighthouse) - catches ~40% of issues",
+        step_2: "Keyboard testing - Tab through all interactive elements",
+        step_3: "Screen reader testing - Navigate with NVDA/VoiceOver",
+        step_4: "Manual checklist - WCAG quick reference",
+        step_5: "User testing - Test with real users with disabilities (critical for high-stakes sites)"
+    };
+    report.tools = {
+        browser_extensions: ["axe DevTools", "WAVE", "Lighthouse (Chrome DevTools)"],
+        screen_readers: ["NVDA (free, Windows)", "JAWS (paid, Windows)", "VoiceOver (built-in, macOS/iOS)", "TalkBack (built-in, Android)"],
+        contrast_checkers: ["WebAIM Contrast Checker", "Color Oracle (colorblindness simulator)"],
+        testing_platforms: ["Fable (test with real users)", "AccessibilityOz"]
+    };
+    report.reference = "See ux://accessibility/wcag for complete WCAG guidelines";
+    return {
+        content: [{ type: "text", text: JSON.stringify(report, null, 2) }]
+    };
+}
+async function suggestABVariant(args) {
+    const element = args.element.toLowerCase();
+    const goal = args.goal.toLowerCase();
+    const currentPerformance = args.current_performance;
+    const suggestion = {
+        element,
+        goal,
+        current_performance: currentPerformance,
+        hypothesis: "",
+        variants: [],
+        metrics_to_track: [],
+        sample_size: {},
+        duration: "1-2 weeks minimum (account for weekly cycles)",
+    };
+    // Generate hypothesis
+    suggestion.hypothesis = `If we modify the ${element}, then ${goal} will improve because [reason based on best practices]`;
+    // Generate variants based on element type
+    if (element.includes("button") || element.includes("cta")) {
+        suggestion.variants = [
+            {
+                variant: "A (Control)",
+                description: "Current version",
+                changes: "No changes (baseline)"
+            },
+            {
+                variant: "B",
+                description: "Action-oriented copy",
+                changes: "Change button text to specific action verb (e.g., 'Get Started' vs 'Submit', 'Start Free Trial' vs 'Sign Up')",
+                rationale: "Specific, action-oriented CTAs convert better"
+            },
+            {
+                variant: "C",
+                description: "Contrasting color",
+                changes: "Use high-contrast color for button (test complementary color to background)",
+                rationale: "Higher visual prominence improves click-through"
+            },
+            {
+                variant: "D (optional)",
+                description: "Size + placement",
+                changes: "Larger button + above the fold placement",
+                rationale: "Visibility and accessibility"
+            }
+        ];
+        suggestion.metrics_to_track = ["Click-through rate (CTR)", "Conversion rate", "Bounce rate", "Time to click"];
+    }
+    else if (element.includes("headline") || element.includes("title")) {
+        suggestion.variants = [
+            {
+                variant: "A (Control)",
+                description: "Current headline",
+                changes: "No changes"
+            },
+            {
+                variant: "B",
+                description: "Benefit-focused",
+                changes: "Lead with benefit, not feature (e.g., 'Save 10 hours per week' vs 'Task automation software')",
+                rationale: "Users care about outcomes, not features"
+            },
+            {
+                variant: "C",
+                description: "Question format",
+                changes: "Pose question that addresses pain point (e.g., 'Tired of manual data entry?')",
+                rationale: "Questions engage and create relatability"
+            }
+        ];
+        suggestion.metrics_to_track = ["Scroll depth", "Time on page", "Conversion rate", "Bounce rate"];
+    }
+    else if (element.includes("pricing")) {
+        suggestion.variants = [
+            {
+                variant: "A (Control)",
+                description: "Current pricing display",
+                changes: "No changes"
+            },
+            {
+                variant: "B",
+                description: "Annual vs monthly",
+                changes: "Default to annual pricing with monthly breakdown ($49/mo billed annually)",
+                rationale: "Higher perceived value, longer commitments"
+            },
+            {
+                variant: "C",
+                description: "Highlighted tier",
+                changes: "Visually emphasize 'most popular' tier (border, badge, larger)",
+                rationale: "Social proof + visual hierarchy guides decisions"
+            }
+        ];
+        suggestion.metrics_to_track = ["Conversion rate", "Average order value", "Plan selection distribution"];
+    }
+    else {
+        // Generic variants
+        suggestion.variants = [
+            {
+                variant: "A (Control)",
+                description: "Current version",
+                changes: "No changes"
+            },
+            {
+                variant: "B",
+                description: "Simplified version",
+                changes: "Remove unnecessary elements, reduce visual complexity",
+                rationale: "Less cognitive load improves completion"
+            },
+            {
+                variant: "C",
+                description: "Enhanced clarity",
+                changes: "Clearer labels, better visual hierarchy, stronger contrast",
+                rationale: "Clarity reduces confusion and abandonment"
+            }
+        ];
+        suggestion.metrics_to_track = ["Conversion rate", "Bounce rate", "Time on task", "Error rate"];
+    }
+    // Sample size calculation
+    suggestion.sample_size = {
+        note: "Use A/B test sample size calculator",
+        factors: ["Current conversion rate", "Minimum detectable effect (e.g., 10% improvement)", "Statistical significance (95%)", "Statistical power (80%)"],
+        rule_of_thumb: "Minimum 100 conversions per variant for reliable results",
+        calculator: "https://www.optimizely.com/sample-size-calculator/"
+    };
+    // Best practices
+    suggestion.best_practices = [
+        "Test one variable at a time (isolate cause)",
+        "Run test for full 1-2 weeks (account for weekly patterns)",
+        "Ensure statistical significance (p < 0.05)",
+        "Segment results (mobile vs desktop, traffic source)",
+        "Don't stop test early (even if winning)",
+        "Account for external factors (holidays, marketing campaigns)",
+        "Document results and learnings"
+    ];
+    suggestion.reference = "See ux://testing/validation for complete A/B testing guide";
+    return {
+        content: [{ type: "text", text: JSON.stringify(suggestion, null, 2) }]
+    };
+}
+async function analyzeInformationArchitecture(args) {
+    const siteStructure = args.site_structure;
+    const userGoals = args.user_goals;
+    const issues = args.issues;
+    const analysis = {
+        site_structure: siteStructure,
+        user_goals: userGoals,
+        issues: issues || "Not specified",
+        assessment: {},
+        recommendations: [],
+    };
+    // Analyze structure depth
+    const structureLower = siteStructure.toLowerCase();
+    if (structureLower.includes("level") || structureLower.includes("tier") || structureLower.includes(">")) {
+        const depth = (siteStructure.match(/>/g) || []).length + 1;
+        analysis.assessment.hierarchy_depth = {
+            current: `~${depth} levels`,
+            recommendation: depth > 4 ? "Too deep - aim for 3-4 levels max" : "Good depth",
+            issue: depth > 4 ? "Users get lost in deep hierarchies" : null
+        };
+    }
+    // Check for issues keywords
+    analysis.assessment.common_issues = [];
+    if (structureLower.includes("confus") || issues?.toLowerCase().includes("confus")) {
+        analysis.assessment.common_issues.push({
+            issue: "Confusing labels",
+            recommendation: "Use card sorting to understand user mental models",
+            action: "Conduct open card sorting with 15-30 users"
+        });
+    }
+    if (structureLower.includes("too many") || issues?.toLowerCase().includes("too many")) {
+        analysis.assessment.common_issues.push({
+            issue: "Too many navigation items",
+            recommendation: "Limit top-level navigation to 5-7 items (Miller's Law: 7±2)",
+            action: "Group related items, use mega menu for subcategories"
+        });
+    }
+    if (structureLower.includes("search") || issues?.toLowerCase().includes("find")) {
+        analysis.assessment.common_issues.push({
+            issue: "Findability problems",
+            recommendation: "Improve search and navigation",
+            action: "Add autocomplete search, breadcrumbs, related links"
+        });
+    }
+    // Recommendations based on user goals
+    analysis.recommendations = [
+        {
+            priority: "high",
+            recommendation: "Conduct card sorting to validate IA",
+            method: "Open card sorting (users create categories), then closed card sorting (validate proposed IA)",
+            tool: "OptimalSort, UserZoom, or Miro"
+        },
+        {
+            priority: "high",
+            recommendation: "Run tree testing to validate findability",
+            method: "Give users tasks ('Find your order history'), measure success rate and path",
+            tool: "Treejack (Optimal Workshop), UserZoom",
+            target: "> 80% success rate"
+        },
+        {
+            priority: "medium",
+            recommendation: "Review navigation labels",
+            check: ["Use user language (not jargon)", "Be specific (avoid 'More', 'Other', 'Resources')", "Keep short (1-2 words)", "Consistent capitalization"]
+        },
+        {
+            priority: "medium",
+            recommendation: "Ensure multiple paths to content",
+            methods: ["Global navigation", "Search (with autocomplete)", "Related links", "Breadcrumbs", "Footer sitemap"]
+        },
+        {
+            priority: "low",
+            recommendation: "Create sitemap",
+            purpose: "Visual representation for stakeholders, SEO, user reference"
+        }
+    ];
+    // Best practices
+    analysis.best_practices = {
+        hierarchy: "Keep shallow (3-4 levels max)",
+        navigation: "5-7 top-level items",
+        labels: "Clear, user-centered, avoid jargon",
+        findability: "Multiple access paths (nav, search, links)",
+        breadcrumbs: "Use for deep sites",
+        mobile: "Consider mobile navigation (hamburger + search)",
+        testing: "Validate with tree testing before design"
+    };
+    analysis.research_methods = {
+        card_sorting: "Understand how users categorize content",
+        tree_testing: "Validate findability in structure (no design)",
+        user_interviews: "Understand mental models and tasks",
+        analytics: "See how users actually navigate (top pages, search queries, exit pages)",
+        first_click_testing: "Where users click first for a task"
+    };
+    analysis.reference = "See ux://ia/information-architecture for complete IA guide";
+    return {
+        content: [{ type: "text", text: JSON.stringify(analysis, null, 2) }]
+    };
+}
+async function detectDarkPatterns(args) {
+    const flowDescription = args.flow_description.toLowerCase();
+    const screenshotUrl = args.screenshot_url;
+    const detection = {
+        flow: args.flow_description,
+        screenshot: screenshotUrl || "Not provided",
+        detected_patterns: [],
+        severity_score: 0,
+        ethical_alternatives: [],
+    };
+    // Detect dark patterns based on keywords
+    if (flowDescription.includes("cancel") || flowDescription.includes("unsubscribe")) {
+        detection.detected_patterns.push({
+            type: "Forced Continuity / Roach Motel",
+            description: "Making it hard to cancel subscription",
+            examples: ["Must call to cancel (can't do online)", "Buried in settings", "Multiple confirmations", "Retention dark patterns"],
+            severity: "critical",
+            ethical_alternative: "Cancel button in account settings, one confirmation, done. Same ease as sign-up."
+        });
+    }
+    if (flowDescription.includes("cookie") || flowDescription.includes("consent")) {
+        detection.detected_patterns.push({
+            type: "Misdirection / Visual Prominence",
+            description: "Giant 'Accept All' button, tiny 'Reject' link",
+            severity: "major",
+            example: "Large green 'Accept All Cookies' button, small gray 'Reject' text link",
+            ethical_alternative: "Equal visual weight for Accept and Reject options. Clear 'Necessary Only' option."
+        });
+        detection.detected_patterns.push({
+            type: "Obstruction / Hidden Options",
+            description: "Hiding 'Reject All' behind multiple clicks",
+            severity: "major",
+            example: "Must click 'Manage Preferences' → scroll → find 'Reject All'",
+            ethical_alternative: "Reject All button on first screen, same prominence as Accept All",
+            legal: "GDPR requires equal ease for accept/reject"
+        });
+    }
+    if (flowDescription.includes("checkout") || flowDescription.includes("cart")) {
+        detection.detected_patterns.push({
+            type: "Sneaking / Hidden Costs",
+            description: "Revealing costs late in checkout",
+            severity: "critical",
+            example: "$50 product, but $80 at checkout (shipping, fees revealed late)",
+            ethical_alternative: "Show total cost upfront, or clearly separate fees early in process"
+        });
+        detection.detected_patterns.push({
+            type: "Sneak into Basket",
+            description: "Adding items without user knowledge",
+            severity: "major",
+            example: "Insurance or warranty auto-added to cart",
+            ethical_alternative: "Offer as optional add-on with clear, unchecked checkbox"
+        });
+    }
+    if (flowDescription.includes("notification") || flowDescription.includes("permission")) {
+        detection.detected_patterns.push({
+            type: "Nagging",
+            description: "Repeatedly asking after user declined",
+            severity: "moderate",
+            example: "Pop-up asking for notifications every visit after decline",
+            ethical_alternative: "Ask once, or after delivering significant value. Respect 'no'."
+        });
+    }
+    if (flowDescription.includes("sign up") || flowDescription.includes("account")) {
+        detection.detected_patterns.push({
+            type: "Privacy Zuckering",
+            description: "Tricking users into sharing more data than intended",
+            severity: "major",
+            example: "Pre-checked boxes to share data with partners",
+            ethical_alternative: "Unchecked by default, clear opt-in, explain why"
+        });
+        detection.detected_patterns.push({
+            type: "Forced Enrollment",
+            description: "Requiring account for basic functionality",
+            severity: "moderate",
+            example: "Can't view content without creating account",
+            ethical_alternative: "Guest checkout, browse without account, optional sign-up"
+        });
+    }
+    // Generic patterns to check for
+    if (flowDescription.includes("no thanks") || flowDescription.includes("decline")) {
+        detection.detected_patterns.push({
+            type: "Confirmshaming",
+            description: "Guilt-tripping decline option",
+            severity: "moderate",
+            example: "'No thanks, I don't want to save money' as decline button",
+            ethical_alternative: "Neutral wording: 'No thanks' or 'Maybe later'"
+        });
+    }
+    if (flowDescription.includes("only") || flowDescription.includes("left") || flowDescription.includes("viewing")) {
+        detection.detected_patterns.push({
+            type: "Fake Urgency / Scarcity",
+            description: "False claims of limited availability",
+            severity: "moderate",
+            example: "'Only 2 left in stock!' but always 2 left, or '500 people viewing!' (not true)",
+            ethical_alternative: "Real scarcity only, or don't use scarcity tactics"
+        });
+    }
+    // Calculate severity score
+    const severityMap = { critical: 3, major: 2, moderate: 1, minor: 0.5 };
+    detection.severity_score = detection.detected_patterns.reduce((sum, p) => sum + (severityMap[p.severity] || 0), 0);
+    // Overall assessment
+    if (detection.severity_score >= 6) {
+        detection.overall_assessment = "SEVERE: Multiple critical dark patterns detected. This violates user trust and may violate GDPR/CCPA.";
+    }
+    else if (detection.severity_score >= 3) {
+        detection.overall_assessment = "MODERATE: Several dark patterns detected. Consider ethical alternatives.";
+    }
+    else if (detection.detected_patterns.length > 0) {
+        detection.overall_assessment = "MINOR: Some questionable patterns detected. Review for ethical design.";
+    }
+    else {
+        detection.overall_assessment = "No obvious dark patterns detected from description. Manual review recommended.";
+    }
+    // Ethical design principles
+    detection.ethical_design_principles = [
+        "Transparency: Be honest about costs, terms, data usage",
+        "User control: Make opting out as easy as opting in",
+        "Respect decisions: Don't nag after user declines",
+        "Honest social proof: Use verified reviews, real stats only",
+        "Equal visual weight: Accept and reject options should be equally prominent",
+        "GDPR/CCPA compliance: Required for legal reasons, good for ethics too"
+    ];
+    detection.legal_risks = {
+        gdpr: "Many dark patterns violate GDPR (non-consensual data collection, hard to withdraw consent)",
+        ftc: "FTC has issued warnings and fines for deceptive practices",
+        california_ab_2571: "California explicitly bans dark patterns in subscriptions"
+    };
+    detection.reference = "See ux://ethics/dark-patterns for complete dark pattern guide";
+    return {
+        content: [{ type: "text", text: JSON.stringify(detection, null, 2) }]
+    };
+}
+async function calculateUXMetrics(args) {
+    const metricType = args.metric_type;
+    const rawData = args.data;
+    const result = {
+        metric_type: metricType,
+        raw_data: rawData,
+        calculation: {},
+        interpretation: "",
+        benchmark: "",
+    };
+    if (metricType === "SUS") {
+        // System Usability Scale (10 questions, 1-5 scale)
+        // Extract numbers from data string
+        const responses = rawData.match(/\d+/g)?.map(Number) || [];
+        if (responses.length !== 10) {
+            result.error = "SUS requires exactly 10 responses (one per question)";
+            return { content: [{ type: "text", text: JSON.stringify(result, null, 2) }] };
+        }
+        // SUS calculation: Sum((odd - 1) + (5 - even)) * 2.5
+        let score = 0;
+        for (let i = 0; i < 10; i++) {
+            if (i % 2 === 0) {
+                // Odd questions (1,3,5,7,9): subtract 1
+                score += responses[i] - 1;
+            }
+            else {
+                // Even questions (2,4,6,8,10): subtract from 5
+                score += 5 - responses[i];
+            }
+        }
+        score = score * 2.5;
+        result.calculation = {
+            responses,
+            sus_score: score.toFixed(1),
+            formula: "Sum of [(odd questions - 1) + (5 - even questions)] × 2.5"
+        };
+        result.interpretation =
+            score >= 80 ? "Excellent (A+): Users love this product" :
+                score >= 68 ? "Good (B): Above average usability" :
+                    score >= 50 ? "OK (C): Average usability, room for improvement" :
+                        "Poor (D/F): Significant usability issues";
+        result.benchmark = {
+            excellent: "> 80",
+            above_average: "68-80",
+            average: "50-68",
+            below_average: "< 50",
+            note: "68 is the average SUS score across all products"
+        };
+    }
+    else if (metricType === "NPS") {
+        // Net Promoter Score (0-10 scale)
+        const scores = rawData.match(/\d+/g)?.map(Number) || [];
+        const promoters = scores.filter(s => s >= 9).length;
+        const detractors = scores.filter(s => s <= 6).length;
+        const total = scores.length;
+        const nps = ((promoters / total) - (detractors / total)) * 100;
+        result.calculation = {
+            total_responses: total,
+            promoters: `${promoters} (scores 9-10)`,
+            passives: `${scores.filter(s => s === 7 || s === 8).length} (scores 7-8)`,
+            detractors: `${detractors} (scores 0-6)`,
+            nps_score: nps.toFixed(1),
+            formula: "(% Promoters - % Detractors)"
+        };
+        result.interpretation =
+            nps >= 50 ? "Excellent: Strong customer loyalty" :
+                nps >= 30 ? "Great: Good growth potential" :
+                    nps >= 0 ? "Good: More promoters than detractors" :
+                        "Poor: More detractors than promoters, address issues";
+        result.benchmark = {
+            excellent: "> 50",
+            great: "30-50",
+            good: "0-30",
+            poor: "< 0",
+            note: "NPS varies widely by industry. SaaS average is ~30-40."
+        };
+    }
+    else if (metricType === "CSAT") {
+        // Customer Satisfaction (typically 1-5 scale)
+        const scores = rawData.match(/\d+/g)?.map(Number) || [];
+        const satisfied = scores.filter(s => s >= 4).length;
+        const total = scores.length;
+        const csat = (satisfied / total) * 100;
+        result.calculation = {
+            total_responses: total,
+            satisfied: `${satisfied} (scores 4-5)`,
+            csat_score: `${csat.toFixed(1)}%`,
+            formula: "(Responses 4 or 5 / Total responses) × 100"
+        };
+        result.interpretation =
+            csat >= 80 ? "Excellent: High customer satisfaction" :
+                csat >= 70 ? "Good: Above average satisfaction" :
+                    csat >= 60 ? "Fair: Room for improvement" :
+                        "Poor: Significant dissatisfaction";
+        result.benchmark = {
+            excellent: "> 80%",
+            good: "70-80%",
+            fair: "60-70%",
+            poor: "< 60%"
+        };
+    }
+    else if (metricType === "task-success") {
+        // Task success rate
+        const numbers = rawData.match(/\d+/g)?.map(Number) || [];
+        let successful, total;
+        if (numbers.length === 2) {
+            successful = numbers[0];
+            total = numbers[1];
+        }
+        else {
+            successful = numbers.filter(n => n === 1).length; // Assuming 1 = success, 0 = fail
+            total = numbers.length;
+        }
+        const successRate = (successful / total) * 100;
+        result.calculation = {
+            successful_completions: successful,
+            total_attempts: total,
+            success_rate: `${successRate.toFixed(1)}%`,
+            formula: "(Successful completions / Total attempts) × 100"
+        };
+        result.interpretation =
+            successRate >= 78 ? "Good: Above Nielsen's 78% benchmark" :
+                successRate >= 60 ? "Fair: Usable but room for improvement" :
+                    "Poor: Significant usability issues";
+        result.benchmark = {
+            good: "> 78%",
+            fair: "60-78%",
+            poor: "< 60%",
+            note: "Nielsen Norman Group benchmark: 78% average task success rate"
+        };
+    }
+    else {
+        result.error = `Unsupported metric type: ${metricType}. Supported: SUS, NPS, CSAT, CES, task-success, retention`;
+    }
+    result.reference = "See ux://analytics/metrics for complete UX metrics guide";
+    return {
+        content: [{ type: "text", text: JSON.stringify(result, null, 2) }]
+    };
+}
+async function generateWireframe(args) {
+    const pageType = args.page_type.toLowerCase();
+    const elements = args.elements;
+    const layout = args.layout || "single-column";
+    const wireframe = {
+        page_type: args.page_type,
+        layout,
+        elements: elements || "Not specified",
+        ascii_wireframe: "",
+    };
+    // Generate ASCII wireframe based on page type and layout
+    if (pageType.includes("login")) {
+        wireframe.ascii_wireframe = `
+┌────────────────────────────────────────────┐
+│                                            │
+│              [  LOGO  ]                    │
+│                                            │
+│         Login to Your Account              │
+│                                            │
+│    ┌────────────────────────────┐          │
+│    │ Email                      │          │
+│    └────────────────────────────┘          │
+│                                            │
+│    ┌────────────────────────────┐          │
+│    │ Password            [👁]    │          │
+│    └────────────────────────────┘          │
+│                                            │
+│    [ ] Remember me    Forgot password?    │
+│                                            │
+│    ┌────────────────────────────┐          │
+│    │      LOG IN BUTTON         │          │
+│    └────────────────────────────┘          │
+│                                            │
+│    Don't have an account? Sign up         │
+│                                            │
+└────────────────────────────────────────────┘
+`;
+    }
+    else if (pageType.includes("dashboard")) {
+        wireframe.ascii_wireframe = `
+┌─────────────────────────────────────────────────────────────┐
+│ [Logo] Dashboard    [Search...]   [Notifications] [Profile] │
+├─────────────────────────────────────────────────────────────┤
+│                                                             │
+│  ┌──────────┐  ┌──────────┐  ┌──────────┐  ┌──────────┐   │
+│  │  Card 1  │  │  Card 2  │  │  Card 3  │  │  Card 4  │   │
+│  │  Value   │  │  Value   │  │  Value   │  │  Value   │   │
+│  │  +12%    │  │  +8%     │  │  -3%     │  │  +15%    │   │
+│  └──────────┘  └──────────┘  └──────────┘  └──────────┘   │
+│                                                             │
+│  ┌────────────────────────────────────────────────────┐    │
+│  │             Chart/Visualization                    │    │
+│  │                                                     │    │
+│  │    ██                                               │    │
+│  │   ████         ██                                   │    │
+│  │  ██████  ██  ████                                   │    │
+│  │ ████████████████████                                │    │
+│  └────────────────────────────────────────────────────┘    │
+│                                                             │
+│  ┌────────────────────────────────────────────────────┐    │
+│  │ Recent Activity                                    │    │
+│  │ • Item 1 - Description                             │    │
+│  │ • Item 2 - Description                             │    │
+│  │ • Item 3 - Description                             │    │
+│  └────────────────────────────────────────────────────┘    │
+│                                                             │
+└─────────────────────────────────────────────────────────────┘
+`;
+    }
+    else if (pageType.includes("card") || pageType.includes("product")) {
+        wireframe.ascii_wireframe = `
+┌─────────────────────────┐
+│                         │
+│   ┌─────────────────┐   │
+│   │                 │   │
+│   │  Product Image  │   │
+│   │                 │   │
+│   └─────────────────┘   │
+│                         │
+│   Product Name          │
+│   Short description     │
+│                         │
+│   $99.99                │
+│   ★★★★☆ (24 reviews)    │
+│                         │
+│   ┌─────────────────┐   │
+│   │  ADD TO CART    │   │
+│   └─────────────────┘   │
+│                         │
+└─────────────────────────┘
+`;
+    }
+    else {
+        // Generic wireframe
+        wireframe.ascii_wireframe = `
+┌────────────────────────────────────────────┐
+│  [Logo]         Navigation Menu        [☰] │
+├────────────────────────────────────────────┤
+│                                            │
+│  ┌──────────────────────────────────────┐  │
+│  │        Header / Hero Section         │  │
+│  │  [Image] + Headline + Description    │  │
+│  └──────────────────────────────────────┘  │
+│                                            │
+│  ┌──────────────────────────────────────┐  │
+│  │                                      │  │
+│  │       Main Content Area              │  │
+│  │                                      │  │
+│  └──────────────────────────────────────┘  │
+│                                            │
+│  ┌────────┐  ┌────────┐  ┌────────┐       │
+│  │ Item 1 │  │ Item 2 │  │ Item 3 │       │
+│  └────────┘  └────────┘  └────────┘       │
+│                                            │
+├────────────────────────────────────────────┤
+│  Footer: Links | Contact | Social Media   │
+└────────────────────────────────────────────┘
+`;
+    }
+    wireframe.notes = [
+        "This is a low-fidelity wireframe for layout planning",
+        "Use as starting point for design discussions",
+        "Focus on structure and hierarchy, not visual design",
+        "Iterate based on user needs and feedback"
+    ];
+    wireframe.next_steps = [
+        "Add detailed content and copy",
+        "Define interactions and micro-interactions",
+        "Create high-fidelity mockup in Figma/Sketch",
+        "Conduct usability testing",
+        "Develop responsive versions (mobile, tablet)"
+    ];
+    return {
+        content: [{ type: "text", text: JSON.stringify(wireframe, null, 2) }]
+    };
+}
+async function suggestMicrointeraction(args) {
+    const element = args.element.toLowerCase();
+    const context = args.context?.toLowerCase() || "";
+    const platform = args.platform || "web";
+    const suggestion = {
+        element: args.element,
+        context: context || "General interaction",
+        platform,
+        microinteractions: [],
+    };
+    // Suggest microinteractions based on element type
+    if (element.includes("button")) {
+        suggestion.microinteractions = [
+            {
+                trigger: "Hover",
+                feedback: "Background color change + slight scale up (1.05x)",
+                duration: "200ms",
+                easing: "ease-out"
+            },
+            {
+                trigger: "Active/Press",
+                feedback: "Scale down (0.95x) + darker background",
+                duration: "100ms",
+                easing: "ease-in",
+                haptic: platform === "mobile" ? "Light tap (10ms)" : "N/A"
+            },
+            {
+                trigger: "Focus",
+                feedback: "Outline ring (accessibility)",
+                style: "2px solid blue, 4px offset"
+            }
+        ];
+        if (context.includes("delete") || context.includes("destructive")) {
+            suggestion.microinteractions.push({
+                trigger: "Click",
+                feedback: "Confirmation modal with shake animation",
+                duration: "300ms",
+                pattern: "Shake left-right to indicate danger"
+            });
+        }
+        else if (context.includes("success") || context.includes("save")) {
+            suggestion.microinteractions.push({
+                trigger: "Click success",
+                feedback: "Checkmark animation + color change green",
+                duration: "400ms",
+                pattern: "Button → Checkmark → 'Saved!'"
+            });
+        }
+    }
+    else if (element.includes("toggle") || element.includes("switch")) {
+        suggestion.microinteractions = [
+            {
+                trigger: "Toggle on",
+                feedback: "Slide animation + color change (gray → green)",
+                duration: "250ms",
+                easing: "ease-in-out",
+                haptic: platform === "mobile" ? "Medium tap (20ms)" : "N/A"
+            },
+            {
+                trigger: "Toggle off",
+                feedback: "Slide animation + color change (green → gray)",
+                duration: "250ms",
+                easing: "ease-in-out"
+            }
+        ];
+    }
+    else if (element.includes("like") || element.includes("favorite") || element.includes("heart")) {
+        suggestion.microinteractions = [
+            {
+                trigger: "Click/Tap",
+                feedback: "Heart fills with color + bounces (scale 1 → 1.2 → 1)",
+                duration: "400ms",
+                easing: "elastic",
+                haptic: platform === "mobile" ? "Light tap" : "N/A"
+            },
+            {
+                trigger: "Unlike",
+                feedback: "Heart empties + subtle shrink",
+                duration: "200ms"
+            }
+        ];
+    }
+    else if (element.includes("loading") || element.includes("spinner")) {
+        suggestion.microinteractions = [
+            {
+                trigger: "Loading state",
+                feedback: "Spinner animation OR skeleton screen OR progress bar",
+                duration: "Continuous",
+                pattern: "Rotating spinner or pulsing skeleton",
+                note: "Show progress if duration is known"
+            }
+        ];
+    }
+    else if (element.includes("form") || element.includes("input")) {
+        suggestion.microinteractions = [
+            {
+                trigger: "Focus",
+                feedback: "Border color change + label move (floating label)",
+                duration: "200ms"
+            },
+            {
+                trigger: "Valid input",
+                feedback: "Green checkmark appears",
+                duration: "200ms"
+            },
+            {
+                trigger: "Invalid input",
+                feedback: "Red border + shake animation + error message",
+                duration: "300ms",
+                pattern: "Shake to indicate error"
+            },
+            {
+                trigger: "Form submission success",
+                feedback: "Success message + confetti animation (optional)",
+                duration: "500ms"
+            }
+        ];
+    }
+    else if (element.includes("dropdown") || element.includes("menu")) {
+        suggestion.microinteractions = [
+            {
+                trigger: "Open",
+                feedback: "Fade in + slide down",
+                duration: "200ms",
+                easing: "ease-out"
+            },
+            {
+                trigger: "Close",
+                feedback: "Fade out + slide up",
+                duration: "150ms",
+                easing: "ease-in"
+            },
+            {
+                trigger: "Hover item",
+                feedback: "Background color change",
+                duration: "100ms"
+            }
+        ];
+    }
+    else {
+        // Generic suggestions
+        suggestion.microinteractions = [
+            {
+                trigger: "Interaction start",
+                feedback: "Visual feedback (color, scale, or position change)",
+                duration: "200-300ms"
+            },
+            {
+                trigger: "Interaction complete",
+                feedback: "Confirmation (checkmark, success message, or state change)",
+                duration: "300-400ms"
+            }
+        ];
+    }
+    // General principles
+    suggestion.principles = [
+        "Keep animations subtle (< 400ms)",
+        "Use easing for natural motion (ease-out for enter, ease-in for exit)",
+        "Provide immediate feedback (< 100ms)",
+        "Respect prefers-reduced-motion (disable animations)",
+        "Use haptic feedback on mobile (10-50ms)",
+        "Ensure accessibility (feedback not only visual)",
+        "Match brand personality (playful vs professional)"
+    ];
+    suggestion.css_example = element.includes("button") ?
+        "button {\n  transition: all 200ms ease-out;\n}\nbutton:hover {\n  transform: scale(1.05);\n  background: #0056b3;\n}\nbutton:active {\n  transform: scale(0.95);\n}" : null;
+    suggestion.reference = "See ux://animation/principles for complete animation guide";
+    return {
+        content: [{ type: "text", text: JSON.stringify(suggestion, null, 2) }]
+    };
+}
+// ========================================
+// PROMPTS - Pre-configured UX Reviews
+// ========================================
+server.setRequestHandler(ListPromptsRequestSchema, async () => {
+    return {
+        prompts: [
+            {
+                name: "accessibility_review",
                 description: "Comprehensive accessibility review following WCAG 2.1 AA guidelines",
                 arguments: [
                     {
@@ -1642,6 +3644,22 @@ server.setRequestHandler(ListPromptsRequestSchema, async () => {
                     },
                 ],
             },
+            {
+                name: "complete_ux_audit",
+                description: "Comprehensive UX audit combining accessibility, usability, performance, SEO, and responsive design checks",
+                arguments: [
+                    {
+                        name: "interface",
+                        description: "Interface or page to audit",
+                        required: true,
+                    },
+                    {
+                        name: "code",
+                        description: "Code to analyze (optional)",
+                        required: false,
+                    },
+                ],
+            },
         ],
     };
 });
@@ -1748,6 +3766,110 @@ Provide code examples for token definition and a starter component.`,
                     },
                 ],
             };
+        case "complete_ux_audit":
+            return {
+                messages: [
+                    {
+                        role: "user",
+                        content: {
+                            type: "text",
+                            text: `Please conduct a comprehensive UX audit for: ${args?.interface}
+
+${args?.code ? `Code to analyze:\n\`\`\`\n${args.code}\n\`\`\`\n` : ""}
+
+This is a complete audit covering all critical UX dimensions. Perform the following:
+
+## 1. Accessibility Audit (WCAG 2.1 AA)
+- Use analyze_accessibility tool to identify violations
+- Check keyboard navigation and focus management
+- Verify screen reader compatibility (ARIA labels, roles)
+- Test color contrast with check_contrast tool
+- Review semantic HTML and heading hierarchy
+- Check form labels and error handling
+
+## 2. Usability Heuristics (Nielsen's 10)
+- Use review_usability tool for detailed analysis
+- Rate each heuristic (0-4 severity scale)
+- Identify specific violations per heuristic
+- Provide actionable recommendations
+
+## 3. Responsive Design
+- Use check_responsive tool to analyze breakpoints
+- Verify mobile-first approach
+- Check touch target sizes (44x44px minimum)
+- Test layout across viewports
+- Review mobile navigation patterns
+- Reference: ux://mobile/patterns
+
+## 4. Typography & Readability
+- Use generate_typography_scale to verify type system
+- Check line length (45-75 characters)
+- Verify line height (1.5-1.7 for body text)
+- Review font pairing and hierarchy
+- Reference: ux://visual/typography
+
+## 5. Color System
+- Use generate_color_palette to analyze harmony
+- Verify semantic color usage
+- Check 60-30-10 rule adherence
+- Ensure sufficient contrast ratios
+- Reference: ux://visual/color-theory
+
+## 6. Form Patterns (if applicable)
+- Use suggest_form_pattern tool
+- Verify single-column layout
+- Check validation timing (hybrid approach)
+- Review field types and autocomplete
+- Test error messages (clear, specific, actionable)
+- Reference: ux://forms/patterns
+
+## 7. Microcopy & Content
+- Use suggest_microcopy tool for key elements
+- Review button labels (specific, action-oriented)
+- Check error messages (explain + instruct)
+- Verify empty states and success messages
+- Reference: ux://content/microcopy
+
+## 8. Data Visualization (if applicable)
+- Use analyze_data_viz tool
+- Verify appropriate chart types
+- Check accessibility (color independence, alt text)
+- Review data-ink ratio
+- Reference: ux://data/visualization
+
+## 9. Performance Indicators
+- Check for performance best practices
+- Review lazy loading and code splitting
+- Verify optimization techniques
+- Reference: ux://performance/optimization
+
+## 10. SEO & Metadata
+- Review meta tags and Open Graph
+- Check semantic structure
+- Verify heading hierarchy
+- Reference: ux://seo/best-practices
+
+## Output Format
+
+For each dimension, provide:
+1. **Status**: ✅ Pass | ⚠️ Needs Improvement | ❌ Critical Issues
+2. **Severity Score**: 0-4 (0=none, 1=minor, 2=moderate, 3=major, 4=critical)
+3. **Findings**: Specific issues discovered
+4. **Recommendations**: Prioritized, actionable fixes
+5. **References**: Relevant knowledge resources
+
+## Summary
+- Overall UX Health Score: X/100
+- Critical Issues (must fix): List
+- High Priority (should fix): List
+- Medium Priority (nice to have): List
+- Positive Highlights: What's working well
+
+Provide a comprehensive, actionable audit report.`,
+                        },
+                    },
+                ],
+            };
         default:
             throw new Error(`Unknown prompt: ${name}`);
     }