SuperPower (ex. WorkoutMe)
A daily micro-workout app for iOS and Android: a one-minute session instead of an hour at the gym, a streak, an activity feed and a leaderboard. One React Native codebase, rated 4.6 on the App Store.
Outcome
- 4,6
- average App Store rating across 559 reviews
- 350+
- guided exercises with video in the catalogue
- 2
- platforms from a single codebase: iOS and Android
Product screens
Home screen: the personal plan for the day, the streak strip with completed days, and instant workouts of one to five minutes.
Picking a workout: a 1/3/5-minute duration filter, with a video and a timer behind every exercise. No equipment needed.
End of a workout: the streak, a meme reward and a question about how it felt. From here the result goes into the reports and into Apple Health.
The progress screen, my part of the work: month calendar, streak chart and the "days in a row" and "workouts total" counters. Three Firestore reports on one screen.
Leaderboard: the top three plus the user’s own row with the change in position. Rank comes from workouts completed in the period.
Activity feed: other people’s workouts, workout doodles and kudos. A separate query collects an author’s doodles into the gallery on their profile.
Onboarding: the goal drives the plan and the difficulty. The steps live in their own navigator and the answers are kept until sign-up.
The business problem
The product does not fight a shortage of exercises — it fights people quitting in week two. Everything rests on visible progress: how long the streak is, how many workouts the month added up to, what friends make of it. The old profile showed an avatar and a couple of counters, so there was no way to read the trend, and the statistics sat in Firestore separately: user totals, monthly reports and per-day slices in different documents. All of that had to become one screen that opens immediately and stays smooth on low-end Android devices.
My role
Frontend Engineer: I built the progress screen from scratch — the header with avatar and city, the report carousel with a month calendar and a weekly chart, the streak and total-workout counters, the friends row, the gallery of workout doodles and the placeholders for paid SuperPower reports. The screen is written in TypeScript inside a codebase that was still JavaScript at the time, so I also set up the path aliases, typography and shared style mixins the rest of the team then used.
The solution
React Native with Redux and React Navigation, data in Cloud Firestore. Reports load through three independent queries: user totals, the month document behind the calendar, and the last seven days behind the chart. The blocks fetch in parallel, so the screen never waits on the slowest query and paints the header straight away. The carousel renders report cards as they are swiped into view, and RevenueCat handles the SuperPower subscription and access to paid reports. Exercise videos are never streamed mid-workout: on first launch the app downloads an archive from a CDN in the background and unpacks it into the device file system, after which everything plays locally — the download and the unpacking are instrumented with Firebase Performance traces. Builds ship through Fastlane and GitHub Actions; small fixes go out over CodePush without a store review.