Case Study

Stay n Play

Where no connection is too far.

About the Project

Overview

For this class project we were tasked with creating a new app that would play a role in a user's life on a regular basis. We spent a long time ideating to come up with an interesting app that would be timely during the pandemic. We wanted to improve the daily life of our uses and give them a distraction and a creative outlet to share with family and friends. 

Problem

We discovered through user interviews and surveys that the pandemic and the upcoming holiday season was causing much anxiety and depression as users faced the harsh reality that traditional holiday plans and events would have to be canceled. Thus leaving them isolated and in need of a safe space to make meaningful connections and holiday memories during this unprecedented time.

Solution

We believe that by providing a virtual environment platform we will be able to create an all inclusive social experience for users to connect with family and friends. We might do this by allowing users to coordinate virtual classes chosen by the users interest.  Including features such as private and public video classrooms. Choose or be invited to activities based on genre. Revisit saved classes or meetings at your convenience.  Doing this will allow users to engage with family and friends through a tailored virtual experience. 

My Role

I was tasked with product and project management. I was also responsible for most of the UI design and the company branding efforts. I lead a small team of 4 individuals and delegated tasks to keep our team moving efficiently through this design effort. 

Tools:

• Miro
• Figma
• Trello
• Google Form
• Otter
• Illustrator
• Photoshop
• Invision

Design Process

Design Steps

The design process for Stay n Play was shaped by principles of design thinking methodology. We worked through these steps to achieve our end goal of creating an app that would bring joy to our users and create a virtual platform for people to connect in meaningful ways while maintaining safety.

User Research

Survey

We began with a survey to gather data to assess basic demographic information regarding potential users. We were looking for insight into their social activity habits, and to see how the pandemic was affecting that aspect of their lives. We also wanted to discern how the pandemic was affecting their holiday plans. As well as the toll isolation was taking on their mental and physical wellbeing.

We had a total of 100 respondents to our online survey we had several key finding that help guide this design.

Key Findings

1. Users are excited about food and most activities during the pandemic were food-centric. With 66% of respondents being excited the most by a good meal, and 88% reporting that food was their main activity during the pandemic.
Above is a chart of activities our users are partaking in during the pandemic.
2. 93% were using video conferencing platforms to connect with family, friends, and work.
3. All respondents were experiencing changes to holiday plans due to travel restrictions and social distancing concerns. 

Interviews

We conducted 5 user interviews to gain insight on how people are navigating through the pandemic and how it has affected their ability to connect with people.We also wanted insight into activities our users participate in and how that had changed. 

Key Findings

1. Users preferred to connect through their phones.
2. All have changed or cancelled holiday plans.
3. Our users were experiencing loneliness and disconnection from their communities
4. Many feel the pandemic will permanently change how we socialize moving forward

Competitor Analysis

We conducted competitor analysis to see what our competitors were doing and how they were meeting this moment. We ran an analysis on 

1. House Party
a. Strengths
Call multiple people at one time 
Free to use
Virtual games to play together
Virtual backgrounds to use
b. Weakness
More people caused lag and glitches
Can only have 15 people per group
Video quality went down with number of people
2. Airbnb Online Experiences
a. Strengths
Many different options
Makes connections Internationally
Available on different platforms laptop, phone, and tablets
Can have private groups
b. Weakness
Not many specific kid friendly activities
Needs more crafting options
New feature that needs more advertising
3. Creative Live
a. Strengths
Offers one free class a day
Blogs and podcasts
Team building exercises
Goal set and tracking progress
Previews of the class
b. Weakness
Recorded classes no live interaction
Limited amount of topics to improve skills lacking any food or cooking options
They have some iPhone design issues when in a video mode

Opportunity- From this research we discovered there was not an all inclusive virtual activity platform. Which gave us the ability to create a truly unique experience that wasn't already available and help users connect and plan activities virtually.

Definition

Empathy Map

We began by creating a proto-persona based on our assumption of who our target user would be. We used the information gathered from the interviews and created an empathy map to help us start visualizing our end users motivation, pain points, and general feelings.

Persona

Meet Sarah, a young mom who is the life of any party. She loves connecting with her community as a social worker and she is dedicated to the betterment of society. Her hobbies are cooking, gardening, and crafting. With the pandemic Sarah is struggling to keep it all together. With everyone being stuck at home she is struggling to stay connected with her community, spend quality time with her husband, and keep her two young boys occupied, while also maintaining her mental health. 

Ideation

Brainstorming

We began by brainstorming features that may solve Sarah’s problems by using the I like, I wish, and What if method. From there we used a prioritization matrix to visualize the complexity and user impact to help direct our focus. Due to our limited time we then voted on features we felt were most important to Sarah and her goals within our app this helped us establish the scope of this project.

User Flow

Next we create a user flow to help us visualize how Sarah would move through the app and see how many pages we would need to create to provide an immersive experience. 

Story Board

With a clearer picture of the app and how Sarah would move through it. We created a storyboard to identify any pain points that could arise as she navigates through the experience to address and eliminate those pain points before we moved into screen design.

From this exercise we discovered a major pain point for Sarah once registering for a class she would have to go to the store and contend with masks, uncertainty, and potential unavailability of items needed. Which led to our integration of Insta cart and Amazon to alleviate this pain point for her.

Prototype

paper Wireframes

We began by independently creating paper wireframes to ideate what we felt the experience should look like. Below is a sample of the screens I created.

Low Fidelity Prototype

After that we reconvened and discussed our solutions. We then combined our design and created a prototype.

See the full LOW fidelity prototype

High Fidelity Wireframes

After several rounds of user testing we devised solutions to solve user pain points and created our final prototype

See the full High fidelity prototype

Testing

User Testing

With the completion of our low fidelity prototype we moved onto testing. We ran usability test with 6 users. We discovered some common pain points during this process.

Pain points

1. Users didn’t know what to do after the invitation was copied and what that meant. If they did understand they didn't want to leave the app to send link to family and friends

Solution- Allow users to send link directly using IOS system

2. Users were unsure where the preference were or why they mattered.

Solution- Was to simplify the account screen and give users less options to make the experience clear and easier to follow 

3. They were confused by how to see classes they had already registered for 

Solution- Create a clear section to view my classes in the dropdown menu and add button at the end that would let the user view classes.

Final User Test

Conclusion

In retrospect and now that I am revisiting this case study to add it to my portfolio. I have honestly discovered so many things I would do differently today. I see many holes and errors in this design but it is an amazing representation of where I was at the time and how far I have truly come in my personal journey in this field. I am still very proud of this project and my leadership skills demonstrated to keep my team on task. 

What's Next

We want to build out the invite friends and family feature we ran out of time to completely flush this part out 
We loved the idea of integrating Amazon and Instacart into the app to allow users to skip the store and have items needed delivered directly to them
This is only a mid fidelity prototype we would like to spend more time and bring it into a more finished project
Given more time we would love to actually bring a live class to fruition and see this working and helping people create memorable experiences virtually

Follow Me on Dribbble