A fresh and [emphasis]flavour-first website experience[/emphasis] for donut lovers

Overview

Offbeat Donuts is a premium artisan donut brand based in Ireland, known for creating handcrafted and indulgent treats that blend classic flavours with imaginative twists. Founded with a passion for quality and creativity, Offbeat offers a wide range of donuts made fresh daily, using high-quality ingredients and unique recipes.

To match its playful identity, Offbeat aimed for a modern website that highlights its creativity and premium quality, showcases imaginative flavours, simplifies ordering, and delivers an engaging online experience.

My responsibilities during the project

  • Partnered with UX Lead on wireframes
  • Led the creation of high-fidelity UI across core user journeys
  • Collaborated with developers on QA to ensure design accuracy
Agency
Matrix Internet
Role
UI Design Lead
Work
Design System, UI Design, QA
Tools
Figma, Adobe CC, Miro
Year
2021

🏔️ The challenge

  • Scalability: Build a scalable eCommerce platform for Offbeat’s growth
  • Functionality: Blend brochure-style content with advanced functionality and delivery integrations
  • Efficiency: Streamline operations, automation, and performance tracking

💡 The solution

  • UX & UI overhaul: Playful, mobile-first design with intuitive navigation and engaging visuals
  • eCommerce integration: Custom store ordering system, automation, and delivery partner connections.
  • Content & marketing tools: Scalable CMS, personalised messaging, and social media integration

📈 The impact

  • Engaging experience: Playful, on-brand site making ordering and exploration seamless.
  • Business growth: Revenue +15.8%, orders +9.4%, users +55% since 2020
  • Streamlined operations: CMS training, automated orders, and delivery integration for efficiency

Mapping Offbeat’s online journey

We kicked off the website redesign with a marketing and UX workshop aimed at defining the brand’s online direction. The workshop explored brand personality, vision and positioning, value proposition, customer types and personas, SWOT analysis, RACE communications strategy, and website benchmarking. The goal was to translate these insights into a playful, modern, mobile-first website that highlights creativity, premium quality, and seamless online ordering.

Key takeaways from the workshop:

  • Brand personality & positioning: Playful, inventive, premium identity guiding tone and visuals
  • Value proposition: Imaginative flavours, fresh ingredients, indulgent experiences
  • Customer personas: Families, corporate, and occasional users shaping navigation and content
  • Benchmarking: Competitors like Costa Coffee, Kinder, and Daily Donut for best practices
  • Sitemap focus: Donut range, booking, and occasions (celebrations, gifts, seasonal specials) for easier discovery and ordering

Designing a playful, premium digital experience

The design process for Offbeat’s new website was driven by insights from the marketing and UX workshop and translated into a playful, premium digital experience. Building on the workshop’s findings, the team transformed Offbeat’s brand personality, value proposition, and customer insights into a modern, mobile-first website that feels both inventive and high-quality. Competitive benchmarking guided best practices for usability and e-commerce, while the sitemap focus on donut range, booking, and key occasions streamlined discovery and ordering.

Key visual tasks included:

  • Visual language: Defined colours, typography, and imagery reflecting Offbeat’s playful, premium tone
  • Content hierarchy: Prioritised messaging and key offerings in the UI layout
  • Sitemap structure: Highlighted donut range, seasonal events, and promotions in site architecture
  • Navigation flows: Designed intuitive paths for browsing, booking, and ordering
  • Usability standards: Applied interface and e-commerce best practices from competitor analysis
  • Interactive features: Added engaging UI elements that enhance user experience and reflect brand personality

Impact

The redesigned Offbeat Donuts website brings the brand’s playful, premium identity to life with a seamless, mobile-first experience. Streamlined navigation and intuitive ordering make discovering flavours and placing orders effortless, creating an engaging, on-brand experience. The platform has driven business growth – revenue +15.8%, orders +9.4%, users +55% since 2020 – while CMS training and automated ordering streamline operations.