The year 2020 gave all of us hard time and the new ‘normal’ takes some time to get used to
One of the things I and my friends missed the most, was going to coffee shops & restaurants to enjoy quality beverages like (duh) coffee. Ordering hot drinks online was out of the question so we started thinking about how we can make this work in times of the pandemic.
Even after everything is going back to normal, we think that the idea presented in this case study will work great for people that live on schedule, and the option to skip the line thanks to our app, is something great to have.
My role
I was co-responsible for building the concept & product journey and designing the prototype & visual concept for the application.
As a Product Designer and co-creator of the app, I was effectively responsible for brainstorming and discuss with other team members the ideas, based on best UX & startup-business practices, like understanding the future user base, client needs, and designing the app for them.
Work on the lo-fi prototype and visual concept took some time (about 2-3h every week for 3 months) Due to two-people team and hackathon like the design process, the documentation is very minimalistic, consisting mostly of the essentials for now.
RESPONSIBILITIES 🧔🏽
Product concept & journey, ideation, end-to-end prototype, visual concept
TIMELINE & OUTPUT ⏱
3 months of work on product
TEAM 💃🏼🕺🏻
Product Designers (2)
The context ☕️
It was one of those nights when you start talking about appliances that could enhance your everyday life. Naturally during the pandemic, most of the ideas orbited around “it would be great to limit the number of people around you” and “I just want to go to my favorites spots again!”.
How to help the local businesses
We also discussed how the idea could help local businesses that are struggling with serving customers. The product should aim at local facilities and give them great management tools.
Order, take, enjoy
Being aware of the limitations of the pandemic situation, we understand that interactions need to be kept to a minimum, so most of the preferences need to be listed inside the app.
Keep me updated
The core interactions with the user should be limited to upcoming orders. Few minutes before scheduled goods, the customer & business owners will get instructions tailored to their needs.
Design challenges
There are multiple products on the market that specialize in food ordering & delivery, but not many of them are specifically targeted at cafes specifically and were designed with the pandemic situation in mind. Finding benchmarks and breaking them down was easy. The challenge came from very specific business limitations, which we found very mind-bending!
Who are the users?
Due to mentioned “two-people team and hackathon like the design process”, two proto-personas were made so we can focus our design decisions on their expected actions - Customer & Barista.
Pains & Gains were surprisingly extensive based on our gorilla-style research. After the first day of UX work, we started to understand what should be our user’s goals, which all of us can relate to.
How can we deliver the idea?
Creating a journey cognitively & visually required separate goals for both personas. Customers are in need of receiving beverages and the business owners want to be found. To organize & visualize the MVP we started drawing the journeys as extended flow with as many ideas as we could think of, separating each milestone.
Customer journey presented as the extended flow of customers ordering products in the cafe
Barista journey presented as the Extended flow of barista receiving an order.
After that, we simplified the journey into just steps to focus on essentials. This unique approach provided great cognitive exercise and confidence in the product’s MVP that is presented on the timeline below.
From here, we focused on the customer journey, which in our eyes was more fascinating to design visually.
if it ain't broke, don't fix it 🍪
There are a lot of benchmarks when it comes to designing food apps. Just Eat, Wolt and UberEats have amazing design solutions, and not borrowing ideas from them would be a waste of time. CafeCo takes what is great about these and expands the concept adding a twist - customers are more likely to pick up the order in their favorite spots.
Naturally, that is not the only twist we have in mind. Subscription options and custom orders are great additions for our users and quite unique for the food app users.
New order
Let’s start with the order process. It is tailored to the customer, who should already know what and when to reserve the goods. That unique approach worked in our tests when the ordered product had to be hot when received and could lose a lot of favor during transportation.
Most of the users already know the place they’re buying from, so the extra description was not needed. One of the mentioned perks of coffee shops is that you can extremely customize the order and save to the favorite for future purchases.
Subscription options would provide users with discounts, bigger orders, and scheduling orders ahead of time. That option is only mentioned in MVP and would be expanded in the future development of the app.
Skip the line
Pickup time plays an important role in the whole process. The customer selects the time interval in which he wants to receive the order and checks in when approaching the shop. The shop owner has already scheduled the visit, so after receiving the notification, the goods should be delivered in a matter of minutes. Payment is being done entirely with the help of the application.
Naturally, if the customer would not show up for the order, and not cancel ahead of time, he’ll receive one of three strikes. From our research, we understood that giving management power tools for the shop owner is a must-have and it would be expanded in the future development of the app.
Designing from scratch 👨🏼💻
At first, we tried to use common solutions well known to the users from Wolt & JustEat, but it didn’t work well with the UI that required unique orders and received processes. The design is what you can expect from a modern smartphone app, with smooth shape representation to highlight the user-oriented design.
Warm Tone
The color palette consists of two opposite shades - orange and blue, the autumn duo, that is connected with a feeling of warmth and care. The synergy of shades makes the CafeCo unique when looking at the competition.
Blue was chosen as an action based on research we conducted and knowledge that it’s one of the most commonly used interaction colors. The exception to this rule is primary buttons. Big blue buttons were too engaging so the color was changed to yellow.
Orange is used for highlighting elements in the UI that represent the value and focus the user’s attention on the details.
Vivid minimalism
Components & patterns follow the rule of “don’t overthink it” and focus on the essentials, with a modern twist. Some of the components use the same color to present their state and others are presented only as vivid typographic elements.
The dominant shade in the application is white and grey, to boost the impact of the photos presenting the shops and products. The use of shadows & blur gives a more exclusive present as a whole.
Outcome & retrospective 🤔
The CafeCo project was made in a couple of days to test the idea. We’re very happy with the results created in a two-person team, even if the UI design took a bit too long to make. The lesson from this experience was to research, test & design solutions in a short time without overthinking the whole process and it was a...
Success!
Designing an application by doing the whole process in just 3 days is not a small task. Naturally, the UI took some more time, but overall the core of the concept was made over the weekend and that’s not an easy task.
Future development
As the pandemic days go away, the idea is not so innovative anymore. Surely we could transform the concept into something more dedicated to users that want custom orders, but that would require a lot of work from us.
We might return to the idea somewhere in the future or use it as a great learning experience.
