Bestie Play

Building an Interactive Virtual Playdate App

Role: Product Designer
Tools: Figma & Photoshop

Overview

The COVID-19 pandemic has caused many places to shut down including schools and with stay at home orders, it is hard for parents and children alike to visit family and play with friends. For children, it is especially crucial to have social interaction to develop strong cognitive skills such as communication, language, and creativity.

My Role

I worked as a Product Designer in a small team of 6 that included the CEO, product managers, iOS developers, and 2 designers. The CEO has tasked me to continue developing the reading activity and a design system in order to launch the MVP for beta testers.

My Responsibilities
  • Creating a design system with another designer and components in Figma to streamline designs
  • Developing lo-fi wireframes to hi-fi designs for the activities like reading
  • Creating rapid prototypes for developers and internal stakeholders to understand design functionality during standups
  • Editing the user flow to provide clarity on the MVP roadmap
  • Creating marketing assets like a website and video to showcase the product Fun fact: I did the voiceover for the promo video

Goals
Bestie Play is an iPad app that has a virtual assistance for children from ages 4-10 years old to connect with their friends by playing games while they having a video chat. Parents are able to schedule virtual playdates and add besties for their children to ensure security and safety measures.

How do we create a fun interactive social app for kids to communicate with their friends while they stay at home?
PROMOTIONAL ASSETS

Website and Video

Utilizing beautiful illustrations of the characters from our team’s illustrator and Canva, I created a website and promo video assets for accelerator pitches. I leveraged my marketing/advertising background to create effective copy and call to actions to promote Bestie Play’s features.

USER FLOW

Defining the Parent and Child Flows

Parents have access to invite their child’s friends to join them on BestiePlay. Once connected, your child can play activities with their friends, all guided by the Bestie virtual assistant. If no friends are available, they can also play these activities on their own.

Design system

Translating a Web Style Guide to a Design System

Leveraging the website style guide from a previous designer, I worked alongside another designer to create a design system that is accessibility friendly and acts a guide for both designers and developers. This guide helped define the design components that were leveraged to build out the screens.

first-time users experience

Registration Process for Parents

Parents must register for their children through a simple registration flow and SMS code text verification. They can help create their childrens’ profile by adding in their name and interests, which then leads them to the app’s rules. After that, the kids will have access to the Bestie playdate page and the activities under parental control.
Getting started

Inviting Besties to Play Games

Parents are able to have full control over who they can add to their kids' besties list. The design leveraged the existing iOS form field designs to follow the HCI guidelines for an Apple app product.

Kids aren't able to access the parent view in the locked view to ensure online safety and to be COPPA compliant.

Scheduling Playdates

It's easy for parents to schedule playdates and monitor who their children are playing with online. Currently, the MVP playdate scheduler can schedule for the month.
Kid's social profile

Choosing Avatar and Interests

The kids are able to modify their avatars and interests as part of their social profile.
‍
Design Decision:
To not create more visual conflict with the animal characters designed by our illustrator, I created these emoticon illustrations to convey the kids' interests to scale if more interests were to be added.

Reading Activity

Bestie Play used upcoming children book authors to create the initial library collection. Using Apple and Audible as inspiration, I started designing some lo-fi to high-fi wireframes of a library carousel for the children to swipe through easily after the library activity is selected from the shared screen of activities.

Concept 2 was selected for the MVP launch and simplified further by removing the progress bar with the virtual assistant was moved to the bottom left corner. Once a book is selected, the book will appear with two CTA buttons to flip through the book while the children take turns reading aloud together. Once the story is completed, the kids can either go back to the library or pick another activity to play.

NEXT FEATURE LAUNCH: voice assistance
Introducing the Bestie Virtual Assistant

Part of the next steps is to develop the voice assistant further to keep kids engaged with educational and fun activities. The voice assistant provides guidance in questions children might have or help clarify the directions for activities.