FindAMoo

Building community through a scavenger hunt game for students at the University of California, Davis (UC Davis).

Timeline

January 2022 – June 2022

Tools

Figma, Adobe Illustrator

Role

Design Team Lead and UI/UX Designer

01. INTRO

Project Overview

FindAMoo is a scavenger hunt game that aims to build community among UC Davis students by encouraging them to explore the campus to collect unique cows.

Originally, the goal of our project was to create a mobile application that facilitates new students’ transition to UC Davis, specifically helping them navigate their week of orientation. Due to an administrative issue with implementing our application officially, we decided to pivot ideas but maintain the same goal.

Our overarching goal was to encourage UC Davis students to familiarize themselves with the campus, leading us to create a proof of concept for a mobile application that engages students with a daily cow scavenger hunt. Every day, a cow appears on campus as shown on the live map, and students will have to navigate the campus and explore on foot to catch the cow.

The Team

My Role

As Design Lead, I was responsible for communicating decisions made by the design team to our product manager and development team. I was the first point of contact for questions about the designs and was the primary advocate for our design decisions.

Additionally, I was the visual designer for this project and designed all cow graphics used in the app. I was also involved with designing the overall app concept and game logic, specifically focusing on the profile page.

02. RESEARCH

Initial Research

Originally, our target users were new UC Davis students who wanted a solution to help them navigate orientation week, campus, and campus life. For our first research phase, we wanted to find out what current students believed to be the strengths and weaknesses of orientation. Using a combination of competitive analysis, surveys, 1:1 interviews, and Strengths, Weakness, Opportunity, Threat analysis, we discovered the following:

Students liked meeting new people, learning general info about campus, and how to register for classes
Students wished to learn more about UC Davis campus culture (e.g. clubs, student life, extracurriculars, etc.)

Pivoting Ideas

At the end of Week 3 in the term, our team pivoted app ideas after discussing the impracticality of implementing our orientation app officially with the university due to a complex process of approving the app. As this obstacle limited the features we originally had in mind for the app, we ultimately decided to create an entirely different app that would be more engaging to students and be a more productive use of our team’s efforts.

Both our team’s designers and developers worked together to brainstorm a new How Might We statement to guide us through the design process with the pivot:

How might we increase student engagement with the UC Davis campus and strengthen community?

With this, we worked together to generate Crazy 8 sketches of possible solutions and were inspired by Wordle and Pokemon Go to build a “daily cow scavenger hunt.”

FindAMoo Research and Synthesis

After developing the idea of a cow scavenger hunt game, we conducted additional research to learn more about people’s experiences playing with games. We sought information about what aspects of games people enjoyed, what they found most engaging, and whether they played alone or with friends. Through interviews and a Google Form survey, we found that:

Students enjoy game progression and unlocking new achievements or customizations
Students primarily play with friends
Students find mobile games convenient and easy to access

We further developed our idea by participating in another Crazy 8’s exercise as a team, brainstorming potential features that could increase engagement. After sharing our sketches, we found a few features in common:

Daily streaks
Daily custom cow
Barn collection of cows

We created a user flow following our synthesis of ideas:

03. DESIGN PROCESS

Low-Fidelity Wireframes

After developing our user flow, we moved to creating low-fidelity wireframes to build out the layouts for our main pages: the map, barn, and profile.

Design System

When developing our design system, our team decided that we wanted FindAMoo to feel playful with a focus on accessibility and simplicity. Our header font is Lexend which we chose because of its modern and youthful feel. Our body text is Avenir which we chose because of its variability and readability. Our three main colors — teal, red, and yellow — were chosen to create variety and contrast between elements. For our components, we focused on keeping them simple to improve clarity while navigating the app.

Cow Designs

To feel cohesive within our design system, I designed the cows in a 2D vector graphic style using bright colors. Since FindAMoo is based around players being able to catch a unique cow every day, we developed enough variations of cows to be able to generate over 800 unique cows, which would be equivalent to over two years of playing every day. Cows come in two postures — front-facing and side-facing. As players catch more cows they unlock 6 different colors of cows and 5 types of each accessory (cowbell, head accessory, and extra accessory).

Mid-Fidelity User Testing

After applying the colors and fonts in our design system to the low-fidelity wireframes, we conducted a round of user testing to validate our design decisions and identify any user pain points.

We found 3 primary user pain points to address:

Users were unclear about the “1 cow a day” rule after using the prototype.
Solution: We created a tutorial walkthrough of the game's rules and relevant features that pops up after logging in.
Users did not understand how the level system worked.
Solution: We focused on rewording the explanatory descriptions displayed on various screens.
Users felt there was a lack of customization in the game.
Originally, we allowed users to choose their avatar by favoriting one of the cows they caught.
Solution: We created a new feature to allow users to customize their own avatars.

High-Fidelity User Testing

The second round of user testing with our hi-fidelity prototype revealed that while users gained a better understanding of specific game functions from our new tutorial, they continued to lack a general sense of gameplay. We added a new screen in our onboarding to provide a more high-level description of the game to address the users’ pain point.

Users also expressed confusion over which type of cows they were able to catch at their current levels, leading us to revise our description of the level system to more clearly explain what occurs when leveling up and which cows they are able to collect at each level.

04. FINAL DESIGNS

Video Walkthrough of FindAMoo

Onboarding Tutorial

First-time users follow a tutorial that points out features in the game: the daily countdown timer, the daily streak, the barn, and the level system.

Catching the Cow

Once users are within 100 feet of the location, they are able to catch the cow.

Viewing the Barn

Users can view their collection of cows in their barn and sort or search to find specific cows.

Customizing Cow Avatar

Users can create their own profile avatar by selecting a cow, cow accessory, and background color.

05. CHALLENGES AND TAKEAWAYS

Pivoting and Prioritizing features

Our two biggest challenges were pivoting ideas and prioritizing which features to implement. Pivoting from an Orientation App to FindAMoo, challenged us to repurpose the work we had previously done and to conceptualize and develop a new app with less time. Due to the time constraint, we had to prioritize the most important features to develop. Several of the features (such as the share feature) were unable to be implemented during this term, but with more time in the future, we would like to finish building out FindAMoo.

Teamwork Makes the Difference

The FindAMoo team was one of the most collaborative teams I have worked on and our strong sense of camaraderie made this project so much fun to work on. Initially, the designers and developers worked independently which made progress clunky and slow. However, once we started having weekly meetings where both designers and developers were present, we were able to communicate more effectively which translated to more productivity (and more fun!).