Campus Coffee: P1 at General Assembly
Introduction
I did a-lot of “firsts” in the past week. It was the first time I went up to strangers to ask them a series of questions about their social lives, it was the first time I tested a prototype, and it was the first time I actually started to understand the process of UX/UI. Oh and this is the first time I’ve written a case study. Below I will do my best to describe the process for creating Campus Coffee, my first project as a UX/UI Designer.
The Brief and Hypothesis
Before starting on P1 (Project 1) we were all assigned a partner (or 2) with who we would start interviewing with before breaking off to come to our own conclusions. We had a few lectures on the Double Diamond design process and how to conduct successful user interviews. Hypotheses and user interviews start off the first half of the first diamond. So lets get down to it.
First the brief:
General Assembly is looking to improve the lives of students either academically or socially.
My partner, Andrea, and I preferred to explore social. Immediately I though of Slack and how that was the primary mode of communication in our cohort. There has to be some frustration there right? All communication is through it, so wouldn’t students want a better way to receive social notifications and a better way to organize events? That was my hypothesis, and I was pretty confident that the interviews would reflect that.
User Interviews
Andrea and I started our first interview with our mentor, Leah. The questions were about how the interviewee organizes and gets notified of events and what events they attend (within GA and outside of GA). Being nervous that it was my first user interview I forgot the most important part of interviewing, asking WHY. Asking why she bought her lunch most days or why she thinks a calendar is the best solution for General Assembly’s hosted events. Nether less she gave us some great insights and she mentioned the frustrations I had hypothesized. Andrea and I then decided to interview one more student together before working on our own. We walked down to the floor below in hopes of finding a non-UX/UI student. We eventually spotted a girl sitting by the coffee bar and she reluctantly accepted the interview. Hey — we get it, GA doesn’t slack off on giving students work! Liz, who is a WDI (Web Development Immersive) student (success!) gave us quick answers but Andrea did a great job asking “why”. The insight that stuck with Andrea and I was that Liz wanted to collaborate with UX/UI students to get opinions on her work in WDI. She wished that General Assembly would organize more happy hours so that she could network to meet UX/UI students.
The next day Andrea and I went our separate ways to interview more students. After many deep breaths and soothing my inner introvert, I approached a UX/UI student who happily agreed to an interview. Valerie also gave some great insights about how her cohort organizes events and goes to lunch. I then approached a table with two ladies sitting across from each other and again they both happily agreed to be interviewed. Both Urva and Nechari are content with using Slack for all communication. When I asked Urva how her experience is with Slack, she replied “Loved it, I love Slack.” Doing some quick post-interview synthesizing, I noted that Leah was the only interviewee who had frustrations with Slack. I was surprised by this but it really brought home one of the most important lessons as a UX designer, you are not the user.
Synthesizing
After completing the user interviews, I moved onto identifying trends by affinity mapping. I went through the transcripts of all my interviews and wrote down powerful quotes, user behaviors, and their likes/dislikes on post-it notes. Utilizing a white wall at my apt, I placed all the post its on the wall before starting to move them into categories.
Immediately I noticed that all interviews agreed on one aspect — they wished that General Assembly would hold more events. Unfortunately I can’t really do anything about General Assembly sponsoring more happy hours or lunches. Once I looked at why all the students want more events, it became clear what my problem statement would be.
Problem Statement
After conducting the user interviews, I realized that majority of the students were content with using Slack as the main source of event organization and notification. BUT when I interviewed Liz (WDI student) she said she would like to meet a UX/UI student to get a second opinion on projects. This is NOT something that she can do on Slack. Another UX/UI student, Valerie, echoed this as she doesn’t feel comfortable going up to strangers around campus. I used these insights to form my “How might we” statement:
Students use Slack to communicate social outings with in their cohort, but aren’t directly connected to other cohorts and courses on Slack.
How might we provide students with tools and materials to encourage them to network with other students on campus?
Ideation & Planning
Now we get into the second diamond in the Double Diamond design process. I started with some simple whiteboard sketches for different home page ideas. I was thinking about how students might be able to see events that other GA students are attending. Then I started thinking about ideas that would directly connect students that do not know each other.
Thinking back to how dating apps operate, I landed on an idea that will allow students to plan an event with a new student the don’t know. From here I started jotting down notes of how this could work and what features I would use. Once I had a list of ideas, it was time to simplify. What’s the best way for a student to get to know another student on campus? A cup of coffee, for one it’s free on campus (GA students love free food, I learned that from my interviews), and second it’s not a big time commitment. Grabbing a cup of coffee can be as quick as 10 minutes. I then created the user flow chart, which helped me see the flow of screens before I start sketching.
I then began sketching my screens. At first I decided to eliminate messages as a core feature and instead have a message bubble pop up when you connect with somebody. That bubble message will stay active until the two students agree on date, time, and place of their coffee meet-up then disappear forever. You would input the date and time of your coffee meet up and the app would remind you. Then if you needed to cancel, you would just “X” out the meet-up to which an alert would be sent to the other student to notify them of the cancelation. But what if you’re running late? Or you want to reschedule and not just cancel the coffee? You need messages. I reworked a few sketches until I was ready to move into Sketch and start wireframing.
Wireframing and Prototype #1
I kept my wireframes as simple as possible and decided not to label most of the buttons hoping the user would be able to identify the function based on context clues. The home screen of the app would have a large button in the center with a coffee icon for the user to press. It would then take you to a page where it would show the student profile of who you “connected” with. You can choose to message them which will take you to a private conversation. Once back on the home screen, you can find the existing conversations by pressing the messages button in the top left corner.
User Testing Prototype #1
Next comes user testing to identify any issues and to make sure it’s an enjoyable experience. I gave my testers 2 task to complete. The first task was to connect with a student and message them. The second was that you needed to reschedule the coffee meet-up. I recruited some friends and family to do the testing. For usability test round one on the first prototype, I had four friends test my app over a couple slices of New York’s finest pizza and garlic knots. Side note that has nothing to do with UX: I absolutely love garlic knots.
During the tests, I noticed that most of the testers seemed overwhelmed by the home screen of the app but were all able to complete the first task quickly. For the second task, 2 out of the 4 did not press the messages button first and were perplexed by the organization of the page. In the post test survey most testers agreed that the home page was not necessary and that the existing messages was hard to find. Also in the post test survey 2 of the 4 participants mentioned that they expected a scheduling or calendar feature. So there I had my three pain points thus I created three goals to solve:
- Goal #1: make it easier to start a coffee
- Goal #2: Make it easier to get to messages you’ve already started
- Goal #3: Make it easier to see when your coffees are
I addressed these goals with the following solutions:
- Solution #1: Have the new student profile be the Home Screen
- Solution #2: Clearly label the Messages button and add a tab bar
- Solution #3: Add a feature where users can input the meet up to a schedule. The schedule will be displayed on the Home Screen
User Testing Campus Coffee Prototype #2
I kept the tasks from user testing prototype #1 but altered the first task to include scheduling the coffee meet-up. I received positive feedback on the added calendar feature and there was also reduced confusion on what the buttons functions were. But a few pain points did come up, users wanted to be able to click on “Scheduled meet ups” on home screen and users were confused who’s calendar was showing up on home screen.
- Goal #1: Allow the user to edit scheduled meet ups
- Goal #2: Make it clear that potential student connection and scheduled meet ups are separate from each other
Based on those goals, I came up with the below solutions:
- Solution: Have the scheduled meet-ups on the first page be editable and add a page where all existing meet ups can be seen
- Solution: Add space between the two features and add “Your” to the “Scheduled meet-ups” title
Next steps…
I do like the direction I am going with the app but more user testing would need to be done especially with some students at General Assembly. I also think that adding a “pass” feature would be helpful if you are looking for a student in a specific course. This feature would also need to be tested.
Conclusion
Even though I felt like a fish out of water throughout the process of designing the Campus Coffee app, I am proud of what I accomplished. All of the frustration of doing something for the first time was worth it to see my classmates and instructors react with positivity to Campus Coffee. On to P2 (Project 2)!
