Problem

1

In the spring of 2018, Dartmouth students from the Student Wellness Center partnered with the DALI LAB and asked us to design and create a mobile application. The idea behind the app was to create a discussion platform in which Dartmouth students would be able to discuss mental health and personal issues without fear of judgement.

Mental Health by the Numbers

These statistics, provided by the National Alliance on Mental Health, highlighted a key issue that college students face across the nation, especially on Dartmouth's campus. Creating a discussion platform that allowed students to freely discuss mental health issues was just one step in the right direction, but we believed it was important to help bring mental health to the forefront of conversation on campus and would hopefully lead to more students services and support channels.

Anonymity and Discussion

Through the initial meetings with our partners, they stressed two ideas: anonymity and discussion. They wanted users to remain anonymous, and they also wanted the app to focus around and foster healthy discussions. These principles would shape our decisions for the entire project.

Initial design challenges

User Research

2

Social Media Platforms

We looked at various social media platforms to see how their user flow encouraged discussion and interaction. For example, platforms like Instagram and Facebook encourage reviews through quantitative measurements (e.g. number of likes), and this measurement puts pressure on the user to post popular posts that appealed to the mass audience. On Reddit, discussion is organized in a hierarchy so that the most liked comments are displayed first. For forums, discussion in posts and comments is usually chronologically ordered, creating an equal but often unorganized discussion that can branch into several sub-discussions.

User Interviews

We interviewed 15 students from various majors, backgrounds, and social economic statuses in order to find what emotions and concerns people had for a discussion platform. We asked them about their social media use.

Things that we found important

"I love being able to connect with friends on social media. But it stresses me out to maintain this ideal image of myself."

Dartmouth Student '20

We knew we wanted to include elements of social media in the Unmasked app to promote interaction and discussion. But after our interviews, it was also clear that we should steer clear of certain aspects of social medal that can cause stress.

User Personas

Ideate

3

Feature Brainstorming and Low-Fis

After our user research, we went through several brainstorming sessions to come up with ways in which our discussion platform would help solve the user needs.

The Hybrid Comment System

One of the biggest challenges during the ideate phase was coming up with a comment section design that promoted equal discussion while still maintaining some level of organization. We didn't want to use Reddit's hierarchy system because we felt it promoted only 'top' comments and felt jumbled after the initial branches. We also wanted more organization that just a simple chronological system in most forums because it can be hard to track where the discussion is going.

We felt that this hybrid system provided the best of both worlds. Since each initial comment usually responds to the original post in a new direction, we thought that these would be great 'conversation starters.'' Responses and comments in these sub-conversations would be grouped together to keep the discussion organized, while allowing new contributors to equally add to the conversation. Therefore, the comment section would encourage discussion while still maintaining some level of organization.

Identicons

We stressed anonymity throughout the design phase, but we feared that total anonymity would discourage users from truly interacting with each other. We wanted users to be able to differentiate themselves from others, but also not label themselves through a username (which could cause issues with privacy or inappropriate names). As a result, we looked into how platforms like Yik Yak created user identifies through avatars without breaking anonymity. We came across Identicons, random shapes generated using a hash function from any string of characters. We believed that these identicons could help users connect with each other without clearly labeling a user as a certain avatar. The shapes offered just enough abstraction to help users blend into the crowd for post and comment interactions, but also help distinguish users during direct messages. Specifically, we wanted to use the JDenticon library, as shown above.

Reactions

We knew we wanted to encourage genuine connections through Unmasked, but we questioned the use of "likes" that most social media platforms used as engagement. We brainstormed various ways that users could react, such as "Claps" or "Hearts" or even "Snaps". In our initial designs, we chose to include all three as possible reactions to a posts because we believed that each represented a different kind of support. Additionally, we opted to hide the quantity of each reaction on the post, instead only notifying the original poster of a reaction every few minutes. This way, users could feel the engagement from other users without the anxiety of achieving a number of reactions for each post. Thus, users would feel more comfortable being honest instead of trying to appeal to a broad audience.

Prototype

4

By building out low-fis, we were able to quickly discuss feature ideas and get user feedback.

john
analytics
graphs
graphs
graphs
graphs
graphs
graphs

For example, we quickly found that users felt that three different types of reactions to a post would be excessive. Although they associated each reaction with a different emotion when interviewed, in practice they felt no difference between the three when using them as well as receiving them on posts.

Additionally, we were able to get positive feedback on our idea of allowing users to like each other's posts, but not sharing the number of likes to anyone. Our test users felt that this would encourage commenting as the main form of interaction, but also retain the small channels of feedback that we have been accustomed to when posting online.

Product

5
graphs
graphs
graphs
graphs
graphs
graphs

See the prototype

We designed with cool and warm colors that promoted comfort and low-stress. For our main fonts, we decided to use Comfortaa because of its gentle curves in titles, and used Lato for clean and clear readability in the posts themselves. Additionally, we wanted to use images and icons that contributed to our comforting atmosphere, seeking inspiration from the outdoors!

One interesting feature that received overwhelmingly positive feedback was our concept of "Question of the Day" element. We believed that this would be a more encouraging than a simple "Post" section. Our initial idea was that there would be rotating questions of the day that would act as conversation starters for people to engage with the platform. Additionally, the "Share a thought" button was just one example of the attention to tone and language that we took when designing the final mockups for Unmasked.

Reflection

6

After our product demo, multiple students and faculty members complemented our ability to create a platform that encourages meaningful discussion. Our partners at the Student Wellness Center were overwhelmingly pleased with our progress throughout the term, and they hope that that a successful beta app with our designs will be implemented in the coming terms.

We hope that Unmasked shows the importance of the design process, especially the user research and ideate phases. Without our time and effort in these stages, we would have overlooked several aspects of our user experience and not considered how potential features could negatively affect the main purpose of the application.

Designed and created by Justin Luo. All rights reserved.