Roxy: Premium HYROX Training App Development

Roxy is a state-of-the-art mobile application designed for competitive HYROX athletes. It serves as a central hub for training, race tracking, and performance analytics, wrapped in a high-octane, premium aesthetic.

The goal was to build a specialized companion app for the growing community of HYROX athletes. Unlike generic fitness apps, Roxy focuses on the specific demands of fitness racing — combining endurance with functional strength. The app is designed to smoothly guide athletes from everyday training into focused, race-day preparation.

Framework: Expo (React Native), enabling rapid cross-platform development

Navigation: Expo Router with file-based routing for a clean, scalable architecture

Styling: NativeWind (Tailwind CSS) for a responsive, design-system–driven UI

State Management: Zustand for lightweight, high-performance session and event state handling

Animations: React Native Reanimated for fluid transitions, gestures, and interactive UI elements

Data Visualization: Custom-built charting system for heart rate, pace, and training volume

Typography: Space Grotesk for display and Manrope for body text, creating a modern, industrial look

A high-impact home screen centered around a Hero Race Card that tracks the athlete’s next competition with a live countdown. Includes discovery of trending and nearby HYROX events.

An interactive calendar presented as a horizontal timeline to manage workouts and rest days.

Swipeable workout cards allow quick actions such as starting, editing, or deleting sessions.

AI-powered “Ask Roxy” chat provides personalized training insights and suggestions.

A unique Cylinder-style session view built specifically for high-intensity environments, ensuring metrics and progress remain readable during intense workouts.

In-depth insights into training load, heart rate zones, consistency, and progress trends to help athletes peak at the right time.

A personalized, multi-step onboarding flow that captures division, age, and notification preferences to tailor the experience from day one.

Defined the “Roxy Acid” visual theme — a high-contrast dark mode with neon lime accents — tailored to competitive athletes. Typography and spacing tokens were centralized in a shared tokens configuration.

Used Expo’s modern architecture with the New Architecture enabled for performance gains. Adopted a feature-based folder structure within the app directory for long-term scalability.

Built a reusable component library, including custom SVG iconography to maintain strong brand consistency across the app.

Implemented custom hooks and Zustand stores to manage event tracking, workout persistence, and user state efficiently.

Applied memoization and callback optimization for heavy lists, and leveraged Reanimated to ensure smooth 60fps interactions on both iOS and Android.