.png)
Project Type
Academic
Duration
Oct - Dec, 2020
Team
Team of 3
My Role
UX Research, Prototyping, Participant Recruitment, Usability Testing, UI Design and Study Report
Overview
Overview
Comfyhead helps you stay connected with your peers no matter what software you use to communicate. Express yourself beyond “LOL”s with real-time facial expressions and give yourself a mental health break by keeping your camera off while still being able to show a smile with your avatar. Comfyhead keeps you comfortably connected, while also adding some much needed whimsy back in your life.
Design Problem
Although we have many ways to stay connected with each other, there’s still a massive disconnect between people. We are looking to bridge the gap between people as they are looking to connect, allowing people to passively understand each other’s comfort level, but also know when to reach out. We want to develop a product for people to understand how their peers are doing and when they can feel comfortable reaching out to others or be reached out to themselves.
Process
Research
>>
Define
>>
Ideate
>>
Design
Test
>>
User Research
To understand how we can help students feel comfortably connected, we first conducted user research to identify problem areas and space for improvements in the lives of professors, students, and advisors.
Surveys
27 Responses from students engaging in online education
Interviews
12 Interviews
7 Students
4 Faculty
1 Student Advisor
Ethnographic Field Study
2 Students
Surveys
Since our primary stakeholders are students, we knew we had a huge group of people to gain knowledge from, namely our peers. We believed the best method to get specific answers and data to our questions without using too much of our time and that of our research participants was to release an online Google Form survey.
-
“Comfortably Connected” - Our survey
-
“College students emotional well-being” - Fellow students' survey
Interviews
We took 12 semi-structured online interviews consisting of students doing remote learning, advisors interacted with such students and professors taking remote classes. The link to the detailed findings can be found at the link: Interview Data
Ethnographic Field Study
Apart from surveys and interviews, we conducted field studies to find out how students are customizing workspaces to fit their needs. We went to the student’s workspace to observe their studying habits, behavior and environment. We took detailed notes of the happenings throughout the day and compiled some key observations.
Key Findings
From all of our research methods, we narrowed down onto a few key insights
Students feel uncomfortable turning their web camera on through the lectures
Without visual cues, students and faculty are unable to gauge each others comfort levels
Students hesitate to reach out to professors and classmates for casual conversations
Define
After research, common patterns and behavior trends are identified. These findings are then used to further guide the design process.
Refined Design Questions
After our user research, we further refined our design question with the hopes of it leading us towards building a product:
-
How can students understand each other’s comfort level?
-
How can we understand the boundaries of students connected remotely?
-
How to be respectful of a student's personal space and academic space?
Personas
Through our research, we have created three user personas that represent the motivations and pain points of our stakeholders.
Design Goals
Our research and persona creation allowed us to come up with specific design goals that we hoped to accomplish with our design solution. At this point we kept intentionally wanted to have a wide range so that we could ensure to keep all answers from our user research in mind while addressing problems and interesting points we had previously identified. We selected four most important ones from them.
The solution should send signals to others whether the student is focusing on personal or academic life
The solution should inform about their comfort level in terms of open for communication
The solution should encourage all students to actively participate in class, in spite of being at different comfort levels at their homes
The solution should encourage interactions between remotely connected students
Ideate
Based on key pain points of the defined personas, brainstorming is done to solve their problems. Features are devised keeping in mind the motivations and goals of potential users.
Proposed Solution
We believe that using avatars to replace your face during video calls or to supplement your text chats can greatly benefit the emotional and social interaction between people. For this, we would want to use Apple's already existing avatar system, Memojis. This takes advantage of an already existing design language that is familiar and easily understandable by people.
Use Case Scenarios
With the above created design goals and proposed solution idea, we created some use case scenarios on how we imagined our personas to interact with the product solution we came up with. We did this by creating comic-like storyboards to help illustrate our points and bring our personas to life in real scenarios.
Comfyhead in Slack
Comfyhead in Zoom
User Flows
There are several user flows illustrated below, ranging from the High-level over, to the Comfyhead software, to two example “linked” software.
Mid Fidelity Wireframe
There are several Information Architecture flows illustrated below, ranging from the High-level over, to the Comfyhead software, to two example “linked” software.
Usability Testing
-
Our study goal was to validate our initial concept of avatars, check if the user understands the concept of an avatar, if he is able to integrate it in his daily work flow.
-
We tested 5 users -- three independently found, two from studio time
-
For our study, we walked the users through
-
A sample video call solution using an avatar
-
A low-fidelity prototype enabling avatar during call
-
A low-fidelity walkthrough of avatar in a Slack chat
-
A low-fidelity prototype of enabling avatar in Slack
-
Key Findings
Mid-fidelity prototype usability test findings:
Mid-fidelity prototype usability test findings:
All participants were uncomfortable turning on their videos during lectures and were psyched about the idea of replacing themselves with an avatar
Participants emphasized that they would feel more comfortable turning on their avatar in chat with other students, but not with faculty.
Participants wanted to be able to see their own avatar to make sure that it was portraying their expressions accurately.
Design
The main idea behind our solution was to make students and professors feel more connected to the cohort from their remote location. We did not want to add any product on top of all the other online applications they are using. We designed our solution to be integrated into the platforms they are already using. Thus we came up with our solutions to be applied to features like chats and videocalls that are extensively used for remote learning activities.
UI Design
When Comfyhead is integrated into another software (such as Zoom or Slack), it must follow that software’s design language so as to provide a seamless experience to the end user. This means respecting existing settings and notification patterns, respecting the chosen UI guidelines in terms of color and styling, as well as with respect to existing UX. Comfyhead should never disrupt the already existing software experience.
Final Prototype
Figma Prototype
We created our final high-fidelity prototype as an interactive Figma file so that users would be able to click through and experience the Comfyhead features as we envisioned, while also providing high-fidelity prototypes of Comfyhead avatars in Zoom and Slack.
Role-play Video Prototype of Comfyhead in Zoom Video Call
Experience a role-play of discussion between a Student and Teacher in various display modes in Zoom video call.
Reflections
What we learnt?
Working on a product creation group project remotely, across different time zones, and as my first Master's course class was challenging but manageable. We were able to successfully ideate, and had moments of true inspiration, creativity, and excitement as we came up with our product ideas. In the end, our "crazy" ideas were the ones we were most excited about, and doing all this in a classroom environment gave us freedom and creative mindset we couldn't have achieved otherwise.
What we could do going ahead?
There's so much further we can take this project -- at the point where we are now, we believe that this product could indeed become a standalone project because the feedback we have received from our peers has been overwhelmingly positive. Of course there are some tricky parts we'd have to still design and build: We'd have to build our own avatar generator as well as ensure that we are respecting privacy and security rules when integrating into other products such as Slack and Zoom. However, the idea itself is solid and looking ahead there are many avenues to flesh this product idea out.