UmeCatch

#SUPABASE #FIGMA #REACT.JS

UmeCatch
Role

UX/UI Designer,

Frontend Developer,

Document Controller

Tools

Figma, Supabase, React Native

Timeline

Autumn 2025

2 months, 50%

Overview

UmeCatch is a GPS-based mobile game developed as part of the course Product Development for Mobile Applications . The concept is inspired by treasure hunts and location-based games, where players explore Umeå University campus and collect points by finding specific locations.

The goal was to create an engaging experience that encourages students to explore campus, discover new places and add movement to their everyday routines. As a team, we developed the concept from the initial idea through research, prototyping, user testing and implementation, resulting in a fully functional mobile application.

The game combines GPS, maps and location-based challenges with a playful visual identity. P layers are given a target location and must physically navigate to it. Once they believe they have reached the correct place, they lock in their position and receive points based on how close they are to the target.

The project was developed collaboratively using React Native, Expo, Supabase and Figma.

Process

We worked in four sprints, following an agile process inspired by Scrum. The project evolved continuously through brainstorming, prototyping, user testing and implementation.

Ideation & Research

We started by exploring existing location-based experiences such as Geocaching, Adventure Lab and GeoGuessr. These references helped us identify what makes location-based games engaging and gave us inspiration for combining exploration, maps and game mechanics. From this research, we developed the initial UmeCatch concept: a campus-based treasure hunt where players receive locations to find and are rewarded based on their accuracy.

Lo-fi Prototyping & User Testing

The design team created individual lo-fi concepts before combining the strongest ideas into a shared prototype. We tested the concepts with people from our target audience using user scenarios and A/B testing. The testing helped us identify several improvements. Users wanted a more direct way to start playing, clearer navigation and a less confusing tutorial. We used this feedback to iterate on the prototype and establish the structure of the final application.

Umecatch design process

Visual Design & Hi-fi Prototype

Once the core flow was established, we created a shared visual identity. The design was intended to feel adventurous, active and connected to nature while remaining clear and easy to navigate. We developed the hi-fi prototype in Figma and tested it before implementation. Feedback at this stage mainly concerned smaller details such as button sizes, hierarchy and naming.

Umecatch design process
Umecatch design process

Development

The final application was developed using React Native and TypeScript with Expo. Supabase was used for authentication and database functionality, while PostGIS handled geographical data and distance calculations. The gameplay system connects the player's live GPS position with predefined locations. When a player locks in their position, the backend calculates the distance to the target and assigns a score accordingly. Throughout development, the team worked in parallel across design, frontend and backend, using Git for version control and Figma for collaboration.

Final Result

The final result is a fully implemented mobile game where players explore Umeå University campus through GPS-based challenges.

The application includes onboarding and authentication, a tutorial, home screen, gameplay, profile, friends and settings. The core gameplay consists of finding locations around campus and locking in a position once the player believes they have reached the target.

Points are calculated based on the distance between the player's position and the correct location. The closer the player is, the higher the score. In total, 25 locations were created across campus, each supported by an image containing visual clues to help players identify the correct place.

The application also includes a progression system where players can earn XP and levels, as well as a high-score system that adds an additional layer of competition and motivation.

Although the final version was limited by the timeframe of the course, the application was developed with scalability in mind. Future improvements could include multiplayer gameplay, custom game creation, weekly challenges, seasonal events and rewards. We would also have liked to conduct more extensive testing of the implemented application to further improve performance, loading times and overall usability.

Overall, UmeCatch successfully combines location-based technology, game mechanics and user-centred design into an interactive experience that encourages students to explore their campus in a new way.

Let’s talk

elin.soderstrom@live.se
← Back to projects