Balzac's Coffee Roasters
During my second year UI/UX design-focused course, our professor gave us a project where we had to search for an existing business, identify a gap or problem within the platform to intervene in, research it and propose a UX-focused solution. My team settled on a franchise of coffeehouses based in Ontario and worked primarily with secondary research in order to develop our proposal and final solution.
Context
Building a New Experience for Coffee Enjoyers
Balzac’s Coffee Roasters are a franchise of coffeehouses who sell their coffee beans in traditional retail stores and on an e-commerce platform. They believe in the consumption of coffee as an enriching encounter, and strive to establish coffee as a cultural experience for all their customers to enjoy.
Framing the Problem
01
Casual coffee consumers lack the knowledge and sense of refined preferences to make informed decisions that impact the quality and flavor when purchasing coffee. This acts as a barrier for casual coffee consumers towards engaging in more specialty coffee consumption.
02
Based on their survey question answers, casual coffee consumers are demonstrating an interest in broadening their knowledge by purchasing different coffee types. However, they lack the required knowledge of coffee culture to make informed purchases as a connoisseur would.
Discover
Competitor Analysis
We conducted a competitive analysis with the company Kit + Ace as part of our requirement for this project and were provided with a handbook with their branding. We were tasked with discovering strategies and utilising them in our final solution and experience.
Engine Digital, the company that was in charge of the branding, wanted to balance both cultural and commerce aspects in their new feature redesigns using a UX approach. They outlined three main experiences as a baseline for laying the content and services that Kit + Ace would provide including website structure, personalization and the digital to physical connections.
Key Takeaways
For our project, we highlighted three main strategies that we wanted to implement in our final solution. The first strategy focuses on customization, allowing users to narrow down the type of content they receive. The second strategy focuses on content separation, dividing parts into a hero, content and feed to foster a linear narrative for the user to scroll through. Lastly, the shopping features connect online to in-store activity, decreasing the friction between a digital experience.
Key Features
Identifying and Analysing Consumer Behaviour
The current website lacked brewing method explanations depending on the different grind types.
Rationale: “Coffee drinkers, especially older millennials, aren’t just gulping coffee for a simple morning pick-me-up. They want a deeper, more sophisticated coffee experience that’s achieved through high-end brewing methods and premium ingredients.” - Restaurant Business, Consumer Trends
The various product types do not explain how to use each type of product -- the usage of coffee beans depends on the format they come in.
Rationale: “Consumers search for new quality experiences coupled with new state-of-the-art at-home machines that allow consumers to replicate beverages previously only available from a professional barista,” - World Coffee Portal, Coffee Industry Reports
The flavour profiles fail to elaborate on what each flavour note means and what the levels indicate.
Rationale: “Those who consume single origin coffee and even specialty blends typically want to know more about their coffee, from the origin and variety to the roast date and profile.” - Canadian Grocer, Consumer Reports and Trends
Final Solution
Designing A Solution
User Flows
After identifying the strategies we wanted to implement from Kit + Ace and developing rationale for consumer objectives, we created a simple user flow to show how the consumer would progress through our experience. As for the flavour profile pathway, we ended up pivoting due to the medium we were working on (digital) and landed with something more feasible; coffee origins.
Structuring & Wireframing
The landing page consists of various intervention points for the consumer to learn more about specialty coffees and further inform them prior to their purchase. The recipe cards create a subtle access point to a brewing and flavour information overview and they can choose between two different pathways: brewing types or coffee origins. As for the product page, various guides and terminology are provided in order to show which factors will impact the consumption experience.
For the brewing method and coffee origin pages, brief explanations are provided with additional product recommendations listed underneath. The consumer is able to sort through the different specifications and learn how to elevate their coffee experience.
Prototyping
For our final prototype, we created an organised and easily navigable informative experience in order to bridge the gap between casual coffee consumers and connoisseurs. We wanted to introduce diverse methods of coffee consumption for these consumers expressing their desire to search for innovative ways to enjoy coffee. As such, we created several opportunities across this new microsite experience for consumers to hover, click into and overall explore exactly what these coffee beans have to offer them that makes them stand out from the rest.
Visual Design
Developing the Visual Identity
UI Design
Through initial experimentations with colours and font pairings, we settled on using GT Walsheim as our primary font for its rounder and welcoming atmosphere. When the font is set to all capital letters, it creates a bold impression that is representative of the bold flavours and branding of Balzac’s Coffee Roasters. Furthermore, we did not want to stray too far from their current branding and as such, settled on branding that would follow closely with the current site.
Deliver
Final Takeaways
Results
At the beginning of this project, there were multiple pivots that we needed to decide on and carry out in a short period of time, however with the assistance of the TAs and the professor, we were able to land on an established company that led to a highly successful project.
One of the greatest challenges we faced as a team was landing on a feasible client that will allow us to develop a proper intervention and solution, but through that we were able to learn a lesson that I still value to this day; never be afraid to trace your steps and rework the foundation of your work. Design processes are meant to be iterative and nothing is truly set in stone in the beginning stages, which is a lesson we had to learn the hard way, and as a result we were working under tight time pressures. As a result, the extra time pressure ended up being a driving force and with a supportive group and teaching team, we were able to present a polished product using solely secondary research.
Here were some of the additional things I learned from working on this project!
Hard Skills
- Created and refined high fidelity wireframes for the landing page, brewing method pages and coffee origin pages
- Collaborated with the team and teaching team to incorporate critique and feedback
- Coordinated final product prototyping using Figma
Soft Skills
- Time management
- Project management
- Verbal and written communication
