Beepo
April 2019

Beepo

Expertise

Product Design, User Research

Platforms

iOS and Android

Deliverables

UI Screens, UX Flow and Prototype, Research
Beepo

My Role

I worked with one illustrator in this project along with one child psychology professor from the University of Michigan.

I was the UX Researcher and Designer in this project and was responsible for user research, user flows, prototypes, and visual expression.

TEAM:

- Jenalyn Abinales, Illustrator

- Child Psychologist

My 6 years old niece loves to dance. One day I saw her recording herself on the iPad and immediately posted it on TikTok. I was afraid of the inappropriate content she will see and the strangers on the platform she might interact with.

TikTok keeps profiles public and private messages open. This means anyone can contact you and see your profile unless you change your settings.

I wanted to make sure she was safe from this.

To solve this issue, we created Beepo

Beepo is a mobile educational app that teaches children about the internet as well as the importance of digital privacy with the help of their helpful companion, Beepo!

The app consists of various types of media such as comics, games, and videos to teach kids about the internet.

Impact

Creating this digital product will help educate children and teenagers on how to stay safe, healthy, and kind in the digital space.

But how did we get here?

Background

How might we educate young users about privacy and safety online?

With the increase use of technology and social media by young users, there is an importance to ensure young users are safe online. Beepo is an educational and resource tool for both young users and their parents to ensure that they are safe online.

Research

Competitive Analysis -

What is currently being done to teach kids about the internet and their privacy online?

Hint: It's boring and catered to teachers and parents. 

To further understand this space and look at existing solutions, we created a competitive analysis. This helped with finding gaps in existing solutions and opportunities to bridge this gap.

The competitive analysis looked at different organizations or digital solutions specializing in educating younger users about online privacy.

We found that most are catered to adults and educators rather than children. Further, if anyone wants to read it, it is too dense and dry because they try to follow common core standards. This is a problem.

User Research -

We talked with kids!

The target for this app is children the ages of 6-12.

We went to a Parent and Kids fair at the mall and set up a booth with various games. We then took the time to interview some kids in the fair, with the permission of their parents!

This allowed us to get better insights about how they use apps and the problems they face. This also allowed us to expand the conversation and allowed us to better empathize with the kids.

The interview took approximately 10-15 minutes of their time to get to the core of how they use technology and the internet.

6 Kids Interviewed | 2 Males | 4 Females | 7 yrs. avg. age

Research Findings

Based on the competitive analysis and interviews, we identified the main issues.

01 / Lack of awareness
Kids are unaware of to safely behave online the consequences of the internet.

02 / Cyberbullying is a big issue online
While many kids faced some sort of cyberbullying online, many don't know how to cope or handle the situation.

03/ Boring Material
Learning about security and privacy is boring and too technical.

04 / No platform
There are no accessible platforms that address the issues of privacy online for younger children.

The Opportunity -

We need to address how we teach children to safely use the internet as well as be a resource for them when they face cyberbullying.

High Level Goals -

01 / Make it accessible
Taking the time to children about technology can be daunting. Why not use use existing tools to integrate that learning?

02 / Improve well-being
The overall impact we want to see is improve children's well-being in their digital lives. Away from danger and harmful content.

03/ Make it fun!
Who says learning about the internet should be boring? How might we make this entertaining for children?

04 / Educational
We need to streamline educational content about the internet. This is an important step in improving children's digital lives.

Define

Brainstorming and Ideation -

How should we address the issue while keeping it accessible for children?

Games, videos, comics...and many more... through an app!

We brainstormed and created sketches of ideas in order to bridge the gaps we identified. First, I sketched out potential solutions and divided those solutions with different user scenarios. After getting feedback on the sketches, most people favored the mobile application with the idea to combine other solutions with it.

Information Architecture -

Through prototyping, we identified three main screens and features that align with our goals and children's main needs.

  1. Homescreen - Perks and points
  2. Lessons - Main content
  3. Help - How to seek help when faced with dangerous content or cyber bullying

Within these three screens, we identify and sort where a particular feature should be displayed while aiding us in user flow. Although simple, we are able to visualize core functionalities of the application.

User Flow -

Creating the information architecture allowed us to create user flows of the application and break down processes the user would do to achieve specific tasks.

Mapping the user flow also assisted in solidifying our ideas, features, and screens necessary to build the application.

Low-fidelity Prototype -

After deciding on a mobile application, we created a low-fidelity prototype to further develop the ideas.

This prototype allowed us to create and refine the experiences for the kids. It allowed us to grasp the overall direction and goals of the app while brainstorming how each screen would look like.

Wireframe -

The wireframes helped us organize our thoughts while incorporating the user flows, information architecture, and our sketches to redefine the user experience.

The wireframe helped us in determining what screens were unnecessary, and which ones can be consolidated into one screen.

Moodboard -

We created a moodboard to influence the visual design of the application.

The inspiration came from Beemo, a robot character from Adventure Time. We then took inspiration from Duolingo, which is a language educational application.

We focused on education and schooling so we took inspiration from elementary school images such as the school bus and classrooms. We incorporated pastel colors of blue and pink because it evokes childhood but is still gender neutral.

Design

We created Beepo!

A mobile application to address the salient privacy issues that our younger generation face today while teaching them about the internet and how to cope and get help when they get cyberbullied.

01 / Why a mobile app?
There are no current existing platforms that teaches about privacy that are accessible to them. More than half of U.S. children now own a smartphone by age 11 (Pew Research, 2018). Thus, creating a mobile app is an accessible approach for them.

02 / What are the contents?
This mobile application addresses issues about social media, passwords, phone number privacy, cyberbullying, and many more. These topics are delivered in different types of mediums such as video games, comics, and educational videos (edutainment).

03 / What makes this educational platform different?
This app provides external resources in case users would want to reach out to an adult or organization about the issues they are facing online. This includes organizations, or tips on how to approach an adult about cyberbullying.

04 / Who's Beepo?
Beepo is a robot that the child will help teach or learn with about the internet. Children can also collect bow-ties to customize Beepo. Beepo serves as a friendly companion to provide a safe, non-intimidating learning environment (Redmiles et al.).

=============

Meeting Beepo for the first time!

A fun and friendly onboarding process to meet Beepo for the first time.  

Customizing Beepo - Bowtie galore!

An interactive and fun way children can connect with Beepo. Full color customization as well as incentives to collect bowtie and dress up Beepo.

Game and media selection

Getting bullied? Get help!

Conclusion

Challenges and Limitations -

We didn't have the opportunity to test our prototype.
We also didn't have a defined curriculum for internet/privacy comics, games, and videos to refer to.

We leave this for future work.


No usability testing
We firmly believe that products should undergo testing and evaluation to ensure that it is meeting the goals and needs of the user. However, due to time contraints, budget, and population access, we were unable to conduct any testing. However, I am conducting reserach with The Conceptual Development Lab at University of Michigan. They can potentially be a great partner to conduct user testings with children in the future.

No definied curriculum
While there are some cybersecurity and digital literacy curriculum made by organizations, most of them are meant for teachers or parents. In addition, the curriculum are copyrighted so we are not able to use any of them. Due to time and budget, we were unable to create an effective curriculum. Future work would involve working with reserachers and content creators to design a curriculum.

Learning and Insights -

Design and create with purpose
This project stemmed from my interest in security and privacy education. I have worked with kids and their mental models of digital privacy in the past, and one common thing I kept noticing was the lack of knowledge on their part on how to protect themselves online. While some receive some tips from school and parents, there hasn't been a common tool to educate this generation of users. I hope this design opens the discussion around awareness and action of our youth’s security and privacy problems.

Understand your users, and keep it fun!
One thing that worried me about designing this project was how I may be repeating the pattern of creating an educational tool that is dull, not engaging, and ineffective. However, I listened to my users and received valuable feedback on how to approach a gamified version of a security and privacy tool. In turn, I added avatars, badges, and a pop of color to keep younger users engaged. Don't be afraid to add some color!

Speak the same language
Since security and privacy can be daunting to non-technical users, I wanted to find ways to deliver information that is simple and easy to understand. While this platform still exists on a mobile platform, there are ways that this can manifest itself into books, movies, and music that everyone can enjoy. My role as a designer is to ensure information is delivered to those who need it and allow them the space and autonomy to take action.