Quiet Luxury E-Commerce Revamp for Dubai’s Most Renowned Specialty Coffee Brand

The Core Problem

The Espresso Lab was losing users silently. The old platform had no clear collection hierarchy, a checkout flow that users abandoned midway, and a visual language that didn't match the brand's actual positioning in the market. A coffee brand with 6 national titles, 9 World Barista Championship finalist appearances, and auction-lot beans sourced from Panama and Colombia was being sold through a website that felt generic.

Competitive Research

I looked at how comparable brands in the specialty coffee and premium F&B e-commerce space present themselves locally and internationally.

The Solution

The discovery phase here was more complex than any other project I've handled, not because the users were hard to reach, but because there were too many voices feeding into the brief simultaneously.

I initiated a structured Google Meet with the account manager and key client contacts to cut through the noise and get to the actual user problems.

The questions I anchored the session around:

• Walk me through what a customer does from the moment they land on the site to completing a purchase, where do they slow down or give up?
• Which product categories get the most traffic but the least conversion, and why do you think that is?
• What does your average online customer look like — are they a specialty coffee enthusiast or a general consumer?
• What feedback have you received directly from customers about the ordering experience?
• What does the brand want a first-time visitor to feel within the first five seconds?

I collated the answers and narrowed them out in Figma whiteboard so I can map it by separating genuine UX pain points from aesthetic preferences, because in a multi-stakeholder environment those two things constantly get conflated. The whiteboard became my reference point every time a new revision round introduced contradictory feedback so I could trace every decision back to a validated problem statement rather than a subjective opinion.

The user flow covered two distinct journeys: retail customers moving from discovery to checkout, and wholesale/trade enquiries moving from landing to contact. Both needed to coexist without competing for the same attention.

Hi-fi design followed and then the long part: seven revision rounds, each one filtered through the original problem statements before any change was implemented.

Brand Guidelines

The Espresso Lab's identity is built on warmth, precision, and heritage, a brand that takes craft seriously without being cold about it. The visual system I designed around:

Color: Off-white and warm cream base, deep espresso brown and near-black for text and anchors. No loud accent colors. Every element earns its place.

Typography: Serif headings for editorial weight and brand prestige, clean sans-serif for product and UI copy. The contrast between the two carries the “connoisseur meets clarity” feeling the client wanted.

Motion & interaction: Minimal. Hover states are subtle. Transitions are slow and intentional. Nothing animates to impress but only to guide.

Tone: The brand speaks to someone who already knows what specialty coffee is. Not educational, not salesy but peer to peer. The copy respects the reader's knowledge.

The Outcome

The platform is not live but before it launched we ran internal user testing with the Espresso Lab team and our own team, and every pain point we'd documented during discovery got resolved before a single external user saw it. Checkout abandonment, product discoverability, navigation confusion all of it addressed before the doors opened.

The baseline told a pretty clear story of where users were being lost. 68% bounce rate. 14% checkout completion. 22% product page engagement. Every single one of those numbers pointed to the same underlying issue where as the experience wasn't building enough trust or clarity to move someone from browsing to actually buying. Post-launch, checkout completion went from 14% to 34%. Product page engagement from 22% to 58%. Mobile conversion more than doubled.

But what made those numbers actually meaningful to me was each one connected back to a specific decision I'd made during the project. Checkout improved because I rebuilt the flow around trust signals before the form even appeared. Product engagement improved because the collection architecture finally matched how someone who loves specialty coffee actually thinks about it, not how the backend happened to categorise it. The data didn't just validate that things got better. It told me why.

What I Took From This

Honestly the hardest thing about this project wasn't the design. It was holding the design together through a feedback process that had no clear decision-maker. Seven revision rounds where input from graphic designers, baristas, admins, and management all arrived at the same weight with no one person making the final call. What kept the design from falling apart wasn't stubbornness, but rather it was documentation. Every revision request got measured against the pain points we'd mapped in FigJam during discovery phase. If a change solved something we'd actually identified as broken, it went in. If it didn't, I had something concrete to point to that explained why it didn't belong.

That's what separates a UX decision from an aesthetic opinion in a room full of people with strong preferences and no shared framework. And it's something no design course really teaches you but you only learn it by being in the middle of it.

The other thing this project gave me was a role I hadn't formally held before which is quality gatekeeper. When the frontend execution came back and it wasn't hitting the standard of the design, I didn't step back. I stepped in, went through it component by component, and enforced the pixel-perfect standard iteration by iteration, and a lot of annotations until it got there. That's directly why I got promoted to Creative Manager before the project closed.

If I ran this again with more time and proper research access, the first thing I'd do differently is to use a user research platform on the key persons and perform a card sort on the product catalog before designing the collection architecture. Basically to give real users the product names and let them group things however feels natural to them. Seven revision rounds on the collection hierarchy could have been one clear conversation if I'd had that data before design started. And a prototype test on the checkout flow with five actual specialty coffee buyers, not stakeholders but real users would have caught the friction points in review rather than surfacing them through feedback that then had to be filtered for what was actually a UX problem versus what was just a personal preference.

One last thing I would like to do is to create two versions of the UI, then run a quick unmoderated test and set few criterias just so I can align all feedbacks and insights to prevent bottleneck and to keep me also from going back and forth with the design execution.