Coffee Matters is a café finder app for coffee-lovers. The design concept stems from the mission of the company: to help everyone find the coffee they like. Whether you're a coffee snob or you don't know nothing about brewing and roasting coffee beans, you deserve to enjoy a coffee cup at a beautiful place that suits your necessities.
Firsts things first: why do we need this app?
Coffee is the second most drank liquid just after water.
Consumers have become real snobs who enjoy many different things about coffee. From the brewing process (many options just here) to the origin of the coffee beans.
Now people care about the composition, origin and the story behind the coffee they are sipping. But the real coffee snobs care about things like altitude, selection, roasting, brewing and even the type of cup they're drink from.
Humans tend to move around and, even when we are going through a pandemic that prevents us from international travel, we find enjoyment in discovering new places.
Goals
The main focus around the app is building a community and promote the taste for good coffee.
For the users we have to be useful answering three main questions for them:
1. WHAT DO I WANT?
2. WHERE SHOULD I GRAB IT FROM?
3. HOW MUCH WILL IT COST TO ME?
So the main goals for the app should be:
1. Find the right places and products for the users.
2. Give the right information about products.
3. Offer deals and competitive prices.
UX Research. Benchmarking, interviews and user personas
Let's talk branding
I like to start my projects using the stylescape technique. I look for inspiration, from color to typography, textures and photography. Then I try to see how do they work toghether I try to buid any kind of creativity with all of that.
The stylescape is the starting point that with the help of a good benchmarking has lead me to define the right branding for the app.
The goal here is to build a brand that makes quality coffee an accessible and close product, while moving it away from the tendency to relate it to the refined and elitist.
Architecture
Wireframing process
Design
Prototype
This prototype was created with InVision. You can try it yourself here.