Case Study : Bushba —Ecommerce for coffee shop with subscription system
Overview
Bushba is a coffee roaster company based in Austin Texas. With the environment in mind, this coffee roaster company expressed concerns about zero emissions.
The fundamental procedures and methods used by conventional commercial coffee roasters are also used throughout the Bushba roasting process.
Traditional technical procedures are used at Bushba for roasting. Coffee beans are kept in a roasting chamber with a drum shape, heated, and continuously stirred with a rotary stirrer to get the ideal roast. The distinction is that Bushba roasts it using a Zero-Emissions Roaster. This demonstrates Bushba’s love and cares for the environment.
Bushba made the decision to sell their coffee through an online store website. Instead of just having basic features of eCommerce like selling per product.
Bushba wanted to build their primary business model on a subscription basis. So people can create their coffee subscription package, specify the number of bags they want to buy, the type of coffee, then set the delivery frequency.
In this way, customers don’t have to repeat their purchases, and it seems very suitable for the target market of coffee shops and restaurants that need coffee stock regularly.
In this project, I design a Bushba online store by first understanding the problem, setting goals, researching competitors, design wireframes, design user interface and clickable prototypes for the Bushba website.
Problem statement
Bushba intends to sell coffee products via subscription, so that customers only need to place one order and receive their coffee on a predetermined schedule. Even so, this does not preclude customers from purchasing one product per product. They will still be able to purchase coffee as well as create their own subscription plan.
So main problem to be solved in designing this product is how to make a coffee online store with subscription method, and how users can manage their subscription packages and still be able to purchase one coffee at a time.
After formulating each problem from Bushba, I use it as a reference and boundary for me to start looking for solutions and design it.
User & Audience
After talk with the client and observing the target market for Bushba, here is the users & audience for Bushba:
Scope & Constraint
In this project, I did the UX research, UX design, UI design and prototyping sections.
After receiving a brief from the client, I began by conducting UX research, such as mapping, creating user flows, classifying users, conducting interviews with multiple users, conducting competitor analysis, creating user stories, and summarizing the results.
After finishing the research, I began doing UX design by creating wireframes. This is an implementation of the solution I created during UX research from the problem formulation.
When the UX design (wireframe) is finished, I work on UI design, instead of just coloring and filling in images I also pay attention to responsive design to ensure the design runs well on desktop, tablet and mobile.
Process
I applied design thinking methodology to the process of comprehending and working on this project.
Design Thinking is a problem-solving approach that originated in the field of design and combines a holistic, user-centered perspective with rational and analytical research with the goal of developing innovative solutions. Design thinking has five stages: empathize, define, idea, prototype, and test.
1. Emphatize
Empathize’s goal is to conduct research to determine the perspectives and needs of target users prior to defining a problem statement and conducting ideation.
In order to provide empathy and understand user problems, I believe it’s good practice to jump right in and ask people who are in that field to understand their needs.
The difference between my location and the client’s residence is indeed an obstacle, but considering there are no particular differences between coffee shops in one country and another, I don’t hesitate to collect data at my current location.
I decided to visit several coffee shops in my city within a few weeks. with expectations can get more in-depth information of their process in producing coffee stock and meeting other coffee enthusiasts. There is no specific schedule for visits the coffee shops. I just let everything happen.
Process in gathering information
Similarly, the data collection procedure. I conducted open interviews with baristas, coffee shop owners, and coffee enthusiasts.
The behavior of people who drink in coffee shops and the baristas themselves are not typical of structured, formal people.
They love to talk, love to meet new people. And this is what I use as an opportunity to talk to them.
In simple conclusion, I use the open interview method.
After a few weeks of getting into the field, it really paid off. I am able to clearly understand the problems that coffee owners face.
The following are some of the data that I selected which I think can be useful as a consideration in establishing a design
2. Define
In the Problem Statement section, the main problems that need to be solved in the Bushba product design have been explained.
After gathering insights through interviews, I thoroughly analyzed and identified the key problems that needed to be addressed in the design of the Bushba online store, in order to develop effective solutions.
3. Ideate
In design thinking, ideation is a creative process in where designer start generate the idea using data in emphatize and define stage.
Most of the idea is similar to the other marketplace. Users are able to buy products, checkout, choose the payment method, and track the shipment.
But, in product detail, before user checkout there are few thing that they need to choose.
- Grind size (Whole bean, Fine, Medium, and Coarse)
- How many items that they want to buy
And then the most challenging for this project is creating flow and thinking about how user creates their subscription package.
4. Ideate
With this data in hand, the overall vision for the product design is taking shape. I’ve broken down the website design process into three distinct stages: wireframe, UI design, and prototype.
4.1 Wireframes (UX)
With this information, I then created wireframes to help me come up with solutions and designs. I begin each page, including the main landing page, by crafting a wireframe. I’ll give you an overview of the wireframe development process for several pages.
4.1.1 General page
- Homepage
The homepage design doesn’t beat around the bush, it focuses directly on Bushba’s sales model and products. It showcases some products, testimonials, and a brief overview of Bushba, and highlights that Bushba can be used through a subscription purchase.
- About us page
The client also requires an about us page to provide more information about the company, its mission, and the products they offer.
- Product page
Currently, Bushba only has a few products: Red Bourbon Arabica, Yellow Bourbon Coffee, Green Bourbon Arabica, Blue Bourbon Coffee. Due to the limited number of products, there’s no need to align the product display like in a typical online store. Myself and the client agreed to showcase the products on one page, with each product highlighted. (Showing the wireframe of the product page)
- Product detail page
Like most product detail pages, for this design I will display the product name, several images, an “add to cart” button, a “love” option for saving, and a detailed description. Additionally, I’ll showcase a “Grind Size” option according to the product availability, so customers can choose the grind size they prefer.
