TrackPacer is a digital "track rabbit" that helps competitive runners train harder. It's a controllable beam of light that orbits a 400 meter track, illuminated by thousands of LEDs and driven by Arduino-compatible microcontrollers. Coaches and runners control the pace, distance, and intervals of the pacer using an iOS app.
After a React-based prototype had been created, I was brought in to design the user interface. This included:
Sketching, interaction design, prototyping, and final art production.
Planning and design for enhancements like saved workouts and a wearable app.
The main screen displays workout stats like distance, pace, and intervals.
Circling the perimeter of the screen is the track. The pacer orbits this in real-time, offering additional feedback to the coach — important in bright conditions when the pacer may not be easily visible from afar.
Controls for editing and changing workouts are shown only when the pacer is paused. While helping simplify the interface, this decision serves a more important function—it protects against inadvertent changes to settings in the midst of a workout.
Users can swipe between predefined distance settings or enter one numerically. A custom keypad guards against invalid input and makes choosing units easy. Pacer color can be tuned for best visibility in changing light conditions.
Requesting and passing control
Inevitably, multiple users will try to use the system simultaneously. A user who wishes to use the track can request control. Doing so messages the current “owner” who can choose to pass control or ignore the request.
Detaching from the track
While control of the track is released when the owner walks out of range, she can also do this manually. Pulling the screen down past a certain point—in essence, away from the track—disconnects the app from the track.
An animated icon depicting a plug pulling away from a socket provides feedback where this threshold lies. The track UI dims to draw attention to the message.
The simple UI was easily translated to a wearable form factor. This natural extension allows a coach to start and stop the pacer with a tap. Saved workouts can be changed with a swipe.
Our corporate site was in the midst of a redesign, but we wanted to tell the story of creating TrackPacer in an engaging way. I collaborated on the design of this one-off case story page with Billy French.
- UX & Visual Design
- Todd Moy, Billy French, Joseph Le
- Hardware Design, Fabrication, and Software Development
- Lawson Kurtz, Justin Sinichko, Eli Fatsi
- Front-end Development
- Ben Tinsley