Rossel | Concevoir un écosystème de presse multimarque

01

Analyser un existant et en dégager une logique de système

Ma compétence : identifier les règles derrière les interfaces

Intervenir sur un design system existant demande de comprendre à la fois son organisation et la manière dont il est réellement utilisé.

J'ai analysé les maquettes, les composants et leurs déclinaisons pour identifier les valeurs communes, les différences nécessaires entre titres et les éléments à rationaliser.

Mon intervention consistait à déterminer quelles différences avaient une fonction, et comment les représenter dans le système.

Ce que cela démontre Ma capacité à comprendre un environnement complexe, à hiérarchiser l'information et à transformer un ensemble de choix graphiques en règles de conception cohérentes.

02

Concevoir une architecture multimarque

Ma compétence : choisir le bon niveau de mutualisation

Dans un écosystème multimarque, chaque différence doit être portée au bon endroit. Ces choix influencent la réutilisation et la maintenance des interfaces.

• Tokens
• Thème
• Variante de composant
• Configuration d'un bloc

J'ai travaillé sur les thèmes du Soir et de MAD, ainsi que sur les besoins de thématisation d'univers comme Bonsoir. Pour MAD, j'ai créé un thème distinct, qui gère quelques différences spécifiques tout en conservant les fondations partagées avec Le Soir.

Un autre cas concernait un bouton vert propre à un univers éditorial. J'ai identifié deux possibilités :

1. A

   Un thème

   Gérer cette couleur dans le thème de l'univers.

2. B

   Une variante

   Étendre les variantes du bouton.

J'ai porté cet arbitrage auprès des développeurs, afin de déterminer où cette différence devait être prise en charge.

J'ai également appliqué les tokens de La Libre à une Une construite à partir du template du Soir, pour examiner concrètement les possibilités de réutilisation.

Ce que cela démontre Ma capacité à concevoir pour plusieurs marques, à anticiper les conséquences d'un choix local et à préserver un équilibre entre cohérence et personnalisation.

03

Donner une signification fonctionnelle aux règles visuelles

Ma compétence : relier l'apparence au comportement

Je travaille les fondations graphiques en tenant compte de la fonction des éléments dans l'interface.

Sur les signatures d'auteurs, plusieurs compositions coexistent : nom cliquable ou non, fonction, et champ complémentaire provenant du CMS. J'ai connecté les variantes concernées à une règle sémantique commune :

J'ai également clarifié l'usage du champ complémentaire, pour lui appliquer le traitement correspondant à son comportement.

Cette approche exprime une intention, au-delà d'une valeur de couleur. Elle rend la règle compréhensible dans les différentes compositions du composant.

Ce que cela démontre Ma capacité à construire une cohérence fonctionnelle et visuelle, puis à la formaliser dans des règles réutilisables.

04

Maîtriser les dépendances entre composants

Ma compétence : anticiper les effets d'une modification

Les composants d'une interface sont imbriqués. Une modification sur un élément partagé peut donc affecter plusieurs contextes d'utilisation.

J'ai rencontré ce cas lors du travail sur le soulignement des titres au survol : certains titres reposaient sur un Text Block également utilisé dans les boutons.

J'ai identifié cette dépendance et explicité les contextes dans lesquels le soulignement devait s'appliquer. J'ai préparé les déclinaisons typographiques soulignées avec leurs tokens, et discuté avec les développeurs de la manière de transmettre cette règle.

Nous avons notamment confirmé qu'un exemple pouvait suffire si l'épaisseur du soulignement restait identique, avec une spécification commune dans le ticket.

Ce que cela démontre Ma compréhension de l'architecture des composants, ma capacité à anticiper les effets de propagation et mon attention à la précision des interactions.

05

Transformer une demande métier en décision de conception

Ma compétence : évaluer la portée d'un besoin

Une demande éditoriale peut sembler limitée à un détail visuel, tout en engageant le fonctionnement du système.

Le Soir souhaitait, par exemple, afficher des chapôs en taille MD dans un bloc « Layout 3 articles ». Cette possibilité n'était pas prévue dans sa configuration initiale. J'ai identifié les options disponibles :

1. A

   Modifier le Card Content

   Intervenir dans les pages concernées.

2. B

   Faire évoluer le bloc

   Ajouter une possibilité à la configuration du bloc.

L'échange avec les développeurs a conduit à traiter ce besoin comme une configuration du bloc, avec une valeur par défaut et une variation possible par éditeur. Mon intervention permettait de qualifier la demande avant sa traduction dans la maquette.

Ce que cela démontre Ma capacité à passer d'un besoin métier à une solution structurée, à évaluer sa portée et à construire l'arbitrage avec l'équipe technique.

06

Concevoir des interfaces éditoriales à plusieurs niveaux de lecture

Ma compétence : articuler hiérarchie visuelle et composition

Avec l'équipe design, j'ai contribué aux livraisons des Unes Signatures et de l'Article classique standard :

• Une standard
• Une bis
• Sport
• Économie
• Culture
• Article classique standard

Ces interfaces réunissent des contenus de nature et d'importance différentes. Leur conception demande d'articuler les tailles de titres, les formats de cards, les métadonnées, les images et les blocs éditoriaux.

Mon travail associait la composition des pages, l'application des thèmes et la vérification de la cohérence des composants dans leur contexte. Les templates permettaient aussi d'éprouver les règles du système : une variante utile isolément doit conserver son sens une fois intégrée à une page complète.

Ce que cela démontre Ma capacité à concevoir des interfaces riches en contenus, à organiser leur hiérarchie et à maintenir une cohérence entre les composants et l'expérience globale.

07

Penser le responsive comme un comportement

Ma compétence : expliquer comment l'interface s'adapte

J'ai travaillé sur la lecture des compositions entre mobile, tablette et desktop, et accompagné les développeurs dans leur interprétation.

J'ai notamment expliqué pourquoi deux compositions différentes sur grand écran pouvaient converger vers une présentation identique sur petit écran.

J'ai également participé à la clarification des règles de troncature des titres et des chapôs, dont la longueur influence l'alignement des cards et la hauteur des blocs. Cette démarche demande de considérer ensemble les contenus, la composition et les règles de comportement.

Ce que cela démontre Ma capacité à dépasser l'écran statique pour concevoir et expliciter les conditions d'adaptation d'une interface.

08

Prototyper pour rendre les décisions concrètes

Ma compétence : choisir une représentation adaptée à la question

Sur Replica, le kiosque numérique, j'ai réalisé un prototype mobile Le Soir avec ses tokens, et une simulation sur une page pour Sudinfo.

J'ai travaillé sur la présentation du journal, l'accès aux suppléments, la pastille indiquant leur nombre et les états liés au téléchargement.

Le prototype permettait de parcourir les écrans et de comparer les options de présentation des suppléments, notamment en grille ou en défilement. J'ai précisé les comportements simulés, indiqué où retrouver les trois états de téléchargement, et proposé une passation avec les développeurs pour expliquer les changements.

Ce que cela démontre Ma capacité à rendre un parcours tangible, à représenter ses états et à utiliser le prototype comme support de discussion Produit–Tech.

09

Intégrer les contraintes d'accès aux contenus

Ma compétence : traduire un besoin Produit dans une interface multimarque

J'ai conçu les déclinaisons d'un paywall natif de secours pour les pages articles.

À partir des contenus et des règles fournis côté Produit, j'ai travaillé une structure comprenant un message et deux actions : accéder à l'offre et se connecter.

J'ai préparé les déclinaisons avec les tokens du Soir et de La Voix du Nord, et vérifié les attentes concernant leur position dans les templates. Ce travail associait une structure partagée, des contenus adaptés et l'expression graphique de chaque titre.

Ce que cela démontre Ma capacité à intégrer une exigence Produit dans l'expérience de lecture et à la décliner avec cohérence entre plusieurs marques.

10

Assurer une transmission exploitable au développement

Ma compétence : relier intention de design et mise en œuvre

J'accompagne la livraison en clarifiant les composants, les variantes, les tokens et les comportements attendus. J'ai également préparé les exports JSON, et travaillé avec les développeurs sur leur compatibilité avec les scripts d'intégration.

Un cas concernait les typographies en gras italique du Soir : leur représentation dans Tokens Studio produisait une structure d'export différente de celle attendue. J'ai comparé les fichiers avec l'équipe et adapté les options d'export. Le développeur a ensuite confirmé pouvoir relancer la génération.

Cette collaboration demande de comprendre suffisamment les contraintes techniques pour identifier l'origine d'un écart et contribuer à sa résolution.

Ce que cela démontre Ma capacité à dialoguer avec les développeurs, à transmettre des règles précises et à accompagner leur mise en œuvre.

11

Donner de la visibilité sur le travail de conception

Ma compétence : rendre le périmètre et la charge compréhensibles

J'ai contribué à l'organisation du travail en préparant les éléments à valider, en identifiant leurs dépendances et en estimant les déclinaisons.

Pour les thèmes, j'ai distingué une adaptation principalement colorimétrique d'une adaptation comprenant également les typographies. Cette distinction permettait de construire une estimation selon les différences réelles entre les titres.

J'ai également préparé les validations sur des ensembles de plusieurs dizaines de blocs et de pages, en vérifiant la cohérence entre les composants et leur utilisation dans les templates.

Ce que cela démontre Ma capacité à organiser mon intervention, à expliquer les facteurs de charge et à donner aux interlocuteurs les informations nécessaires à la planification.

Mon apport dans cette mission

J'ai relié les décisions prises à l'échelle des fondations à leur application dans les composants, les pages et les parcours.

Cette continuité me permet d'intervenir aussi bien sur une règle de token que sur une composition éditoriale, un comportement interactif ou une question de transmission technique.

Mon expertise : concevoir des interfaces et des systèmes capables d'accueillir plusieurs identités, puis accompagner leur utilisation par les équipes qui construisent le produit.