01 / 07
Restructuring a National Brand's Digital Experience
6→1
Clicks to join a waitlist
A strong brand and quality product can still lose customers if the digital experience creates friction. OEB's site was making its three highest-intent actions harder than they needed to be — especially on mobile.
Sole designer — heuristic audit, user journey analysis, mobile usability review, and the full high-fidelity redesign.
A redesign launched in Q2 2026 with a 300% lift in overall conversion across all three primary flows: viewing a menu, ordering online, and making a reservation.
A newsletter pop-up greeted every visitor before they understood the page. The menu had no prices or photos. Joining a waitlist took six clicks.
OEB Breakfast Co. is a national breakfast, brunch and lunch brand with genuinely excellent food photography and a distinct point of view. None of that was the problem. The problem was that the site's structure and interaction choices sat between a hungry customer and the thing they came to do.
I ran a condensed, evidence-based audit across the three most-visited pages — Home, Locations and Menu — evaluated the three business-critical user journeys end to end, and assessed the whole experience through a mobile-first lens, since mobile is the primary channel for prospective restaurant customers.
"Small usability issues have an outsized impact on high-intent behaviour. Someone deciding right now where to eat will not work for the answer."
Mapped the three most common, business-critical journeys — menu, reservations, ordering — against analytics and user expectations to see where real visitors were dropping out.
Audited Home, Locations and Menu against usability heuristics and WCAG — contrast, tap targets, legibility, responsiveness — surfacing problems before any development investment.
Consolidated the findings into a prioritized problem statement: the brand was working, the structure was not, and high-intent tasks were the ones being blocked.
Rebuilt the site structure and navigation around what visitors actually come for, surfacing menu, reservations and waitlist as primary paths instead of buried links.
Set measurable targets before design started — clicks to complete each task, contrast ratios, mobile body size — so success could be judged on numbers, not opinion.
Designed the responsive high-fidelity pages and updated the brand design system — colour, type and components — to be accessible, modern and reusable across the site.
Page goal: quickly communicate what the restaurant offers and guide users to high-intent actions such as viewing the menu, making a reservation, or ordering food.
Menu links are hard to see overlaid on a moving background. The green CTA colour with white text does not pass WCAG guidelines.
No link for Reservations violates user expectations, making it harder for visitors to book a table or join the waitlist.
Pop-ups not initiated by the user interrupt before they understand the page. Newsletter signup is a low-priority action for restaurant visitors — poorly timed and misaligned with intent.
Full-width video backgrounds in the hero increase cognitive load and slow orientation, competing with primary actions.
Placing the value proposition at the bottom of the page significantly reduces visibility of a critical element needed to orient and engage users.
High-quality photography and video are visually compelling and effectively reinforce the brand's quality and appeal.
Page goal: as the second most-visited page on the site, this reflects a high-intent goal — quickly finding the nearest restaurant to plan a visit.
The hero video's constant motion increases cognitive load and distracts, making it harder to understand the page's goal — to find location information.
Oversized CTA boxes reduce scannability and force excessive scrolling. Generic city landscapes instead of actual restaurant visuals prevent users forming a connection with each location, reducing relevance and trust.
Overlaying moving testimonial text on a moving video increases cognitive load and makes the message difficult to process.
A footer with no navigational links frustrates users who scroll to the bottom expecting quick access to key pages, leaving them stranded.
Page goal: showcase OEB's offerings, helping users explore dishes, see descriptions and prices, and make informed dining or ordering decisions.
Auto-rotating carousels distract, increase cognitive load, and prevent easy navigation to a specific image or piece of content.
Presenting the menu in a carousel without prices or photos makes it hard to scan and frustrates users by preventing easy comparison of dishes.
After viewing the menu users want to check hours, make a reservation, order food, or find a map — none of those next steps were offered.
Professional images effectively showcase OEB's dishes, making the food visually appealing and enticing.
Most visitors arrive with a specific goal in mind, and friction at any step can delay or prevent a visit. Because restaurant users are usually on the go, each journey was evaluated through a mobile-first lens.
"I want to browse the menu and see if this place is good"
The visitor scrolls the homepage hunting for a menu, hits the newsletter pop-up instead, nearly misses the real button, then lands on a blank page. When the menu finally loads there are no prices, no photos, and images that move before they can be read.
Recommendation: eliminate broken links and provide a static menu with photos, prices, and social proof such as "most popular" or "local favourites" to guide choice.
"I want to make a reservation / join the waitlist"
Scrolling for a nearest location surfaces the newsletter pop-up first, then food imagery that doesn't help them locate anything. They guess at a page, scroll to confirm, and find the waitlist six clicks later — by which point they no longer need it.
Recommendation: minimise steps for high-intent tasks. Reducing the waitlist journey from six clicks to one or two significantly improves usability, especially on mobile.
"Can I order takeout / delivery online now?"
Once past the homepage pop-up this journey largely works — the third-party ordering platform is streamlined, recommendations land well, and checkout is easy.
Recommendation: remove the homepage newsletter pop-up so users reach this high-intent action uninterrupted.
Mobile users need content that is immediately readable without zooming, primary actions that are easy to tap one-handed, and a hierarchy that makes the next step obvious. Three findings were measurable rather than subjective.
CTA buttons were also cut off or misaligned in places, and the page allowed horizontal scrolling — a clear responsiveness failure that makes navigation error-prone.
Every finding pointed the same direction: the brand was doing its job and the structure was not. The redesign removed what interrupted — the unprompted pop-up, the competing hero motion, the auto-rotating carousels — and promoted what people were hunting for.
Key changes: a static, scannable menu with photos, prices and social proof; reservations and waitlist surfaced as primary navigation rather than buried; real restaurant imagery on location pages in place of generic city skylines; the value proposition moved above the fold; a WCAG-passing CTA colour; and a footer that works as a genuine secondary navigation hub.
View the live site ↗
