Caffinder
Helping remote workers find the best coffee shop
My role
Research, UX design, Interaction design
Tools
Figma, Qualtrics, Usertesting.com
Team Member
John, Brenna, Anita, Yen-Jen
Time
3 Months
Let's work remotely in a coffee shop Together!
Backstory
Pandemic has impacted work location
58.6% are remote workers due to the COVID-19 pandemic (NorthOne)
The Situation
There’s a notable lack of good apps to find local coffee shops and an even more notable disparity in quality between coffee shops. We want to give our users the ability to find a shop that matches their expectations and provides the experience they want on any given day. The app will also function as a way to save particularly good shops or help local shops by spreading awareness. By using user-generated data, we can help good local shops compete with large chains, rather than relying on sponsored advertisements.
Problem Statement
Are people finding a coffee shop that meets their needs?
How might we
create an application with a specific filter and smart features to help people find a preferable coffee shop for work and study?
Research
The interview with prospective users and owners will give us qualitative data to craft our survey questions. The survey will give us quantitative data with insight regarding which features, filters, etc… are most valued by prospective customers.
Interview - Users
The interview with prospective users and owners will give us qualitative data to craft our survey questions. Starting with users and potential customers, we conducted 6 interviews with potential users to understand their experience when choosing a coffee shop for work or study.
1.People use Google Maps to find coffee shops for work but also word of mouth.
2.The most important amenity among our respondents was the number of available sockets.
3.Some respondents got tired of their usual shops, others were interested in trying different shops around their homes
Interview - Shop Owner
The owner interviewed runs a local coffee shop in Brentwood, Austin, TX. The shop has been open for 5 years and caters to creating a strong community space. From our interview, we learned that balancing different customers and their needs is difficult, coffee shop patrons tend to be a highly variable group.
Survey
We gathered 57 effective responses in a week, with 22 participants aged 18-25, 34 participants aged 26-34, and 1 participant aged 35 or above. 68.75% of our participant's study or work in a coffee shop, indicating our target audiences account for a large scale in all the coffee-shop goers.
-
50% of users use Google Maps to search for information
-
People care about wifi and sockets most, location, chairs, business hours, and atmosphere.
-
People read reviews with photos most then texts.
Users dislike inefficient since they spend time exploring information from cross-equipment. Also, after searching on Google Map or content platform, they didn't find details of the environment of the coffee shop but instead other irrelevant information.
Lastly, it's hard for users to check the current condition. For example, when they head to the coffee shop, they found the wifi is too slow and no available socket as too many people.
Users focus on reliability. 50% of online participants rely on Google Maps to search the information and some of them also rely on word of mouth from friends and KOL.
Moreover, people need to find a place that matches their preference for the environment. Lastly, they want to get a notification of how current condition of a coffee shop.
User Journey Map & Define
User Journey Map
There are two gaps in the journey when users want to find a coffee shop to work and study.
1. Browse to search information: Overload information makes users spend time searching and organizing the data across digital tools.
2. Decide to experience: Unexpected environment in the coffee shop makes users feel terrible.
Pain point
Users are hard to find a coffee shop based on their needs.
Defined the Requirement
-
Must list and provide environment details of coffee shop
-
Must help users know the current condition
-
Must have a filter to generate the result
-
Must make users share information and follow others
Design
Ideation
We were thinking about mobile or web which one is better. After reviewing the user's feedback and flow, we decided to choose the mobile application as the solution because it's more convenient when people stay outside and use their mobile to search the information with images and information, also check the current condition of the coffee shop.
Wireframe
Based on our discussion, I created the wireframes for the homepage, filter, and review page to make sure what are the basic components of information we are looking for. Then brought them to my team to discuss with everyone.
I focus on the main page where users explore the information first. In addition to the basic information, I suggested that use icons replaced the texts to show some information such as wifi, socket, etc. Not only simplify the interface but also as decrease the overload of information for the users.
I also proposed using the defined labels button to help users efficiently filter the result. There are: good for study, good for work and good for the group.
Prototype
I created the prototype with the mid fidelity wireframes to run usability testing on Usertesting.com.
User Testing
We conducted testing with 5 participants for our mid-fi prototyping. They all agreed the flow is easy and understandable. Also, they clicked the defined labels to find the results first then to filter and search. The defined labels did fill users' need.
#1 Home Page
We need to make a clear link.
Lack of connection between the popular icon (fire) and the wifi and socket icon. People didn't connect if the place is popular, there might be not enough sockets and stable wifi.
#2 Filter
We need to consider more in reality.
Offering items can't satisfy users. They need to have food in the coffee shop since if they work there for 8 hours, that is what real-world happens.
Also, the sound options are too complicated to confuse users. None of the users chose the mixed sound or normal options since users only selected the quiet option when they need it.
#3 Review
We need to think definition clearly.
The score of options is too complicated and confuses users. No one can tell 3 is positive or negative. Users only want to see clear instructions.
Iteration
We did iterations three times and I improved the pages based on the user's feedback.
Hi-Fi Wireframe
These are the highlighted feedbacks and suggestions:
1. Keep related components together.
2. Think about real-world experiences even if the interviewer didn't mention them.
3. Definition needs to be clear since everyone is with a different perspective.
4. Icon and color are easy to help users distinguish the situation.
Hi- Fi & Prototype
I was responsible for the home page, filter, and review page. We tested the prototype baes on 4 independent tasks with the participants. The tasks are all about the questions when people are in the real world when choosing a coffee shop.
#Home Page
#Filter
#Review
#Upload photo
Next Step
#Encourage Engagement
We noticed that user-generated data is the most important value want to Caffinder since people rely on others' comments to evaluate the coffee shop. Also, people follow others sharing to explore more new shops. Lastly, the reviews and sharing could help us bring in new members. Therefore, designing a gamification mechanism and micro-interaction to encourage users to contribute to the review is our next step. In the future, we want to build a complete cycle system.
