Mobile App · Product Design · UX Research

SoccerGOAT

Where Passion Meets Simplicity and Personalization — a soccer companion app and physical display device designed to bring North American fans closer to the beautiful game.

SG
SoccerGOAT

Mobile App + Physical Display Device

Live ScoresFan CommunityPersonalizationCross-Play Device

Role

UX Designer
Product Designer

Deliverables

Mobile App Design
Physical Device Design
UX Research

Tools

Figma · Blender
User Interviews · Surveys

01 — Background

The Problem

As a soccer fan living in North America, I experienced the challenges that hinder the sport's accessibility and enjoyment firsthand. Soccer trails far behind the NFL and NBA despite rapid growth — particularly among younger, diverse audiences under 45.

Fragmented Broadcasters

Soccer content is scattered across CBS, NBC, ESPN, Apple TV, and more — each requiring a separate subscription.

Lack of Soccer Culture

In the U.S., only 20% follow soccer vs. 52% NFL and 42% NBA — a huge gap in cultural engagement.

Complex Interfaces

Existing apps are cluttered with ads and unnecessary features, making it hard to find key match info quickly.

Missed Matches

Busy users miss games due to scheduling conflicts with no simple way to stay updated on the go.

Market Opportunity

1.75M

viewers for Messi's MLS debut — the most-watched MLS match in 20 years

795M

minutes watched of Ted Lasso S3 — entertainment broadening soccer's appeal

$5B+

projected economic impact from the 2026 FIFA World Cup in North America

02 — Research

Understanding the User

A survey of 98 respondents explored needs and frustrations with existing sports apps, alongside in-depth interviews to uncover deeper motivations.

98

Survey Respondents

73%

Have Used a Sports App

88%

Prefer Mobile Access

75%

Want Favorite Team Info

BS

Bella Stones

22 · Marketing Coordinator · Ann Arbor

“I would like to have easier access to soccer related news and knowledge!”

Pain Points

·Overwhelmed by complex apps

·Too much beginner friction

·Intrusive ads and pop-ups

RB

Rob Bowen

21 · CS Student · Washington, DC

“I would like to experience a better soccer app!”

Pain Points

·Misses matches due to busy schedule

·Cluttered apps with unnecessary features

·Hard to quickly find match info

03 — Design Process

From Chaos to Clarity

The design process began with affinity mapping and post-it sessions, evolving through information architecture, wireframes, and low-fidelity prototypes before reaching high-fidelity screens.

1

Affinity Mapping

2

Information Architecture

3

Wireframing

4

Hi-Fi Prototype

Key Features Designed

Personalization

Choose your favourite club, jersey number, and typography to make the app feel like yours.

Morning Newspaper

A daily digest of the latest soccer news, curated around the teams and leagues you care about.

Live Interaction

Post-game sentiment analysis and real-time fan community features keep the experience social.

Integrated Cross-Play

Seamlessly connects with the SoccerGOAT physical display device for in-stadium and at-home use.

One-Click Access

Home team logo shortcuts and a simplified menu bar reduce friction to near zero.

Loyalty & Pins

Earn loyalty rewards and collect pins as you engage, adding gamification to the fan experience.

04 — Physical Design

Beyond the Screen

SoccerGOAT extends beyond mobile — a physical display device designed from initial sketches through multiple 3D modeling iterations, built to sit on a soccer ball and deliver live scores and ratings in real-time.

Hardware

Live Display Device

A compact, soccer-ball-inspired physical device with an embedded display screen. Designed through sketch, foam model, and multiple Blender 3D iterations before reaching the final render.

Compact form factor fits on a soccer ball

Embedded display for live scores & ratings

Green + white + navy brand colorway

Connects wirelessly with the mobile app

Design Journey

Sketch → Model → Render

Concept Sketches

Initial hand-drawn explorations of form and function, exploring multiple silhouettes.

Foam Prototyping

Physical foam models to test scale, grip, and placement on a real soccer ball.

3D Modeling in Blender

Multiple mesh iterations refining the organic, tubular form wrapping around the display.

Final Render

High-fidelity 3D render with SoccerGOAT brand colors and materials.

05 — Final Design

The Result

A cohesive green-accented mobile app covering onboarding, home feed, live scores, standings, and the fan community — paired with a striking physical device.

SG

Create Account

SG

Home Feed

SG

Live Scores & Ratings

SG

Standings Table

SG

Customized Page

SG

Live Display Device

Thanks for reading

Want to see more work?

← Back to All Projects