Ginger’s Bakery
Local Bakery Site
This case study is focused on developing a desktop-first website for my client’s French bakery named “Ginger’s Bakery”. For this project, the client needed a digital storefront with information on the business and a place for customers to purchase products online.
Tools
Figma
Whimsical
Adobe Creative Suite
Timeline
Total Time: 3 Weeks
Research and Testing: 1 Week
Design & Prototyping: 2 Weeks
Role
UX Designer
UI Designer
Background
Background
Ginger's Bakery is a beloved local bakery founded by Ginger, who discovered her love for cooking at a young age in her mother's kitchen. After spending several years in France mastering French cuisine, Ginger now runs her bakery using fresh ingredients from her homestead, where she raises chickens, goats, and grows a herb garden. The website needed to reflect Ginger's unique story, her commitment to quality, and her passion for baking, while also making it easy for customers to purchase products online.
Objective
The goal of this project was to design a brand-new website for Ginger's Bakery. The website needed to reflect the warmth and homeliness of Ginger's Bakery while providing a seamless online shopping experience for customers. The primary focus was on enhancing user experience, streamlining the checkout process, and improving overall navigation and accessibility.
Research
Methodology 1: Competitive Analysis
Research Objectives:
Understand user expectations and needs for a bakery website.
Identify desired features and functionalities.
Gather feedback on design preferences and UI elements.
Determine preferences for online ordering and delivery options.
Collect suggestion for creating a user-friendly and appealing website.
Key insights
The competitive analysis reveals that successful bakeries in the small town differentiate themselves through diverse product offerings, strong community engagement, excellent customer service, and a robust online presence. Emphasizing local ingredients and unique specialties position these bakeries favorably in the market.
Methodology 2: User Interviews and Affinity Map
Interviews were conducted about ordering bakery products online. Participants were asked about their experiences and preferences.
Common Pain Points
CONFUSING NAVIGATION
LACK OF FEATURES
MISSING INFORMATION
DIFFICULT CHECKOUT PROCESS
Wireframes and Prototypes
Lo-Fi Wireframes
Based on initial research, the low-fidelity wireframes included layout of the major sections of the homepage and checkout process.
The high-fidelity phase was about refining the major sections, getting critical feedback from the client, and making any necessary adjustments.
Hi-fi Wireframes:
After user testing on the site, improvements were made based on feedback to the overall flow as well as some small changes to the UI that improved experience and accessibility.