exclu mondiale :)
formation UX design !
53h de vidéo
60 études de cas
150 livrables - 160 wireframes
places limitées

étude de cas UX Total exploration

Conception de film interactif Total exploration.

Scenarisation de film numérique, architecture de l'information et design d'interaction d'une plateforme de vidéo interactive pour Total exploration production.

étude de cas UX Total exploration
note : ce projet a été piloté par DIGITAS (groupe Publicis), cadre dans lequel J.Muckensturm a assuré la conduite des missions en architecture de l'information.
écrit en 2010
et révisé en 2016 par
Julien Muckensturm
Architecte de l'information
icone linkedin
icone viadeo

La problématique digitale

Spécificités de la mission Total exploration

Nous avons souhaité vous présenter une partie des travaux réalisés pour Total exploration production afin d’illustrer la démarche de conception en matière de gestion des problématiques de contenu et de scénarisation de film interactif.

La mission a été réalisée en 2009.
Visualisez le projet UX Total exploration...


scenario animé

A propos de Total exploration

La branche exploration et production de Total représente la branche la plus importante du groupe en terme d’investissements avec 70% des capitaux investis, et fait parti des activités amont du groupe (exploration et production du pétrole brut et du gaz et activités exercées dans les domaines du gaz et des énergies nouvelles).

La communication de la branche exploration et production compte 4 familles de produits pour lesquelles sont réalisées de nombreuses plaquettes imprimées soignées :

  • la communication institutionnelle
  • la communication sur les filiales (segmentation géographique)
  • la communication sur les savoir-faire
  • la communication sur les grands projets

Total exploration et production souhaitait faire évoluer le contenu des brochures issues de la collection “savoir-faire” en mettant en perspective sa capacité d’innovation sur ses projets de recherche et développement.

Problématique digitale de Total exploration

Les brochures imprimées illustrant les savoir-faire de Total exploration et production devaient être refondues et adaptées pour une lecture digitale, afin de promouvoir la capacité d’innovation de l’enseigne, son expertise, ses références technologiques ainsi que ses outils…

Les contenus digitaux devaient être présentés au travers d’une logique de mini-sites, permettant de traiter chacune des problématiques propres à l’exploration production ; ainsi, chaque branche de l’activité exploration-production se devait d’être modélisé sur support digital :

  • l’offshore profond
  • les bruts extra-lourds
  • la valorisation des gaz
  • les gaz acides
  • la sismique

Au total, 5 brochures composées chacune d’une trentaine de pages très visuelles, se devaient d’être adaptées sur support digital et offrir des possibilités de portabilités sur support blu-ray et optimisé pour des bornes interactives

Les objectifs du projet consistaient notamment à :

  • mettre en perspective les « projets croissance » de Total qui nécessitent la définition et le franchissement de gaps technologiques permettant l’accès à de nouvelles ressources situées aux limites des technologies existantes
  • s’adresser dans une logique B2B aux cibles traditionnelles de Total (états, institutions, compagnies pétrolières partenaires, contracteurs, médias…) mais aussi à un public plus large, tel que le grand public intéressé par les savoir faire spectaculaires de Total et par une meilleure compréhension des enjeux stratégiques liés à la production de nouvelle ressources.
  • produire des contenus de qualité, s’appuyant sur différents formats : texte, animation, vidéo, infographie… rendant les contenus concret pour une information, une communication percutante et une meilleure compréhension.

Il s’agissait donc de concevoir des supports interactifs très visuels, dans une logique de vitrine des savoir-faire du groupe Total avec une démarche commerciale indirecte pour toile de fond…

couvertures de brochure total exploration-production
couvertures de brochure total exploration-production

page intérieure d’une brochure total exploration-production
page intérieure d’une brochure total exploration-production

page intérieure d’une brochure total exploration-production
page intérieure d’une brochure total exploration-production

Notre approche

Adaptation et rationalisation

5 brochures nécessitaient d’être transposées au travers d’un dispositif interactif dont la dimension principale visait à pouvoir être décliné sur différents supports :

  • mini-site internet centralisé autour d’un hub et rattaché à total.com
  • support indépendant blu-ray
  • borne interactive

Au-delà de la problématique de portabilité du dispositif, il s’agissait de concevoir 5 dispositifs intégrant des médias riches et audio-visuels (animations, vidéos, 3D…), ce qui posait dès le départ la question de la rationalisation de la production… le dispositif devait également intégrer les problématiques multilingues.

Pour répondre à la problématique de portabilité du dispositif, nous avons naturellement pensé à la technologie flash, au travers d’une trame auto-suffisante.

Concernant les enjeux de rationalisation, nous nous sommes orientés en direction de la conception d’un support master, sur la base duquel seraient déclinées les autres brochures

Il était donc important de concevoir un dispositif à la fois flexible et modulaire, pour traiter les différentes thématiques, mais également balisé autour de fondamentaux afin de cadrer la démarche autour d’éléments tangibles : nombre de chapitres, volume des contenus, durée des séquences audiovisuelles, possibilités d’interaction

un enjeu de portabilité
un enjeu de portabilité

nécessité d’une structure pérenne
nécessité d’une structure pérenne

Solutions de conception

Segmentation des contenus...

Dans un premier temps, nous avons matérialisé de façon imagée, les enjeux du dispositif et ses impacts en matière de conception, afin de fédérer les équipes autour d’une vision commune sur la façon de répondre à la problématique.

Il était indispensable d’adapter les contenus à une logique de consultation répondant aux spécificités de la lecture à l’écran

Par ailleurs, compte-tenu du fait que le dispositif devait être déployé sur internet, il convenait également de prévoir sa localisation dans la galaxie de sites Total et les différentes modalités d’accès.

Nous tenions à rappeler que le dispositif devait s’adresser à deux types de cibles différentes (experts vs. grand public) pour lesquelles il était nécessaire de prévoir des modalités de consultation spécifiques.

à propos de la lecture à l’écran vs lecture sur support digital
à propos de la lecture à l’écran vs lecture sur support digital

à propos de la lecture à l’écran vs lecture sur support digital
à propos de la lecture à l’écran vs lecture sur support digital

dispositif d’accès au site
dispositif d’accès au site

deux types de cibles
deux types de cibles

Séquençage des contenus

Pour baliser les problématiques éditoriales, il convenait de définir une trame commune à l’ensemble des brochures, malgré les différences de thématiques abordées par chacune d’elles.
Nous nous sommes donc immergés dans la lecture approfondie des brochures, pour essayer d’extraire une organisation méta en vue de structurer le fonctionnement du support master

Au final, en collaboration avec les équipes Total, nous nous sommes accordés autour du fait que 4 à 5 chapitres récurrents permettraient de traiter les thématiques de chacune des brochures… il s’agissait :

  • introduction
  • grands-projets
  • savoir-faire
  • défis
  • engagements et responsabilité

Chacun des chapitres faisant l’objet de mini-découpages spécifiques (interviews, infographie… permettant d’illustrer et développer le chapitre en question).

Sur la base d’une structure éditoriale pérenne, nous avons commencé à travailler sur une brochure en particulier (grands fonds), pour déboucher sur la rédaction d’un synopsis général visant la transposition des contenus en dispositif interactif… il prévoyait un fonctionnement comme suit :

  • jingle de présentation de la branche exploration production
  • choix de la langue
  • introduction vidéo
  • menu présentant les chapitres
  • en option : accès à une médiathèque
  • en option : accès à un lexique
  • lecture multimédia permettant d’activer un chapitre

Chacun des cinq chapitres comportait une voix off assurant la narration, soutenue par un déroulement vidéo ou animé à partir de visuels ; en complément de la séquence narrative, des modules éditoriaux pouvaient apparaître, et faire l’objet d’une consultation spécifique pour approfondir une thématique : la cinématique devait alors passée en mode pause…

A la fin de chacun des chapitres, le film interactif marquait une pause permettant à l’utilisateur d’accéder à tous les modules éditoriaux présentés dans la séquence animée…

Sans action de la part de l’utilisateur pendant les temps de pause, le film interactif se poursuivait et déroulait une séquence complète enchainant les cinq chapitres (le support pouvait donc fonctionner en lecture autonome).

définition d’une structure éditoriale
définition d’une structure éditoriale

approfondissement de la trame éditoriale et de la structure narrative
approfondissement de la trame éditoriale et de la structure narrative

synopsis du film interactif
synopsis du film interactif

trame du scénario : complément minutage
trame du scénario

trame du scénario : complément minutage
trame du scénario : complément minutage

structure détaillée du scénario
structure détaillée du scénario

découpage éditorial
découpage éditorial

Fonctionnalités

Sur la base du synopsis, les modalités de fonctionnement général du film interactif ont pu être matérialisés sous la forme d’une trame de scénario (scénarisation des contenus, temps des séquences, possibilités d’interaction).

Nous avons ensuite listé les fonctionnalités que devaient embarquer l’interface ainsi que les registres de médias à disposition sur la base desquels les conteneurs des modules éditoriaux ont pu être modélisés.

fonctionnalités
fonctionnalités

typologie des médias
typologie des médias

utilisation par type d’utilisateur
utilisation par type d’utilisateur

Scenarisation

Nous avions suffisamment d’éléments à disposition pour modéliser le zoning général de l’interface, en veillant à matérialiser deux modes de consultation pour les publics experts et grands public, et enfin définir les zones d’interaction : celles-ci devaient être grandes dans l’optique de l’adaptation du dispositif à une borne interactive et à des interactions tactiles.

Pour guider le travail de scénarisation du fonctionnement détaillé du film interactif, nous avons commencé par adapter le synopsis écrit sous forme d’enchainements d’écrans

Le travail de scénarisation a permis de modéliser l’intégralité du dispositif grands fonds, en esquissant les contenus audiovisuels à intégrer et en modélisant les écrans statiques permettant d’approfondir les informations (media-center, lexique, module éditoriaux permettant de visualiser une infographie, une animation 3D, de lire une interview ou un article simple…).

principes d’interface
principes d’interface

transposition du synopsis en écran
transposition du synopsis en écran

storyboard et scénario animé…
storyboard et scénario animé…

storyboard et scénario animé…
storyboard et scénario animé…

storyboard et scénario animé…
storyboard et scénario animé…

storyboard et scénario animé…
storyboard et scénario animé…

storyboard et scénario animé : fin de chapitre
storyboard et scénario animé : fin de chapitre

storyboard et scénario animé : média center
storyboard et scénario animé : média center

Inventaire

Enfin, nous avons relevé l’intégralité des écrans scénarisés au sein d’un inventaire fonctionnel et éditorial, afin de déterminer la structure finale du film interactif en vue de la rationalisation de la production et de la déclinaison des 4 autres brochures.

inventaire des composantes éditoriales et fonctionnelles
inventaire des composantes éditoriales et fonctionnelles

Résultats

Bilan de la mission réalisée pour Total exploration

Le produit final a été une véritable réussite, les équipes créatives ont su insuffler un vraie dimension esthétique au produit, et chacun des films interactifs réalisés proposaient une expérience de consultation riche, spectaculaire et véritablement immersive (grâce à l’utilisation de la vidéo et au recours à une interface liquide exploitant tout l’espace de l’écran).

Les équipes Total furent ravis du résultat, et nous aussi !

Cette mission illustre une façon de matérialiser le fonctionnement et le scénario d’un film interactif, ainsi que des techniques pragmatiques permettant de transposer une problématique éditoriale offline statique en dispositif interactif riche et animé.

Cette expérience est une référence intéressante pour tout projet impliquant des dimensions immersives et expérientielles, en matière de méthodologie et de conception.

Créa du dispositif Total exploration production
créa du dispositif Total exploration production

Vous appréciez notre approche ?

UX design avec IAFACTORY.

On s'occupe de tout ce qui se rattache à la conception et on vous propose des services UX sur-mesure, en fonction de votre projet.
Si vous souhaitez vous faire accompagner en phase de conception

A partir d'ici, les internautes lisent aussi ces cas

ETUDE DE CAS UX
Architecture de l'écosystème digital international de l'industriel somfy : marque, CRM, e-commerce.
etude cas ux somfy
ETUDE DE CAS UX
Test utilisateur et optimisation de l'expérience utilisateur de l'intranet monde du groupe Technip.
etude cas ux technip
ETUDE DE CAS UX
Architecture de l'information et design d'expérience utilisateur du site institutionnel multi-pays Valeo.
etude cas ux valeo

...

Si vous recherchez des modèles à télécharger pour vos cartographies
Si vous souhaitez améliorer vos compétences en conception
Si vous avez besoin d'un peu d'aide pour votre projet digital