Tiffany Voix Off
Le site d'une comédienne voix off & narratrice
Site vitrine développé en freelance pour Tiffany, comédienne voix off et narratrice de livres audio. Un projet one-page, proche d'une formule essentielle : une seule page, quatre sections (accueil, démos, présentation, contact), pensée pour transformer un visiteur en prise de contact. Au cœur du site, un lecteur de démos audio entièrement sur mesure qui remplace les players embarqués type SoundCloud, un fond animé au canvas piloté au scroll, et un formulaire de contact connecté par email.
01 — Vue d'ensemble
Une voix, une identité, et un site one-page qui va droit au but.
Un site d'une seule page, pensé pour aller à l'essentiel. Le visiteur arrive, comprend en trois secondes qui est Tiffany et ce qu'elle propose, écoute une démo, et la contacte. Pas de menu qui se perd sur cinq pages : tout tient dans un parcours fluide qui se déroule au défilement.
Une direction artistique chaleureuse et feutrée. Ambiance de studio, typographie serif élégante, fond animé qui réagit au scroll, lumières douces : l'univers colle à celui d'une voix, à mi-chemin entre le livre audio et le spot publicitaire.
Un vrai lecteur de démos, pas un simple embed. Les livres audio d'un côté, les voix off (pub, télé) de l'autre, chacun avec sa pochette, sa catégorie et sa durée. On lance une écoute sans quitter la page, sans passer par SoundCloud ou Spotify.
Le site est en ligne sur tiffanyvoixoff.fr, n'hésitez pas à aller le visiter pour vous en faire votre propre idée.
Pilier n°1
Un one-page qui va droit au but
Une seule page, quatre sections enchaînées au défilement : accueil, démos, présentation, contact. Aucune navigation à rallonge, un parcours pensé pour mener naturellement à la prise de contact.
Pilier n°2
Un lecteur de démos audio sur mesure
Livres audio et voix off (pub, télé) présentés avec pochette, catégorie et durée. Lecture directe dans la page, sans embed SoundCloud ou Spotify, pour garder l'identité du site et la maîtrise de l'expérience.
Pilier n°3
Une direction artistique de studio
Ambiance feutrée, typographie serif, fond animé au canvas qui réagit au scroll, transitions douces. Un univers cohérent avec le métier de la voix, à mi-chemin entre le livre audio et le spot publicitaire.
Côté technique
Un lecteur de démos audio développé à la main
Plutôt que d'embarquer un player SoundCloud ou Spotify (qui casse l'identité visuelle et impose leur interface), j'ai construit un lecteur audio sur mesure. Il gère la lecture/pause d'une piste à la fois, l'état visuel de la piste active, les pochettes, catégories et durées, et sépare proprement livres audio et voix off. L'écoute se fait sans quitter la page ni recharger quoi que ce soit.
Un hero animé au canvas, piloté par le scroll
Le fond du hero est un canvas HTML qui dessine une onde audio animée en continu (requestAnimationFrame). Son intensité et ses couleurs réagissent à la progression du scroll via GSAP ScrollTrigger, pendant que le titre se révèle lettre par lettre. Le défilement est lissé avec Lenis pour un rendu doux et inertiel, cohérent avec l'ambiance feutrée du site.
02 —
Mes démos — un lecteur audio maison
La section démos rassemble les extraits de Tiffany, séparés en deux colonnes : les livres audio (roman, nouvelle, fantastique, jeunesse…) et les voix off (Prada, Banque Populaire, Top Chef…). Chaque piste affiche sa pochette, sa catégorie et sa durée, et se lance sans recharger la page. Un lecteur développé sur mesure plutôt qu'un player embarqué, pour rester dans l'univers du site.
Côté technique
Un formulaire de contact sans backend dédié
Le formulaire de contact envoie les messages directement dans la boîte pro de Tiffany via une Route Handler Next.js et Resend, sans serveur séparé à maintenir. L'envoi se fait depuis un domaine vérifié (contact@tiffanyvoixoff.fr) avec le mail du visiteur en reply-to, pour qu'elle puisse répondre en un clic.
Autonomie et souveraineté de la cliente
Le domaine, l'hébergement et le compte d'envoi d'emails sont ouverts au nom de Tiffany, pas au mien. Le site est une vitrine légère, rapide et sans dépendance à un CMS payant : elle possède l'ensemble de ses outils et reste libre de faire évoluer le projet.
03 —
Présentation & prise de contact
La section « Qui suis-je ? » raconte le parcours de Tiffany, ancienne professeure de français devenue narratrice, formée à la narration et à la voix off. Le tout se termine sur un formulaire de contact clair (nom, email, type de projet, message) connecté à sa boîte pro, avec les infos utiles à côté : email direct, zone d'intervention, délai de réponse.
Vous aimez ce type de site ?
Je crée des sites sur mesure pour artistes, indépendants et petites entreprises.
Identité visuelle, e-commerce, interface d'administration — chaque projet est pensé et codé de A à Z.
Projet suivant
BNP Paribas
Module e-learning IA générative