Match Highlights: a football highlights platform, designed and shipped solo

Problem

Football fans in this market don’t pay for a highlights subscription. They go to WhatsApp groups, YouTube search, and a chain of ad-heavy blog reuploads to find the goals from a match that finished an hour ago. The official clips exist (leagues and broadcasters post them to YouTube), but there’s no single, fast, spoiler-aware place to watch them.

Match Highlights is that place: a free site that pulls the official highlights for the seven major European leagues and the 2026 World Cup into one browse, sorted by competition and by team, with an AI assistant that will recap any fixture and hand you the video.

Evidence / research

The clips were never the problem; finding them was. Fans think in two ways, “what happened in the Premier League this weekend” and “show me my club”, and none of the places they looked supported both. YouTube search mixes official clips with reuploads and puts the score in the thumbnail, so the result is spoiled before you press play. That pointed the design at three things: a content model filed by competition and by team, a browse that doesn’t force the score on you, and official sources only.

My role

I was the sole designer and builder, responsible for research, information architecture, Figma UI design, the front-end implementation and deployment, including the AI match-assistant experience.

Constraints

Every screen had a build cost for one person. The product needed to work on mobile web, handle fixtures with no highlight yet, and support official video sources. The shipped implementation uses the YouTube Data API and OpenRouter.

Options considered

A single chronological feed would have been the simplest build, but it makes “just show me Arsenal” a scroll instead of a tap. A chatbot that only answers questions would have been easy to wire up, but it would leave you with a recap and nowhere to go, so the assistant always ends at the highlight itself. And a native app would have meant two store releases for one person to maintain; an installable PWA gives the home-screen icon and notifications without either.

Decision

Make league and team the core content model, keep scores optional in browsing, and give the assistant a concrete destination: the relevant highlight. Design loading, empty and unavailable-video states alongside the main experience.

Design

What I designed

• A competition-and-team content model: every clip is filed under its league and both clubs, so “just show me Arsenal” and “just show me the Champions League” are both one tap.
• A spoiler-aware browse: scores are available but never forced into a thumbnail you haven’t opted into, so you can scan the site before you’ve watched.
• The AI match assistant: ask “who won Madrid vs Inter?” and it returns a short recap plus a direct link to the highlight, instead of making you search.
• Team notifications: follow a club, get pinged when its highlights land.
• An installable PWA: “Add to home screen” so it opens like an app, no store needed.

matchhighlights.live

Collaboration / implementation

The whole thing is one person: research and IA, the full UI in Figma, then the front-end build and deploy.

Stack. I built the front end with Claude Code and deploy it on Netlify. Highlights come in through the official YouTube Data API, not a scraper, and the AI match assistant is wired through OpenRouter, so one integration reaches whichever model I want to run it on.

Measurement

I track three things: monthly users and sessions, where the traffic comes from (organic search against the WhatsApp, X and Facebook channels), and how often people use the match assistant rather than browsing.

Result

Live at matchhighlights.live, covering seven leagues plus the 2026 World Cup. It runs at 20,000+ monthly users and 30,000+ monthly sessions, with traffic split between Google organic search and the WhatsApp, X and Facebook channels linked on the site. The AI match assistant gets moderate use.

What I learned

Working across design and implementation changed the design: components were drawn to be cheap to build, states I’d normally hand off (loading, empty league, no highlight yet) got designed because I was the one who’d hit them, and the scope stayed honest because every screen had a build cost attached to it.