A curated luxury
experience

The UX-UI process was not a separate phase. It was the direct output of nine months of research. Every structural, visual, and interaction decision in this section traces to a finding from 25 user interviews, 50 surveys, and a competitive teardown of eleven luxury and luxury-adjacent brands. This page documents how those findings became architecture, architecture became interface, and interface became a luxury digital experience that does not look, feel, or behave like the cycling category it competes in.

The benchmarking phase is documented in detail in the Research chapter. What follows is the distilled output: the eight UI-actionable takeaways that shaped every decision on this page. The point of this section is not to summarise research. It is to make the through-line from external evidence to internal decision visible.

For VELOQUE, SEO isn't primarily about being found by strangers. It's about showing up correctly for the people already looking, and using that same research to make the site itself easier to shop. Four things had to reconcile: how the brand shows up in search, the words that guide the customer, the colours the customer is actually looking for, and a site structure and category set that matches how they already think.

VELOQUE's traffic strategy is brand-led, not keyword-led. Most high-intent users arrive already knowing the brand, so SEO was never going to be the acquisition engine. Its real job is presence: appearing correctly, consistently, and in the customer's own words wherever they search, which reinforces credibility before they ever land on the site. That same research doubles as the cheapest, most honest way to improve the customer experience, because it tells you exactly where today's category labels get in the customer's way.

I worked with an external SEO specialist, on a structured intent study to turn that presence into a working map of terminology, colour, and structure.

The study started with vocabulary, the actual words cyclists search, not the words the industry writes. Search volumes for "bib shorts" vs. "cuissard" vs. "culotte" vary by an order of magnitude across markets, and getting this wrong means the customer's own language never matches the site's.

Colour-family search clustering across men's and women's segments showed that black, navy, and camel dominate intent in the luxury cluster, while vivid colours only peak in narrow seasonal windows. We also mapped trends in range composition and seasonality, so drops launch inside the intent window instead of against it. The product range is structured around the colour families customers are demonstrably searching for, drop-specific palettes layered on top of a stable, neutral essentials core, rather than a palette chosen on instinct.

The output of all three (presence, terminology, colorimetry) was never a keyword list. It was a category map that let the site's structure mirror the customer's mental model instead of the brand's internal taxonomy. The range is organised by use-case (road / gravel / café / racing) crossed with the colour families above, collapsing what would otherwise be a long, confusing garment taxonomy into a navigable, gendered, use-led structure that improves how the customer actually shops.

That same category research surfaced a concrete structural constraint: above ~30 visible product models, the brand stops reading as luxury in the cyclist's perception (consistent with the MAAP and PNS findings in §02). VELOQUE's catalogue is capped at 27 active models, with seasonal drops rotating in and out rather than accumulating, keeping the structure itself part of the brand's luxury signal.

Before a single high-fidelity component was drawn, three sitemap-and-flow variants were prototyped as interactive Figma wireframes and tested with 10 moderated users drawn from the Progressive and Engaged personas. Users completed identical tasks across all three: "Find a jersey for a hot-weather gravel ride," "Buy a piece from the current limited drop," "Check what's included in the seasonal subscription."

Click any branch to expand. Hover a node to see why it exists. Home sits directly off the root, a level shallower than every other section, because it is the entry point, not a category. Everything else, the shopping moments, the club, the account, is indented one step to the right of home, and each sub-level indents further still, so depth in the tree always reads as depth in the site.

Once the sitemap was validated, the homepage flow was rebuilt in Framer as a fast-prototype, interactive, scrollable, and shareable as a public URL, before committing to the design system. The objective was fast validation of brand storytelling and scroll rhythm with internal stakeholders and a small group of cyclists, not pixel polish.

The scroll length is intentionally long. A luxury experience should build a mental model section-by-section, not compress it into a single viewport, and the prototype confirmed that users would scroll the full page if each section delivered a distinct, relevant payload.

The design system reconciles two requirements that usually pull against each other: modernity (which leans soft, friendly, web-native) and luxury (which leans monumental, dense, traditional). The system commits to five explicit principles.

No platform offers a complete luxury e-commerce solution, and the technical strategy refuses to pretend otherwise. Each tool is assigned the role it does best, wired together into a single system, and the seams are hidden from the user.

The screenshots below are the production interface; the caption beside each one is the design rationale. Toggle Show rationale on each image to surface the gold-pill annotations at their anchor points.

The conversion strategy obeys one constraint: no tactic may undermine luxury perception. Every mechanic below was tested against that constraint with the Engaged and Experienced personas.

The case study is one continuous argument. Research feeds architecture, architecture feeds interface, interface feeds conversion. This table makes the chain auditable.