HabitSlots

May 2026

Gamified habit system with slot machine reward mechanics

HabitSlots

About the Project

A cross-platform mobile and web application that applies variable-ratio reinforcement (the same psychological mechanism behind slot machines) to habit formation. Users earn paperclips by completing pre-defined habits, then cash them in to spin a reward wheel. The more clips committed to a spin, the higher the reward tiers unlocked, creating a risk/reward dynamic that makes the next spin genuinely exciting.

The application is built around a "Jar" system where each jar is a self-contained habit loop with its own behaviours, tiered rewards, and long-term milestone goals visualized as progress bars. A rare 2% gold paperclip drop unlocks all reward tiers at once. Landing on Bonus triggers a secondary wheel that starts a 10-minute window to earn clips at a reduced effort cost, with additional bonuses queuing sequentially behind the active one.

The wheels are hand-authored in SVG with weighted arc geometry and a custom stop-angle algorithm that ensures the winning segment's midpoint lands precisely under the pointer on every spin. All state is persisted locally via AsyncStorage with no backend, no accounts, and no server. The entire application runs on-device.

What I Learned / Technologies Used

  • Expo SDK 55 / React Native 0.79 (iOS, Android, Web)
  • Expo Router v7 file-based navigation
  • Zustand 5 with AsyncStorage persistence middleware
  • React Native Reanimated 3 wheel spin animations
  • Hand-authored SVG wheels with weighted RNG and precise stop-angle geometry
  • TypeScript strict mode throughout
  • Zero-backend client-only architecture