The MŌN App

Adding a new audio feature (memos) to a social audio app to increase the app’s functionality and increase engagement

Who is MŌN?

The MŌN App is a live voice-chat audio app that provides a safe space to promote sex positivity through conversation, exploration, and education.

What is sex positivity? According to sex educator, Goody Howard, sex positivity is operating around the topics of human sexuality, health, and pleasure with respect and without shame or stigma. This includes gender identity, orientation, sex education, nudity, relationship styles, body positivity, safer sex, reproductive equity, and much more.

Role

Visual Design Lead/UX Designer (In a team of 5 with a Project Manager, Research Lead, Interaction Lead, and Content Strategy Lead)

Platforms

Mobile Application

Methods

User Interviews, Surveys, Affinity Mapping, A/B Testing, Sketching, Hi-FI Wireframes, Prototyping, Usability Testing

Timeline

March 2022 - April 2022

Tools

Adobe XD, Figma, G-Suite, Maze

PROBLEM

There’s a lack of safe space on the internet to talk about sex positivity.

Per the Rolling Stone, there’s been an 82% increase in the de-platforming of sex-related content from social media. This statistic includes content that is meant to promote sex positivity and foster business relationships with clients. If these content creators are being kicked off, where can they go and how can they safely promote conversation, exploration, and education about sex positivity?

OPPORTUNITY

What if the app had an audio memos feature where people can share their thoughts?

Due to the early stage of the app, The MŌN App only has a rooms feature that allows users to host and join rooms. The CEO wanted our help to:

  1. Implement an audio memo feature where users can record up to two-minute audios, and other users can react and engage with this audio content

  2. Reconfigure the current home page design to integrate the audio memo feature and a potential podcast feature (in the works by the company)

SOLUTION

Making memos a modern and seamless experience

Record a Memo and Personalize it

  • Give users fun ways to create content

  • Creators can change settings for specific posts, catered to their needs

Listen to a Memo in Full Viewport with Swipe Up Function

  • Provides users memo details and tags

  • More modern functionality like Tik Tok and Instagram Reels

  • Can appeal to Gen-Z audiences

View and Post Comments

  • Users can interact with memos

  • Creators feel safer to hear replies rather than see texts which can be misconstrued

COMPETITIVE ANALYSIS AND THE GAP

Competitors in the sex-positivity industry do not have audio memos.

We looked at three direct competitors and three analogous competitors. Almost all direct competitors in the sex positivity space do not have audio memos, so we looked at three other audio apps outside of the industry (Beams, Quinn, and Colorcast) and three analogous competitors (Spotify, Instagram and Twitter).

Looking at competitors helped us create a list of features that we could use for our designs and were later part of our feature prioritization list. Below is a snippet of some of the common features we noted.

RESEARCH: UNDERSTANDING OUR AUDIENCE

Users don’t want to feel limited by what they can post.

We categorized the users into two main groups: sex positivity content creators and sex positivity content consumers both on MŌN and outside of MŌN.

Due to the sensitive nature of the app and its users, the CEO moderated a live group interview with 10 users. We also surveyed 43 content consumers and 17 content creators either on MŌN or outside of MŌN. These were questions we wanted to understand:

  • What are the motivations behind creating content or consuming content?

  • What do users care about in terms when posting or viewing content? (i.e. safety, privacy, anonymity, details..etc)

  • How do content creators engage with users and what are the preferences for social engagement?

  • How do users envision audio memos in the MŌN app?

  • Are there any obstacles experienced?

These were four key takeaways about the behaviors of content creators and consumers:

Safety

“I block messages from people who are not respectful of my boundaries”

No censorship

“It has been difficult as it is never clear what the terms of service cover”

Ephemeral content

“‘Be here or miss it’ gives the idea of community and engagement”

Other methods to respond

“Text can be easily misconstrued”

On top of these identifying these behaviors, we also noted top features to prioritize:

What Memo Creators Want:

Fleeting memos to increase engagement

Interaction options, like comments and emojis

Use memos to promote content

What Memo Consumers Want:

Understand content before viewing it. (i.e. clear tags on posts)

See the popularity of a memo by the number of listens

Use time wisely by viewing the time length of a memo

DESIGN CONSTRAINTS

We can’t design all features users want.

After we presented our research findings to the CTO and shared the that we wanted to make memos have a fleeting nature, the CTO mentioned that given the time frame, they would only be able to design a permanent memo feature for the time being and later down the line, look to rollout a fleeting option. As designers, this was hard to hear because the ephemeral nature of memos was important to our users. However, we had to recognize that technology constraints played a factor and consider the business’ limitiations.

DESIGN: TOO MANY FEATURES

Too many possibilities for the design

Our team realized that through research, there was an abundance of features that could be designed into the audio memos, so we had to prioritize the features to include in the design. We created a MSCW table to prioritize which features were must-haves, should-haves, could-haves, and won’t have.

We created sketches and wireframes for the “Must-Have” features given the time constraints and technological constraints.

IDEATION AND TESTING THE HOME PAGE

A new multi-page navigation bar tested better with users

We created two homepage designs and performed A/B testing on five users with Maze to determine which homepage users preferred and navigated better with.

User flow of the 2 home pages:

Usability testing results of the home page:

TESTING

Mis-clicks on icons but overall high success rates

The team performed usability testing using Maze with 14 users of who are a mix of creators and consumers of sex positivity content. We asked users to perform two tasks; 1) create and post an audio memo and 2) add a reply to a memo.

1) Create an audio memo

  • Overall Success Rate: 83.3%

  • Indirect Success Rate: 50% (had a few mis-clicks in completing the flow)

  • Average Task Difficulty Rating from Users (1 = very easy, 5 = very difficult): 2.3

  • Considerations for future iterations: Changing the add content icon to be more universally recognizable, where most mis-clicks ocurred

2) Add a reply to an audio memo

  • Overall Success Rate: 66.6%

  • Indirect Success Rate: 9%

  • Average Task Difficulty Rating from Users (1 = very easy, 5 = very difficult): 2.3

  • Considerations for future iterations: Changing the “Replies” verbiage to a post to “comment” or a term more recognizable.

  • Technical Difficulties: the background for the top and bottom of the image are white instead of the yellow and pink gradient that it is supposed to be. This could have influenced users.

 

FINAL DESIGN

A Look at our final design for 2 user flows

  1. Record a memo flow

2. View a memo and post a comment flow

Mobile Clickable Prototype Made From Adobe XD

VISUAL DESIGN

The Style Guide

As the visual design lead, I created a new, brand consistent, design system and ensured that the final prototype was visually cohesive for the user experience. The company did not have a current design system. I leveraged the existing style guide of a purple and pink gradient and added other color accents on a few areas of the site. I also helped ensure spacing, typography, were presented consistently throughout and new components were published accurately.

CONCLUSION AND NEXT STEPS

What would I do going forward?

  1. Test navigation bar icons

    • If there was more time, I think it would’ve been important to test the navigation bar icons in a card sort, A/B testing, or other testing method because the navigation is the basis of how the users perform tasks and users were mis-clicking the navigation bar.

    • When we designed the navigation bar, we had altered the icons a few times during the design phase and questioned which was best. The below are suggestions for icons that we thought of

2. Change the audio memo reply verbiage and perform usability testing

  • As per the initial usability test, users were confused by what “replies” meant for the app. Does it mean reply to an existing response or does it mean to create a new response? I believe it’s important to change the verbiage to “comment”, something like “reply to ‘creator name’”, or something else that’s more recognizable and learnable.

3. Add other features that we didn’t have time to design

  • During research, we noted that features like being able to save content locally, share content across social media platforms, and pin an audio memo to profile were important to users. Due to technological constraints and user safety issues, these features were more difficult to implement. To provide the ability to save and share sensitive content, we would need to understand how that further influences privacy and safety, which are core to users’ needs.

  • We were not able to design the memos to be fleeting due to technological constraints, which was a one of the major user insights from user interviews and surveys. I believe that this feature is time sensitive and should be considered sooner if users are not satisfied by permanent audio memos.

 Explore More

Guinness

Netflix Watch Party

Baboon Animation Inc.