Conception écosystème digital web exemple

Spécificités de la mission Sécurite routière

Nous avons souhaité valoriser la mission de la Sécurite routière, afin d'illustrer une intervention de conception sur un projet complexe, divisée en 2 temps : un temps d'étude avec analyse et diagnostic permettant de déboucher en temps 2 sur des scenarios de conception et des nouvelles pistes d'architecture de l'information.

Les travaux ont été réalisés en 2011 - 2012.
Visualisez le projet IA Sécurité routière ainsi que les wireframes de la Sécurité routière.

A propos de Sécurite routière

L'entité de la Sécurité routière poursuit l'objectif fixé par les gouvernements successifs de sensibiliser et responsabiliser les différents publics aux "risques de la route". Les messages s'adressent à différents publics (de l'automobiliste jusqu'au piéton...) avec un objectif conatif et comportemental visant à faire évoluer les comportements des usagers du réseau.

Il s'agit également de faire comprendre à tous les usagers du réseau les spécificités propres à chaque catégorie pour améliorer la cohabitation des usagers (actifs et passifs) de la route...

Problématique digitale de Sécurite routière

La problématique digitale de la Sécurité routière, c'est le problème classique de l'écosystème digital fragmenté autour de petits objets digitaux, bref, le syndrome de la galaxie de sites non unifiée.

L'ensemble était organisé autour d'une quizaine de sites, sans organisation générale, sans possibilité de navigation transversale, le tout construit autour d'un site pivot type hub securite-routiere.gouv.fr beaucoup trop corporate par rapport aux cibles visées et ne jouant pas efficacement son rôle d'orientation.

Par ailleurs, la communication de la Sécurité Routière trouvait difficilement écho dans l'organisation digitale du dispositif en ligne qui ne permettait pas de relayer avec efficacité les messages des campagnes grand public.

Analyse diagnostic de l'existant

L'objectif était de mettre à plat l'organisation existante, pour visualiser le caractère fragmenté de l'ensemble et envisager des scenarii d'évolutions.

Plusieurs possibilités de réorientation se dessinaient et l'étude devait aider à réaliser des choix en matière de repositionnement de l'écosystème digital et d'architecture de l'information.

Pour procéder à la compréhension globale de l'écosystème digital de la Sécurité Routière, nous avons procédé par étape :

• 1. contextualisation et mise en perspective des enjeux du projet
• 2. cartographie globale de l'organisation et du maillage interne des sites existants
• 3. analyse détaillée de chacun des objets de l'écosystème
• 4. analyse des cibles et des réponses prévues par l'écoystème existant (pour identifier les manques)
• 5. diagnostic
• 6. axes d'optimisations et scenarii de refonte

Ce travail a été réalisé par l'architecte de l'information et consigné au sein de planches A3 dans un document très synthétique d'une dizaine de pages.

L'objectif était de permettre aux parties prenantes du projet de bien visualiser les syndromes de l'organisation existante pour identifier des voies d'optimisations.

Ci-après, quelques éléments extraits de la phase d'analyse du dispositif digital de la Sécurité routière.

Axes d'optimisation

Les résultats de l'étude sont présentés de façon visuelle et soulignent les principales carences du dispositif global :

• Plusieurs cibles ne sont pas adressées (aucun dispositif dédié, absence de guidage pour certaines catégories d'utilisateur, architecture de l'information confuse)
• Une très faible utilisation des réseaux sociaux par rapport au potentiel de partage
• Un traitement institutionnel des sujets (l'institution parle académiquement)
• Une utilisation marginale des contenus dits multimédias (animation, vidéo, etc.)
• Des parcours utilisateurs cloisonnés dans une galaxie de sites éclatée avec ouverture de chacun des sites dans de nouvelles fenêtres
• Un site pivot qui ne joue pas son rôle de hub puisque non efficace dans l'orientation des utilisateurs finaux
• etc.

En bref, et comme indiqué supra, tous les syndromes de l'écosystème digital labyrinthique...

Ces constats peuvent paraître évidents certes, encore fallait-il pouvoir les démontrer de façon "objective", raisons pour lesquelles il était important de projeter visuellement l'organisation existante des sites et leur manque d'inter-relation (problématique de maillage interne).

Plusieurs dispositifs très volumineux étaient en cohabitation (site corporate de l'institution, site institutionnel du permis de conduire, site adressé aux conducteurs de 2 roues, dispositif centré sur l'alcool, dispositif à destination des jeunes - SAM, etc.).

La question à trancher était donc de déterminer si cette stratégie de sites spécifiques était plus efficace qu'un dispositif unifié.

Compte tenu des enjeux et de la vocation de l'institution (partage d'un seul et même réseau routier par différentes catégories d'usagers), il paraissait pertinent d'explorer la voie d'un dispositif unifié et d'abandonner la logique de hub qui cloisonnait les discours ans des objets digitaux spécifiques.

Les axes de réorientation étaient ambitieux et visaient à remettre à plat l'ensemble, pour recomposer 1 seul site centralisant toute l'information (infos institutionnelles, infos académatiques du permis de conduire, infos pédagogiques) et la communication de la Sécurite routière (relais des campagnes, comportements...), y compris auprès des publics professionnels et BTOB (routiers, associations et partenaires...).

Nouvelle architecture de l'information

La nouvelle architecture de l'information du dispositif digital de la Sécurité Routière devait centraliser les contenus "autrefois" accessibles via 15 objets digitaux spécifiques.

Il s'agissait donc d'une mission périlleuse, d'une part, dans les difficultés liées à l'identification, l'extraction, l'organisation et la migration des thématiques clés, et d'autre part, dans le fait de faciliter l'accès à toutes ces briques de contenus aux utilisateurs finaux.

Le nouveau dispositif securite-routiere.gouv.fr a naturellement été segmenté autour d'une logique d'entrées par profils avec des espaces dédiés aux différentes catégories d'utilisateurs.

Pour atténuer la "clusterisation" du site autour des profils d'usagers (ce qui présentait le risque de cloisonner l'expérience), nous avons préconisé la mise en place d'un plan de taggage des contenus à grande échelle : chaque article devait être taggé par thématique, usager, typologie, de sorte à proposer un accès transversal aux contenus, accessibles à toutes les catégories d'usagers.

La cohabitation d'une organisation éditoriale hiérarchisée autour d'espace profilés combinée à une structure matricielle présentait l'avantage de couvrir différents types de parcours utilisateurs.

Au-delà des accès par profils et des accès par thématiques et tags, il s'agissait également de consacrer une chaine éditoriale à l'organisation (vocation instituionnelle incontournable pour un acteur directement lié au pouvoir executif couvrant une mission de service public) : la visibilité de cet accès a finalement été minorée dans les derniers moments de conception du projet pour privilégier d'autres éléments...

La stratégie éditoriale a parallèlement été combinée à la stratégie 2.0 en faisant converger les flux partagés par les utilisateurs dans les réseaux sociaux directement au sein du dispositif de la Sécurité routière (au sein d'un item dédié "parlons-en").

Enfin, les dimensions pédagogiques (dangers de la route) et "académiques" (permis de conduire, règles) ont bénéficié d'une forte visibilité par la création de 2 chaines editoriales complémentaires et dédiées.

Les planches ci-dessous sont présentées à titre d'illustration et sont à considérer comme des extraits de la démarche d'organisation des contenus : ces éléments reprennent une partie des travaux réalisés dans le cadre du réaménagement de l'architecture de l'information du dispositif.

L'architecture de l'information n'est pas une science exacte, les interlocuteurs du projet ont paralèllement besoin de "VISUALISER" les solutions, d'où l'importance de partager des supports facilitant la projection.

Interface du nouveau dispositif

L'interface met en scène un portail media, extrêmement dynamique et met l'accent sur les différentes clés de consultation du contenu : entrées par profil, exploration des thématiques par tags, chaines editoriales.
L'accès aux différentes thématiques se fait par "overlayer" et la navigation se fixe sur les codes les plus standards (colonne de gauche) compte tenu de la vocation très grand public du dispositif.

La fin du tout corporate

Le dispositif de la Sécurité routière a été un projet extremement dynamique sur les choix opérés en matière d'architecture de l'information, compte tenu du caractère "sensible" de la problématique et de la volonté des parties prenantes de positionner le dispositif en phase avec des actions de communication en pérpétuel renouvellement.
Néanmoins, la création du dispositif unifié a permis de centraliser l'ensemble des prises de paroles de la Sécurité routière sur internet, tout en ouvrant le dispositif à la dimension collaborative : l'appropriation recherchée a bien eu lieue comme le démontre les contributions des utilisateurs sur le site en ligne.

Les principales thématiques émergent aujourd'hui plus facilement, bien que l'utilisation d'over-layer surchargés posent quelques questions en matière d'ergonomie...

Bien que tout ne soit pas parfait, la conception de ce dispositif démontre le fait que de belles choses sont réalisables en matière de fusion d'objets digitaux ; les questions posées par les problématiques d'écosystèmes digitaux demeureut complexes, mais les solutions d'unification élégantes restent possibles.

Écrit par Julien Muckensturm

Approfondir l'architecture de l'information

Techniques utilisées :

• Analyse de datas
• Analyse stratégique
• Stratégie digitale
• Audit de site web
• Arborescence fonctionnelle
• Persona
• Cartographie stratégique
• Cartographie de site web
• Cartographie d'écosystème digital
• Stratégie éditoriale
• Segmentation des contenus
• Arborescence de site web
• Wireframing
• Conception web
• Conception responsive

Formation vidéo à visionner :

• Formation UX design en ligne

Livrables à télécharger :

• Kit ultime projet 150 modèles de livrables à télécharger
• Kit ultime conception 160 écrans de wireframes à télécharger
• Kit UX design 25 modèles à télécharger

Etudes de cas à lire :

• Etude de cas Gouvernement
• Etude de cas Renault
• Etude de cas Valeo

Travaux à visualiser :

• Wireframes
• Zoning
• Design de navigation
• Mind map
• Arborescence
• Cartographie
• Analyse de data

Compétences métier évoquées dans ce projet :

• Méthode et process
• Design stratégique
• Stratégie éditoriale
• Architecture de l'information
• Design de l'information

Autres ressources sur le web :

• Signalez nous des ressources sympas autour des thèmes abordés dans cette étude de cas UX design en utilisant les commentaires !