Home / Selected work / OHME!

2025Hackathon · 3 daysE-commerceTeam of 4

Seventy-two hours to checkout

A three-day, design-only sprint for OHME! Foods: keep the joy, fix the hierarchy, shorten the path to purchase.

RoleUX/UI Designer
Timeline3 days
Team4 designers
ToolsFigma
OHME! redesign — hero

OHME! Foods: playful, natural — now easier to buy.

01Overview

OHME! Foods makes premium freeze-dried snacks from simple, natural ingredients, much of it sourced in BC, with a playful, energetic brand. For the FLUI Hackathon (three days, design-only), they asked our team of four to refresh the website: clarify the offer, boost engagement, and shorten the path to purchase. They also wanted a blog for brand storytelling and an AR feature to let shoppers visualise products at real size.

02Audit

The brand personality was already right: bright, casual, joyful. The website wasn’t: weak hierarchy, inconsistent layout, and a shopping flow that fought the user.

OHME! website before the redesign, with annotations flagging the usability issues

The site before the sprint.

  • The “View Products” button just refreshed the page
  • Multiple 404s across the site
  • Content — like accessories — unreachable from navigation

Competitive analysis (Blume, Smart Sweets and peers) plus a persona and journey map grounded the redesign in real shopper behaviour.

Competitive analysis table OHME shopper persona

The shopper persona.

User journey map, part 1User journey map, part 2

The user journey map, start to finish.

03Direction

The goal in one line: keep OHME!, but make it clearer, more engaging, more conversion-focused. We kept the beloved Canopee typeface but held it to headlines for readability, paired it with Switzer for body text, and adjusted the pastel palette for WCAG contrast.

OHME moodboardRefined style guide

04Design

Wireframes restructured the flow around a clearer hierarchy and a shorter path to purchase. We cut a standalone blog page to protect the core shopping experience within three days.

OHME wireframes, part 1
OHME wireframes, part 2

The redesign came together on two pages: the homepage and the product page.

Homepage

  • Hero banner & carousel: movement that makes the landing feel alive.
  • OhMyBlog! section: refined wording and structure to shape its long-term role.
  • Mega-menu navigation: scalable for future inventory, with room for promotion.
  • Accessible, readable design: better contrast, hierarchy and spacing.
  • Cleaner, more dynamic UI: the same fun spirit, now more polished.

Product page

  • Refined product display: expected UI patterns, plus a carousel for multiple angles.
  • AR integration: a QR-code button to visualise the product’s real size.
  • Cleaner “More Picks”: now a slider for smoother browsing.
  • Improved reviews: more structured and readable.
  • Stronger visual hierarchy: better spacing, contrast and typography.
Redesigned homepage
Redesigned product page

Explore the Figma prototype →

05Outcome

We didn’t win the hackathon. But OHME! reached out afterward to talk about working together. The direction resonated where it counted.
3 daysbrief to full prototype
4 designerstight roles, fast decisions
1 client callpost-sprint collaboration interest

06Takeaways

  • Tight deadlines reward role clarity: mapping each person’s strengths on day one kept momentum.
  • Fast feedback sharpens work: mentor input settled decisions in hours rather than days.
  • Sprints produce, but they cost: three days of intensity make strong work and aren’t a sustainable way to live.
Next case study Kio, an AR bird →
Ask me about this project