How Did an AI-Ready Modular System Fix a Luxury Travel Identity Crisis?

1. Executive Summary

• Role: Lead Product Designer (Strategy, UI/UX, Logic Architecture).
• Team: Cross-functional (CMO, Head of Sales, SEO Lead, Frontend Engineers).
• The Problem: Business-Class.com is a premium concierge service, but the legacy interface mimicked a DIY search engine. This "Expectation Mismatch" caused high friction and bounce rates.
• The Solution: A strategic UX realignment combining semantic shifts, smart defaults, and an AI-powered modular design system integrated directly into the CMS.
• Business Impact: +27% lift in CTR to the booking funnel, 95% faster landing page creation via AI, and achieved WCAG AA compliance.

2. The Challenge: The "Expectation Mismatch"

Users entered the site with a "DIY" mindset, expecting instant automated results. Instead, they hit a concierge lead form. Fighting the user's mental model was killing conversion.

I needed to gently transition their mindset from "I want to search" to "I need an expert", establishing immediate trust for high-ticket ($5k+) purchases.

3. Information Gain: The "Recent Searches" Fallacy

The Failed Hypothesis: I assumed business class travelers have a non-linear decision journey, making a "Recent Searches" shortcut critical for returning users.
The Reality: Post-launch data showed near-zero engagement. It competed for attention with the "Popular Destinations" list, adding unnecessary cognitive load.
The Pivot: Following the data, we deprecated the module in the next sprint. This reinforced that reducing decision fatigue is always more profitable than offering theoretical "convenience features."

4. The Strategy: Semantic Shifts & Smart Defaults

To lower the Interaction Cost to near zero, I redesigned the Search Widget to act as an Assistant rather than a database query.

• The Semantic Shift: Changed the primary CTA from "Search Flights" to "Check Your Price". "Search" implies work; "Check Price" implies utility. This subtle shift drastically reduced the perceived commitment.
• The "Wizard of Oz" MVP: Introduced a quick-select destination list. Instead of building a complex dynamic sorting algorithm on day one, we launched with a manually curated list to validate engagement first.
• Smart Defaults: Implemented IP-based detection to pre-fill "Origin" and "Dates," solving "Empty State Anxiety."

5. Stakeholder Management & Technical Trade-offs

Real-world design requires balancing business demands with user experience and technical performance.

Conflict 1: The Video Background (Marketing vs. Performance)

• The Ask: Marketing pushed for a heavy video background for a "Luxury Feel."
• The Compromise: I optimized the asset and implemented a static "skeleton" image for instant loading. This satisfied marketing while protecting our Core Web Vitals (LCP).

Conflict 2: The Aggressive Chat (Sales vs. UX)

• The Ask: Sales wanted an auto-opening chat to maximize lead volume. I proved this interrupted high-intent search behaviors and diluted lead quality.
• The Solution: Engineered a "Smart Trigger" protocol. Chat is suppressed while the user types, engages only after 15s of inactivity, and pauses the Hero Carousel if opened to prevent visual overload.

6. The Scale: Empowering Marketing with AI

Marketing needed to launch 300+ route-specific SEO pages but was bottlenecked by development resources.

• Design System Governance: I architected a modular system of 15+ flexible blocks (Hero, Reviews, Trust) integrated directly into the CMS. I baked strict constraints (padding, typography rules) into the code to ensure visual integrity even when built autonomously.
• AI Integration: The system now leverages AI to populate SEO-optimized text within these constrained modules.
• The Result: Page production time was reduced by 95%, allowing the marketing team to scale operations instantly without design intervention.