OneWeb - Portail client – Design

À noter : le texte de cette page décrit le projet que j’ai mené en entreprise. Les visuels, la démo et le fichier Figma présentés ici sont une refonte personnelle, conçue de zéro : produit, cible, contenus, identité visuelle et écrans sont fictifs et originaux. Ils ne reprennent ni les écrans, ni les contenus, ni les données du projet d’origine.

OneWeb est un portail client qui regroupe plusieurs services au même endroit : visibilité en ligne, services externalisés, constats et prise de rendez-vous en ligne.

L’objectif de la refonte était de transformer un ensemble d’outils dispersés en une expérience fluide et lisible, capable de montrer la valeur de chaque service à travers des tableaux de bord métiers.

La démo : une refonte personnelle

Pour montrer ma démarche sans exposer le projet d’origine, j’ai réimaginé OneWeb de zéro pour une autre cible : un cockpit pour créatifs indépendants. Architecture, user flows, design system, 126 écrans pensés mobile d’abord, accessibilité visée WCAG 2.2 AA et protocole de test : tout est consultable dans le prototype et le fichier Figma.

Côté clients, l’expérience était morcelée : plusieurs connexions, plusieurs interfaces, aucune vue d’ensemble claire. Côté produit, il était difficile de démontrer concrètement la valeur générée par chaque service.

• réduire la fragmentation entre les différentes applications
• faciliter l’accès aux actions récurrentes (contenu, stats, services)
• rendre les indicateurs clés visibles et compréhensibles

J’ai commencé par structurer la navigation autour d’un schéma clair : Application → Services → Produits → Détails. Cette hiérarchie a guidé les wireframes, puis les maquettes haute fidélité (desktop et mobile).

Les écrans ont été pensés pour accueillir des volumes de données importants sans perdre en lisibilité, en utilisant des blocs bien séparés, des dataviz simples et des actions rapides contextualisées.

Éléments clés :

• architecture d’information refondue de zéro
• écrans globaux + vues détaillées par service
• composants UI alignés avec le futur Design System OneWeb

OneWeb sert désormais de socle à l’écosystème de services et prépare le terrain pour des évolutions futures (nouveaux métiers, nouvelles offres, nouveaux modules).

Le travail réalisé a aussi permis de lancer la création du Design System OneWeb et de structurer la collaboration design → dev sur les projets OneWeb (voir OneWeb - Design-to-Code).

Impact :

• vision unifiée pour les clients et les équipes internes
• expérience mieux structurée autour des besoins métiers
• base de travail solide pour les projets OneWeb suivants

À noter : le texte de cette page décrit le projet que j’ai mené en entreprise. Les visuels, la démo et le fichier Figma présentés ici sont une refonte personnelle, conçue de zéro : produit, cible, contenus, identité visuelle et écrans sont fictifs et originaux. Ils ne reprennent ni les écrans, ni les contenus, ni les données du projet d’origine.

Conception d’un portail unique permettant de rassembler plusieurs services (site web, services externalisés, constats, prise de rendez-vous en ligne) dans une seule interface cohérente.

OneWeb offre aux clients un point d’entrée unifié avec une navigation claire et des tableaux de bord qui mettent en avant la valeur des services utilisés. Ce projet est étroitement lié au travail mené sur le Design System OneWeb et le projet OneWeb - Design-to-Code.

• centralisation de plusieurs applications en un portail unique
• navigation hiérarchisée (App → Services → Produits → Détails)
• mise en avant de statistiques métiers pour démontrer l’utilité des services

La démo : une refonte personnelle

Pour montrer ma démarche sans exposer le projet d’origine, j’ai réimaginé OneWeb de zéro pour une autre cible : un cockpit pour créatifs indépendants, qui réunit quatre applications en un seul produit. L’étude de cas couvre toute la démarche, de la recherche au prototype.

• architecture en entonnoir à quatre niveaux (app → espace → service → détail), identique partout
• user flows et wireframes, dont un écran par état pour l’enregistrement des mémos vocaux (micro bloqué, pause, échec d’envoi…)
• design system documenté : une fiche de comportement par composant (anatomie, états, accessibilité, contenu, responsive) pour le handoff dev
• 54 écrans mobiles et 72 écrans desktop, reliés dans des prototypes cliquables (7 parcours sur mobile), avec leurs états : erreur, vide, chargement, hors connexion
• accessibilité visée WCAG 2.2 AA : focus visible dessiné pour chaque composant, ordre de tabulation documenté, contrastes et tailles de cible audités sur les 126 écrans (aucun texte sous le seuil AA après corrections)
• protocole de test utilisateur en cinq tâches, vérifié par un test pilote (huit problèmes repérés et corrigés avant les sessions)

Les clients devaient jongler entre plusieurs outils distincts pour gérer leur visibilité en ligne, leurs services externalisés, leurs constats et leur prise de rendez-vous. Résultat : une expérience fragmentée et aucune vision claire de la valeur générée.

Enjeux majeurs :

• réunifier l’expérience en un seul portail lisible
• simplifier l’accès aux services récurrents et aux données clés
• rendre visible le retour sur investissement des services OneWeb grâce aux statistiques

Le travail UX a consisté à redéfinir l’architecture globale du portail autour d’une hiérarchie claire : Application → Services → Produits → Détails. Cette structure a permis de réduire la densité d’information sur chaque écran tout en gardant une vision globale accessible.

Une fois l’UX validée, l’UI a été déclinée sur desktop et mobile, en s’appuyant sur des composants réutilisables qui serviront de base au futur Design System OneWeb. Les écrans intègrent des dataviz simples mais explicites (courbes, barres, indicateurs clés) pour valoriser les performances.

Éléments clés :

• retravail complet de l’architecture de navigation
• découpage des écrans en vues globales, vues par service et vues détaillées
• intégration de statistiques métiers lisibles (volume, performance, évolution)

OneWeb apporte une entrée unique sur l’écosystème de services et clarifie le rôle de chaque outil via des tableaux de bord métiers. Même si le projet a été livré jusqu’aux maquettes et au support aux équipes de développement, l’objectif reste le même : rendre l’accès aux services plus fluide et rendre leur valeur plus visible.

Le portail sert aujourd’hui de base commune pour la suite des projets OneWeb, notamment le Design System et le projet OneWeb - Design-to-Code.

Impact attendu :

• réduction de la friction liée au passage d’un outil à l’autre
• meilleure compréhension de l’utilisation et de la performance des services
• base visuelle et structurelle pour l’extension du produit à d’autres métiers