FALL 2020
My Pocket Place
My Pocket Place aims to guide children -- including those with special needs -- from ages 4-12 years old through their emotions. With the help of Oba-Bear, our in-game cuddly emotional support companion, this ActionScript coded app I created on a team of 3 developers teaches kids about healthy habits and coping mechanisms and provides them with a safe space that they can take anywhere. Created using Adobe Animate, keep scrolling to learn more!
OUR MOTIVATION:
All children, including those with special needs, require a safe space where they can dedicate time out of their day to process and manage their emotions.
Mental health and talking about our feelings and emotions has been a taboo topic in our society for generations, even continuing today. Because of this perspective on mental health, children have grown up thinking this is the truth and have become the adults we see today. Sadly, nearly 1 in 5 adults live with a mental illness in the US, oftentimes not getting the proper help they need. In fact, mental health issues are becoming even increasingly more common in younger generations, such as Millenials and Gen Z. For this reason, it has become clear that we need to start the conversation about mental health early on so that future generations can have the tools necessary to achieve the best possible mental state that they can.
Game Features:
Back Button -
Within the app, on every screen that has a reversible state, the user can click a back button in the lower left hand corner of the screen.
Music and Sound Effects -
The app has a standard background music track that plays on loop. In addition, clicking the buttons provides the user with auditory feedback with a light button click sound.
Welcome Screen -
This page welcomes the user. If the user is a first time user, it will prompt them to enter their name. If they are a returning user, then they will be greeted by a message with their name.
Emotion Selection Screen -
The user will be prompted to select their current emotion. There are 5 different options to choose from: happy, angry, worried, sad, and neutral. This selection will affect the weather seen in the window of the room.
Emotion Intensity Selection Screen (varies based on selected emotion) -
All of the different emotions: happy, angry, worried, and sad, have 3 different levels of the selected emotion for the user to choose from, with the exception of neutral because that does not require the user to set an intensity.
Room Screen with Taskbar -
This screen acts as the main “hub” for the user. It is the main center stage for the app, and has the following interactable objects: the journal, painting, the letter, the bulletin board, the building blocks, and Oba-Bear plushie.
Task Bar (bottom of Room Screen) -
In addition, at the bottom of the screen, there is a taskbar for the user to use some additional features.
Journal Screen -
The user can make pages documenting their day in the journal that will be stored within the app.
Painting Screen -
The user can make their own drawings in the app in this painting mode.
Letter Screen -
The user can open letters sent to them by Oba-Bear.
Bulletin Board Screen -
The user can post sticky note reminders on this screen.
Dress Up Oba-Bear Screen -
The user can put various fun accessories onto Oba-Bear on this screen.
Building Blocks Game Screen -
Users can build whatever their hearts desire with virtual building blocks.
My Role:
For My Pocket Place, I acted as a developer, researcher, lead artist, evaluation proctor, and scrum master.
Conducted primary and secondary research on our topic to better inform our design decisions
Drafted several low-fidelity sketches of design alternatives
Maintained a scrum sheet to ensure the completion of our tasks in a timely manner
Built a high-fidelity prototype based on feedback from peers and mentors
Implemented the bulletin board, building blocks game, dress up game, and handled the data storage for the user’s inputted information
Designed art assets (including Oba-Bear!) aligned with our mission and style
Administered user tests including think-aloud, retrospective, heuristic, and cognitive to effectively measure our success
Design Decisions:
In order to create the best possible user experience for our target users -- children with and without special needs -- we took into account making our interface fun and interactive, while striving to make it easily understandable and accessible.
Theme: Old DS games
Style: Pixel art, simple design so it isn’t too overwhelming
Colors: Gender neutral color scheme for inclusivity, Pastel colors
Font: Rounded font, easy to read for kids with dyslexia
Interactivity: Easy for kids to understand/notice objects that are interactable, use bold outlines that change colors to show feedback
Goal: We want our design to feel comforting, safe, and fun
Design of Oba-Bear: Cuddly, lovable, trustworthy
Optimization: Optimized for tablets since they are popular amongst children
Prototyping
We decided to produce low fidelity prototypes for our UI and explore several different design alternatives for each screen. Using low fidelity prototypes allowed us to examine the pros and cons of various versions of designs without spending too much time on an idea that wouldn’t be used. On the next page, you will see our preliminary sketches and mockups that we later developed into the current UI of My Pocket Place!
Demo
Here is a quick demo for My Pocket Place! It begins with the splash screen, and once you click the arrow button, Oba-Bear asks you for your name. Then, Oba-Bear asks you how you are feeling and how intense that feeling is today. After you select the intensity, you are taken to a virtual safe space — a cute, cozy bedroom with lots of things to play around with. You can click the bulletin board and write notes, the journal and write an entry, the Oba-Bear plushie and pick out a fun outfit, the building blocks and build a tower, the letter from Oba-Bear and read it, and the easel to draw a picture!
Features not shown in demo:
Weather based on emotion
The strongest positive emotion is happy, and there are clear blue skies, while the strongest negative emotion is angry, and in contrast there are black thunder clouds outside. For the emotions in between, they gradually go from this clear, blue sky to the stormy weather. For example, the neutral emotion makes the weather still clear, but not as saturated of a blue as “happy” weather. For scared, the weather becomes foggy and more white skies than blue. And finally, sad is a storm but not as darkly-colored as the “angry” weather.
Calming background music
We wanted to have background music in our game but didn’t want a track that didn’t fit the feel of the game nor did we want the user to feel overstimulated. After researching many royalty-free songs, we finally decided on this one by Bgm President on YouTube that we felt best fit with every mood chosen and gives a calming feel.
User Testing & Evaluation
We conducted our evaluation primarily in-person over zoom with an online questionnaire as well as some taking place in person with safe, social-distancing where the user was in front of the laptop while one of our team members took notes.
The types of evaluations we conducted were think aloud, retrospective, cognitive, and heuristic. An in-depth overview, discussion of demographics and our results can be read in our full report, which is linked below!
Success Criteria
Our main goal for this project was for kids, especially those with special needs, to be able to have a safe space where they can recognize their emotions and learn healthy ways of processing and communicating them. In addition, we wanted the app to be as intuitive and easy to use and learn as possible as well as being consistent and pleasing in style. We ultimately want our users to have a positive experience using our app, associating it with comfort and safety while still having fun. This chart shows our preferred results with reasoning behind them for our user testing.
Results
19.7 seconds for a user to get to the actual room of the game
100% of all testers recognized the emotions being depicted by the emotion buttons and intensity buttons
90.9% of all testers knew which general buttons to press to continue
100% of all testers gave positive feedback in regards to the art style
Testers reported an average score of 9.28/10 stars for the app
85.7% of all testers respond that they would hug Oba-Bear
71.4% of testers expressed positive feelings after using the app
100% of testers responded that they would use the app again
Overall, we feel that our app, My Pocket Place, was a great success, and we are happy that our implementation of our ideas for the app almost all got entirely implemented. And not only were they implemented, they were also implemented well beyond most of our expectations in terms of frontend as well as a working backend.