Quand OpenSkyRadio est devenue Ulia.Radio, il ne suffisait pas de changer le logo. Il fallait un site à la hauteur de la nouvelle marque. J'ai donc repensé et développé toute la présence en ligne de la radio : le site, l'application, l'espace auditeur et le titrage en direct qui fait le lien entre l'antenne et tous ces supports.

Pour la partie visuelle (logos, couleurs, typographies), tout est détaillé dans l'article Rebranding de l'écosystème Ulia. Cet article parle de la suite, c'est-à-dire de tout ce qui a été construit une fois la charte validée.

Le contexte

D'OpenSkyRadio à Ulia.Radio

OpenSkyRadio est née en 2015 à Sacy-le-Grand, dans l'Oise. C'était une radio 100 % web, lancée par une bande de passionnés. Elle a beaucoup évolué en dix ans.

  • 2015 Lancement d'OpenSkyRadio, radio 100 % web.
  • 2019 Arrivée des émissions en direct.
  • 2020 Nouvelle identité visuelle.
  • 2024 Ouverture aux podcasts et aux vidéos.
  • 2025 OpenSkyRadio devient Ulia.Radio, avec la signature « Le Son de Toutes les Voix ».

Avec le nouveau nom, la radio a gardé sa musique (pop, rock, électro, dance) mais a donné plus de place aux émissions parlées, aux débats et aux créations des animateurs. L'ancien site n'était plus adapté. Il fallait passer d'un simple lecteur avec une grille des programmes à un vrai site média, avec des émissions, des podcasts, des vidéos et des actus.

10 ansd'histoire avant le changement de nom
10émissions à l'antenne
24/7de direct
4qualités d'écoute
Le site

Un site fait sur-mesure

J'ai développé le site entièrement en PHP, sans CMS. Une radio a des besoins particuliers. Le lecteur doit toujours fonctionner, les infos changent à chaque morceau, et les contenus audio et vidéo sont liés entre eux. En partant de zéro, j'ai pu construire exactement ce qu'il fallait, sans dépendre d'extensions ou de leurs mises à jour.

Le site est organisé en cinq rubriques.

  • Émissions, avec une page pour chaque programme.
  • Podcasts, pour réécouter les émissions, avec leur durée et leur description.
  • Vidéos, pour regarder les replays.
  • Musiques, qui garde la trace de tout ce qui passe à l'antenne (je détaille plus bas).
  • Actualités, pour suivre la vie de la radio et de l'équipe.

Sur la page d'accueil, le lecteur en direct est mis en avant. Un clic suffit pour écouter, et le titre en cours s'affiche avec sa pochette.

Le titrage

Le titrage en direct

C'est la partie qu'on ne voit pas, mais c'est elle qui fait tout tourner. À chaque nouveau morceau, les infos (artiste, titre, pochette, heure de passage) sont récupérées, complétées, puis mises à disposition par une API que j'ai développée. Le site, l'application et les autres pages vont tous chercher les données au même endroit. Tout le monde affiche donc la même chose au même moment.

L'antenneDiffusion 24/7
API de titrageTitre, artiste, pochette, heure
Le siteLecteur et titres diffusés
L'applicationDirect et titre en cours
Pages titresUne page par morceau
Espace auditeurTitres favoris
Toutes les données du direct viennent de la même source.

L'API alimente d'abord la rubrique « Titres diffusés », qui montre en temps réel les derniers morceaux passés avec leur heure. Elle sert aussi à autre chose. Chaque morceau diffusé a automatiquement sa propre page, avec :

  • l'album, sa date de sortie et la durée du titre
  • les heures où il est passé sur Ulia.Radio
  • des liens vers Deezer, Spotify, Apple Music et YouTube
  • le clip officiel
  • les autres titres du même artiste passés sur la radio
  • un bouton « J'aime » et un bouton pour partager

Plus la radio diffuse, plus la rubrique Musiques s'enrichit, sans que personne n'ait à créer ces pages. Et ce sont autant de pages que Google peut référencer.

Les services connectés

L'application et l'espace auditeur

Une application à installer (PWA) On installe le site sur son téléphone ou son ordinateur depuis le navigateur. Il s'ouvre ensuite comme une application, en plein écran et avec sa propre icône. Le même code sert pour le web, le mobile et l'ordinateur.
Un espace auditeur Chaque auditeur peut créer son compte, modifier son profil et retrouver ses favoris, par exemple les titres qu'il a aimés pendant l'écoute.

Pour une radio indépendante, la PWA a de gros avantages. Pas besoin de passer par les stores, pas de version à maintenir pour chaque système, et chaque amélioration du site arrive directement dans l'application.

La diffusion

Écouter partout

La page « Nous écouter » regroupe toutes les façons d'écouter le direct en dehors du site et de l'application. Le flux existe en quatre qualités, pour une connexion mobile limitée comme pour une chaîne hi-fi.

MP3 · 96 kbps MP3 · 128 kbps MP3 · 192 kbps Sans perte · qualité CD

Une playlist M3U à télécharger permet d'écouter la radio avec VLC, un lecteur réseau, une enceinte Wi-Fi ou un autoradio connecté.

Le bilan

Ce que ce projet m'a apporté

J'ai pu travailler sur toute la chaîne, de la charte graphique jusqu'au code qui relie l'antenne aux écrans des auditeurs. Aujourd'hui, l'identité Ulia.Radio est la même partout, et chaque support affiche les mêmes infos en même temps.

Écouter Ulia.Radio Toutes les façons d'écouter Lire l'article sur la charte
Retour à l'accueil