SOCO

SOCO is a solo project completed at the Brainstation UX Design Program, tackling increased feelings of loneliness during COVID-19 due to quarantine and lack of social interactions. 

ROLES

Research
Wireframe
UX + UI Design
Usability Testing
Prototyping
Branding
Marketing

TIMELINE

July - Sept. 2020 (8 weeks)

TOOLS

Figma
Sketch
InVision

Group-522_1

PROBLEM

The unexpected outbreak of COVID-19 has taken "normal" away from everyone's daily lives. Due to the rapidness of the outbreak, many individuals have been at home practicing physical distancing in an effort to prevent the spread of the coronavirus and to ensure the safety of their own and others. However, meanwhile, people have traded in their daily social needs and healthy mental well-being for a safer society.

SECONDARY RESEARCH INSIGHTS

54%

18-34

52%

Canadians feel lonely and isolated due to physical distancing and a lack of social interaction.
(Source: Ipsos)

Age group suffers the most compared to any other group.
(Source: CAMH)

Canadians indicate that their mental health has worsened since the physical distancing.
(Source: Statistics Canada)

How might we keep people socially connected in order to increase the feelings of connection and reduce the feelings of isolation during the COVID-19 pandemic?

SOLUTION

Introducing SOCO

SOCO helps people stay socially connected with their friends by providing fun and engaging activities such as playing games or watching movies when they can't be physically together.
 

start-1

Start 

Check your friends’ status and activity or directly contact them in the app to see who is down to have fun with you.

Invite

Invite your friends to the party room with a simple step and get ready for a fun social time.

invite
browse

Browse

Browse built-in movie or game libraries with your friends and choose the one everyone likes. 

Pay

Buy or rent your favourites inside the app with the quick and secure Apple Pay so you can have fun right away.

pay
watch

Have a Great Social Time

Now, you can socialize with friends over engaging activities and spend quality time with them even when you're not physically together. 

USER INTERVIEWS & INSIGHTS

I conducted interviews with 5 people in the age group of 18-34 to dig deeper and hear firsthand people’s experiences and stories - how they were affected psychologically and coping with it.

After the interviews, I organized the qualitative data into 3 categories: motivations, pain points and behaviours, which led to 3 key insights:

  1. Most people use existing social platforms to maintain their connections and mental well-being. However, they are dissatisfied with these platforms.
  2. People find fun, authenticity and engagement are important when it comes to virtual interactions.
  3. People gravitate towards movie-watching and game-playing for fun and engaging online socialization.

Insights from the user interviews helped me build a user persona and user journey map later in the design process.

MARKET RESEARCH

From the interviews, users revealed the platforms they used to socialize with their friends and families online during COVID. I studied these apps to see what was working, what could be improved, and how I could reflect that within my own design. 

Group-4

These current platforms offered little or no all-in-one experience (video chatting + activities at the same time), which was one of the reasons why users found the virtual experience unsatisfying.  

This shed more light on my project direction - a platform that allows users to video chat while watching a built-in move or playing a built-in game.

PERSONA

Based on the insights from research, user interviews, and competitive analysis, I created a persona, Caroline, that describes the target user to guide me throughout the project. This persona is helpful in terms of purifying the research results and bringing attention to the important pieces of info. Later in the design process, I used it as a reference for testing and prioritizing features throughout the development.

Primary-persona-Copy

CAROLINE'S JOURNEY MAP

Based on behaviours learned from user research, I created a journey map of Caroline interacting with existing digital products to start a movie-watching party with her friends. It gives me a better understanding of her emotional journey and also helps me identify potential opportunities for the intervention.

Experience-mapping-Copy

From her experience, I defined 3 opportunities for intervention:

  1. Visibility of friends' activity and status
  2. Built-in movie/TV show library
  3. Ability to watch movies and video chat with friends at the same time

USER STORIES

To start ideating, I used the persona as the reference for user stories to put myself in the shoes of Caroline and ensure appropriate features and prioritize them. I decided on the core epic that would best demonstrate the MVP - interacting and connecting with friends. Each story in the core epic gave me an idea of what potential features the solution would entail.

Core-epic-Copy

TASK FLOW

User stories helped me develop a task flow that focuses on starting a movie-watching party with invited friends. Task flow allowed me to make sure the flow was logical and seamless and challenged me to think of a solution that is easy to use and requires minimum steps to reach the user goal.

Task-flow-Copy

SKETCHES & WIREFRAMES

I translated the user task flow into several sketches on paper to better visualize the solution and interaction.

Then, I digitized sketches into mid-fidelity wireframes and used them for usability testing.

USABILITY TESTING

I conducted 2 rounds of usability tests, each with 5 unique users, obtaining practical feedback to improve the design and provide a more optimal user experience.

The 1st round was conducted on the mid-fi prototype to identify any issues that could cause frustration or confusion.

The 2nd round was conducted on the improved prototype based on the 1st round to validate the effectiveness of new design changes.

Participants were asked to complete the following tasks:

Task 1: Start a party room

Task 2: Invite friends from the friend list 

Task 3: Find a movie

Task 4: Rent the movie

Task 5: Watch the movie with friends

Round 1
Group
  • 60% of users had trouble completing the first task (i.e., start a party room) because the "Start a Party" button was hidden inside the kebab menu, which wasn't intuitive and accessible.
  • 20% of users weren't confident or sure what to do after creating a party room due to a lack of instruction.
  • 100% of users completed the rest of the tasks without any trouble.
Round 1 Iteration

After a round of usability tests, I organized and synthesized all the feedback and made adjustments accordingly. Here are the major improvements:

Artboard-1
change-2
Round 2
round-2
  • 100% of users completed the first task with ease. The design iteration significantly increased the findability of the button and, therefore, the success rate of this task.
  • 20% of users had trouble exiting the invite screen as the interaction contradicted their mental model (e.g., using 'Back Arrow' to exit the screen). 
  • 100% of users completed the rest of the tasks with ease.
Round 2 Iteration
change-3

VISUAL DESIGN

Brand Embodiment: Based on the interest of the target demographic and the purpose of the product, I wanted the brand to be fun, interactive, energetic and welcoming. It is a happy social platform full of laughter.

Brand Colors: Since the product is where users and their friends gather together and have fun, I decided to go with yellow, red and blue, associated with positive emotions that can play psychological tricks on users. It also creates a vibrant, fun, energetic and inviting mood for the brand.

Wordmark: I chose to use George Round for the wordmark. The geometric sans serifs with soft edges give the brand a friendly, playful and inviting feel while keeping the appearance clean and modern.

Typeface: Gilroy is a modern sans serif with a geometric touch. It's clean and playful, which matches the general feel of the brand.

App Icon: I avoided using the wordmark as the app icon because it didn't seem to match with the product. Instead, I went for a metaphorical approach - different colours represent different individuals gathering together to have fun and form one happy face. On top of that, the app icon is cute, friendly and welcoming.

MARKETING SITE

marketing

FUTURE STEPS

KEY LEARNING

This was my very first UX project, and working fully through this project on my own taught me a lot. I am very proud of what I had done under a short time constraint. Thanks to the project, I was familiarized with the UX design process and developed a user-centric mindset. All the challenges I faced along the way made me realize the importance of every step in the design process.

During the process, I had a chance to reflect as a UX designer and learned about my strengths and weaknesses, which definitely helped me become more conscious of what to focus on in the future.

My main takeaways:

  • Always design with intentionality and rationalize design decisions.
  • Document the design process along the way for better learning and self-reflection.
  • Trust the design process because every step exists for a reason.

Thanks for reading! 😊

Other Projects

Let's connect!

Feel free to reach out to me on any platform anytime! I'd love to connect with you and talk about anything.

Made with lots of 🥩 + 🍞 = 🍔 = ❤️