Site audité
tellmefilms.com
Société de production indépendante · films et séries documentaires.
Projet 02 · Refonte UX
Tell Me
Films.
Refonte d'un site de société de production audiovisuelle indépendante. Audit sur 12 critères, benchmark concurrentiel et architecture de l'information repensée pour 3 publics distincts.
12
critères audités
2
sites benchmarkés
3
personas définis
6
recommandations priorisées
3,1
→ 4,2 /5 score UX projeté
00 · Repères
EN 30
SECONDES.
Une société de production dont les preuves de qualité existent, mais restent invisibles. Ce que l'audit a mesuré, et ce que la refonte propose.
- Rôle
- UX Designer · cas d'étude
- Site audité
- tellmefilms.com · production documentaire indépendante
- Année
- Refonte 2026
- Livrables
- Audit 12 critères · benchmark 2 sites · 3 personas et parcours · arborescence · wireframes annotés · maquette haute fidélité · roadmap 3 phases
Le problème
Les preuves de qualité existent — 85 sélections en festivals, un catalogue riche — mais elles sont noyées dans une grille indifférenciée. Score UX 3,1/5.
Ce que j'ai fait
Un audit sur 12 critères, un benchmark face à un pair et à une référence, trois personas avec leurs parcours, une arborescence, des wireframes annotés et une maquette.
Le résultat
Six recommandations priorisées en trois phases, et un score projeté à 4,2/5 — critère par critère, pas en bloc.
01 · Le contexte
COMMENT VALORISER DES CONTENUS
ET FACILITER LEUR ACCÈS ?
Une maison de production installée, un catalogue reconnu, et un site qui accumule des frictions structurelles depuis plusieurs années.
Le projet n'est pas la vidéo : le projet est l'accès à la vidéo.
Tell Me Films est une société de production indépendante de films et séries documentaires, implantée en Nouvelle-Aquitaine, Normandie et Guadeloupe. Fondée en 2014 par Laurent Alary et Eric Jarno, la maison compte 20 productions, 85 sélections en festivals et 12 ans d'expérience.
Le site actuel (tellmefilms.com), construit sur Strikingly, accumule depuis plusieurs années des frictions structurelles : architecture floue, vignettes carrées qui tronquent les affiches cinéma, absence de mentions légales malgré une boutique active, contenu mal hiérarchisé. Les preuves de qualité existent — sélections festivals prestigieuses, catalogue riche — mais elles sont noyées dans une grille indifférenciée.
Cible de la mission
3 publics · 1 site
Programmateurs, acheteurs internationaux, grand public cinéphile.
Problème central
L'accès, pas la vidéo
Le projet n'est pas la vidéo — le projet est l'accès à la vidéo.
02 · Diagnostic
AUDIT ERGONOMIQUE
SUR 12 CRITÈRES.
Évaluation systématique de tellmefilms.com, méthode Bastien-Scapin enrichie. Chaque critère est noté de 1 à 5, avec un constat factuel et un niveau de priorité pour la refonte.
Un site fonctionnel mais bridé par quatre frictions hautes : tagline, légalité, guidage, architecture.
-
01 Architecture de l'information
2,5 / 5Page d'accueil = liste de tous les films sans hiérarchie. Aucune distinction entre films récents, en cours de diffusion, catalogue. Un film spécifique (Kim Novak's Vertigo) apparaît comme entrée de menu — rupture structurelle.
Priorité haute
-
02 Organisation visuelle
3,5 / 5Page pas surchargée, clusterisation respectée. La loi de Pareto est correctement appliquée — l'essentiel est mis en avant.
Priorité faible
-
03 Cohérence interne
3 / 5L'apprentissage interne est respecté avec les boutons. Manque d'effets au survol pour identifier la cliquabilité. La version mobile reste fidèle au desktop.
Priorité moyenne
-
04 Conventions externes
3,5 / 5Convention externe respectée avec une navigation standard et des visuels génériques, peu dépaysants pour l'utilisateur.
Priorité faible
-
05 Informations & tagline
1,5 / 5Pas de tagline, difficulté à comprendre l'activité du site et ce qu'il propose. On déduit du contenu qu'il s'agit d'audiovisuel, sans certitude.
Priorité haute
-
06 Compréhension du contenu
3 / 5Icônes pour les réseaux et la boutique, mais absentes pour le contenu. Langage tourné vers les professionnels et les personnes ayant une bonne culture cinéma — excluant pour le grand public.
Priorité moyenne
-
07 Guidage
4 / 5Absence de guidage, pas d'animation au survol (à part le curseur), pas d'appel à l'action. L'utilisateur est perdu dans l'exploration. Aucun lien interne pour fluidifier la navigation.
Priorité haute
-
08 Gestion des erreurs & légalité
1,5 / 5Aucune gestion d'erreur dans le formulaire, pas de mentions légales, pas de politique de confidentialité, pas de CGV — alors que la boutique permet des achats.
Priorité haute
-
09 Fluidité technique
4 / 5Site avec une vitesse de chargement correcte. On peut trouver ce que l'on cherche rapidement — à condition de savoir ce que l'on cherche.
Priorité faible
-
10 Liberté utilisateur
3 / 5Pas de cookies imposés, pas de page 404 dédiée (page builder par défaut). Quand un achat est sélectionné il est mémorisé. L'utilisateur n'est pas contraint à voir les vidéos.
Priorité moyenne
-
11 Accessibilité
4,5 / 5Site globalement accessible — couleurs respectant les contrastes, code propre, navigation clavier fonctionnelle. Quelques alt-text à enrichir.
Priorité faible
-
12 Satisfaction visuelle
3,5 / 5Site simple, pas de faute visuelle majeure, sauf pour les affiches des films. Le visuel n'est pas au goût du jour — il mériterait d'être actualisé pour gagner en élégance et en attractivité. Effet « site d'association sur thème préfait ».
Priorité moyenne
Score global · moyenne des 12 critères
3,1 / 5
Le site est fonctionnel mais bridé par 4 frictions hautes — informations et tagline (1,5), gestion des erreurs et légalité (1,5), guidage (noté 4 mais sans aucun appel à l'action) et architecture (2,5). Les contenus de qualité existent — sélections festivals, catalogue riche — ils ne sont simplement pas accessibles dans la lecture.
03 · Benchmark
CONFRONTATION À
2 RÉFÉRENCES DU SECTEUR.
Audit comparatif sur les mêmes 12 critères : Les Films d'ICI (pair direct, production documentaire française) et Participant Media (référence internationale — Citizen Four, Roma, Spotlight).
Tell Me Films double son pair direct, et reste à 1,4 point de la référence sectorielle.
Tell Me Films
3,1
/ 5 · site audité
Les Films d'ICI
1,5
/ 5 · pair direct
Participant Media
4,5
/ 5 · référence sectorielle
| Critère | Tell Me Films | Les Films d'ICI | Participant Media |
|---|---|---|---|
| Architecture de l'information | 2,5 | 3,5 | 4,5 |
| Organisation visuelle | 3,5 | 0,5 | 3 |
| Cohérence interne | 3 | 1 | 4,5 |
| Conventions externes | 3,5 | 2 | 4,5 |
| Informations & tagline | 1,5 | 2 | 5 |
| Compréhension du contenu | 3 | 1,5 | 4,5 |
| Guidage | 4 | 1,5 | 4 |
| Gestion des erreurs & légalité | 1,5 | 0 | 5 |
| Fluidité technique | 4 | 0 | 5 |
| Liberté utilisateur | 3 | 4 | 5 |
| Accessibilité | 4,5 | 1,5 | 4 |
| Satisfaction visuelle | 3,5 | 0,5 | 4,5 |
| SCORE GLOBAL | 3,1 | 1,5 | 4,5 |
01 · Marge de manœuvre
2,1 × son pair direct
3,1 contre 1,5 pour Les Films d'ICI. Tell Me Films est déjà au-dessus : la refonte n'a pas besoin de tout réinventer pour gagner des points faciles.
02 · Écart à combler
−1,4 sur la référence
3,1 contre 4,5 pour Participant Media. Un écart concret et atteignable : c'est la cible de la refonte, projetée à 4,2/5.
03 · Zones de rattrapage
Tagline, légalité, visuel
Participant excelle sur ces trois critères — 5/5 chacun. Ce sont eux qui guideront les recommandations prioritaires.
04 · Cibles utilisateurs
3 PUBLICS DISTINCTS,
1 MÊME SITE.
Trois publics, des objectifs très différents — et une seule frustration commune : l'absence de hiérarchie temporelle.
Qu'est-ce qui est récent ? en salle ? en catalogue ? Sur le site actuel, impossible de répondre vite. Tout part de là.
Camille, 38 ans
Programmatrice de festival
Contexte
Prépare la sélection officielle d'un festival de documentaire régional. Découvre plus de 200 films par an.
Objectif sur TMF
Savoir en 30 secondes si TMF a un film récent qui correspond à sa ligne éditoriale, accéder à la bande annonce et au contact chargé festivals.
Frustration actuelle
Vignettes 200×200 indistinctes, pas de filtre par année, pas de contact direct festivals.
Marcus, 45 ans
Acheteur international · sales agent
Contexte
Représente un distributeur étranger, cherche des documentaires français à acheter pour son territoire.
Objectif sur TMF
Voir le catalogue exportable, les chiffres clés (durée, langue, sous-titres), récupérer le press kit.
Frustration actuelle
Aucune info technique sur les films, pas de zone Industry ou Press, site uniquement en français.
Léa, 27 ans
Cinéphile · abonnée Tënk et ARTE
Contexte
Suit l'actualité documentaire, lit Trois Couleurs, suit TMF sur Instagram.
Objectif sur TMF
Savoir quel est le film TMF du moment et comment le voir — salle, ARTE, Tënk, achat Vimeo on demand.
Frustration actuelle
Aucune section « À l'affiche », aucune mention de plateforme — il faut chercher film par film sur les VOD pour savoir où le voir.
Parcours sur le site actuel · 3 frictions communes
Ce que chacun des trois vit aujourd'hui, étape par étape, jusqu'à la sortie.
Camille · programmatrice
Trouver un film récent, sa bande annonce et un contact en moins de 90 secondes
01
Arrive par une recherche Google « tell me films documentaire 2025 ».
02 · Friction
La page est une grille de 30 vignettes carrées indistinctes. Aucun signal « récent ».
03 · Friction
Ouvre 4 fiches au hasard : 2 lignes de descriptif, pas de contexte festivals.
04 · Friction
Page Contact : un seul mail générique, pas de chargé festivals identifié.
05 · Sortie
Abandonne — cherche le film via une autre source.
Marcus · acheteur international
Bâtir une short-list de 5 films à demander en screener, en 5 minutes
01
Arrive sur une fiche film via le lien LinkedIn d'un confrère.
02 · Friction
Pas de durée, pas de langue, pas de sous-titres disponibles affichés.
03 · Friction
Cherche une zone « Industry » ou un press kit : n'existe pas.
04 · Sortie
Envoie un mail générique, attend, sans press kit téléchargeable.
Léa · cinéphile
Voir immédiatement les options de visionnage — salle, VOD, Vimeo
01
Arrive par la newsletter TMF.
02 · Friction
La homepage est une liste indistincte, aucun « à l'affiche ».
03 · Friction
Cherche « où voir le film » : aucune mention de plateforme ni de salle.
04 · Sortie
Renoncement — film perdu.
Insight transversal
Les 3 personas ont la même frustration finale : l'absence de hiérarchie temporelle du contenu. Aucun signal sur ce qui est récent, en salle, en catalogue ou disponible en VOD. La refonte propose un hero éditorial « À l'affiche » qui résout cette friction commune dès la homepage.
05 · Architecture de l'information
UNE ARBORESCENCE REPENSÉE
EN 5 ENTRÉES.
Cinq entrées cohérentes, trois niveaux au maximum, un fil d'Ariane sur toutes les pages internes, et un contact segmenté par usage.
Clarifier l'activité principale prime sur l'exhaustivité — c'est l'arbitrage central de la refonte.
Restructuration en 5 entrées de navigation cohérentes — Accueil · Films & Séries · Le 10ᵉ Art · News · Prendre Contact — avec 3 niveaux maximum, fil d'Ariane sur toutes les pages internes, et segmentation du contact par usage : festivals, ventes, presse, candidatures.
Niveau 1
5 entrées
Accueil · Films & Séries · 10ᵉ Art · News · Contact.
Pages templates
2 types
Page Réalisation et page Actualité.
Profondeur
3 niveaux
Au lieu de 4 à 5 dans la version actuelle.
Suppression
Kim Novak au menu
L'entrée de film individuelle est retirée du menu principal.
Le parti pris
Ce qu'on me demandait
Regrouper toutes les activités de la société dans une arborescence par thématique.
Ce que j'ai tranché
Une arborescence courte et standard : l'activité principale mise en avant, une page dédiée par activité, reliée depuis l'accueil et la page entreprise.
Pourquoi : tout mélanger noyait l'objectif du site — l'utilisateur ne savait plus ce que fait Tell Me Films ni ce qu'il présente. Clarifier l'activité principale prime sur l'exhaustivité.
06 · Wireframes annotés
HOMEPAGE ET FICHE FILM,
DESKTOP & MOBILE.
Wireframes basse fidélité avec annotations UX, desktop 1440 et mobile 375 côte à côte. Chaque annotation explicite un choix de design et son impact pour les trois personas.
Seize annotations au total : chacune relie une décision de structure à une friction nommée.
07 · Recommandations
6 RECOMMANDATIONS
PRIORISÉES.
Chaque recommandation suit la même structure : j'ai identifié que · j'ai fait le choix de · cela permet de.
Chaque décision est rattachée à un persona nommé et à une friction mesurée dans l'audit.
01 Restructurer l'architecture en 5 zones cohérentes
Architecture · Navigation
J'ai identifié que
Le menu mixe des catégories (Films, Vidéo Game) avec une entrée de film individuel (Kim Novak's Vertigo) — rupture structurelle. Les 3 publics sont noyés dans la même grille indifférenciée.
J'ai fait le choix de
5 entrées fixes (Accueil · Films & Séries · 10ᵉ Art · News · Prendre Contact), une sous-section « À l'affiche », et un Contact segmenté par usage.
Cela permet de
Camille trouve le chargé festivals en 1 clic, Marcus accède aux ventes internationales directement, Léa atterrit sur « À l'affiche » immédiatement.
02 Remplacer les vignettes 200×200 par des affiches 2:3
Hiérarchie visuelle · Cohérence graphique
J'ai identifié que
Les affiches cinéma sont conçues en portrait, au format 2:3 standard. Les vignettes carrées tronquent la composition graphique et lissent visuellement tout le catalogue.
J'ai fait le choix de
Une grille d'affiches au format portrait 2:3, un badge festival superposé en haut à droite, titre et réalisateur en surimpression au survol.
Cela permet de
Respecter la composition originale des affiches, rendre le signal festival immédiat, et distinguer les films primés au défilement.
03 Créer un hero éditorial « À l'affiche »
Appel à l'action · Hiérarchie · Contenu
J'ai identifié que
Aucun film n'est mis en avant sur la homepage actuelle. L'utilisateur ne sait pas quel film est récent, en salle ou disponible en VOD. Léa abandonne en 10 secondes.
J'ai fait le choix de
Un hero plein écran avec les productions phares, badge festival, titre, réalisateur, durée, et 2 appels à l'action : bande annonce et « où le voir ».
Cela permet de
Léa accède au film en salle ou en VOD en 1 clic, le hero raconte une histoire éditoriale, et le site n'est plus une grille muette.
04 Développer les fiches film avec synopsis et contexte
Contenu · Crédibilité
J'ai identifié que
Les fiches affichent 2 lignes de description, sans synopsis long, sans contexte de production, sans crédits techniques. Marcus ne peut pas faire de short-list, Camille ne peut pas évaluer la ligne éditoriale.
J'ai fait le choix de
Une fiche film en 9 sections : hero, synopsis enrichi, sélections festivals, plateformes de diffusion, achat VOD, crédits techniques, galerie, films similaires, pied de page.
Cela permet de
Marcus dispose des infos techniques en 30 secondes, Camille évalue la ligne éditoriale, Léa découvre les festivals d'un coup d'œil.
05 Ajouter une zone de crédibilité institutionnelle
Crédibilité · Conversion
J'ai identifié que
Les sélections festivals (Venise, IDFA, Deauville) sont noyées dans la fiche film. Pas de chiffres clés sur la homepage, alors que 12 ans, 20 productions et 85 sélections existent. La crédibilité ne se voit pas.
J'ai fait le choix de
3 chiffres clés visibles dès le hero (12 / 20 / 85), une citation signée d'Eric Jarno, une timeline de la maison et les 3 implantations affichées en pied de page.
Cela permet de
Marcus voit immédiatement la légitimité, Camille comprend le standing de la maison, et le site se positionne dans l'écosystème institutionnel.
06 Mettre en conformité légale et accessibilité de base
Légal · Accessibilité · SEO
J'ai identifié que
Pas de mentions légales, de CGV ni de politique de confidentialité, alors que des achats sont possibles via la boutique. Images sans texte alternatif significatif. Pas de page 404 dédiée.
J'ai fait le choix de
Le trio mentions légales / CGV / confidentialité, des textes alternatifs descriptifs sur toutes les images, une page 404 dédiée renvoyant aux 5 entrées, et un contraste WCAG AA minimum.
Cela permet de
Assurer la conformité RGPD et e-commerce, la lisibilité par les lecteurs d'écran, un meilleur référencement, et une expérience cohérente jusque dans les erreurs.
08 · Maquette finale
UNE DA SOBRE, ÉDITORIALE,
COMME UN PROGRAMME DE SALLE.
Pas un site « 2026 glassy ». Quelque chose qui respire le cinéma ancien, le papier d'affiche, le grain argentique.
Une seule couleur d'accent, et c'est exactement ce qui force à hiérarchiser.
Couleur de fond
#FAFAF7
Papier crème chaleureux. Évoque la matérialité du programme de salle et casse la froideur du blanc pur institutionnel.
Couleur d'encre
#0F0F0F
Noir non-pur. Moins agressif, plus lisible sur les longues lectures — synopsis et fiches film.
Accent unique
#E8460A
Couleur exacte du logo, et codes du cinéma d'auteur — ambre des projecteurs, affiches Capricci. Une seule couleur d'accent force à hiérarchiser.
Typographies
Inter + Cormorant Garamond
Inter extra-light pour les titres (modernité neutre), Cormorant italique pour les accents émotionnels — titres de films, années. Un duo qu'on retrouve dans les éditions de la Cinémathèque française.
09 · Roadmap
ROADMAP REFONTE
· 3 PHASES.
Les recommandations sont priorisées selon leur impact UX et leur complexité technique — du quick win d'une semaine au chantier de fond de trois mois.
Cinq corrections de la première phase ne demandent aucune refonte : elles tiennent en une semaine.
Quick wins
Semaine 1 · sans refonte
- Textes alternatifs des images — correction immédiate, impact SEO et accessibilité
- Retirer Kim Novak du menu — 5 minutes, rétablit la cohérence structurelle
- Page À propos — histoire, ligne éditoriale, chiffres
- Mentions légales — trio CGV / confidentialité / mentions, conformité RGPD
- Fiches film prioritaires — synopsis long et badges festivals sur les 4 films récents
Moyen terme
Semaines 2 à 6 · refonte structurelle
- Hero éditorial « À l'affiche » — film en avant et 2 appels à l'action
- Format d'affiches 2:3 — remplacement des vignettes carrées
- Bande de crédibilité — 3 chiffres clés en homepage
- Architecture à 5 entrées — restructuration du menu et des sous-sections
- Fiches film complètes — synopsis, crédits techniques, galerie, films similaires
- Pied de page segmenté — documents presse et 4 contacts différenciés
Long terme
Mois 2 à 3 · amélioration continue
- Filtres catalogue — genre, année, statut (en salle / catalogue / VOD)
- Bilingue français-anglais — indispensable pour les ventes internationales
- Migration CMS — sortir de Strikingly vers WordPress, pour le contrôle total
- Performance et chargement paresseux — optimisation du catalogue lourd
- Espace Industry / Press — press kits téléchargeables, screeners professionnels
- Newsletter — recapture éditoriale auprès des cinéphiles fidèles
10 · Auto-évaluation
AUTO-ÉVALUATION
HONNÊTE.
Recul critique sur la démarche : ce qui a marché, ce qui aurait pu être mieux, ce que je ferais différemment. Un projet UX se mesure aussi à ce qu'on apprend en le faisant.
Ce que je referais surtout : trancher plus fermement, quitte à refaire.
Ce qui a le mieux marché
Le choix des références s'est avéré déterminant : confronter Tell Me Films à Les Films d'ICI (pair direct) et Participant Media (référence sectorielle internationale) a donné une grille de lecture qui a tenu de bout en bout. La méthode des 12 critères ergonomiques a permis de noter sans tomber dans le ressenti subjectif, et l'écart 4,5 → 3,1 a chiffré ce que je pressentais.
J'ai aussi pris le temps de m'imprégner du domaine — production audiovisuelle indépendante, écosystème des festivals, distribution institutionnelle — avant de proposer des recommandations. La phrase qui a structuré tout le projet, « le projet n'est pas la vidéo, le projet est l'accès à la vidéo », est née de cette immersion, pas d'une checklist.
Ce qui aurait pu être mieux
J'aurais dû fixer une échéance plus claire, avec des objectifs intermédiaires datés. J'ai sous-estimé le temps nécessaire à la production complète — audit, benchmark, arborescence, wireframes, maquette, cas d'étude formalisé — et je n'ai pas livré l'intégralité du périmètre que je m'étais fixé au départ.
Une découpe en sprints courts, avec un point de validation chaque semaine, aurait évité ce dépassement et m'aurait obligé à livrer plus vite et itérer plutôt qu'à peaufiner en silence.
Ce que je ferais différemment
Plus de recherche du domaine en amont : passer une journée entière sur les sites de production audiovisuelle avant d'auditer, pour mieux saisir les conventions du secteur.
Travailler en relation continue avec le client, avec des points de validation chaque semaine plutôt qu'un livrable final. Ça évite les dérives et permet d'ajuster en cours de route.
Trancher mes décisions design plus fermement, quitte à refaire. J'ai trop écouté des envies parfois contradictoires et pas assez ma propre lecture de designer UX. Certains choix manquent de cohérence parce que je n'ai pas assumé une direction claire.
Ce que ce projet m'a appris
La gestion du temps sur un projet long, avec ses phases de doute et de relance. Comprendre quand arrêter l'audit pour passer à la conception, quand arrêter la conception pour passer à la maquette.
La patience d'itérer : refaire dix fois une petite modification jusqu'à ce que ça tombe juste, sans céder à l'envie de figer pour passer à autre chose.
Le monde de la production audiovisuelle : ses enjeux économiques (droits, ventes internationales, financement institutionnel), ses temporalités (festival → salle → VOD → catalogue) et ses publics multiples. Ce projet a fait mûrir mon process de designer UX.
11 · Score projeté
L'IMPACT DES RECOS,
CRITÈRE PAR CRITÈRE.
Projection des 6 recommandations sur les 12 critères audités. La barre montre le score visé, le repère clair marque le score actuel — et les deux chiffres sont écrits à côté.
3,1 → 4,2 sur 5, soit +1,1 — et les quatre frictions hautes portent l'essentiel du gain.
3,1 4,2
Score UX sur 5, avant → projeté
+1,1
Gain projeté sur la moyenne des 12 critères
4
Frictions hautes qui portent l'essentiel du gain
Moyenne recalculée sur les 12 critères : 4,2 / 5. Les 4 frictions hautes — légalité, tagline, architecture, guidage — portent l'essentiel du gain.
Crédits & droits
QUI A FAIT
QUOI.
Un cas d'étude n'a de valeur que si l'on sait ce qui revient à qui.
- Site audité
- Tell Me Films, société de production indépendante · Nouvelle-Aquitaine, Normandie, Guadeloupe
- Mon rôle
- Audit ergonomique, benchmark, personas et parcours, architecture de l'information, wireframes annotés, direction artistique et maquettes, roadmap
- Hors de mon périmètre
- Le développement et la mise en ligne — la refonte n'a pas été déployée
- Publication
- Cas d'étude réalisé à titre d'exercice de conception. Le nom, les contenus et les visuels de Tell Me Films appartiennent à la société et sont cités à titre d'illustration.