Research and Personas

1 on 1 interviews were conducted asking people about problems they faced trying to organize games as a child and learning about common games that children played.

Common problems found during the interviews were:

- Generating teams and figuring out who was “it”
- Friends would normally have to leave in the middle of the game
- Weather
- Wandering too far away, and taking too long to set up the games

Once the 1 on 1 interviews were conducted, personas were created to show the different type of users that needed to be considered when designing the app.

Wireframes & User Testing

Before diving into high fidelity designs, paper wireframes were created to conduct user testing. Users were asked a series of questions around how they would complete 3 tasks. After user testing multiple people, I learned that some of the wording needed to be changed, specifically for the inviting friends portion because many got confused with the friends tab at the bottom. The weather button also needed to stand out more, because people had trouble finding it. And finally, there was no way to get back to home from any of the screens so a home button needed to be added to the bottom navigation bar.

The home page allows users to access their profile, look at the local weather, view the game of the month and view all the games from past months

Once you select a game it provides you with instruction on how to play the game, the equipment needed (all shipped in the subscription box), and recommended amount of players and the average game time. The next step is to invite your friends. Drag and drop your friends from the bottom screen up into the top to allow them to be separated into teams. The app will then generate teams and select who is “it” if necessary.

When the teams have been generated, the game can start. The app will then take you to a screen where you can track the players on your team. This is to make sure no one gets lost. There is also a feature to message players on your team. You can also choose to leave the game and it will notify the other players in the game, that way they know you left. Once the game is over the app will announce who won and show team stats.

The end of game stats adds points to the leaderboard. The leaderboard collects points from all the games ever played and displays the top three players.

Reflection

What I found the most challenging part of this project was finding the balance between too many graphics and everything being on a dark background. The subscription box is fun and vibrant, but when I tried to create that on the app, it was too much. I had to cut back on some of the background graphics and find a happy medium. At first I had the entire app be on the dark blue background and that made the app very monotone, with no real visual breaks. That is why, I eventually decided to do a white and dark blue split on most of the screens. This allowed for the user to differentiate between different sections on the screen as well as getting a break from the dark background.

I learned a lot from the research process as well. There were some functional issues in my original design that I would not have seen without user-testing. There were also parts of my first iteration that were confusing to some users, so that helped me make the best functioning app I could.

Overview

Time: 3-4 Weeks

Tools: Figma and Adobe Illustrator

Skills: UX/UI, Wireframes, Site Maps, Research, App Design, Branding, User-Testing, Icon Design