Team USA Mobile App

Create Your First Project

Start adding your projects to your portfolio. Click on "Manage Projects" to get started

Team USA Mobile App

Role

Art Director, Designer and Project Manager - Blndspt Consulting

Goal

Transform a non-compliant mobile experience into an inclusive, accessible product for Team USA fans.

Insights

• Updated Visual Design: The new interface uses Team USA’s bold red, white, and blue color scheme for a more patriotic and polished look.
• Improved UX: Navigation is clearer with a more prominent back button, categorized filters (Olympic vs. Paralympic), and sport icons for quick access.
• Enhanced Search: A streamlined search bar with contextual prompts helps users quickly find athletes or sports.
• Quick Links: Scrollable sport icons provide immediate entry points, reducing friction and enhancing discoverability.

.....................................................

The Team USA app—used by thousands of fans to follow Olympic athletes and events—was facing legal action for non-compliance with accessibility standards.

The core challenge was urgent and multifaceted: resolve accessibility gaps, enhance the user experience, and do so without disrupting existing fan engagement.

As Lead Designer and Project Manager, I drove the end-to-end redesign, managing timelines, cross-functional collaboration, and client communication, while ensuring we met both legal compliance and high UX standards.

This project showcases the redesign of the "Making Team USA" mobile experience, transforming an outdated layout into a modern, user-friendly interface. The original design featured a basic grid of athlete photos with limited functionality. Through an iterative process, we introduced a wireframe to explore structure and functionality, leading to a final design focused on usability and visual clarity.

This redesign significantly improves user engagement and accessibility, delivering a more intuitive and visually cohesive experience.

Team USA mobile app- showing 3 unique screens, the splash page, the athlete page and the articles page

Team USA Mobile Device

Description TBD

Color palette and type styles used on new app

Updated color palette and typography

These changes reflect type size and color contrast WCAG 2.1 accessibility compliance - which states that color should be at least 3:1 and type should be minimum 14pt/18px.

Wireframes - Header

Header Exploration, accounting for long athlete names, search bard, quick links and display views. Wires were handed off to engineering team in an agile working environment - this helped engineering and design work alongside each other and meet targets quickly.

Athlete Landing Page

Redesign of the Athlete Landing Page - with updated colors, improved layout, enhanced search, and quick sport filters for a cleaner, faster, and more intuitive user experience.

Athlete Landing Page - UPDATE

Showing both Tablet and mobile phone views - note addition of an ALL tab, this is the default view upon landing, for the first time putting olympic and paralympic athletes in the same list.

Athlete Detail Page

Redesign of the Athlete Detail Page - a substantial improvement in the visual appearance of the page, while keeping the underlying structure and content the same.

Image of Photo Gallery Landing page with list and grid view, and a centered image of photo gallery detail page.

Photo Gallery Page

Updated the Team USA photo galleries with an improved UI and dual display views—grid and list—to give users more control over how they browse content. Enhanced photo presentation and clearer navigation create a more engaging and accessible visual experience.

Images of original recipe page, wireframe and final design.

Team USA Recipes

Who doesnt want to eat like an olympic athlete! And this updated UI/UX helps you quickly see what to cook, how to cook it and be able to share with your friends.

Tablet and Phone view of sports landing page and open navigation on tablet.

Sports Landing Page & Navigation

Showing both Tablet and mobile phone views. This view also highlights the updated navigation with relevant iconography and bold categories.

.pro-gallery-wix-wrapper {display: block !important;} .pro-gallery-wix-wrapper .gallery-item-container {opacity: 1 !important; display: block !important;}