CUNY Techworks Express Training Program
The Challenge
“It’s nice to count on good humor to go through these uncertain times. We imagine the experience of an 8Ball mobile app to answer existential questions.”
The Solution
For people who sometimes need a little help making up their mind, my team offers a new take on a timeless classic. The Magic 8 Ball mobile app reveals that the future is full of fun!
​
The 'My 8 Ball' mobile app is about a shared experience of fun between people of all ages. It reinvents the experience with new themes and answers while still providing the thrill of putting oneself in the hands of fate.
The Team
Nelly Gomez
Prototyper
Co-researcher
Co-Information Architect
Carey Seward
Co-researcher
Co-Information Architect
Our Deliverables
Research Plan
Competitive Analysis
Behavioral Analysis
Personas
User Journey
User Stories
Style Guide Clickable Prototype
Megan Martin
Co-researcher
Co-Information Architect
Aliya Best
Co-researcher
Co-Information Architect
Tools
Figma
Google Suite (forms, doc, sheets)
Miro
Inessa Royt
Co-researcher
Co-Information Architect
Time
4 Weeks
Understanding the problem
We began the project by researching the history of the Mattel Magic 8 Ball.
Our initial hypothesis was that people seek a glimpse of the future when they feel stressed or uncertain. This hypothesis initially lead us toward mysticism and astrology.
However, our surveys reoriented our creative direction. It became clear that people do ask the 8 Ball questions, but in a more practical rather than spiritual frame. Moreover, they look to the 8 Ball for fun and excitement. There was an element of nostalgia at play as well. They remember sharing this fun experience with friends, in the classroom and in other ways. We therefore imagined gamifying the application, but another look at our data suggested it could have practical applications as well.
Understanding the Market
We looked at iterations of the Magic 8-Ball, both in physical and app form like the Magic Tiger 8 Ball, Ask Me app, and Mr.Predicto. We also looked at decision making and randomizer apps like the Tiny Decisions App.
​
We concluded that:
-
People love the nostalgia and playful mystery surrounding the original Magic 8 Ball.
-
They appreciate the communal experience of consulting the Magic 8 Ball together.
-
People loved the voice feature of the Mr. Predicto Ball and the Ask Me digital app.
-
People like the Apps that succeeded in re-creating this experience, and disliked those that did not.
Overwhelming, people expressed a desire for animations and the experience of handling the object. They want to shake it.
Our Users
Parents
People who work with children
Young Professionals
We drew on all of the data we had gathered to create 3 personas. From our competitive analysis, we saw that many used the original Magic 8-Ball in classroom settings but also in offices, and at home. We saw that parents and care-givers were likely to use the 8 Ball with their children. Young, unmarried professionals without children might use the 8 Ball with their friends.
Persona
User Story
As a parent, I want to have a fun way to help me and my family make decisions that no one can argue with.
​
And I know I am done when the kids understand the decision is made and they can't disagree.
Albert
Profession: Product Manager in a mid-sized company.
Primary Relationships: Wife and children
​
Goals & Frustrations
-
Albert strives to be a good father
-
Albert agonizes over making decisions, even small ones. Though initially enthusiastic about something, he will hesitate when it comes time to sign on the dotted line, or experience buyer’s remorse once the deal is done.
User Journey
Scenario: The user is with their children picking out ice cream at the store. A disagreement ensues over which flavor to buy.
Albert and the family have been cooped in the house because of the pandemic. All of this “quality time” spent together has everyone on edge, and it’s increasingly difficult to get everyone to agree. He decides to take the kids out for some fresh air, and on they way home, the kids ask for ice cream.
​
Once they get to the store though, an argument breaks out over which flavor to buy. Everyone wants something different. Mom’s favorite is strawberry. Son wants chocolate, and daughter is insisting on that gross cotton candy, that only she likes. Albert feels a meltdown coming on, but in a flash of inspiration, his son suggests using the Magic 8 Ball to decide.
​
Albert launches the app, opens the Program My 8 Ball mode, a feature that allows you to program your own answers into the 8-Ball, and enters his ice cream selections. He shakes the 8 Ball, and luckily Chocolate is the answer.
​
Through another feature, they send and share the result with Mom and head home.
User Flow
This is the flow for the My 8 Ball app. There are three modes the user can enter by swiping and selecting through the Magic 8 Balls on home page. A new user is introduced to the app by the onboarding and there the user is explained all the app can do.
In the first flow 'My 8 Ball', the user can use the theme feature to receive theme related answers for 
their questions. The user can select themes like Harry Potter, Yoda and the original 8 ball from the theme menu, ask their question and shake their phone to receive an answer based on their selected theme.
​
In the 'Program my 8 Ball' flow, the user can enter their own answer choices into the 8 ball. If the user needs help making choices for their magic 8 ball to select from, they can enter the screen that allows them to request help from friends and family to submit answer choices.
​
In the 'Adventure' flow, the user can select a category like 'food' to get a location based food choice or 'netflix' to get an app based choice for this category that would be a movie selection.
Albert uses the Program my 8 Ball mode with his children to pick their ice cream.
-
Albert launches the app.
-
As a frequent user, the onboarding would not appear for him.
-
He would enter the Program My 8 Ball Mode.
-
He enters his answers for the 8 ball to choose from.
-
He has the option to review his answers in list form.
-
Then he shakes the 8 ball and receives his answer. Decision made.
The Style Guide
For our mood board, each of us created individual boards to express our ideas. We then surveyed ourselves to make a decision on which style to use. We decided to go with a 70s/retro vibe for the app. This is also a play on a popular package redesign Mattel released for a special edition.
For the typography we gave the option for team members to suggest fonts and as a team we decided on Fredoka for Headers because it felt playful, game like and fit our mood board. Railway for the body text is paired for its simplicity.
​
Our colors are pulled from the mood board with some adjustments to make them accessible. Our icons and buttons conform to IOS standards and were user tested for clarity.
FROM SKETCHES TO WIREFRAME
Working together to sketch our ideas of how the application may look after all of our research was important to us. We had many similar ideas and visions of this application using the data to tell us what features are important to our users.
We each submitted a sketch and then chose the most compelling features from those sketches to put into the wireframe.
Wireframe
After discussing all of our sketches, we agreed on certain features that would be available and which buttons would be important to include.
We failed to test our paper prototype completely, and this may have contributed to weaknesses in our design, that we later encountered.
From Mid-Fidelity to high-fidelity Prototype
Initial tests of this mid-fidelity prototype demonstrated that users needed some explanation of how the app worked. Users were confused about how to use the application and what the main functions are. The way to address this need, we concluded was through an on-boarding feature.
Also, users did not understand our original home button (made to look like a Magic 8-Ball), so we decided to go with a more classic approach of a home button in our next prototype.
Users were confused about the buttons for a chat function, but liked the option of being able to connect with family and friends, so we dispensed with the chat feature, but retained the share feature in the next prototype.
In the High fidelity prototype, we began the interface with an on-boarding to orient the user right away. We streamlined the user-flow and added the style we decided on with our mood board.
We moved the icons together into one toolbar--moving the share w/ friends and family button that was originally only accessible from the ‘personal consultation’ screen.
To streamline the user flow, we added back buttons to each screen, whereas before users needed to click the home button each time to return to the three main functions.
Some users were confused about the function of each Magic 8-Ball on the home screen, so we added more information in the on-boarding.
We also created more frames to show the users more features like how they would receive their answer or use the style (now known as theme) feature.
Users were confused about the themes, but liked the idea of customizing it. We surveyed our uses to help with renaming and labeling this function.
With our second high fidelity prototype, users were able to navigate the app with significantly less confusion. Whereas in the mid-fidelity prototype, we had to ask them to perform specific tasks. In the high-fidelity prototype, they performed these tasks intuitively.
We continued to streamline the user flow by removing extra steps. We linked the 8 balls on their home screen directly to their function (ex: ‘choose my 8 ball’ home screen clicks to the themes page directly when you click the center of it).
Some users were still confused about the themes but still liked the customizability, so we added headers with captions directly on the page to guide them.
We added a new onboarding screen to clearly explain each mode of the app. For additional help, the user can still click the question mark icon for directions on each page.
Users were still confused with the second mode “personal consultation” with the example we set, so we changed the title of the section to “Program my 8 Ball” and removed the example and just indicated to users to enter text there.
We performed a third round of user testing to verify that our changes had been effective and made one last round of edits.
-
We made the status bar in the onboarding larger so it’s easier to see.
-
We changed the ‘style’ button to say ‘theme’ to be consistent.
-
We also changed it so that when you clicked on “My 8 Ball” it links directly to our example of the Yoda ball. That way we could remove an extra step for the user, respect Hick’s Law by removing complexity, and relieve the cognitive load of choosing the ball’s theme right off the bat.
Next Steps
Our prototype gets easier to use and easier to navigate with every iteration. Each round of usability testing yields actionable data. However, it is clear that using the app is still not intuitive. Further design changes and further usability testing are necessary.