CONTEXT

From college students to cafe regulars, many face challenges in finding suitable coffee shops for productive work sessions. My team shared a common love for studying and working at cafes, but also a common struggle to find new cafes that match our preferences—from accessible outlets to a quiet ambience. We also recalled how many of our peers share the same frustrations of driving 15 minutes to find a cafe with no seating or chargers available.

How can we help college students to easily filter cafes for distance, availability, and atmosphere to satisfy their cafe experience?

USER RESEARCH

To learn more about users' cafe-searching experiences, we conducted surveys and interviews—with our respondents ranging from college freshmen to seniors. We also constructed a competitive analysis matrix to compare various apps with similar concepts: helping users find cafes near them.

FINDINGS

Outlets, seating, wifi, and noise level are the most prioritized features respondents take into consideration

Finding seats and good work environments are the main challenges faced when looking for cafes

There are no cafe-focused apps in the US—only general restaurant finding apps

USER FLOW

Before creating our sketches, we decided to solidify a user flow to ensure we knew all the pages we want to include within our app. Using our findings, along with our initial idea of creating an app to help students with productivity, we decided our main screens would consist of browsing, profile, pomodoro, and search pages.

Complete user flow of app to include all features

SKETCHING

Utilizing our findings, we sketched out wireframes for an application displaying cafes with their amenities: outlet availability, wifi, and crowd levels. We also wanted to include a pomodoro timer to promote productivity and help to foster an effective work environment.

Low-fidelity sketches of onboarding, cafe search, and account pages

We decided our main screens would consist of browsing, profile, pomodoro, and search pages. To ensure we covered all features we wanted to implement, we created a user flow—which also included the onboarding flow of creating a profile.

BRAND IDENTITY

As we constructed our mid and high-fidelity prototypes, we created a brand identity to ensure our elements were consistent throughout our designs. We created a simple and sleek design, so users can easily skim through the key attributes of each cafe and decide where to go. We also wanted the app's design to be reminiscent of coffee, hence the coffee cup motifs and color palette.

Image to show the transition from mid-fidelity to high-fidelity wireframes for LoCafe.

Brand identity and coffee-cup motifs in mid and high-fidelity wireframes

USABILITY TESTING

After finishing our high-fidelity wireframes, we performed usability testing to observe how our audience navigates through our app and utilizes features. We created three usability tasks for each tester and recorded their actions.

TAKEAWAYS

Some features were hard to understand, asked for tutorials

Buttons and text needed more consistency

Users were disappointed in how there was no review section, wanted a clear way to see/make a review

After testing, we edited our prototype to include more pop-ups for new features and a reviews section for cafes. We also looked over our styling to ensure everything matched and finished our Locafe prototype.

REFLECTION

With Project Teams lasting for 10 weeks, my biggest takeaways were learning how to clearly communicate my ideas and keeping designs consistent with multiple designers. In the beginning of the ideation process, everyone in the team had a variety of ideas and we struggled with narrowing down our options. This led to us needing to have multiple conversations about our priorities with the app, where I learned the importance of listening to others' ideas and feedback to avoid missing key points and small details.

Icon used to describe how one of my key takeaways was communication.

Reflecting on our research process, since we pre-established our idea of creating an app to find cafes for productivity, our survey and interview questions may have been biased. A majority of our questions related directly to what productivity features users would want in a cafe, rather than asking about cafe features in general. In the future, I would ensure my research statements do not include confirmation bias to determine whether or not our idea is a viable solution to our initial problem statement.

As for consistency, I never worked with five other designers on the same project, so wireframing to match styling was a bit difficult and different than personal projects I have done myself. However, by utilizing Figma and communicating with my team, we were able to ensure our pages were all consistent and followed the same style guidelines.

Our team received the third place prize, out of nine total teams. This project team experience was very rewarding and it is a project that truly resonates with me—and my love for cafes. I am so thankful for my team and all the work we put into creating this prototype.