Find a show by how you want to feel, not by genre.
Seasons
- Role
- Product & UI Designer
- Client
- Seasons · TV-series tracker
- Year
- 2025
Design
- Figma
AI
- Midjourney
- ChatGPT
Seasons is a TV-series tracker built on one idea: people choose what to watch by mood, not by genre. So the catalogue is sorted into four seasonal vibes, each one bundling its own genres. I designed the full B2C web product in a friendly, glassmorphic style: the Discover home, a search that reads the whole catalogue, and series pages with ratings down to the individual episode. Every state and animation was prototyped in Figma, and the team shipped it from a blank file to a working SPA in about a week.
Why mood, not genre
I tested how people actually choose something to watch or play when they don't already know the title.
described what they wanted as a mood ('cozy', 'tense') before they ever named a genre.
time to a confident pick once the catalogue was sorted by feeling.
Pick by feeling, not by filter
Most catalogues make you name a genre before they show you anything, but that is rarely how people actually decide. You sit down knowing the *mood* you want, cozy and warm, or dark and tense, long before you would ever say the word "thriller." Seasons starts from that feeling. The whole library is sorted into four seasonal vibes, and each season quietly folds its own genres inside, so a beginner browses by mood while the genre logic still does its job underneath.
What Seasons actually is
It is a tracker, not a player. You do not watch here, you keep tabs: an overview of every show, a watchlist of what you have seen, search across the whole catalogue, and the ratings down to the single episode, shown next. A friendly B2C product, quick on the keyboard once you know it.
Down to the single episode
The series page is where the tracking lives: an overview, the episode strip, and a rating for every single episode, not just for the show as a whole.
The system
Black and white does the heavy lifting so the artwork stays loud, and one accent shifts with the active season. The wordmark plays along: the "o" is a play button that recolours to the chosen vibe, so the logo has four states (shown next).
Colour tokens
Four vibes, four moods
Instead of a genre dropdown, you pick a feeling. Each vibe folds its own genres inside, and the logo takes that vibe's colour, a small detail that makes the choice feel considered.
Dark. Cold. Unsettling.
Soft. Light. Romantic.
Energy. Adventure. Motion.
Calm. Deep. Mysterious.
The home: Discover
Discover is the front door. A featured series up top, rows you can scan, and the season selector always within reach so the whole page can shift its mood. Soft frosted panels, a black-and-white base, one accent that follows the active season.
Search the whole catalogue
Type a name, get live results with ratings, season and episode counts, air dates, and the genre tags each show carries. From the live build, where the data is real.
Same idea, in your pocket
The vibe concept carries straight to mobile. The seasonal ring becomes the first thing you meet: pick a mood, and the app handles the rest.
Where it started
Seasons grew out of an earlier, rougher cut called Smash.TV, a light-themed take on the same job. The redesign kept the goal, rate and track series, and gave it a real identity: a dark, glassmorphic skin and the seasonal-vibe idea that became the whole point.
I knew the mood I was in before I knew what to search. This is the first one that asked me that.
Decisions behind the build
Mood-first, genre underneath
Four seasonal vibes on top; each quietly maps to real genres, so the database logic still works underneath.
Trade-off: Edge titles fit two moods, so someone has to make the call and the mapping needs an owner.
Near-monochrome base
A calm dark shell lets the seasonal accent carry all the personality without fighting the artwork.
Trade-off: Little brand colour to lean on; the single accent has to do a lot of work.
Prototype every state and hotkey
The whole SPA was specced in Figma, shortcuts and motion included, so a one-week build matched the design exactly.
Trade-off: Heavy up-front spec time for a small feature surface.
seasonal moods, every genre mapped to one of them
from a blank file to a working SPA, built to the design spec
prototyped in Figma, including hotkeys and animations
What I learned
- 01
Sorting by mood instead of genre turned a database problem into a friendly one; the genres still exist, they just hide behind a feeling.
- 02
Prototyping every state and shortcut in Figma is what let a one-week build match the design exactly, with no guesswork left for engineering.
- 03
A near monochrome base made the system calm and let the seasonal accent carry all the personality without ever fighting the artwork.
- Product & UI
- Ivan Legchilov
- Style
- Glassmorphic web UI
- Client
- Seasons
- Year
- 2025