OneWeb - Design-to-Code – Développement

À noter : le texte décrit le travail mené en entreprise. Le visuel de la vignette vient de ma refonte personnelle de OneWeb, conçue de zéro (voir OneWeb - Portail client) : il ne montre rien du projet d’origine.

Renfort front-end au sein de l’équipe de développement OneWeb pour accélérer le développement Angular et garantir l’alignement entre l’UI designée et l’implémentation finale.

Je prenais en charge la partie visuelle, les intégrations SCSS complexes, le responsive, et la vérification des PR pour éviter les régressions UI.

• intégrations Angular complexes
• mise en place des variables SCSS globales
• vérification systématique des PR front

L’équipe avait besoin d’un profil capable de fluidifier le delivery front-end, d’améliorer la qualité UI et d’éviter les retards causés par le manque de compétences CSS/Angular.

Objectifs :

• accélérer le delivery Angular
• fiabiliser l’intégration UI
• limiter les régressions en production

Mon travail consistait à transformer les maquettes en composants Angular fiables : gestion du DOM, états, navigation, responsive, animations légères et SCSS structuré.

• composants Angular modulaires alignés au Design System OneWeb
• architecture SCSS scalable (naming, tokens, layout)
• prévention d’effets de bord via revues PR

Le développement front-end est devenu plus fluide et plus cohérent. Les développeurs ont gagné du temps, la qualité UI a augmenté et les retours post-intégration ont diminué.

Impact concret :

• réduction des corrections UI
• meilleur alignement design ↔ code
• gain de vitesse pour l'équipe de développement

À noter : le texte décrit le travail mené en entreprise. Le visuel de la vignette vient de ma refonte personnelle de OneWeb, conçue de zéro (voir OneWeb - Portail client) : il ne montre rien du projet d’origine.

En complément du projet OneWeb - Design-to-Code, ce projet se concentre sur la partie développement front Angular/SCSS pour les fonctionnalités OneWeb.

L’idée était de servir de référent front, capable de transformer les maquettes en composants fiables tout en respectant le Design System OneWeb.

L’équipe avait besoin de solidifier la partie front sur des écrans riches en données, avec beaucoup d’états et de cas particuliers.

• garantir une intégration propre sur des écrans complexes
• éviter les écarts entre maquettes et rendu final
• garder un code SCSS maintenable malgré la richesse de l’UI

J’ai travaillé directement dans le code Angular/TypeScript pour construire les composants, brancher les données et appliquer les styles issus du Design System.

Les fichiers SCSS ont été organisés pour rester lisibles : séparation layout/composants, usage de variables globales et classes utilitaires lorsque nécessaire.

Le renfort front a permis d’améliorer la stabilité visuelle des écrans OneWeb et de réduire le temps passé en correction après mise en recette.

Impact :

• intégrations plus fiables sur les écrans complexes
• moins d’écarts entre maquettes et rendu final
• code front plus maintenable pour l’équipe