Game Design: Animalia
The small interface of smartwatches make it frustrating to interact with apps, especially games. How do we create an engaging and fun game for a smartwatch that is seamless for users?
Team Members: Squid Aussem, Hanan Jama, Adam Lee, Kaitlin Russell
Tools Used: Figma, Adobe Illustrator, Photoshop, Visual Studio Code, GitHub, ScreentoGif, and Google Slides
Timeline: 3 Weeks
Company Introduction
This app was designed as the final project for a UX/UI Bootcamp at the University of Toronto. We were put on teams and had to pitch concepts, do user research and analysis, iterate, and finally present our completed designs. We decided to create a game specifically designed for the smartwatch interface.
The Process
Define
- Problem Statement
- Feature Prioritization
- Competitor Analysis
Develop
- Lo-Fi Prototype Testing
- UI Style Guide
Deliver
- Hi-Fi Prototypes
- Coded Launch Site
Discover
Originally, this app was meant to be targeted towards children, and have an educational theme. We did 8 total user interviews, 4 with adults and 4 with children. We also did 2 expert interviews with an education expert and a PhD candidate in the field of game narratives. We analyzed our interview data and created an empathy map to pick out important feedback that we noticed. We used this feedback to guide our feature selection for the mobile onboarding and smartwatch game.
User Interviews
Isir, 7 y/o
"Games are super important in a virtual pet app because they make it more fun and interactive. I'd love to play mini-games with my virtual pets, like a race or a puzzle game!"
Zak, 10 y/o
"One idea I have is to have different environments or habitats for the virtual pets. For example, a jungle or an underwater world. It would be amazing to explore different places with my virtual pet!"
Yasmin, 25 y/o
"A smartwatch makes your virtual pet accessible anytime, right on your wrist. Quick interactions, notifications, and fun gestures enhance the immersive experience of caring for a virtual pet."
Game Expert Interview
"Smartwatch games would have to have simple controls because of the issues with precision and complex actions. Something like a rhythm game would work very well, maybe you could combine it with the step counting feature."
"Pixel art is coming back in a big way, there's a huge demand for nostalgic and cute art styles."
Empathy Map
As we analyzed our data, we realized that children overwhelmingly preferred tablets and phones for gameplay. But we also found that adults who used smartwatches wanted games available to them. We changed gears to target young adults who enjoy retro-inpired gaming, but are also mindful about their screen time.
Define
Next we finalized a problem statement that reflected the goals and pain points of our constructed user. We selected our features and analyzed competitors for our app to ensure that our product was unique enough to be viable.
Problem Statement
The small interface of smartwatches hinders users from fully enjoying virtual pet games, leading to frustration and limited engagement. Users seek a seamless and rewarding experience where they can develop a strong bond with their virtual pets, feel a sense of responsibility, and easily connect with other players. There is a need to improve user interactions in Virtual Pet Smartwatch Games, addressing the challenges of the small interface and creating a captivating experience that aligns with users' expectations.
Selected Features
- Stages of growth for pets: allowing users to "level up" their pet through step-counting and gameplay
- Mini-games: providing activities for users to do with their pets
- Pet customization: users wanted to see fun and unique interactions, but also to be able to have some input on their pet, such as name, colour, and accessories
- Scheduling: giving users the ability to set active hours for their pet as well as pause notifications during busy times
Competitor Analysis
Develop
Now that we have an idea of what our user would want in a game, we can finalize a user flow, create lo-fi prototypes to test our features and develop a style guide to apply to mid- and high-fidelity prototypes.
Lo-fi Testing
A lot of smartwatch apps require a mobile onboarding for text-heavy inputs and account set-up. We wanted to have the pet customization screens on the mobile device to allow for ease of use.
.svg)
Feedback:
- Requiring a name and username seemed redundant, ask for one or the other
- Include a back button on setup screens for easier navigation
- Add some indication of the changes made to the settings page to show the user what their current selections are (ex. preview sprite that changes colour, current schedule settings)
We created a tutorial for the smartwatch game as our prototype. We wanted to know if the interactions were intuitive and that the interface was easy to understand and use.
.svg)
Feedback
- Make the profile tab more narrow so it doesn't interfere with selecting other buttons
- Add music/SFX control settings
- Change button interactions from swipe to drag
Style Guide
We developed a style tile to guide the creation of our components for the smartwatch, mobile onboarding, and launch page. We took the inspiration for our colour scheme from the beak of a toucan. Our typography, iconography, and logo were inspired by pixel art.
Deliver
After several more rounds of testing, we created our final launch page for Animalia. It contains a preview of the mobile onboarding and gameplay. Please click below to experience Animalia!
