Le site d’un réalisateur de films documentaires
Le réalisateur tourne des documentaires, courts et longs métrages. Son site devait faire voir ses films avant tout, puis donner les moyens de le contacter, en français comme en anglais.
- Livrable
- site en ligne, hébergement
- Rôle
- design du site, direction du développement, mise en ligne
- Ma part
- Je décide et je teste, Claude Code écrit le code.
- Client
- réalisateur de documentaires
- Équipe
- seul, avec Claude Code
- Durée
- 1 mois
- En ligne
- depuis octobre 2026
Contexte
Faire voir ses films avant tout
Comment donner envie de voir les films, puis de contacter leur réalisateur ?
Conception
Décisions
Le film d’abord
Le lecteur prend toute la place, à égale distance du nom et de la barre du bas.
À quai
Un geste vers le bas, ou le titre et sa flèche, pose la vidéo à gauche et ouvre le descriptif. Aucune position intermédiaire.
Deux films par rangée au plus
Pour ne jamais confondre deux projets. Au survol, la vidéo du film se lance dans sa case.
- Les films voisins, à la voix des titresLes noms du film précédent et du suivant prennent la police des titres. Au survol, leur affiche suit la souris en miniature ; un geste de côté change de film, un seul à la fois.
- Une seule action mise en avant« Voir le film complet », en blanc sur noir, juste sous le résumé.
- Le statut, rien d’autreDans la grille, chaque film ne dit que son titre et son statut : l’année, ou « En tournage ». Le reste est dans le descriptif.
- Le chargement s’ouvre sur le filmUn pourcentage suit le remplissage du trait. Puis le trait s’allonge à la largeur de la vidéo et une fenêtre s’ouvre à sa place : on arrive directement sur le film, sans fondu.
- Un générique de finLe pied de page se lit comme la fin d’un film : le nom, puis les rôles à gauche de l’axe et les noms à droite (contact, Instagram, site).
Bilan
Ce que j’en retiens
- La vidéo sur iPhone a ses règlesSon coupé, lecture dans la page, économie d’énergie : chaque garde-fou du lecteur répond à un problème constaté sur iPhone.
- Hiérarchiser sans rapetisserAucun texte sous 14 px : la hiérarchie passe par la graisse, le gris et l’espacement des lettres.
- Une seule policeUne police variable tient les trois voix du site : le texte, les chiffres et les titres d’affiche.