Système de gestion des réseaux sociaux pour Toyota Motor Corporation « TOYOTA Social Hub » – Conception UI/UX et développement système

« TOYOTA Social Hub » : un système de gestion des réseaux sociaux à grande échelle, réalisé par un développement itératif par prototypage

« TOYOTA Social Hub » est une application web qui centralise la gestion des opérations de publication sur les réseaux sociaux officiels de Toyota, les relations presse et les newsletters, impliquant plusieurs départements, un secrétariat opérationnel et des approbateurs. Elle couvre l'ensemble du processus, de la saisie des demandes à l'envoi des contenus, aux tests de publication, à l'approbation, à la vérification après publication et à la mesure des résultats.

Une petite équipe de développement a multiplié les prototypes tout en validant les processus métier réels, afin de concevoir une interface permettant à plus de 200 parties prenantes (à la date du 21 août 2026) d'utiliser le système sans difficulté, malgré des circuits d'approbation complexes et les contraintes propres à chaque média.


Aperçu du projet

Dans ce projet dont Toyota Konic Pro Corporation assure la maîtrise d'ouvrage, Liberogic a pris en charge la conception UI/UX et le développement du système.

Le système gère sur une seule plateforme l'ensemble des workflows liés aux publications : saisie des projets, planification des publications, envoi des contenus, tests de publication, approbation en plusieurs étapes, vérification après publication, mesure des résultats et production des rapports.

Contexte et enjeux

Auparavant, les demandes de publication, les vérifications et les approbations pour les réseaux sociaux, les relations presse et les newsletters s'effectuaient par Excel, e-mail ou échanges verbaux, selon le canal.

Les e-mails se multipliaient entre les chargés de projet, le secrétariat et les approbateurs, rendant difficile le suivi de l'avancement des projets et engendrant de nombreux allers-retours pour les corrections et validations.

Chaque réseau social imposant ses propres règles de format, de nombre de caractères, d'images, de vidéos et d'horaires de publication, il fallait non seulement enregistrer les informations, mais aussi garantir une bonne compréhension des contraintes par média et de l'état des approbations. Nous avons donc comparé plusieurs solutions possibles, notamment l'utilisation d'un SaaS existant et une intégration par API avec un système de gestion de projets.

Architecture technique moderne

Le frontend repose sur Next.js et Cloudflare Workers, tandis que le backend, la base de données et l'authentification sont gérés avec Supabase.

En combinant des services managés et des technologies serverless, nous avons conçu une architecture qui ne nécessite pas une équipe de développement et d'exploitation surdimensionnée, et qui facilite l'ajout de fonctionnalités et l'évolution de l'exploitation à l'avenir.

Développement itératif par prototypage avec une petite équipe

Pour des systèmes métier comme TSH, figer l'ensemble des exigences dès le départ avant de développer peut engendrer des écrans et des opérations qui ne correspondent pas à l'usage réel.

Nous avons donc choisi une approche consistant à clarifier les flux de travail, à prototyper rapidement les écrans, puis à faire progresser le développement en multipliant les validations et ajustements avec les parties prenantes.

Plutôt que de mettre en place une grande équipe de développement, une petite équipe couvrant la conception, l'UI et l'implémentation a été mobilisée, afin de raccourcir les cycles de décision et d'amélioration.

Plutôt que de simplement reproduire les opérations existantes à l'écran,

  • Quels dossiers dois-je traiter en priorité actuellement ?
  • Quelle tâche dois-je effectuer ensuite ?
  • qui attend l'approbation de qui
  • quel travail est terminé pour quel média

etc. Nous avons conçu une structure permettant à l'utilisateur de tout saisir d'un coup d'œil.

Gérer plusieurs rôles et médias dans une seule interface UI

Dans TSH, des utilisateurs aux rôles différents utilisent le même système : demandeurs de publication, secrétariat externe, secrétariat d'exploitation, rédacteur en chef, etc.

Chacun ayant besoin d'informations et de droits d'accès différents, nous avons conçu un système qui adapte l'affichage et les actions disponibles selon le rôle.

Par ailleurs, la solution prend en charge les contraintes et champs de saisie propres à chaque média, tout en permettant de les gérer de façon transversale : X, Facebook, Instagram, TikTok, LINE, PR, newsletter, etc.

Pour chaque projet,

réception des matériaux → test de mise en ligne → approbation du secrétariat → approbation du demandeur → approbation du rédacteur en chef → double vérification → publication → contrôle post-publication → saisie du rapport

cette progression est visualisée, permettant de vérifier, média par média, les tâches terminées ou en attente.

Approbations et remplacements de contenus flexibles, adaptés aux opérations sur le terrain

L'une des caractéristiques de TSH est son flux d'approbation utilisant des éléments provisoires.

Les vérifications et approbations peuvent commencer dès que les éléments définitifs ne sont pas encore prêts, en s'appuyant sur des éléments provisoires. Même si les éléments définitifs sont remplacés après leur finalisation, l'état d'approbation précédent est conservé. La production et l'approbation peuvent ainsi avancer en parallèle.

Dans les systèmes de workflow classiques, un remplacement après approbation peut nécessiter une nouvelle demande d'approbation. TSH a été conçu en partant du principe que les modifications et remplacements surviennent régulièrement dans les opérations réelles sur les réseaux sociaux. Sa structure permet de mettre à jour les contenus avec souplesse tout en conservant l'historique.

Visualisation de l'avancement et alertes

Le tableau de bord et l'écran de détail des projets affichent l'avancement de chaque projet par canal de diffusion.

Chaque étape, qu'il s'agisse de la remise des contenus, du test de mise en ligne, de l'approbation, de la double vérification, de la vérification après publication ou de la saisie du rapport, est visualisée afin de voir d'un coup d'œil où en est le projet.

Lorsque la saisie dépasse les règles d'un canal ou qu'une action est omise, une notification s'affiche à l'écran et est envoyée par e-mail.

Grâce à cela,

  • le suivi de l'état de ses projets devient simple pour chaque membre de l'équipe
  • Prévention des oublis lors de la remise des contenus et des validations
  • Réduction des allers-retours liés aux relectures et aux renvois
  • Réduction des malentendus entre les parties prenantes

.

Centralisation jusqu'à la mesure des performances après publication

Après publication, les résultats de diffusion des réseaux sociaux, des relations presse et de la newsletter peuvent être consultés directement dans TSH.

Pour chaque réseau social, la portée, les impressions et l'engagement sont consultables dans une vue d'ensemble comme dans le détail. Il est également possible de filtrer par nom de projet, date de publication, responsable ou catégorie, et d'exporter les données au format CSV.

Dans l'écran de détail des rapports, l'aperçu de la publication et ses résultats s'affichent simultanément. Les enseignements des actions menées peuvent ainsi alimenter les prochaines planifications et décisions de publication.

Résultats

Une base de travail utilisée par plus de 200 personnes

Depuis le lancement, plus de 200 personnes (au 21 août 2026) issues de plusieurs départements et de bureaux d'administration utilisent le système.

Des utilisateurs aux rôles et responsabilités différents partagent l'avancement des projets au sein d'un même système, ce qui a permis de regrouper dans un seul outil métier des informations et échanges auparavant dispersés.

La structure des écrans, alignée sur les flux de travail réels, et une interface UI qui facilite le suivi des tâches ont également reçu des retours très positifs de la part des équipes opérationnelles.

Les représentants de Toyota Konic Pro Co., Ltd. ont dirigé l'ensemble du projet et partagé activement les retours du terrain ainsi que leurs connaissances opérationnelles, qui ont été intégrés au développement tout au long du projet.

Ils ont également accueilli favorablement les approches innovantes, les nouvelles technologies et méthodes de développement, et créé un environnement permettant à l'équipe de développement d'expérimenter avec souplesse. Nous pensons que cette collaboration étroite et ce processus d'essais et d'ajustements successifs ont permis d'aboutir à un système convivial et à une exploitation fluide.

Responsable de projet
TOYOTA CONIQ Pro, Inc.
Responsable de projet
Toyota Konic Pro Takamoto / Oshima / Yuasa
Directeur technique en chef / Ingénieur en chef
Liberogic Otsuka
Directeur technique
Liberogic Ise
Ingénieur
Matsuzuka, Liberogic
Designer UI/UX
Nagahashi, Liberogic
Directeur
Shigeta, Liberogic
Chef de projet
Morimoto, Liberogic
Nom de l'entreprise et des services
Toyota Motor Corporation, TOYOTA Social Hub
URL
Non divulgué