Studio d'enregistrement · Site immersif + back-office + portail client · 2026

BLEU SABLE STUDIO

Vite 8
Express 5
SQLite / better-sqlite3
GSAP 3 · Lenis · Barba.js
Three.js r184

— Client
Bleu Sable Studio
— Année
2026
— Statut
Livré · bientôt en ligne
— Live
bleu-sable.studio

En collaboration avec HashClub

— Contexte

Un studio d'enregistrement, de mixage et de mastering (Paris) qui ne pouvait pas se contenter d'un site « template ». L'enjeu : une vitrine immersive à la hauteur de son exigence sonore — le « wow » dès la première seconde — doublée d'un espace pour suivre les projets clients.

Plateforme sur-mesure développée pour Bleu Sable Studio — enregistrement, mixage et mastering à Paris — réunissant trois interfaces sur un seul socle Node/Vite. Côté public, un site vitrine immersif piloté au scroll (GSAP, Lenis, transitions de pages Barba.js, séquences WebGL Three.js, curseur et loaders sur-mesure). Côté serveur, une API Express 5 adossée à une base SQLite : authentification JWT, rate-limiting, garde CSRF, uploads et notifications email SMTP. Le back-office pilote l'intégralité du site — réalisations (cover, audio, Spotify), textes, prestations, médiathèque — via un éditeur visuel en direct, et centralise les demandes entrantes. Un portail client par lien privé ajoute écoute en streaming, commentaires horodatés et échange de fichiers, avec journal d'activité côté studio.

— Résultats

01
Site vitrine + back-office + portail client réunis sur un seul socle Node / Vite / SQLite
02
Studio autonome : contenu, médias, réalisations et demandes pilotés sans développeur
03
Revue audio pro par projet : commentaires horodatés, échange de fichiers lourds et suivi d'activité

— Ce qui a été livré9 items

Site vitrine immersif : scroll-narratif GSAP + Lenis, transitions de pages Barba.js, séquences WebGL/Three.js, curseur custom et loaders animés — zéro layout générique
API maison Express 5 + base SQLite (better-sqlite3) : auth JWT (cookie httpOnly, SameSite strict, bcrypt), rate-limiting, garde CSRF same-origin, uploads multer, notifications email SMTP
Back-office — Réalisations : créer/éditer/supprimer un titre avec cover, piste audio et lien Spotify, réordonnancement par flèches (glisser dans l'aperçu)
Back-office — Éditeur visuel « Aperçu » : édition inline du texte du site dans un aperçu live (iframe), clic-pour-éditer chaque bloc, réordonnancement des sections et photos
Back-office — Médiathèque : téléversement drag-drop (images/audio), recherche, filtres, renommage, remplacement à chaud sans casser les références, suppression en lot
Back-office — Messagerie : réception des demandes du formulaire (pièce jointe audio + email SMTP), état lu/non-lu avec badges, réponse par mailto, suppression
Portail client par lien privé à jeton (sans compte) : écoute en streaming (requêtes Range), téléchargement tracé, dépôt de fichiers jusqu'à 200 Mo, fichiers stockés hors zone publique
Revue audio collaborative : commentaires horodatés à la seconde sur chaque piste, fils de discussion, statut résolu/rouvert, signalement des retours non lus côté studio
Suivi projet & journal d'activité : compteurs vues/écoutes/téléchargements/commentaires/dépôts, archivage, gestion des livrables studio jusqu'à 500 Mo