Draft: PaceJam | iOS App Case Study

A comprehensive brand identity and native iOS app that seamlessly syncs running cadence with personal Spotify libraries in real-time, creating a highly adaptive workout experience.

JRMC 7012 | Spring 2026

As the UI/UX Product Designer, I brought this project to life, along side my team members, using design and development tools including Figma, Canva, Claude, Swift, Xcode, Apple HealthKit, CoreMotion, SQLite, and the Spotify iOS SDK.

Project Overview

PaceJam is a mobile app designed to dynamically match music to a runner’s cadence. Our goal was to translate the app’s core promise, a fun, motivating, and seamless experience, into a cohesive visual identity, back it up with rigorous user research, and develop a fully functional native iOS application.

Wearing multiple hats throughout the project, I led UI design and front-end development. Alongside my team, I built out the comprehensive design guide, created the Figma prototypes, and implemented those UI changes directly into the Swift codebase. Additionally, I served as the recruitment lead and primary notetaker for our usability testing, and assisted in producing promotional materials, including our project poster and launch trailer.

The homepage of the iOS version of PaceJam

The Problem

Whether you run marathons or would only run if being chased by a bear, there’s something we can all admit: running sucks a little bit. Maybe it’s too hot outside. Maybe you went out a bit too fast. Or maybe, your music just isn’t hitting the spot.

It’s this last experience that our Capstone team just kept thinking about over the summer. We’re all runners who’ve personally felt the surprising impact music can have on a run. It’s an amazing feeling when the perfect track comes on at the perfect moment in your run. But we realized that whether we had that amazing feeling or not was incredibly unpredictable; the fate of our runs was ultimately left up to whether the Spotify shuffle button was having a good day or was in a mood.

The problem isn’t technology itself; people love using apps like Strava and Nike Run Club to gather data on their performance, and nearly every runner loves having their music from Spotify or Apple Music with them as they head out. The problem is the gap between these two worlds. No app exists to deliver a seamless, integrated experience that joins together the data of your runs and the emotions of your favorite music in perfect harmony to help you consistently reach that runner’s high that, even when it’s a little hot out, helps running suck a little less and rock a whole lot more. So, we decided to build it.

The Solution

Establishing the Brand Identity

Because PaceJam was a brand-new concept, we defined our personality early: dynamic, innovative, encouraging, and fun. This ethos guided every design decision. We audited competitors to ensure a unique market position, refining our initial color palette into a bright, energetic scheme.

For typography, we selected Owners Narrow for headings and Owners for body text to establish a clean, modern foundation, introducing an expressive secondary font for marketing to inject personality. We also created “Tempo,” a friendly mascot designed to make the onboarding process inviting and serve as a helpful guide within the app.

This was PaceJam’s first color palette

This was our font exploration for our brand and logo

This is PaceJam’s current colors, typography, gradients, logos, and mascot

Prototyping & UI Design

As the design specialist, I led the creation of a foundational library of reusable elements. I built key UI components, including the pace selector, navbar, stats chart, media controls, and the streak icon. This pattern library defines layouts for critical user flows like the sliding selector and the music player.

This is one of the initial buttons in the pattern library

Developing the prototype involved multiple iterations. Our initial attempts felt a bit cluttered, so we actively refined the interface to achieve an authentic, minimal but bold aesthetic that felt both energetic and intuitive to users.

This shows the progress from out early wireframe low fidelityt protoype, to the high fidelity figma prototype, to our iOS app interface

User Testing & Iteration

To validate our design, we conducted moderated usability testing with six Generation Z recreational runners. I led participant recruitment and served as the primary notetaker.

The results were highly encouraging: 100% of participants successfully completed the core setup tasks, and the app earned an impressive System Usability Scale (SUS) score of 82.1. Participants noted that the connection to their personal Spotify library, rather than an internal stock library, was a massive positive.

However, the testing revealed crucial areas for improvement, which we immediately iterated on:

• Workflow Restructuring: Users prioritized selecting their workout structure before setting their pace. We split these into two separate screens to better match the user’s natural mental model.

Split Speed Over Time and Starting Pace into separate screens, renamed Speed Over Time to Select Workout for clarity, placed it before Starting Pace, and emphasized the Load Workout button at the top of the screen.

• Clarifying Terminology: Users misinterpreted the “Increase/Decrease” buttons as immediate pace controls rather than split progressions. We renamed these to “Negative Splits / Positive Splits.” Furthermore, we changed mid-run metric labels from “Next Lap” to “Next Interval” to avoid confusion with GPS tracking.

Separated workout and pace into different screens, moved the buttons to the bottom of the workout selection screen, and renamed them Negative Splits / Positive Splits to clarify their function.

Replaced “Next Lap” with “Next Interval In” to align with workout terminology used throughout the app.

• Reducing Cognitive Load: We redesigned the run screen to create a clear visual hierarchy, grouping interval stats together so runners could scan their data in milliseconds without breaking their stride.

Bridging Design & Development

Moving from Figma to XCode, we built PaceJam as a native iOS app coded in Swift. It utilizes Apple HealthKit and CoreMotion frameworks to track workout data seamlessly. For music integration, we used a hybrid approach with the Spotify Developer Kit for iOS and the Web API, backed by a locally packaged SQLite database.

We bridged the gap between design and development through intentional teamwork and the use of Claude to help translate our Figma vision into functional UI code, ensuring that our beta application perfectly matched our prototype while plugging into the backend logic.

Here are some of the major screens of our app on the iOS

Go-to-Market & Promotional Content

Beyond the app itself, I wanted to ensure our promotional assets reflected the same authentic, minimal yet bold aesthetic we established in the UI. I designed the primary promotional poster, intentionally adapting the layout into distinct, optimized formats for both a standard Instagram post and a vertical Instagram Story to maximize social engagement.

This is our final poster design

To bring the app’s energetic vibe to life, I also played a key role in producing our launch trailer. I developed the comprehensive shot list with my team members to ensure we captured the right balance of active running footage and clear interface close-ups, and assisted hands-on with the filming process to keep our creative vision on track from storyboard to final cut.

[embed]

Results & Next Steps

Seeing PaceJam come to life has been incredibly rewarding. What started as an ambitious concept has evolved into a functional, data-driven application. UX research successfully validated our core value proposition while identifying specific refinements that reduced cognitive load and improved the overall user flow.

Key lessons included the vital importance of iterative terminology testing and the power of a mascot to enhance brand personality. Looking forward, our next step is to conduct real-world field testing with users on live runs to fine-tune our music selection algorithm and ensure PaceJam feels just as motivating in motion as it does on screen.