ABSeq is a fast and easy A/B testing tool for audio files on iOS and iPadOS. WIth one tap, the user can swap playback between two or more (up to four) audio files.
The user can instantly hear the difference between the two files, sequence between them using the built in sequencer, and perform A/B or reference tests on the go.
Swift
SwiftUI
UIKit
Supabase
Revenuecat
CoreML
Lottie
Posthog
OneSignal
Kingfisher
Google Sign In
Coordinator Pattern
Custom Camera UI featuring swipe-to-zoom, double tap to flip camera, and pinch to zoom
CoreML Image Classification to detect whether a check-in is a workout or not
Peristent Cache & Offline Mode
Data Prefetching
Push Notification for social nudges and updates
QR Code Invites
Universal Links & Deep Linking for invites
Background updates via background notifications
Custom Accent Colors that allow the user to personalize the UI to reflect their taste
Challengrs is inspired by a fitness challenge that my friend group puts on every year. We would take photos working out, and share in a group chat to keep each other accountable.
The system was simple: go to the gym, or workout at least 5 days a week, and take a picture as proof, and do this for 10 weeks. We quickly learned that this seemed to work better than other fitness challenges and workout apps.
The electricity of the competition drove us to never miss a week. Even on our most miserable days, simply showing up meant success was possible. By the end of the challenge, we all looked and felt notably better!
Though as time went on, we added a point system, and a leaderboard, and the group chat got messy. So we moved to a shared note.
Then we started hitting storage limits, and we needed to appoint a "game master" to tally the points every week.
Then people started reusing old photos, or even trying to fake workouts altogether. The whole thing was starting to become very complicated to run by ourselves.
Challengrs, like all great ideas, started with one thought: "why isn't there a better way to do this?"
The ideas started to flow immediately. Build a social-fitness app that gamifies accountability, using our unique set of rules.
Over a few design iterations, I polled my friends to gather feedback and ideas, though one big question remained: how do you prevent cheating?
Turns out, the answer was machine learning. I trained a CoreML model to recognize whether an image contained a workout or not. As time went on, I expanded the dataset so that the model could classify gym workouts: runs, hikes, pilates, yoga, cycling, and more!
In a later iteration, I had the idea to treat solo, and head-to-head workouts differently than groups – allowing the UI to adapt and display more stats and information relevant to the different play styles.
In the end, I was really proud to have built a platform not just for my friends, but one I could share with the world. A platform that ultimately leads users to live healthier lives, through a little fun competition.
Header
The sticky header at the top of the screen contains key information regarding the current challenge.
The current challenge name, which stands prominently within the header, indicates which challenge is currently loaded into the UI. As users can participate in multiple challenges at once, this is where users will look to see which challenge they are viewing. Tapping on this name brings up a liquid glass menu where users can select from other challenges they are participating in, or create a new challenge.
At the very top, the user can see what week the current challenge is on, and how many days remain in the current week. Tapping on this text briefly shows an alternate text view for the current week's start and end dates.
At the trailing edge of the header, the user can see three buttons that launch different sheets.
The level progress button indicates the user's current level, and a progress ring that indicates how many tasks the user has completed for the current level. Tapping this launches the level progress view, where users can see their current tasks. Upon completing all the tasks in a given level, the user advances to the next level.
The settings button launches the settings sheet, where users can edit their account settings and get support.
The profile view launches the profile view, where users can see their profile info, as well as their lifetime stats (Pro Feature)
Custom Tab View
On the home screen of Challengrs, the user is presented with a custom tab view. Inspired by the scrollable tab bars on X and TikTok, the user can scroll between the three most important views: the Leaderboard, the Check-In view, and the Challenge view (If the user is in a solo group, these adapt to alternate titles: Progress, Check-In, and Challenge, respectively).
The user can either tap on the capsules corresponding to each tab, or swipe between these three main views. This maintains flexibility, and reachability.
The capsules up top will dynamically adapt their color, as well as their size in an accordion-like motion to indicate the selected tab.
Leaderboard/Progress View
The leaderboard view highlights the users' progress throughout the duration of the challenge. A chart with prominent placement at the top features the challengers' weekly point status, allowing users to quickly gauge the status of the competition.
Below the chart is the leaderboard list. Each card in the list contains the user's ranking name, current streak, and score total for the current challenge.
Below the relevant information sits a row of circle indicators representing each week of the challenge. The color of the circle represents the completion status of the given week as follows:
Black - the weekly minimum workouts was not met
Green - the weekly minimum was met
Gold - the weekly minimum + at least one bonus day was completed
Tapping on one of these circles brings up a sheet with the actual check-ins logged for the corresponding week, where users can see and review the photos uploaded for each workout.
Check-In View
The check in screen gives users a glance of the current week's challenge performance. At the top of the view, users can see their own check-in card, containing their profile photo, name, ranking, and a row of circles representing their check-ins for the week.
The color of the check-in circles represent the following:
Green - a normal check-in was completed
Gold - a bonus day check-in was completed
Black - not yet completed
Black w/ Plus icon - not yet completed, but the user is eligible to check-in that day
Tapping on a check-in circle does the following:
Tapping on a green or gold check-in pulls up the corresponding check-in photo for that user.
Tapping on the empty check-in with a plus icon pulls up the check-in camera where users can log a workout for that day.
Below the user's own check-in card sits a custom motivational nudge that is context aware for the given challenge's rankings. These nudges can be simple such as "Your check-in is waiting", or more context aware such as "Aaron is closing the gap, maintain your lead!"
Below the nudge sits a weekly recap card that only appears if the user met their weekly minimum the week prior. The user can edit a shareable recap photo that's perfect for social media stories.
Below the recap is a list of check-in cards for the rest of the users in the challenge. However, if the user is in a solo challenge, or a challenge with only two members (ie a duel), this bottom section adapts to accommodate the extra screen real estate.
In a solo challenge, the user will see a stat card containing the stats for the current challenge.
In a duel, the user will see head-to-head stats for a quick glance at the performance gap between their rival and themselves.
In this way, the check-in screen is an adaptive glance at the current week in any given challenge configuration.
Solo, Duel, and Group modes
Challenge/Group View
The Challenge view contains information regarding the current challenge, and an options screen for managing the challenge.
At the top, the user can see the Challenge photo, the challenge parameters (weekly minimum workouts, duration in weeks, and number of members), and the challenge's start and end dates, as well as an options button and a bookmark button.
The options button brings up different sheets depending on whether the user is the admin of the challenge or not.
If the current user is the admin, they will see settings for editing the challenge name, managing members (where they can remove members or transfer admin status), restarting the challenge, and more.
If the user is not the admin, they will simply see an option to leave the group.
The bookmark button (Pro Feature) allows users to set a default challenge that appears on startup. This helps users that are partaking in multiple challenges see their preferred challenge each time they start the app.
Below that are the group member info cards, starting with the challenge admin, followed by an alphabetical list of challenge members (if in a duel or group challenge).
Tapping on a group member card expands the card to reveal the corresponding users' lifetime stats (Pro Feature).
Sheets
Sheets in Challengrs all have a uniform look with rounded corners up top, and a slightly translucent, black-gradient background.
Sheets are used as a way of minimizing depth throughout the app. The profile view, settings view, create challenge view, check-in camera UI, check-in photo viewer, and challenge settings view all live inside of sheets that can be accessed from home screen. Furthermore, none of these sheets navigate to any sub-views, meaning the user never gets lost in a sea of menus within a sheet. They can always quickly return to the core home screen by swiping down to dismiss a sheet.
Camera UI
The camera UI was custom built to accommodate Challengrs' unique needs. The UI features a beautiful full-screen camera feed, and liquid glass buttons that put the check-in photo at the forefront. Furthermore, as workouts can often be sweaty, and physically taxing, the UI utilizes several gestures and buttons that promote one-handed use.
Swipe to zoom - swipe up or down with one finger to zoom in or out
Double tap - flips between the main and selfie cameras
Zoom factor buttons - quick switching between the zoom factors that are available on the device (including 1.25x and 1.5x sensor crop zooms on newer iOS devices)
Upon pressing the shutter button to capture a photo, the app passes the photo on to the CoreML model that analyzes the photo, and returns either a green or red overlay, corresponding to "Workout Detected" or "Not a Workout", respectively.
If a workout is detected, the user has the option to use the photo, or retake if they would like another attempt.
Check-In Photo Sheet
Tapping a Check-In circle that is complete (green or gold) launches the check-in photo viewer in a sheet. The photo is highlighted in a large, full-screen 9:16 format, with an overlay showing the date of the check-in.
If the user is viewing their own check-in, they can long-press (tap and hold) to view their first ever check-in for a quick glance at their fitness progress.
The design process shown above goes from Figma prototype, to native SwiftUI implementation, and the final production design. As development approached completion, the UI took its final form, embracing iOS 26's focus on Liquid Glass, and concentricity.