Vida
A screen for Catalan culture.
The brief
Ona Mediterrània wanted to launch Vida: a Catalan-language television platform with news and cultural content aimed at the Balearic Islands and the Països Catalans. Own productions, documentary series, archive material and a live channel. All on a site that would not feel like «a YouTube channel with a logo».
The brief was the whole thing: build it end to end and leave it ready to grow, from the website to the last line of code, with the door open to TV apps and deals with other platforms.
What we did
We designed the platform before the website. What counts as a programme, what counts as a special, what counts as a news item and what counts as the live feed; how they relate and what you see first when you arrive. That structure is what makes Vida feel like a TV channel and not a blog with videos.
We built the whole graphic identity from the logo. Everything grew out of the yellow heart that stands in for the V: a palette of purples with yellow as the only warm colour, Oswald for on-screen titles and Roboto for anything read at length, and the platform’s components: the white title tape, the programme card, the five-entry menu and a single button, VEURE. With that same logic we built the website from scratch on WordPress: programme pages, collections of specials, a live block and the archive, all arranged into one smooth, accessible experience.
We coded the parts that make it run on its own. News from dBalears comes in by syndication and publishes without anyone copying it by hand; the videos are hosted where they play best and the platform organises them. Publishing a new special takes minutes, not a developer.
And we left it ready for what comes next. The architecture is built for future TV apps and for deals with other platforms: the catalogue does not depend on the website — the website is only its first window.
A catalogue that assembles itself, with one colour per programme.
A small audiovisual platform cannot afford to maintain a player, a video CDN and a technical team. The key was not reinventing what already exists: the video lives where it is served best, and we built what actually makes Vida different — the catalogue, the brand and the way it tells things.
How it works inside
Vida is not a channel or a blog: it is a catalogue. Every piece has a record with its type (programme, special, news clip), its date and its collection, and the home page assembles itself from that. That is why the site now orders dozens of numbered specials without anyone touching the design.
Video is served from a video platform, not from the website’s own server. It sounds obvious and it is not: plenty of cultural projects die trying to host their own video. Here the server only delivers light pages, and playback, adaptive quality and the live stream are handled by whoever does it best.
News comes in by syndication from dBalears and publishes automatically. It is the least showy part of the project and the one that saves the most work every week: new content without an in-house newsroom.
From process to result · move your cursor
↔
2025 design
2026 redesign
How it went
Vida · editorial architecture
A website that knows what to explain and where to play it.
Vida organises programmes, episodes, live output and news as one experience. The technical decision was to separate that catalogue from the systems that deliver each type of content.
01 · One page, two jobs
The page explains. The player plays.
The same episode page holds the editorial context and opens an external player. Use the controls to separate those responsibilities.
The catalogue
Vida preserves the context.
The page connects programme, collection, episode and what comes next. That structure belongs to the platform and organises the archive without reducing it to a list of videos.
- Programme
- Episode
- Next item
Playback
Video is served outside the web server.
On play, the page hands control to the embedded player. The episode shown uses YouTube as its external player.
- Vida page
- External player
- Playback
Visible responsibility: The catalogue
02 · One navigation, three circuits
Not everything enters through the same door.
The interface brings together three distinct journeys as one experience.
On-demand catalogue
The page organises; the player plays.
Vida preserves the relationship between programme and episode. Playback remains on an external video platform.
- Vida catalogue
- Episode page
- External player
Live and radio
The place remains even when the output changes.
While Vida is off air, the Directe page offers Ona Mediterrània radio in the same place.
- Directe
- Vida off air
- Ona Mediterrània
Syndicated news
News arrives from dBalears.
News enters through syndication and Vida presents it through its own navigation and topic filters.
- dBalears
- Syndication
- Vida news
Visible circuit: Watch
Gallery · the project in pictures (click to enlarge)
The home page assembles itself.
Each piece joins its collection and the home page orders it: the featured special above the latest episodes. The editorial system makes publishing possible without taking the experience apart.
One colour per programme.
From the home page to an episode in four clicks. The recording shows the public website on 26 September 2026.
- Home
- Programes
- Especials
- Episode
Live, radio and news.
The live stream and Ona Mediterrània’s radio share one space; dBalears news joins the same architecture, while the Vida page explains who is behind it.
In your pocket.
The same schedule on a phone, with the five-entry bottom bar: Inici, Programes, Directe, Notícies and Cerca.
"TV, culture and the Països Catalans… all on a single platform."The project team
Want a result like this for your project?
