MapMyRun Web Redesign
Redesigning MapMyRun Web for a global community of 60M+ athletes.
About
MapMyRun
I
Jun 2019
Bringing MapMyRun’s web experience into alignment with Under Armour through a new visual system and scalable design library.
Bringing two
brands together
MapMyRun had a strong product and loyal running community, but its web experience had evolved separately from the broader Under Armour brand.
The visual language, components, and interaction patterns weren't consistently connected across mobile, web, and the Under Armour ecosystem.
The challenge was bigger than a visual refresh: how could we create a cohesive system that felt unmistakably MapMyRun while giving the product a stronger connection to Under Armour?
Bringing MapMyRun into the Under Armour ecosystem
MapMyRun had evolved independently from the broader Under Armour brand, leaving its web and mobile experiences visually disconnected.
The challenge wasn't simply to update the UI. We needed to establish a cohesive visual language across platforms while preserving the utility and personality that made MapMyRun familiar to runners.
I led the web side of this effort, translating the new mobile visual direction into a scalable web system and applying it across MapMyRun's core experiences.
Defining the visual direction
We started with a week-long virtual design studio to explore what the new MapMyRun experience could look and feel like within the Under Armour brand.
Each designer explored a different mobile experience. I owned the Profile screen, exploring multiple directions within the new red, white, and black palette.
The goal was to balance Under Armour's bold, energetic visual language with the clarity and utility runners expect from MapMyRun.
From mobile components to a scalable web system
Using the new system, I redesigned MapMyRun's key web experiences—including the logged-in home, dashboard, route creation, profile, and workout statistics
.
The goal wasn't to make every screen look different. It was to create a consistent foundation that made the product feel more cohesive, modern, and distinctly part of the Under Armour ecosystem.
A new logged-out home page
Making performance data easier to scan
The Outcome
The redesign established a unified foundation for MapMyRun Web and created a stronger connection between the product, mobile experience, and Under Armour brand.
A unified design language
Web and mobile could now share a consistent visual foundation while maintaining platform-specific patterns.
A scalable design system
Reusable components and assets made it easier for design and engineering to build consistently and iterate faster.
A modernized core experience
Key experiences—including the dashboard, route creation, profiles, and workout statistics—were redesigned around the new system.
A foundation for what's next
The system gave the team a reusable framework rather than another one-off visual redesign.