Otorafit - Gamified Fitness Territory App

Mobile AppCompleted 2025
React NativeExpoGoogle Maps APITurf.jsNode.jsMongoDB
App
linear-to-br from-pacific-blue to-dark-teal

Project Overview

Client

Fitness startup aiming to gamify outdoor activities and encourage users to explore their surroundings through territory claiming and community challenges

Timeline

Phase 1: 8 weeks | December 2024 - January 2025

Team Role

Full-stack Mobile Developer - Frontend, Backend, Maps Integration, Geolocation Logic

Otorafit needed an innovative mobile application that combines fitness tracking with gamification and territorial exploration. The app aims to motivate users to stay active by turning real-world locations into claimable territories where users earn points. The platform required precise GPS tracking, complex geographical calculations for territory boundaries, a community system for user engagement, and admin controls for content management. Phase 1 focused on core features: authentication, territory claiming mechanics, points system, and community foundation.

The Challenge

Building a location-based gamified fitness app presented unique technical challenges: Complex Geolocation Logic - Implementing accurate territory claiming using GPS coordinates, detecting when users enter predefined or custom territories, and preventing territory overlap or gaming the system. Real-Time GPS Tracking - Efficiently tracking user location in background without draining battery, handling GPS accuracy issues, and working across different devices and OS versions. Geographical Calculations - Using Turf.js for complex operations like point-in-polygon detection, area calculations, territory boundary verification, and distance measurements between user and territories. Gamification System - Designing fair point allocation logic, preventing cheating or GPS spoofing, tracking user achievements, and maintaining engagement through rewards. Community Management - Building admin panel for post creation, moderation, and content management while ensuring smooth user experience in community feed. Cross-Platform Performance - Ensuring consistent experience on both iOS and Android using React Native and Expo while handling device-specific GPS and map rendering differences.

Our Solution

We developed a cross-platform mobile app with advanced geolocation and gamification features: React Native with Expo providing unified codebase for iOS and Android, leveraging Expo's location services for background GPS tracking and native performance. Google Maps Integration implementing interactive map display, custom territory markers, user location indicator, and real-time map updates as users move and claim territories. Advanced Geospatial Logic using Turf.js for precise geographical calculations including point-in-polygon detection for territory claiming, area measurement for territory size validation, distance calculations, and custom territory boundary drawing. Territory Claiming System with two modes: predefined territories (set by admin) and custom territories (user-drawn areas), point allocation based on territory size and difficulty, prevention of duplicate claims and territory overlaps. Authentication System implementing secure user signup/login with JWT tokens, user profile management, and session handling across app restarts. Points & Gamification Engine tracking user points from territory claims, achievement system for milestones, leaderboard logic (prepared for Phase 2), and engagement metrics. Community Platform allowing admin to create, edit, and delete community posts, users to view community feed, and foundation for future social features like comments and reactions. Backend API using Node.js and Express for user authentication, territory data management, point calculations, and community post storage in MongoDB.

Key Features

Territory Claiming

Claim predefined areas or create custom territories using GPS and earn points for exploration

Dual Territory Modes

Choose between admin-defined territories or draw your own custom claimed areas

Real-Time GPS Tracking

Background location tracking detects when users enter claimable territories

Points System

Earn points based on territory size, difficulty, and exploration achievements

Google Maps Integration

Interactive map showing territories, user location, and claimed areas in real-time

Community Feed

Admin-managed community posts keeping users engaged and informed

Geospatial Calculations

Turf.js powered territory validation, area measurement, and boundary detection

Cross-Platform

Native iOS and Android experience with single React Native codebase

Technology Stack

Frontend

  • Google Maps React Native
  • Turf.js for geospatial calculations
  • Custom UI components
  • State management (Context API/Redux)

Backend

  • Node.js with Express
  • MongoDB with Mongoose
  • JWT authentication
  • RESTful API architecture

Mobile

  • React Native
  • Expo SDK
  • React Navigation
  • Expo Location API
  • Async Storage

Infrastructure

  • MongoDB Atlas for database
  • Cloud hosting (Render/Railway)
  • Google Maps API
  • Expo Application Services

Project Gallery

1
User profile and Activity showing claimed territories, total points, and achievements

User profile and Activity showing claimed territories, total points, and achievements

2
Interactive map showing predefined territories and user current location

Interactive map showing predefined territories and user current location

3
Community feed displaying admin posts and user engagement features

Community feed displaying admin posts and user engagement features

Results & Impact

Phase 1 Completed

Phase Status

Predefined & Custom territories

Territory Types

Within 10-20 meters

GPS Accuracy

iOS & Android native

Platform Support

Turf.js integration

Geospatial Engine

Battery-optimized GPS

Background Tracking

What We Learned

This project was our deepest dive into mobile development and geolocation technology. We gained extensive experience with React Native and Expo, learning to optimize background location tracking for battery efficiency. Working with Turf.js taught us complex geospatial calculations and how to handle real-world GPS accuracy issues. The gamification aspect challenged us to think about user engagement, fair point systems, and preventing exploitation. Building both predefined and custom territory systems required careful database design and efficient map rendering. This project significantly enhanced our mobile development skills and prepared us for future location-based applications.

Interested in a Similar Project?

We'd love to help you build your next mobile app application. Let's discuss your requirements and create something amazing together.