Marahuyo

Marahuyo had built its customer base on Instagram — strong visual identity, loyal audience, no purchase infrastructure beyond DMs and story links. They needed an ecommerce site to expand reach and establish a credible web presence.

The constraint: the product is smell. Three abstract fragrances that resist easy description. The brief was explicit — the site had to make visitors feel Marahuyo before they read about it. A conventional product grid would strip the brand of everything worth buying.

I conducted a comparative analysis of the fragrance ecommerce category. The core problem wasn't ecommerce — it was translation. Most fragrance sites answer the "how do you sell smell" problem with adjectives: warm, woody, sensual. That approach offloads the cognitive work to the visitor. They arrive uncertain and leave with more uncertainty.

"The interface needed to do the smelling for the visitor — not describe the fragrance, but deliver the feeling of it."

The second problem was structural. Mood-first design and purchase-ready flow pull in opposite directions. Lean too far into atmosphere and the path to checkout disappears. Lean too far into conversion and the brand evaporates. The solution had to hold both.

The framing decision came early, in collaboration with the client: the entry point would be "Begin scent journey" — not "Shop now," not "Explore." That single reframe changed the site from a store to an experience, and it changed the information architecture of every page that followed. Visitors aren't browsing; they're being led.

Structured each fragrance as a character — archetype → feeling → notes — moving from emotional to factual in a predictable sequence across all three products.

Built product pages that shift register deliberately: mood and story above the fold, hard data (notes, volume, price) below, in the same order on every page.

Defined the motion system as a first-class constraint — page transitions, scroll behavior, and reduced-motion fallbacks were specified before any high-fidelity work, not after.

Ran informal usability sessions with two users during mid-fi to test whether the journey structure created confusion before checkout. It surfaced one copy change: the CTA on the collection page moved from "View" to "Enter" to stay in the established register.

Hit Lighthouse 99 performance by treating image delivery and font loading as UX decisions, not post-launch cleanup — the cinematic feel had to survive on mobile, mid-load.