top of page
UX Case Study — Self-Initiated

SNS — Sports News & Scores

A real-time sports platform that puts the fan first — fast scores, personalised feeds, and zero noise.

ROLE

UI Designer

​

TIMELINE

4 Weeks

​

TOOLS

Figma, FigJam, Hotjar (simulated)

01 Overview

SNS is a mobile-first sports news and scores platform designed around a single insight: sports fans check scores constantly, but existing apps bury them behind ads, noise, and irrelevant content. SNS strips the experience back to what fans actually want — their teams, their scores, their news — personalized from the first tap and updated in real time.

Design Challenge

How might we deliver the sports information fans need in under 10 seconds — without ads, clutter, or irrelevant content disrupting their focus?

02 Research & Discovery
The Problem with Existing Apps

I audited 4 leading sports apps: ESPN, theScore, Yahoo Sports, and Bleacher Report. Common patterns observed:

  • Home screens prioritise advertising and editorial content over live scores — the primary use case.

  • Personalisation requires account creation and multi-step setup, creating friction before value is delivered.

  • Notification systems are overly aggressive — users reported disabling all notifications because they couldn't configure them precisely enough.

  • Dark mode was either missing or inconsistently implemented across screens.

User Research

I spoke with 6 self-described 'regular sports fans' (people who check scores at least 3 times per week). Key findings:

  • All 6 had a primary sport and 1–2 secondary sports they followed. None wanted to see all sports equally.

  • The most common check-in pattern: open app during a commercial break or commute, want to see score in under 5 seconds, close the app.

  • 3 participants described ESPN's app as 'a newspaper that happens to have scores in it' — a framing that directly informed SNS's 'scores first' hierarchy.

  • Live game experience was a separate use case from score-checking — users wanted deeper stats and play-by-play only when they were actively watching.

Derek, 26 — Software Developer and Raptors Season Ticket Holder
"I just want to know the score. I don't need a think-piece about the game — I watched it. And I definitely don't need a pop-up ad when I open the app at 11pm." Derek follows 3 sports seriously. He checks his phone during meetings, on the subway, and during halftime.
03 Define & Ideate
Design Principles

  • Scores are the hero — live and recent scores appear above the fold on the home screen at all times.

  • Fan-first personalisation — set up in under 60 seconds, no account required.

  • Zero algorithmic noise — users see their teams and leagues, not what an algorithm decides is trending.

  • Context-aware depth — minimal view for quick checks, expanded view for when fans are engaged.

Feature Prioritisation

Using a MoSCoW framework, I prioritised features for V1:

  • Must Have: Live scores, personalised team feed, push notifications with granular control (score updates, game start, final only).

  • Should Have: Article feed filtered to followed teams, standings, player stats.

  • Could Have: Live game play-by-play, game preview and prediction features.

  • Won't Have (V1): Social features, fantasy integration, video content.

04 Design Process
Onboarding Flow

Onboarding was designed as a 3-step visual selector: choose sport(s), choose team(s), choose notification preferences. No account creation required. The entire flow takes under 60 seconds and delivers immediate value — the personalised home screen — as the reward for completion.

Information Architecture

SNS uses a bottom navigation with 4 tabs: Scores (live + recent), News (team-filtered articles), Standings, and My Teams (manage followed teams and notifications). The Scores tab is the default landing point — the most common use case is never more than one tap away from launch.

Visual Design

The design system uses a near-black base with vibrant accent colours pulled from each followed team's brand identity — a technically complex but high-impact personalisation touch. Typography prioritises numerals (score sizes are large, high-contrast, and immediately readable). The overall aesthetic references sports broadcast graphics — bold, kinetic, and high-contrast.

05 Prototype & Testing

5

Participants

5

Tasks Tested

3

Iterations Made

Results

  • Onboarding: 5/5 completed in under 75 seconds. All described the experience as 'fast' or 'easy.'

  • Find score: 5/5 completed under 8 seconds. One participant noted they wanted to see the quarter/period alongside the score, not just the final number.

  • Notification settings: 4/5 completed. One participant couldn't find the settings — they looked in the app's main settings rather than the My Teams tab.

Iterations

  • Added quarter/period/time display alongside all live game scores.

  • Added a notification settings shortcut from the home screen team badge (long press) as a secondary access point.

  • Reduced onboarding from 4 steps to 3 by combining league and team selection into a single expandable screen.

06 Outcomes & Reflections

SNS's 'scores first' information architecture directly addresses the primary complaint about existing sports apps. If shipped, I hypothesise SNS would achieve a daily active user rate significantly above the sports app category average (typically 20–25%), driven by a habitual morning/evening score-check behaviour that the app is explicitly designed to support.

What I Would Explore Next

  • A live game mode with play-by-play and real-time stat updates — a distinctly different UX from the quick-check home screen.

  • Widgets for iOS and Android lock screens — the ultimate expression of 'scores in under 5 seconds.'

  • Accessibility testing with screen readers — sports apps rely heavily on colour and iconography, making WCAG compliance a real design challenge worth documenting.

bottom of page