Designing Habeshawe Coffee; a subscription website for delivering Ethiopian coffee.

Overview

I own 20% of a coffee subscription site called Habeshawe Coffee, (currently being developed, visit us at habeshawecoffee.com). We import organically grown coffee from Ethiopia, the birth place of coffee. We aim to deliver quality tasting coffee right to our customers’ door steps.


Problem Statement

This project was based more on an opportunity than a problem. We noticed a growing trend in the coffee industry, increasing number of subscription based coffee businesses were springing up everywhere. We wanted to take part in the frenzy and create a niche market.

We initially tested our product with local Ethiopians/Eritreans. We started with our families and transitioned to local Ethiopian restaurants, churches, mosques and community centers. It was received very well. Everyone wanted to get their hands on our product. We sold some of our batch on the spot. Market acceptance was looking good.

The challenge is introducing a coffee subscription brand in an overly crowded market and delivering exceptional user experience to drive long term retention and loyalty.

Users and audience

We identified our primary users as Ethiopians and Eritreans. As Ethiopians ourselves, we recognize coffee holds a special traditional place in the hearts of many Ethiopians and Eritreans. It’s customary routine.

Ethiopian/Eriterian Coffee Ceremony

Team and Role

The team consisted of myself and the two co-founders. My role was to design the website. I followed modern web design principles and UX methodologies to design a simple yet functional and aesthetic website.

I visited several subscription sites to get inspiration and designs to adapt into the design of Habeshawe Coffee.

A good artist copy, A great artist steal — Steve Jobs

Constraints

Market constraints

At the time we started, there were already a handful of competitors in the market. Although, we focused on a niche market, we can’t ignore the fact it’s an uphill battle.

Resource Constraints

We wanted to conduct user testing to get quality feedback. However, due to cultural, financial and time constraints we were unable to pursue users and get significant feedbacks.

Design Constraints

The current design is a one page design. Our plan is to eventually import different coffee varieties from different regions of the country. As we grow, this might pose a scalability challenge. As of right now, we only offer one brand/variety of coffee.


Design Process

Negative space is the foundational element in my designs. I build my projects around white space, i.e I start with with negative space in mind from the beginning.

I start my designs by placing components and elements on the page and moving them around until I achieve the best spacing possible. Then I transition into choosing typography, color and other visual elements.

White space act as a separator; it increases ability to highlight CTA better and increases content legibility.

Drinking habits

In designing the price brackets, I wanted customers to know what they are purchasing.

People usually describe their drinking habits as “I am a light drinker” or “I am a heavy drinker.” This holds true for most drinks including coffee.

Keeping this in mind, I wanted the titles to communicate a message, which directly corresponds with their drinking habits.

A point of reference

One of the biggest problems of shopping online is the lack of perspective. Pictures can look deceiving, i.e the actual item might be smaller in person.

Thus, when designing this page, I wanted users to have a point of reference. Not only do I have product pictures; I included average number of cups per bag and the weight of the bag.

Brainstorming and Sketches

During this phase, I sat down with the founders and brainstormed on the look and feel of the site. We visited many existing subscription based coffee and tea companies. We wanted to understand their site functionality usability and aesthetics.

I use a pen and paper to quickly draw layouts, interactions and screen transitions. This method allows me to quickly get ideas out of my mind.
Sketches and Brainstorming

Wireframes

Wireframes affirm ideas into a tangible asset. It allows me to work on spacing, arrangements, and the content rather than the nitty gritty details.

Wireframes give me a bird’s-eye view of the project.
Low fidelity design

High-fidelity Designs

I jump into Sketch to mockup high fidelity designs. I attempted several color combinations that could complement the gold/yellow product picture.

After getting colors, spacing and elements just right, I transitioned into creating versions of the site at different screen breakpoints.

Final high fidelity design

Retrospective Lessons

Defined User Segments

I think we should have a deeper understanding of our customers. We need to further focus on specific user segments; millennial Ethiopians/Eritreans might be the users we should go after as they are very familiar with online shopping.

Shipping Schedule

Including a biweekly, even a weekly, shipping schedule might boost customer satisfaction. It might be an area we need to look into. This is something other coffee subscriptions sites are adopting.