Tom & Lola
Le projet « Tom et Lola » a été conçu dans le cadre d’un exercice académique au sein du BUT Métiers du Multimédia et de l’Internet (MMI). Son objectif était de développer une campagne de communication digitale complète pour la série Tom et Lola, en combinant plusieurs disciplines : création d’un site web interactif, conception d’une identité visuelle, production de contenus multimédias, et mise en place d’une stratégie de communication sur les réseaux sociaux.
Ce projet s’inscrit dans une approche transmédia, exploitant le web, l’audiovisuel, l’interactivité et les réseaux sociaux afin d’immerger le public dans l’univers de la série avant son lancement. Il comprend notamment une visite virtuelle en 360°, une boutique interactive en 3D, ainsi qu’un dispositif numérique basé sur le storytelling.
Le projet Tom et Lola ne se limitait pas à une simple présence digitale : il visait à créer une véritable expérience engageante, pensée pour un public jeune (15-25 ans).
L’objectif était de casser les codes traditionnels de la promotion audiovisuelle en adoptant une approche transmédia et interactive, avec des contenus pensés pour capter l’attention et générer de l’engagement sur les plateformes les plus utilisées par cette tranche d’âge. Pour cela, plusieurs axes ont été développés :
- Une plateforme web offrant du contenu exclusif.
- Des expériences engageantes telles qu’une visite 360° des décors.
- Une identité visuelle, adaptée aux tendances graphiques actuelles et aux attentes des jeunes spectateurs.
- Une stratégie digitale disruptive sur les réseaux sociaux, conçue pour encourager l’interaction et l’appropriation de la série par le public.
L’enjeu était de proposer une communication dynamique et interactive, en rupture avec les formats promotionnels classiques, afin de capter l’attention d’un public habitué aux formats courts, aux expériences interactives et aux contenus engageants sur des plateformes comme Instagram, TikTok ou YouTube.
L’identité visuelle de Tom et Lola repose sur une direction artistique inspirée de l’ambiance méditerranéenne, avec une dominante de bleu profond et de jaune doré. Ces couleurs ne sont pas choisies au hasard : le bleu rappelle la mer et le ciel du sud, tandis que le jaune évoque la chaleur du soleil et l’énergie de la série. Ce contraste permet de créer une identité reconnaissable, en lien avec l’univers de la série.
Le travail sur l’identité visuelle a commencé par un moodboard, permettant d’orienter les choix esthétiques. Il s’appuie sur des références graphiques liées à la Provence. L’objectif était de trouver un équilibre entre tradition et innovation, en mêlant des éléments visuels chaleureux à un design épuré.
La charte graphique a été conçue pour assurer une cohérence sur l’ensemble des supports du projet. Elle définit : les couleurs dominantes, les typographies, et les déclinaisons visuelles.
L’objectif principal de la stratégie de communication autour de Tom et Lola était de générer du buzz avant la diffusion de la série. L’approche adoptée visait à impliquer le public dans un univers interactif et immersif, en intégrant des éléments inspirés des mécaniques de jeux alternatifs (ARG – Alternate Reality Game).
Le défi était de capter l’attention d’un public jeune (15-25 ans), ultra-connecté et friand d’expériences interactives, tout en proposant un contenu original et disruptif qui se démarque des promotions classiques de séries télévisées.
Concept de la campagne : l’ARG
L’ARG est un concept interactif mélangeant fiction et réalité, où les spectateurs deviennent acteurs en résolvant des énigmes et en interagissant avec du contenu numérique. Dans le cadre de Tom et Lola, cet ARG simulait un piratage informatique lié à l’enquête policière de la série. L’idée était d’amener les internautes à suivre une intrigue immersive à travers plusieurs canaux de communication.
L’ARG était structuré en plusieurs phases :
- Déclenchement de l’intrigue : Un message crypté posté sur les réseaux sociaux suggérait un piratage du compte officiel de la série.
- Montée en tension : Des vidéos énigmatiques et du contenu diffusé en temps réel engageaient les spectateurs dans l’histoire.
- Participation active : Des indices disséminés sur plusieurs plateformes poussaient les utilisateurs à mener leur propre enquête.
- Révélation finale : L’issue de l’ARG révélait une facette humoristique et décalée de l’intrigue.
Le site web de Tom et Lola a été conçu comme une plateforme de streaming, s’inspirant des codes des grandes plateformes comme Netflix et Disney+. Il vise à offrir aux visiteurs une expérience fluide, tout en présentant les informations essentielles sur la série.
Le site a été développé sous WordPress en utilisant un thème enfant personnalisé, permettant une personnalisation avancée sans dépendre exclusivement des plugins. Cette approche a permis de :
- Optimiser les performances et le temps de chargement en évitant une surcharge de plugins.
- Personnaliser les fonctionnalités spécifiques avec du CSS et du JavaScript.
- Assurer une évolutivité en facilitant la mise à jour et l’ajout de nouveaux contenus.
Intégration des différentes fonctionnalités
J’ai réalisé un montage behind-the-scenes de Tom et Lola qui a été intégré a site web. Le montage a été réalisé à l’aide d’Adobe Premiere Pro, en assemblant des rushs vidéo fournis par la production ainsi que des prises de vue capturées par d’autres étudiants ayant assisté aux tournages. L’objectif de ce montage était de proposer un aperçu des coulisses, en mettant en avant les moments clés du tournage et le travail des équipes techniques et artistiques. Une attention particulière a été portée au rythme, à la sélection des séquences et au travail de post-production.
L’un des éléments les plus immersifs du projet est la visite virtuelle interactive des décors de la série. Elle permet aux utilisateurs de se plonger dans l’univers de Tom et Lola en explorant les lieux clés du récit. Pour garantir un rendu immersif, des images haute définition en 360° ont été capturées à l’aide d’une caméra spécialisée.
La visite 360° a été ensuite intégrée au site via H5P, un outil permettant d’ajouter des interactions directement sur les panoramas :
- Points d’intérêt interactifs (explications sur les décors, détails sur les objets emblématiques).
- Navigation intuitive entre différentes pièces
Le site propose un quiz interactif qui met à l’épreuve les connaissances des utilisateurs sur la série et leur exploration du site. Les utilisateurs sont encouragés à partager leurs scores et résultats sur les réseaux sociaux avec le hashtag #TomEtLola, créant une interaction avec le public. En plus du quiz, un test de personnalité permet aux utilisateurs de découvrir quel personnage de « Tom et Lola » leur ressemble le plus. Un jeu de mémoire basé sur des images de la série complète cette section, où les utilisateurs doivent associer des paires d’images correspondantes.
L’une des fonctionnalités du projet est la boutique interactive en 3D, permettant aux utilisateurs de visualiser et personnaliser des objets dérivés avant leur achat. Dans le cadre de ce projet la fonctionnalité d’achat et d’ajout au panier était fictive. Le but de cet exercice était :
- La modélisation sous Blender.
- Optimisation des textures et des matériaux.
- La création d’une interface utilisateur pour la visionneuse 3D
- Ainsi que, le développement du visionneur à l’aide de PlayCanvas
Une fonctionnalité de personnalisation en temps réel a également a été intégrée. Cette personnalisation se fait grâce à des scripts JavaScript, interagissant directement avec les modèles 3D pour modifier les paramètres d’affichage sans rechargement de page.
Une attention particulière a été portée à l’expérience utilisateur (UX) et à l’optimisation responsive du site afin de garantir une navigation fluide et intuitive sur tous les appareils. Le design a été pensé pour être adaptatif, assurant une expérience homogène sur desktop, tablette et mobile, avec une interface claire et des accès directs aux sections essentielles grâce à une barre de menu optimisée. Un travail d’optimisation a également été réalisé sur le chargement des pages, en réduisant le poids des médias et en optimisant les scripts pour éviter toute latence. De nombreux tests ont été effectués sur différents navigateurs et appareils pour assurer une compatibilité maximale et éviter les problèmes d’affichage des contenus multimédias.
Cependant, en raison d’un contrat de confidentialité, le site web n’a pas été rendu accessible ni indexé sur les moteurs de recherche. Il n’est donc pas possible de le visiter actuellement. Néanmoins, je travaille sur une solution alternative, probablement sous la forme d’une vidéo commentée, afin de présenter l’interface et les fonctionnalités du site. En attendant, vous pouvez consulter les maquettes Figma du site web via le lien suivant :
Le projet Tom et Lola a été conçu comme une expérience interactive complète, mêlant communication digitale, développement web et production multimédia pour offrir une immersion dans l’univers de la série. Chaque élément, du site web à la stratégie de communication en passant par les fonctionnalités interactives, a été pensé pour engager le public et proposer une approche innovante adaptée aux usages numériques des 15-25 ans.
Pour en savoir plus sur les choix techniques, graphiques et stratégiques qui ont guidé ce projet, vous pouvez consulter le dossier de conception détaillé, accessible ci-dessous. Ce document regroupe l’ensemble des réflexions et des méthodologies mises en place, ainsi que des illustrations et captures du site et des différentes plateformes interactives.