Redesign
Scores Page
Redesigning the Scores Page to Reduce Platform Switching.
Team
1 Product Designer (me)
2 Product Managers
2 Developers
Focus
Information Architecture
Mobile Discoverability
Real-Time Data Visualization
Contraints
4 Week Timeline
Existing APIs only
Multi-sport supported
Overview
45.6% of users were leaving our platform to check scores on competitor apps.
I led the design from research synthesis through developer handoff, redesigning the Scores Page into a high density and real time feature reducing platform switching during live contests.
Goals & Success Metrics
1
Increase DAU through
deeper in app data
2
Improve discoverability
to the scores page
Mapping User Friction
I synthesized survey data into behavioral themes that explained when and why users left the app.
Key Insights:
Users want quick, at a glance information such as who’s pitching, who’s up to bat, or live team momentum (possession).
Accessibility and discoverability are foundational and must be addressed before improving utility.
Problem #1: Low Reachability Navigation
Previously, the Scores icon was located in the top header, the "dead zone" for modern mobile reachability. The icon used also lacked a standard look, appearing unintuitive to new users.
This combination of physical and mental friction resulted in a 9.0% discoverability failure, where users reported being unable to locate the feature entirely.
On the main home screen
✅ In the natural thumb-zone
✅ Labelled icon for clarity
❌ Only accessible through the homepage
❌ Lacks context under resources
In the main navigation bar
✅ In the natural thumb-zone
✅ Labelled icon for clarity
✅ Easily accessible throughout the app
❌ Takes up prime real estate
Internal User Testing
9/10 users preferred it in the main navigation bar.
100% liked the labelled icon
Due to time constraints both navigational experience variations were tested internally.
By optimizing for the mobile "Thumb Zone," I removed the physical barrier to entry. Labelling the icon, reduced confusion around the feature.
This repositioned Scores as a clear and always available utility rather than a secondary feature of our app.
Problem #2: Data Scarcity vs. Technical Constraints
The challenge wasn't what users wanted. It was delivering fantasy critical context without expanding backend scope.
Our game tiles lacked the "fantasy critical" context users needed (pitchers, possession, momentum). However, I had to work exclusively with existing internal APIs, avoiding a backend rewrite.
Market Alignment
I avoided mirroring competitor layouts, focusing instead on scannability under time pressure rather than visual parity.
Eliminating the need for users to switch platforms and dig for critical fantasy information.
Feature Prioritization
I conducted an affinity mapping exercise to synthesize survey data and identify high value 'fantasy critical' features.
I prioritized starting pitchers and possession as these were the strongest drivers of platform switching and could be supported by our existing APIs.
I explicitly deprioritized secondary stats that increased cognitive load without impacting live decision making. This allowed engineering effort to stay focussed on data that directly influences fantasy decisions.
Score Tile States
I created a flexible tile system that rearranged existing data points into a more "scannable" hierarchy.
Prioritizing Information: I identified which API data points (like current Pitchers and Batters for MLB) were most time sensitive and placed them in high contrast focal points on the main scores tile. Thus, reducing a click for users.
Responsive Flyouts: I redesigned the score modals to accommodate high information density across both desktop and mobile, ensuring the UI remained clean despite the increased data and decreased real estate.
[Old modal on the left - New Flyout format on the right]
Data Scarcity & Technical Pivots
During the design of the NBA flyouts, I identified a critical technical constraint.
Our existing API could not reliably provide real time starting lineups within the 4 week sprint window.
I made the call to remove the lineup feature entirely and re-architected the flyouts around Top Fantasy Performers to preserve data integrity and hit the release deadline.
The Logic: If we couldn't show who was about to play (Lineups), we would show who was highest projected to win the game for the user (Top Fantasy Performers).
The Result: This pivot allowed us to hit our release deadline with 100% data accuracy while still delivering high density, actionable insights that reduced user reliance on competitor apps.
Developer Hand-Off
State complexity was the primary implementation risk. I owned the component logic and state architecture, defining a comprehensive State Matrix.
Edge Case Coverage
Created a State Matrix, documenting 48+ unique edge cases across four sports to prevent UI breakage during live data fluctuations.
Developer Velocity
By defining the if/then logic for elements like "Overtime" indicators and "Possession" glows, I reduced engineering guesswork.
Sport Specific Logic
Explicitly mapped unique data requirements to ensure 1:1 parity with industry leaders like ESPN and theScore.
KPIs & Impact
Navigation Validation
All internal testers reported that the updated navigation felt more intuitive. Nine out of ten preferred persistent bottom navigation access over the previous header placement.
Improved Access to Live Data
By surfacing priority information such as starting pitchers, possession, and top fantasy performers directly on the score tiles, the redesign removed an additional click during time sensitive fantasy decisions.
Platform Switching Mitigation
Long term impact on daily active usage required post release measurement. However, early qualitative feedback indicated users felt less need to leave the app to check scores during live contests.
Engineering Impact
The documented state matrix and defined component logic reduced ambiguity during development. This supported smoother implementation across four sports and minimized UI breakage during live data fluctuations.
The Myth of "Less is More"
This project reinforced that in utility driven products, clarity comes from structured consistent density, not minimalism.
If I Had More Time…
Post Release Behavioral Measurement
I would introduce deeper behavioural tracking to measure changes in platform switching. This would include comparing session drop off during games, analyzing interaction patterns within score tiles, and tracking time spent in flyouts during contests.
Progressive Personalization
Based on user behavior, the tile hierarchy could dynamically adjust to emphasize the most relevant data points for each user. For example, MLB heavy users could see pitcher data prioritized more prominently.
Expanded Live Context
Additional lightweight indicators such as scoring runs or momentum shifts could provide richer context without expanding backend scope significantly.
Deeper Contest Integration
The Scores Page could integrate more tightly with active fantasy entries, allowing users to move directly from live game data to their relevant picks without additional navigation.