Amand Witters RNCP36469

Actuellement en poste en tant que Lead Developer Frontend et Mobile, je me permets de vous adresser ma candidature dans le cadre d’une Validation des Acquis de l'Expérience (VAE) afin de valider un niveau de Master. Cette démarche s’inscrit dans une volonté d’officialiser et de renforcer mes compétences acquises au fil de mes années d’expérience professionnelle, ainsi que de répondre aux évolutions constantes du secteur technologique.

Avec plus de dix ans d'expérience dans le domaine du développement, j'ai eu l'opportunité de travailler sur des projets variés, allant de la datavisualisation (web) à l'intégration de technologies bluetooth low energy (mobile). Mon parcours professionnel m'a permis de développer une expertise pointue dans ces domaines, mais également de cultiver un sens aigu des responsabilités et une capacité à gérer des équipes de développement.

Depuis trois ans, j'occupe le poste de Lead Developer au sein d’Enlaps. Cette position m'a été confiée en reconnaissance de mon expertise technique et de mes qualités managériales. Au quotidien, je dirige une équipe de développeurs, planifie et coordonne les projets de développement frontend et mobile, et m'assure que les solutions mises en place répondent aux standards de qualité et de performance les plus élevés. Mon rôle implique également une veille technologique constante pour intégrer les innovations pertinentes et maintenir la compétitivité de l’entreprise.

Si mon entreprise actuelle a su me faire confiance en me promouvant à ce poste à responsabilités, je suis conscient que cette reconnaissance ne sera pas automatique ailleurs. C'est pourquoi je souhaite valider mon niveau de compétences par un diplôme reconnu, gage de crédibilité et d’excellence aux yeux des employeurs et des partenaires. Par ailleurs, l’obtention d’un niveau Master me permettra d’élargir mes horizons professionnels et de m’ouvrir à de nouvelles opportunités de carrière, tant en France qu’à l’international.

La rapidité avec laquelle les technologies évoluent, et notamment l’intelligence artificielle, m’a également fait prendre conscience de la nécessité de continuellement me former et de faire reconnaître officiellement mes compétences. L’IA, bien que prometteuse et porteuse de nombreux bénéfices, commence à réaliser certaines tâches de manière plus efficace que les développeurs humains. Je souhaite donc anticiper cette évolution en me dotant d’un bagage académique solide qui, couplé à mon expérience pratique, me permettra de rester pertinent et compétitif sur le marché de l’emploi.

Ma démarche de VAE s’appuie sur des expériences concrètes et des réalisations probantes. En datavisualisation, j’ai conçu et implémenté des tableaux de bord interactifs pour des entreprises de divers secteurs, facilitant ainsi la prise de décision basée sur les données. Dans le cadre du Bluetooth Low Energy, j’ai développé des solutions innovantes pour l’Internet des objets (IoT), améliorant la connectivité et l’autonomie des dispositifs. Ces projets ont non seulement renforcé mes compétences techniques, mais aussi aiguisé mon sens de l’analyse et de la résolution de problèmes complexes.

En outre, je m’efforce constamment de promouvoir une culture de l’innovation au sein de mon équipe, en encourageant la formation continue et le partage des connaissances. Je suis convaincu que l’apprentissage est un processus continu et que chaque défi professionnel est une opportunité d’acquérir de nouvelles compétences.

En conclusion, ma demande de VAE pour valider un niveau de Master est motivée par un désir profond de reconnaissance professionnelle et de développement personnel. Je suis déterminé à continuer à évoluer dans mon domaine et à contribuer de manière significative à l’avancement technologique. Je suis persuadé que cette démarche de VAE sera un atout majeur pour mon parcours professionnel et je suis prêt à m’investir pleinement dans ce processus.

Je vous remercie par avance pour l’attention portée à ma candidature et je reste à votre disposition pour tout complément d’information.

Parcours du candidat {#parcours-du-candidat}

Peuvent faire l’objet d’une demande de validation des acquis de l’expérience l’ensemble des activités salariées, non salariées ou bénévoles exercées de façon continue ou non, pendant une durée totale cumulée d’au moins un an en rapport avec le diplôme ou titre à finalité professionnelle ou le certificat de qualification pour lequel la demande est déposée.

Inscrivez dans le tableau ci-dessous votre parcours relatif aux compétences recquises pour l’obtention de votre VAE. Vous devrez signaler dans la colonne fiche, le code de la fiche dans laquelle vous décrivez l’organisation (O1, O2, ..), l’emploi (E1, E2, …) et les activités (A1, A2, A3 et A4) sachant que pour chacune des activités choisies, le jury devra disposer de la description de l’emploi correspondant et de l’organisation dans laquelle cette activité a été effectuée. Vous devez choisir de décrire au minimum quatre activités. Ainsi, ce peut être quatre activités choisies pour un même emploi ou jusqu’à quatre activités pour quatre emplois différents dans quatre organisations différentes (exemple ci-dessous : deux activités A1 et A2 dans un emploi E1, une activité A3 dans un autre emploi E2 et une activité A4 dans un autre emploi E3 , le tout dans deux organisations O1 et O2 ). La durée doit être exprimée en mois.

Commencez ci-dessous, en supprimant les exemples fournis.

ORGANISATION(S)			EMPLOI(S)			ACTIVITÉS		Comp.
RAISON SOCIALE	FICHE	DURÉE MOIS	DESIGNATION	FICHE	DUREE MOIS	INTITULÉ	FICHE
ENLAPS, 26 Av. Jean Kuntzmann, 38330 Montbonnot-Saint-Martin	O1	50	Lead Développeur	E1	50	Direction et coordination des développements pour l'application web myTikee et les applications mobiles Enlaps.	A1	C.1.2 Définir une stratégie technique C.1.3 Concevoir les architectures distribuées C.3.1 Définir l'architecture technique C.3.2 Définir les modes de communication C.4.1 Superviser le développement d'une application






						Gestion de projet, analyse des besoins fonctionnels, proposition de solutions techniques, découpage des tâches, planification et réalisation	A2	C.2.1.1 Définir les spécifications techniques C.2.1.2 Élaborer le cahier des charges C.2.2 Définir la méthodologie de gestion de projet






						Suivi des processus de développement et de CI/CD : merge requests, revues de code, tests unitaires / d’intégration / fonctionnels, déploiement, etc.	A3	C.5.1 Mettre en place et maintenir les plateformes de développement C.5.2.1 Mettre en place des outils de protection du logiciel C.5.3 Déployer un projet






						Veille et suivi des tendances et des avancées technologiques.	A4






						Rédaction de la documentation technique via readme et storybook.	A5	C.3.4 Mettre en place et documenter une architecture logicielle C.5.2.2 Concevoir et valider la documentation technique






WIZBII, 31 Rue Gustave Eiffel, 38000 Grenoble	O2	24	Développeur Web	E2	24	Développement de nouvelles fonctionnalités pour les plateformes et application de Wizbii.	A1
						Optimisation des performances de l'interface utilisateur en améliorant le chargement des pages (SSR / mise en cache).	A1
						Mise en place de CI/CD: tests unitaires / d’intégration / fonctionnels, déploiement, etc.	A3
						Conception et UX/UI : Compréhension des principes de base de la conception d'interface utilisateur et de l'expérience utilisateur. Capacité à traduire des maquettes de conception en code fonctionnel.	A6	C.4.2 Construire des interfaces homme-machine
						Veille et suivi des tendances et des avancées technologiques. (talks)	A4	C.1.1 Mener une veille
OXYGEN (ASTELIA), 5 QUAI JAYR, 69009 LYON 9EME + Auto-entreprenariat	O3	50+	Développeur Web	E3	50+	Intégration et mise en page de divers supports web avec une approche centrée sur l'esthétique et la fonctionnalité.	A6
						Utilisation avancée de scripting JavaScript via la régie Google AdWords, intégration de systèmes de gestion des enchères automatisé.	A1

Fiche Organisation n°O1: ENLAPS {#fiche-organisation-n°o1:-enlaps}

Raison Sociale (nom): ENLAPS

Date création: 01 / 02 / 2015 Cette organisation existe-t-elle encore ? oui x non ◻

Statut (société, artisan, association, etc): Société

Effectifs (nombre de personnes): 30

Volume d’activités (chiffre d’affaires, etc): 11m CA, rentabilité atteinte

Implantation (régionale, nationale, internationale): Internationale

Objet, activité(s) (vente services, production biens, etc):

Enlaps est une startup française fondée en 2015, spécialisée dans la création de solutions innovantes pour la réalisation de timelapse. Leur produit phare est la caméra Tikee, qui est autonome grâce à l'énergie solaire et connectée en 4G. Cette caméra est associée à la plateforme SaaS myTikee, permettant de capturer, analyser et partager des images en temps réel. La solution est très prisée dans les secteurs comme la construction, l'événementiel et la recherche, notamment pour le suivi de projets à distance.

Autres données quantitatives ou qualitatives (implantation, position concurrentielle, forme juridique, parts de marchés spécificités, etc) :

Enlaps a réussi une expansion internationale impressionnante, notamment à partir de 2020. L'entreprise a réalisé une croissance de 900 % en Allemagne, 400 % au Royaume-Uni et en Espagne, et a vu son chiffre d'affaires aux États-Unis multiplié par cinq.

Enlaps a ainsi basculé d'une part à l'exportation de 35 % au début de 2020 à 60 % en fin d'année. Cette internationalisation rapide démontre une forte demande pour les solutions d'Enlaps à l'échelle mondiale, notamment dans des secteurs comme la construction, le tourisme et les événements, où les besoins de suivi à distance et d'enregistrement visuel sont croissants.

Enlaps se distingue principalement par son offre unique combinant hardware (les caméras Tikee) et software (la plateforme myTikee). Sa solution complète de capture et de traitement d'images timelapse la place dans une position avantageuse par rapport à ses concurrents, qui se spécialisent souvent uniquement dans l'un ou l'autre aspect. L'intégration de technologies comme l'intelligence artificielle pour l'analyse et la création de contenu offre un avantage compétitif supplémentaire.

Le marché global du timelapse et de l'imagerie numérique reste concurrentiel, avec des entreprises proposant des solutions variées pour la production de vidéos et le suivi de projets. Cependant, Enlaps se positionne comme une solution haut de gamme, grâce à sa connectivité (WiFi/4G), son autonomie (solaire), et la qualité de ses images (résolution jusqu’à 6K). Ces aspects en font une option privilégiée pour des entreprises cherchant à capturer des contenus longue durée dans des environnements où les solutions classiques sont limitées.

Enlaps est enregistrée comme une société par actions simplifiée (SAS) en France, une forme juridique qui lui offre une flexibilité dans sa gestion tout en lui permettant d'attirer des investisseurs. Cette structure est couramment utilisée par les startups françaises, car elle facilite la levée de fonds et l'entrée de nouveaux actionnaires. Enlaps a bénéficié de levées de fonds successives pour soutenir son développement, notamment son expansion internationale et le développement de sa plateforme SaaS.

Les performances d’Enlaps dans plusieurs pays européens et aux États-Unis témoignent de la forte position dans le secteur de niche des caméras timelapse professionnelles. Sa technologie, particulièrement adaptée aux entreprises des secteurs de la construction, des infrastructures, et du tourisme, lui permet de capter une part de marché croissante dans ces domaines.

La majorité de ses clients sont des entreprises B2B dans les secteurs mentionnés, mais Enlaps cherche également à diversifier son public avec le lancement de produits et services plus accessibles au grand public, comme l’application #Time.

Cette stratégie d'élargissement de la clientèle pourrait renforcer encore sa position dans les années à venir, en lui permettant de capter une part plus large du marché des contenus visuels et de la comparaison temporelle.

Enlaps se différencie par son orientation technologique. Le recours à l'énergie solaire pour ses caméras et la connexion permanente via 4G/WiFi rendent les solutions d'Enlaps adaptées aux environnements isolés ou difficiles d'accès, tels que les chantiers de construction ou les parcs naturels. La capacité à capturer des images de haute qualité sur de longues périodes, couplée à une analyse basée sur des algorithmes d'intelligence artificielle, permet de générer des contenus visuels de grande valeur, que ce soit pour du marketing, du suivi de projet, ou des études scientifiques.

L’orientation future d'Enlaps semble tournée vers l'optimisation de son écosystème SaaS et l'amélioration continue de ses caméras. Sa capacité à adapter ses offres aux besoins spécifiques de secteurs variés (BTP, tourisme, médias) tout en s'internationalisant rapidement, augure une croissance continue. L'entreprise pourrait renforcer sa position en explorant d'autres marchés mondiaux, en développant davantage de solutions basées sur l'intelligence artificielle, et en capitalisant sur sa réputation croissante dans le domaine du timelapse.

Fiche Emploi n° E1: Lead Développeur {#fiche-emploi-n°-e1:-lead-développeur}

Reprenez la ou les expériences présenté(e)s dans le parcours en vous limitant, a priori, à 3 ou 4 expériences professionnelles.

Dénomination de votre emploi: Lead Développeur

Période: du 01/06/2020 au (toujours en poste)

Nombre de mois dans la fonction: 60+

Entreprise: ENLAPS

Temps plein

Vous étiez: Cadre

Vos fonctions, à ce poste, couvrent :

Plusieurs fonctions sont possibles, cochez celles qui vous correspondent

Encadrement et responsabilité hiérarchique x
Production x
Commerciale ◻
Marketing ◻
Administration ◻
Qualité x
Gestion de projet x
Gestion financière ◻
Conception et recherche x
Audit - Conseil ◻

Votre unité de travail:

Département technique, équipe de développement web, responsable de la création, du maintien, et de l'évolution des applications et plateformes SaaS.

Place de cette unité de travail dans l’organisation, activités, missions, composition et effectif

Le département Technique, occupe une place centrale en raison de la nature technologique de l’entreprise (⅔ des effectifs). Enlaps développe à la fois du matériel (les caméras Tikee) et des logiciels (plateforme SaaS myTikee), ce qui signifie que l'unité technique est essentielle à la conception, au développement, et à la maintenance de ses produits.

Développement et maintenance de la plateforme SaaS : myTikee, une solution en ligne qui permet aux utilisateurs de gérer, analyser, et partager des contenus timelapse. L’équipe est chargée de maintenir l’infrastructure backend et frontend, en intégrant des technologies modernes comme l’intelligence artificielle pour automatiser l’analyse des images et la génération de contenus.
Intégration hardware-software : assurer que les caméras Tikee, connectées via 4G/Wi-Fi, fonctionnent parfaitement avec la plateforme. Cela inclut la gestion des API et l'optimisation des flux de données entre les caméras et le cloud.
Innovation et R\&D : l’unité participe activement à la recherche et au développement de nouvelles fonctionnalités pour améliorer les performances des produits. Cela inclut des tâches comme l’amélioration de l’interface utilisateur (UX/UI), la scalabilité de l’infrastructure cloud, et l’introduction de nouvelles technologies.

L’unité technique peut être divisée en sous-équipes selon des compétences spécifiques :

Développeurs Backend et Frontend : les développeurs frontend se concentrent sur l’interface utilisateur et l’expérience utilisateur (UX/UI), tandis que les développeurs backend sont responsables de l’architecture serveur, de la gestion des bases de données, et de l'intégration des API.
Développeurs Mobile: les développeurs mobile se concentrent sur les apps mobiles et l’expérience utilisateur (UX/UI).
DevOps/Cloud : chargés de la gestion des infrastructures cloud (AWS, Google Cloud), de la mise en place des pipelines CI/CD, et de l’automatisation des déploiements. Ils assurent la scalabilité et la performance de la plateforme SaaS.
Data Scientists / IA : dans le cadre de l'optimisation des contenus timelapse et de l'analyse d'images, des ingénieurs spécialisés dans l’intelligence artificielle et les algorithmes de machine learning peuvent faire partie de l’unité.

Organisation interne de votre unité de travail

(organisation hiérarchique, répartition des rôles, modalités de fonctionnement interne, objectifs, budgets, effectif, fonctions des collaborateurs…)

Organisation hiérarchique:

En tant que Lead Dev Front-End et Mobile, je suis dans une structure intermédiaire, similaire à celle d'un Lead Dev Front, mais avec une responsabilité supplémentaire sur les développements mobiles. L'organisation hiérarchique est la suivante :

CTO (Chief Technical Officer) : je travaille sous la supervision du CTO (Benoit Farinotte), qui définit la stratégie technique globale.
Lead Dev Front-End et Mobile : je suis responsable de la stratégie technique et de la mise en œuvre des fonctionnalités pour les plateformes web et mobile. J’assure la gestion des développeurs front-end et mobile et travaille en étroite collaboration avec les équipes produit, design, et back-end.
Développeurs Front-End et Mobile : sous ma supervision, ces développeurs sont spécialisés dans leurs domaines respectifs (web ou mobile) pour implémenter les interfaces utilisateurs et les fonctionnalités…

Répartition des rôles:

Lead Dev Front-End et Mobile: je dirige à la fois les équipes front-end (développement web) et mobile, et je suis responsable de la cohérence technique entre ces deux plateformes.
Développeurs Front-End : ils se concentrent sur l’implémentation des interfaces utilisateur pour la plateforme web (myTikee) et travaillent principalement sur des technologies Typescript / Rust (via webassembly) HTML/CSS, et des frameworks front-end modernes comme React..
Développeurs Mobile : responsables du développement des applications mobiles, ils utilisent probablement des technologies cross-platform comme React Native ou Flutter, permettant de déployer des applications sur Android et iOS à partir d’un même code.
UX/UI Designers : ces designers travaillent avec moi et les équipes de développement pour garantir une cohérence et une fluidité entre les interfaces web et mobile, en prenant en compte les spécificités de chaque plateforme.

Modalités de fonctionnement interne:

L’équipe fonctionne en mode Agile (Scrum) pour permettre une flexibilité et une collaboration efficace entre les équipes front-end et mobile :

Sprints et backlog partagé : les tâches sont planifiées en sprints de 2 à 4 semaines, avec une priorisation claire entre les développements web et mobile en fonction des besoins. Je participe à la planification et à la priorisation des fonctionnalités sur les deux plateformes.
Daily stand-ups : j’organise des points quotidiens avec l'équipe pour évaluer l'avancement et résoudre rapidement les obstacles.
Revues de code : j’effectue des revues de code, à la fois pour les développeurs front-end et mobile, je m’assure que les meilleures pratiques sont respectées et que le code est maintenable et performant.
Tests et QA : je travaille en étroite collaboration avec les testeurs QA pour s’assurer que les fonctionnalités développées répondent aux exigences sur le web et mobile.

Quelle place occupez-vous dans cette unité de travail ?

En tant que Lead Dev Front-End / Mobile, j’occupe une position centrale qui requiert de gérer des équipes multiples, assurer la cohérence entre les plateformes web et mobile, et garantir la qualité et les performances des applications. J’ai un rôle clé dans la coordination des équipes techniques, la définition des priorités de développement, et la livraison de produits de qualité, tout en respectant les délais et les contraintes budgétaires.

Qui définit, contrôle et évalue vos activités ?

Benoit Farinotte, CTO, est ma référence principale en matière de définition, contrôle, et évaluation de mes activités techniques. Il définit la stratégie technologique globale de l’entreprise et oriente mes priorités en termes de technologies, d’architecture et de fonctionnalités à implémenter. Il évalue régulièrement mes performances en fonction des objectifs techniques et business de l’entreprise.

###

Votre position:

Présentez et commentez vos principales fonctions et/ou responsabilités. Si la nature de vos fonctions a évolué, expliquez les éléments marquants.

En tant que Lead Dev Front-End / Mobile chez Enlaps, mes responsabilités vont bien au-delà de celles que l'on pourrait attendre pour un poste similaire dans une entreprise plus grande. Enlaps est certes en croissance rapide, mais sa taille relativement petite implique que j'endosse un éventail de responsabilités variées et cruciales pour le développement de notre produit. Cette polyvalence, bien qu'exigeante, est particulièrement stimulante : chaque journée est différente et apporte son lot de défis. Bien que cela signifie parfois que je passe moins de temps à coder que dans mes précédents postes, je compense par une implication stratégique et technique de haut niveau, notamment en m'assurant que nos choix d'architecture et nos interfaces web et mobiles soient toujours alignés avec les attentes du marché.

En tant que responsable de l'architecture de la plateforme myTikee, je m’assure que notre application propose une expérience utilisateur fluide et rapide, et reste compatible avec tous les appareils. J’assure également l’intégration des services backend, permettant un échange de données optimal entre les différentes couches de l’application. Ce rôle requiert une veille technologique constante, ainsi qu'une capacité à anticiper les évolutions du marché.

Mon poste étant au croisement du management technique et de la stratégie produit, je travaille en collaboration étroite avec les chefs de produit pour garantir que les fonctionnalités développées répondent aux besoins des utilisateurs. Ce positionnement, à la frontière entre les équipes techniques et non techniques, fait de moi un facilitateur, traduisant les besoins business en spécifications techniques claires. L'exigence de ce rôle apporte une réelle satisfaction, car je joue un rôle actif dans l’évolution et le succès du produit – un équilibre entre stratégie, innovation et responsabilité qui rend mon travail captivant au quotidien.

Je suis persuadé que je n’aurais pas pu prétendre à ce poste chez Enlaps sans les deux années passées dans le milieu bancaire, où j’ai acquis une rigueur et une discipline exceptionnelles. Travailler dans le secteur bancaire m’a plongé dans un environnement où chaque détail compte et où la moindre erreur peut avoir des conséquences considérables. J’y ai appris à structurer mon travail avec une précision extrême, à être méthodique, et surtout, à adopter des pratiques de développement qui garantissent la fiabilité et la sécurité des applications, des qualités essentielles pour des projets où les marges d’erreur sont minimes. Cette expérience m’a apporté une maîtrise des processus de qualité, de documentation et de test que j’applique aujourd’hui avec la même exigence chez Enlaps, mais avec la flexibilité et l’agilité d’une entreprise en pleine croissance.

Cependant, si cette expérience bancaire m’a permis de développer une rigueur essentielle, le domaine de mon poste actuel chez Enlaps m’anime bien plus. La dimension créative et innovante de mon rôle ici, entre le développement d’interfaces modernes et l’optimisation de l’expérience utilisateur, me passionne réellement. Contrairement au cadre bancaire souvent plus figé, Enlaps me permet de travailler sur des projets qui nécessitent non seulement de l’expertise technique mais aussi une forte dose d’imagination et de réactivité pour anticiper les besoins des utilisateurs. Ici, je peux explorer de nouvelles technologies, tester des solutions plus audacieuses et travailler de manière collaborative avec des équipes aux profils variés. Cette liberté d’innovation, combinée à la responsabilité de mener des choix techniques structurants pour la plateforme myTikee, m’offre une satisfaction professionnelle bien plus grande et me donne le sentiment d’avoir un réel impact sur le produit final et sa qualité. En somme, si l’expérience bancaire a été une étape formatrice, le poste chez Enlaps m’apporte un épanouissement bien supérieur, où mes compétences techniques et mon goût pour l’innovation trouvent pleinement leur place.

Mes principales fonctions et responsabilités sont:

Leadership et gestion d'équipe:

La capacité à inspirer et motiver l’équipe est essentielle pour garantir que le projet progresse conformément aux délais et aux objectifs de qualité. Je dois également encourager la collaboration et résoudre les blocages techniques que les développeurs peuvent rencontrer. C’est une facette de mes fonctions qui m'a demandé le plus d’efforts.

Supervision des performances et de la qualité:

Je m’assure que les applications web et mobiles fonctionnent de manière optimale, que ce soit en termes de vitesse de chargement, de consommation de ressources (notamment sur mobile), ou de compatibilité multi-navigateurs et multi-appareils. L’objectif est de fournir des produits stables, performants, et répondant aux attentes des utilisateurs finaux.

Innovation et veille technologique:

Je suis responsable de rester informé des nouvelles tendances et technologies. J’intégre des innovations lorsque cela est pertinent pour améliorer les produits existants ou en créer de nouveaux.

Dans un environnement aussi dynamique qu’Enlaps, la capacité à identifier et adopter les bonnes innovations technologiques est un avantage concurrentiel majeur. Il est également important de savoir quand rester conservateur pour éviter des perturbations inutiles dans la production.

Vos Interlocuteurs

Identifiez vos interlocuteurs principaux (collaborateurs, supérieurs hiérarchiques ou fonctionnels, services internes, structures externes) et explicitez la nature et les modalités de vos relations.

Benoît Farinotte (CTO - Chief Technical Officer)

En tant que CTO, Benoît Farinotte est mon supérieur hiérarchique direct. Il définit la stratégie technologique globale de l'entreprise et oriente mes priorités. Je travaille en collaboration étroite avec lui pour valider les choix techniques, l'architecture des solutions, et les aspects stratégiques de l'implémentation front-end et mobile.

J’ai des réunions régulières (hebdomadaires) pour faire le point sur l’avancement des projets, discuter des problèmes techniques, et valider les priorités. Il s'agit d'une relation à la fois stratégique et opérationnelle.

Annabelle Meli (Responsable Marketing et Produit)

Annabelle Meli est chargée de la gestion produit et du marketing. Elle joue un rôle clé dans la définition de la roadmap produit et des priorités business. Je collabore étroitement avec elle pour m’assurer que les fonctionnalités techniques que je développe répondent aux besoins du marché et des utilisateurs finaux.

J’assiste à des réunions de roadmap ou des points hebdomadaires pour faire le lien entre les besoins produits et les capacités techniques de l’équipe. Je collabore sur la conception des fonctionnalités, j’ assure que les spécifications sont claires et que les attentes en termes de design et d’expérience utilisateur sont réalisables techniquement.

Développeurs Front-End et Mobile

Je gère directement une équipe de développeurs spécialisés en front-end et mobile. Je suis leur leader technique et suis responsable de les encadrer, de les former, et de les motiver.

Mes relations avec eux sont principalement opérationnelles. Nous faisons des points quotidiens (stand-ups) pour suivre l’avancement des tâches, gérer les obstacles, et apporter des clarifications sur les aspects techniques. Nous réalisons également des revues de code et je les aide à monter en compétence sur des technologies complexes.

Partenaires externes

Il arrive que j’ai besoin de collaborer avec des prestataires pour des projets spécifiques (sous-traitance de développement mobile, #time).

Dans ce cas, je définit les exigences techniques et suivez l’avancement des projets en externe. Je m’assure également que le travail sous-traité respecte les normes de qualité d'Enlaps et s'intègre correctement avec les systèmes existants.

Management

Exercez-vous des fonctions d’encadrement ? ◻ Non x oui

Si oui, nombre de collaborateurs encadrés ? 2 à 5

Je supervise un groupe de 2 à 5 développeurs spécialisés en front-end, full-stack, et mobile, travaillant sur les différents aspects des produits d'Enlaps, tels que la plateforme web et les applications mobiles. J’encadre également un alternant qui, bien qu’en phase d’apprentissage, contribue activement aux projets de l’équipe sous ma supervision.

En plus de mes responsabilités de gestion quotidienne, je suis également chargé des recrutements au sein de l'équipe. Cela inclut la sélection des candidats, la conduite des entretiens et l’évaluation des compétences techniques. Pour cela, je mets en place des tests techniques adaptés aux postes à pourvoir, que je fais passer aux candidats et que je corrige moi-même pour évaluer leurs connaissances. Ce processus me permet d’identifier les développeurs qui correspondent aux attentes techniques et culturelles de l’équipe, tout en garantissant un niveau de compétence élevé.

Changements durant votre expérience

Si des changements importants ont marqué l’évolution de votre emploi (fonction ou poste), de quel(s) ordre(s) étaient-ils ?

Le passage à un rôle de lead développeur chez Enlaps a marqué un tournant décisif dans ma carrière. Ce changement m’a imposé un rôle plus stratégique, qui dépasse la simple exécution technique et m’a donné des responsabilités accrues sur les décisions d’architecture et d’orientation technologique.

Lorsque j'ai pris ce poste, je me suis retrouvé dans une position de leadership technique où j'ai dû apprendre à gérer non seulement des tâches techniques complexes, mais aussi à orienter des choix qui auront des impacts à long terme. J’ai pris du recul par rapport aux simples problématiques immédiates du code, pour me concentrer sur des aspects plus globaux :

Je devais m'assurer que les architectures que je concevais pourraient évoluer avec les besoins futurs de l'entreprise et du produit.
Il est devenu primordial d’être à l’affût des nouveautés technologiques et d’intégrer des solutions pérennes. Cela implique aussi de choisir des technologies et des outils qui répondent non seulement aux besoins actuels mais qui restent pertinents dans l’avenir.
Chaque choix technique, que ce soit l’adoption d’un nouveau framework ou la révision d’un processus d’intégration, avait des répercussions sur les performances du produit et sur la satisfaction utilisateur à moyen et long terme.

Ce rôle m’a aussi demandé d’acquérir et de renforcer certaines capacités comportementales, j’ai dû développer la capacité à anticiper les problèmes à venir, que ce soit en termes de scalabilité, de sécurité, ou d'interopérabilité, pour garantir que nos solutions soient durables.

Le rôle de lead développeur m'a exposé à une complexité croissante, tant au niveau technique qu’organisationnel. J’ai appris à décomposer les problèmes en sous-problèmes gérables et à prioriser les décisions techniques les plus critiques.

Leadership : Mon rôle implique également de guider l’équipe, que ce soit pour les aider à résoudre des défis techniques ou pour les orienter vers des technologies ou pratiques innovantes. Il s’agit aussi de créer un environnement où chacun se sent valorisé et peut contribuer aux décisions techniques.

En résumé, cette évolution m’a demandé une adaptation rapide et un véritable changement de perspective, passant de l'exécution de tâches techniques à une vision stratégique du développement et à une gestion proactive des projets à long terme. Cette prise de recul sur les enjeux globaux a renforcé mes compétences en gestion des priorités, en leadership technique, et en décision stratégique.

Comment avez-vous fait face à ces changements ?

J’ai du non seulement résoudre des problèmes actuels, mais aussi prévoir et éviter les obstacles futurs en adoptant une vision globale de la direction technique de l'entreprise.

Ces changements marquants – une ascension rapide à un poste de Lead Dev, l’extension des responsabilités vers le mobile, l’encadrement d’une équipe, et la prise en charge de la stratégie technique – ont transformé la nature de mes fonctions. Ils m’ont demandé d’adapter mes compétences techniques et managériales, de renforcer mon leadership, et de trouver un équilibre entre mes tâches individuelles et la gestion collective de l'équipe. J’ai évolué vers un rôle plus stratégique et moins opérationnel, où la gestion des personnes et la prise de décision sont devenues centrales.

Expliquez si vous avez eu la possibilité de proposer et d’introduire vous-même des changements :

Bien sûr, en tant que leader technique de l'équipe, je suis dans une position idéale pour identifier les améliorations à apporter tant au niveau des technologies que des processus.

Changements technologiques:

Choix des technologies : En tant que Lead Dev, je propose de nouvelles technologies, des frameworks ou des bibliothèques qui pourraient améliorer la productivité de l'équipe ou la performance des produits. Par exemple, j’ai proposé de migrer vers un framework plus moderne (passage de React Native à Flutter pour le développement mobile multiplateforme si cela offre des avantages en termes de performance ou de productivité).
Optimisation des outils : Je propose aussi l'introduction de nouveaux outils de développement (comme des systèmes de test automatisé, régression visuelle ect) pour améliorer la qualité et la rapidité du développement.
Refactoring du code : J'identifie constamment des parties de code qui pourraient être optimisées ou simplifiées pour améliorer la maintenabilité du code, en particulier si cela réduit la dette technique à long terme.

Changements dans les processus de travail:

Amélioration des processus Agile : Améliorations dans la méthodologie de travail (comme la révision de la durée des sprints, l'amélioration des stand-ups, ou l'introduction d'outils de gestion de projet plus adaptés).
Introduction de pratiques DevOps :J’ai introduit et renforcé les pratiques DevOps, comme l’automatisation du déploiement ou l’intégration continue (CI/CD), pour accélérer le cycle de développement et réduire les erreurs en production.
Tests automatisés : J’ai imposé plus de tests unitaires et d’intégration pour améliorer la qualité des livrables et réduire les régressions.

Amélioration de la collaboration inter-équipes:

Collaboration avec le marketing et le produit : En travaillant de plus en plus avec les équipes produit et marketing (par exemple avec Annabelle Meli, la responsable produit), j’ai proposé des changements dans la gestion des priorités ou dans la manière dont les besoins utilisateurs sont traduits en spécifications techniques. Cela inclut des ajustements sur la manière dont les retours des utilisateurs sont intégrés dans la roadmap produit.
Intégration plus fluide avec le backend : Il m’arrive aussi de proposer des solutions pour améliorer l'intégration entre les équipes front-end/mobile et back-end, en introduisant des API mieux conçues ou en mettant en place des protocoles plus efficaces pour la communication entre les deux équipes. (Hook automatisant la génération de types typescript et réaction à un changement du schéma graphql de notre api).

Changements organisationnels:

Gestion des talents et des équipes : Cela inclut les besoins en termes de recrutement ou de formation au sein de votre équipe, je peux proposer des changements dans la composition de l'équipe ou dans la manière dont les nouveaux membres sont intégrés et formés.

Innovation et veille technologique:

Exploration de nouvelles tendances : Mon poste m'a aussi mis en position de proposer des innovations basées sur les dernières tendances du secteur. Par exemple, l’introduction de nouvelles méthodes d’intelligence artificielle ou d’apprentissage automatique pour optimiser certains aspects du produit (comme l’analyse des contenus timelapse d'Enlaps ou la création d’un chat bot RAG).

Votre autonomie:

Quelles sont vos marges d’initiative et d’autonomie dans votre fonction ? Concernent-elles vos activités, vos priorités, vos méthodes ?

Mon autonomie est relativement large, car je suis chargé de gérer à la fois les aspects techniques et managériaux de mon équipe. J’ai donc une grande marge d’initiative dans plusieurs domaines :

Autonomie dans les activités: Le cadre dans lequel j’évolue a été défini en fonction de mes responsabilités techniques et de la structure de l’organisation. Je bénéficie d’une autonomie importante pour organiser et diriger les projets techniques, tout en respectant les orientations stratégiques fixées par le CTO et les priorités produits définies par le Responsable Produit. Je suis responsable de la définition des technologies à utiliser, des méthodes d’implémentation, et des meilleures pratiques à suivre. Cette autonomie me permet de prendre des décisions sur les solutions à adopter, que ce soit pour des fonctionnalités comme l’optimisation des images avec AWS Lambda, ou pour le choix de GraphQL plutôt que REST pour améliorer la gestion des données. Cependant, mes décisions doivent toujours tenir compte des contraintes de performance, de scalabilité, et des normes de sécurité comme le RGPD, qui encadrent mes choix techniques et garantissent la conformité légale et la performance des solutions mises en œuvre.
Marges d'initiative pour les priorités: Je suis aussi en mesure de définir les priorités techniques dans mon équipe. Cela inclut la gestion des tâches dans les sprints, l'attribution des responsabilités aux développeurs et l'ajustement des priorités en fonction des besoins des autres départements, notamment le marketing et le produit. Mon initiative s’étend également à la gestion des urgences ou des problèmes techniques critiques qui pourraient survenir.
Méthodes de travail: Concernant les méthodes, j'ai la liberté de choisir et d’implémenter des méthodologies adaptées à la structure et aux besoins de l’équipe (par exemple, Scrum). Je peux proposer des outils ou des processus qui améliorent notre efficacité, comme l’introduction de tests automatisés ou la mise en place de pipelines CI/CD.
Innovation et proposition de changements: Mon autonomie me permet également de proposer des changements dans les technologies utilisées ou les processus de travail. Je peux introduire des innovations qui améliorent les performances des produits ou optimisent la collaboration entre équipes.

En résumé, j'ai une grande marge de manœuvre dans la gestion de mes activités, la définition des priorités, et la mise en place des méthodes de travail. Cette autonomie est essentielle pour remplir efficacement mon rôle de Lead Dev et garantir le bon déroulement des projets.

Spécificités

Votre activité présente-t-elle des contraintes ou des spécificités qui impactent votre activité et les compétences que vous mobilisez ?

Complexité technologique: Le développement pour les plateformes web et mobile implique de jongler avec plusieurs technologies et frameworks (par exemple, React.js et web-assembly + RUST pour le front-end et React Native ou Flutter pour le mobile). Chaque environnement a ses propres spécificités, notamment en termes de performance, d'ergonomie, et d'optimisation, ce qui ajoute de la complexité à la gestion technique des projets.

J’ai eu besoin de solides compétences techniques pour maîtriser ces technologies et résoudre les problèmes complexes qui peuvent surgir lors du développement ou de l’intégration des API backend. Mon expertise en architecture logicielle est également sollicitée pour garantir la cohérence entre les versions web et mobile.

Gestion des performances: Les applications mobiles ont des contraintes spécifiques en termes de performance (batterie, consommation de ressources, temps de chargement) qui peuvent affecter l’expérience utilisateur. De même, sur le web, il faut gérer la rapidité et l'optimisation des interfaces, notamment avec des volumes importants de données ou des contenus visuels lourds, comme les vidéos timelapse.

Je dois faire preuve d'expertise en optimisation des performances, à la fois côté client (optimisation des ressources côté mobile et navigateur) et côté serveur (amélioration des temps de réponse API, cache, etc.).

Collaboration inter-équipes: La nécessité de collaborer étroitement avec les autres équipes (backend, design, marketing, produit) peut créer des défis en termes de communication et de gestion des priorités. Les attentes des différentes parties prenantes ne sont pas toujours alignées, ce qui peut ralentir la prise de décision et la réalisation des projets.

Des compétences en gestion de projet et en communication sont essentielles pour faire le lien entre les besoins des équipes marketing/produit et les contraintes techniques. Je dois également gérer les priorités et organiser les tâches de manière agile, en tenant compte des différentes urgences.

Évolutivité et maintenance: En tant que Lead Dev, je dois assurer la maintenabilité du code sur le long terme tout en garantissant que les produits puissent évoluer facilement avec l’ajout de nouvelles fonctionnalités. Cela implique de faire des choix technologiques durables et de minimiser la dette technique.

Je dois mobiliser des compétences en conception architecturale et en revue de code pour assurer une base de code propre, maintenable, et évolutive. Cela inclut l’utilisation de bonnes pratiques de développement et la mise en place de processus rigoureux de testing et de validation.

Pression des délais: Les délais serrés peuvent représenter une contrainte majeure, en particulier dans une startup en pleine croissance comme Enlaps, où les itérations de produit doivent être rapides pour rester compétitives. Les demandes de changements ou de nouvelles fonctionnalités peuvent être fréquentes, ce qui nécessite une grande flexibilité.

Des compétences en gestion du temps et en adaptabilité sont essentielles. Je dois constamment équilibrer la rapidité de développement avec la qualité du code, tout en m'assurant que l’équipe garde un bon rythme et une motivation optimale.

Gestion de la diversité des environnements: Les utilisateurs finaux de la plateforme myTikee accèdent à l’application à partir de divers appareils, navigateurs et systèmes d’exploitation. Il faut donc veiller à la compatibilité multi-plateforme et s’assurer que les applications fonctionnent correctement dans tous ces environnements.

Je dois mobiliser des compétences en tests de compatibilité (cross-browser et cross-platform), en garantissant que les interfaces fonctionnent parfaitement sur tous les navigateurs et appareils mobiles, et en collaboration avec l’équipe QA pour automatiser ces tests autant que possible.

Situations complexes

Dans le cadre de vos fonctions, avez-vous dû gérer des situations problématiques et/ou imprévues ? Si oui, expliquez comment vous y avez fait face (Comment avez-vous opéré en termes d'organisation, de comportement, de connaissances, de compétences mobilisées etc.)

Oui, dans mes fonctions de Lead Dev Front-End et Mobile, je suis régulièrement confronté à des situations problématiques ou imprévues. Ces défis techniques exigent non seulement des compétences spécifiques, mais aussi une bonne organisation et une approche méthodique pour résoudre les problèmes. Voici des exemples concrets de situations que j’ai dû gérer et comment j’ai opéré :

Liste virtuelle pour l'affichage de centaines de milliers de photos

Dans le cadre des interactions avec la caméra d’enlaps, j’ai dû gérer l’affichage de centaines de milliers de photos à l'écran tout en garantissant des performances optimales. Le défi principal était de permettre aux utilisateurs de naviguer rapidement dans un immense catalogue de photos tout en minimisant la charge sur le navigateur et le serveur.

Afficher toutes les photos en même temps aurait non seulement consommé énormément de mémoire, mais aurait aussi sérieusement affecté les performances des navigateurs, en particulier sur des appareils plus anciens ou des mobiles. De plus, chaque déplacement dans la liste nécessitait de s'assurer que les images soient disponibles immédiatement, ce qui posait un défi pour la gestion du cache côté client.

L'optimisation du rendu dans ce contexte est cruciale pour assurer une expérience utilisateur fluide tout en minimisant la charge sur le navigateur et le serveur.

J’ai mis en place une liste virtuelle qui ne chargeait que les éléments visibles dans la fenêtre d’affichage à un moment donné. Pour cela, j’ai mis en place une Virtualisation du DOM.

L’objectif étant d’optimiser le rendu de ma longue liste d'éléments (mes photos). Le principe est simple : seules les images visibles dans la fenêtre d'affichage ou à proximité sont rendues dans le DOM. Les éléments qui sortent de la vue sont retirés du DOM, réduisant ainsi la charge sur le navigateur.

Calcul des dimensions des éléments : L'application peut estimer ou calculer la hauteur et la largeur des éléments de manière anticipée, de sorte que la taille de l'ensemble de la liste soit connue à l'avance, même si elle n'est pas rendue en totalité.
Fenêtre de rendu limitée : En rendant uniquement les éléments visibles dans une "fenêtre" autour de la position de défilement actuelle, on réduit significativement le nombre de nœuds DOM actifs à tout moment, ce qui améliore les performances.
Lazy loading : Les images ne sont chargées que lorsqu’elles sont visibles à l’écran, économisant ainsi les ressources.
Gestion du cache : Une autre contrainte majeure était la gestion du cache pour les photos déjà chargées. Il était nécessaire de conserver certaines images en cache pour permettre à l'utilisateur de revenir en arrière sans avoir à tout recharger, tout en libérant le cache des photos qui ne seraient plus vues pendant un certain temps afin de ne pas saturer la mémoire du navigateur. Pour ce faire, j'ai implémenté une stratégie de cache dynamique, basée sur l'algorithme LRU (Least Recently Used), afin que seules les images récemment visionnées restent en cache, tandis que les anciennes étaient supprimées.

J'ai aussi mis en place une optimisation des requêtes réseau pour limiter le nombre de chargements simultanés, et éviter de surcharger les serveurs. Les images étaient préchargées lorsque l’utilisateur s’approchait d’une nouvelle section, garantissant ainsi une transition fluide sans temps de latence visible. Chaque requête ne renvoie que les données strictement nécessaires pour les images visibles dans le viewport, évitant les appels inutiles et réduisant la charge serveur.

Feature d'upload manuel de milliers de photos

Un autre défi technique auquel j’ai dû faire face était la création d’une fonctionnalité d’upload manuel permettant aux utilisateurs de télécharger des milliers de photos directement via le navigateur. Le principal enjeu ici était de maintenir une interface fluide malgré le traitement de grands volumes de fichiers en parallèle.

Le téléchargement simultané de milliers de photos dans le navigateur pouvait entraîner des blocages ou des ralentissements significatifs, surtout si ces tâches étaient exécutées sur le thread principal, empêchant l'utilisateur de continuer à naviguer sur le site.

Pour éviter ces ralentissements, j'ai mis en place un système de répartition des tâches à travers des Web Workers. Les Web Workers permettent de décharger certaines tâches lourdes (comme le traitement des fichiers à télécharger) vers des threads parallèles, sans bloquer l'interface principale.

J’ai découpé le téléchargement en lots plus petits pour mieux gérer la bande passante et réduire l'impact sur les performances.
Grâce aux Web Workers, chaque photo était traitée individuellement et de manière asynchrone, garantissant que l’interface utilisateur restait fluide et réactive même lorsque des milliers de photos étaient en cours de traitement.

Cette fonctionnalité a permis aux utilisateurs de télécharger rapidement et efficacement de grandes quantités de photos sans subir de ralentissements ou de blocages, améliorant ainsi la productivité des utilisateurs. L'utilisation des Web Workers a non seulement assuré la fluidité de l'expérience utilisateur, mais a également permis de réduire la charge sur le serveur en répartissant mieux les requêtes.

Gestion d’interactions via Protocol Buffers en BLE (Bluetooth Low Energy)

Une autre situation imprévue concernait la gestion de messages via Protocol Buffers pour des interactions entre une application mobile et un dispositif IoT utilisant Bluetooth Low Energy. Le défi résidait dans la faible bande passante de BLE et la nécessité de conserver des messages légers tout en assurant la fiabilité de la communication.

J’ai d’abord étudié le format Protocol Buffers pour réduire la taille des messages. Ensuite, j’ai organisé des tests avec l’équipe backend pour simuler différentes conditions de réseau et déterminer les points critiques où les messages pouvaient être perdus.

J’ai mobilisé des compétences en communication réseau et en gestion de protocoles pour m'assurer que les messages BLE soient envoyés et reçus efficacement, même dans des environnements avec des interférences. J’ai aussi utilisé mes compétences en debugging mobile pour optimiser le traitement des messages côté client.

Nous avons mis en place un système robuste de transmission de données qui a permis à l’application de maintenir des communications stables tout en minimisant l’impact sur la batterie de l’appareil.

###

Automatisation de la génération d'interfaces TypeScript à partir d'un schéma GraphQL backend

L’un des défis imprévus concernait l’automatisation de la génération d’interfaces TypeScript à partir de schémas GraphQL. L’objectif était de s’assurer que le front-end soit automatiquement synchronisé avec le backend, sans devoir écrire manuellement les interfaces à chaque mise à jour du schéma. Et surtout prévenir les régressions qui devenaient fréquentes a force de mise à jour “fortuite” de nos apis

J’ai introduit des outils comme GraphQL codegen, qui permet d’automatiser la génération d’interfaces TypeScript à partir du schéma GraphQL défini côté backend. J’ai travaillé en étroite collaboration avec l’équipe backend pour garantir que les schémas soient bien documentés et compatibles avec l’automatisation.

Des compétences en TypeScript, GraphQL, et automatisation étaient cruciales pour mettre en place cette solution. J’ai également mis en œuvre des tests automatisés pour garantir que les interfaces générées soient toujours correctes après chaque changement de schéma.

Cette automatisation a permis de réduire les erreurs humaines, d'accélérer le développement, et de garantir que le front-end reste synchronisé avec le backend sans effort supplémentaire.

###

Datavisualisation complexe avec D3.js et création de heatmaps (interpolation bicubique)

Dans le cadre d'un projet de datavisualisation complexe, il a été nécessaire de visualiser des données géospatiales et des patterns de comportement en temps réel à travers des heatmaps interactives. L’interpolation bicubique a été utilisée pour lisser les transitions entre les points de données afin de créer une visualisation plus compréhensible.

J’ai segmenté le projet en étapes : collecte des données, création de l’algorithme d’interpolation, et mise en place de la visualisation avec D3.js. En collaboration avec les équipes de données, j’ai récupéré des ensembles de données bruts que j’ai ensuite traités pour l’affichage.

La visualisation des données a nécessité des compétences en D3.js pour la gestion des graphes et des heatmaps, ainsi que des connaissances en algorithmes de traitement de données (comme l’interpolation bicubique) pour produire une visualisation fluide et cohérente. Des compétences en mathématiques appliquées ont également été utiles pour implémenter et optimiser l’interpolation.

Le projet a abouti à une datavisualisation fluide et intuitive, qui a permis aux utilisateurs d’explorer les données de manière interactive et d’en extraire des informations pertinentes de manière visuelle, sans avoir besoin de comprendre les détails techniques.

Ce type de situation a marqué un développement progressif de mes compétences, non seulement sur le plan technique mais aussi en matière de gestion de la complexité et de prise de décision sous pression. Au-delà de l’aspect technique, ce projet a renforcé ma capacité à :

Gérer la pression, la gestion de centaines de milliers de photos en temps réel, avec une contrainte de performances, m’a appris à rester calme et à prioriser les tâches critiques tout en évitant la surcharge cognitive.
Anticiper les problèmes, ces expériences m'ont aussi appris à anticiper les problèmes potentiels liés à l'augmentation du volume de données, ce qui m’a conduit à intégrer des solutions plus scalables dès le début des projets.
J'ai développé mes compétences de communication en guidant mon équipe à travers les étapes de ces projets. Cela m'a permis d'encadrer efficacement mes collaborateurs en gardant une vision claire des priorités, tout en restant à l’écoute de leurs suggestions pour améliorer la solution.

Fiche Activité n° A1: Direction et coordination des développements des applications d’Enlaps {#fiche-activité-n°-a1:-direction-et-coordination-des-développements-des-applications-d’enlaps}

Intitulé: Direction et coordination des développements des applications d’Enlaps

Cette activité est: quotidienne x fréquente □ assez fréquente □ exceptionnelle □

Votre niveau de responsabilité:

□ 1 : Exécution sous contrôle, application de consignes ou de procédures

□ 2 : Exécution autonome, amélioration ou optimisation de solutions, propositions

□ 3 : Conception de programmes, d'actions, de cahiers des charges

x 4 : Définition d’orientations et de stratégies

Décrivez cette activité

Dans le cadre de la direction et coordination des développements pour l'application web myTikee et les applications mobiles Enlaps, j’ai défini une stratégie technique et supervisé la mise en œuvre d’architectures modernes tout en répondant aux besoins opérationnels et aux contraintes réglementaires.

Stratégie Technique:

J’ai mené plusieurs études de faisabilité pour évaluer des technologies comme Next.js pour le Server-Side Rendering (SSR), permettant d’améliorer le référencement SEO des Single Page Applications.

J’ai également intégré GraphQL pour simplifier la gestion des requêtes et optimiser les échanges entre le front-end et le back-end. Ce choix a permis de réduire la charge serveur et de simplifier l’exposition de notre API, tout en garantissant la conformité RGPD.

Des optimisations ont également été mises en place pour réduire l’empreinte carbone, notamment via l’utilisation de Sharp pour le redimensionnement et la compression des images.

Je suis également responsable du microservice GraphQL Gateway. Ce microservice est essentiel pour centraliser et orchestrer les différentes requêtes front-end en direction des services back-end. Il permet d'unifier les points d'accès en exposant les APIs via GraphQL, tout en simplifiant la gestion des données et en offrant une flexibilité accrue dans les requêtes. En tant que responsable de cette architecture, je veille à sa scalabilité, sécurité, et sa performance.

À travers ces projets, j’ai pris conscience de la nécessité de penser au-delà de l’implémentation immédiate. J’ai dû prendre du recul et réfléchir aux implications à long terme de ces choix. Le Server-Side Rendering n'était pas seulement un moyen de résoudre un problème SEO, il avait également un impact direct sur les performances globales de l'application, ce qui affectait l'expérience utilisateur de manière significative. De même, l’adoption de GraphQL n'était pas uniquement une optimisation des requêtes ; c’était une manière de rendre notre système plus modulaire et évolutif, en prévoyant la croissance des besoins en données. Cette capacité à anticiper les évolutions technologiques et leurs impacts futurs m’a appris à aborder chaque décision technique avec un regard stratégique. Chaque choix devait non seulement répondre aux besoins immédiats, mais aussi rester pertinent dans un contexte de scalabilité et de croissance future.

Conception d’Architectures Distribuées :

J’ai conçu une architecture modulaire et scalable en combinant Next.js pour la gestion du front-end avec une application React Native dédiée aux interfaces mobiles. Cette architecture repose sur une bibliothèque de composants et d’helpers partagés, garantissant une cohérence et une maintenance facilitée à travers l’ensemble des projets. Pour optimiser encore davantage l'efficacité, j’ai développé une application dédiée qui génère automatiquement les interfaces partagées pour les différentes applications, unifiant ainsi les bases de code et assurant une synchronisation fluide entre le web et le mobile. Cela permet d’accélérer les déploiements et de réduire les erreurs, tout en assurant une flexibilité pour faire évoluer les projets de manière fluide.

Supervision Technique :

J’ai supervisé l’intégration de modules algorithmiques complexes, notamment pour les visualisations avancées avec shaders et heatmaps. En choisissant React Native pour le mobile, j’ai pu mutualiser le code entre web et mobile, réduisant ainsi les délais de développement. J’ai également veillé à ce que les applications respectent les normes d’accessibilité (WCAG) et les obligations RGPD, garantissant une expérience utilisateur optimale et conforme aux exigences réglementaires. Grâce à cette approche, j’ai pu assurer la scalabilité et la modularité des solutions, tout en améliorant les performances et en garantissant une interopérabilité fluide entre les différentes plateformes.

En quoi cette activité tient-elle une place importante dans votre emploi (fonction, poste) ?

Cette activité tient une place prépondérante dans mon poste, car elle impacte non seulement la stratégie technologique de l’entreprise, mais aussi la performance, la scalabilité, et l’innovation des produits. C’est cette activité qui me permet de prendre des décisions cruciales pour aligner la technologie avec les objectifs commerciaux et de garantir la satisfaction des utilisateurs tout en assurant une gestion efficace des équipes et des ressources

Pour réaliser cette activité, vous êtes en relation à l’interne de votre organisation :

Avec qui (fonction, rôle, service, etc) ?	A quel(s) sujet(s) ? pour faire quoi ?
CTO (Benoît Farinotte) : Responsable de la stratégie technologique globale de l’entreprise.	En collaboration avec le Benoit, je définis les orientations stratégiques en matière de technologies, les choix d’architectures, et les priorités des projets. Nous discutons des solutions à mettre en œuvre, des objectifs techniques et des contraintes (coûts, délais, scalabilité, etc.).
Responsable Produit et Marketing (Annabelle Meli) : Chargée de la gestion des fonctionnalités et des priorités produit.	Avec la Responsable Produit, je travaille à traduire les besoins des utilisateurs en solutions techniques. Nous discutons de la roadmap produit, des fonctionnalités à implémenter, et de l’impact que les choix techniques peuvent avoir sur l’expérience utilisateur et la satisfaction client.
Équipe Front-End et Mobile (développeurs front-end, full-stack, et mobile) Chargée de l'implémentation des fonctionnalités techniques.	Je coordonne l’équipe de développeurs pour garantir que les solutions sont développées selon les standards de qualité, de sécurité et de performance. Je les guide dans l’utilisation des outils comme Next.js ou Apollo et supervise les étapes de développement, notamment pour des tâches complexes comme la compression d’images avec Sharp ou la création de visualisations interactives.
Équipe Backend Responsable de l’API, de la gestion des bases de données et des services backend.	Avec l’équipe backend, je collabore sur l’intégration des APIs GraphQL et la définition des schémas de données. Nous optimisons ensemble les échanges de données pour garantir la fluidité des interactions entre le front-end et le back-end, et assurons une bonne interopérabilité.

Pour réaliser cette activité, vous êtes en relation à l’externe de votre organisation :

Avec qui (fonction, rôle, service, etc) ?	A quel(s) sujet(s) ? pour faire quoi ?
UX/UI Designers Créateurs des interfaces utilisateurs et de l’expérience utilisateur.	Je travaille avec les designers pour m’assurer que les interfaces créées sont techniquement faisables et optimisées en termes de performance. Je m'assure que les interfaces respectent également les normes d’accessibilité.

Pour effectuer cette activité, vous traitez des informations :

De quelles Informations avez-vous besoin ? Comment et auprès de qui vous les procurez-vous ?	Comment les utilisez-vous ? Quel(s) Traitement(s) effectuez-vous ?	Transmettez-vous des informations ? A qui ? Pour quoi faire ? Comment ?
Besoins fonctionnels et objectifs business: Recueillis auprès de l’équipe produit et des parties prenantes (notamment l’équipe marketing). Ces informations sont obtenues via des réunions de cadrage (sprint planning) et des discussions sur Gitlab.	Ces informations sont utilisées pour définir les fonctionnalités prioritaires à implémenter dans les applications web et mobile. Elles sont décomposées en tickets dans GitLab, permettant de planifier et de structurer le travail de l’équipe de développement.	Aux développeurs et au CTO : Je transmets les spécifications techniques dérivées des besoins fonctionnels sous forme de tickets dans Gitlab, permettant aux développeurs de comprendre les attentes et d'aligner les livrables avec les objectifs business.
Détails techniques et contraintes des API: Reçus des développeurs back-end et de la documentation technique en interne. Obtenus lors de réunions avec les équipes techniques ou en consultant la documentation des API GraphQL et autres services backend.	Ces informations sont intégrées dans la planification technique pour s’assurer que les applications web et mobiles interagissent correctement avec les services back-end. J’ajuste les appels API et coordonne les besoins avec le back-end pour anticiper les intégrations.	Aux développeurs front-end et mobile : Je partage les détails d’intégration des API et la documentation nécessaire via Slack, afin qu’ils puissent implémenter et tester les appels API dans l’application web et mobile de manière fluide.
Bonnes pratiques de développement et sécurité: Obtenues via des réunions d’équipe ou en consultant des guidelines internes, mais aussi via une veille technologique pour suivre les évolutions des standards de sécurité applicables.	Ces informations sont intégrées dans les spécifications pour s’assurer que les développements sont conformes aux standards de sécurité, notamment pour la gestion des tokens et des accès.	À l’ensemble des développeurs : Je partage les bonnes pratiques sous forme de guides ou via le README dans GitLab. Ces informations sont aussi diffusées en stand-up et lors de revues de code pour garantir que chaque membre de l’équipe applique les normes de sécurité et de qualité.
Données analytiques et KPIs: Ces informations sont collectées via des outils de suivi des performances (Google Analytics, Sentry) et les rapports des utilisateurs. Partagées par l’équipe produit lors des réunions de suivi de projet.	J’utilise ces données pour analyser la performance des applications web et mobile, identifier les points d’amélioration et ajuster la feuille de route des développements en fonction des objectifs business et des comportements utilisateurs.	Aux parties prenantes (équipe produit, direction) : Je communique les résultats des analyses lors des revues de sprint et dans les rapports de suivi. Cela permet de valider l’alignement des développements avec les KPI et d’ajuster les priorités en fonction des performances observées.

Quels sont les outils, techniques, logiciels, produits que vous utilisez pour réaliser cette activité ?

j'utilise une combinaison d'outils, de technologies et de logiciels qui permettent d'assurer la scalabilité, l'optimisation et la maintenance des projets. Voici une liste des principaux outils et technologies employés :

Environnements de développement et IDE :

WebStorm : L'IDE principal pour le développement Ts (front-end et back-end), utilisé pour Next, et React Native. Il offre des fonctionnalités avancées pour l'auto-complétion du code, la gestion des versions et l'intégration avec des outils comme Git.

Plateformes et services cloud :

AWS (Amazon Web Services) : Utilisé pour l'hébergement et la gestion des services cloud, en particulier pour les instances EC2, et les services S3 pour le stockage d’images et vidéos. J’utilise également AWS Lambda développées en TypeScript, pour automatiser plusieurs processus critiques liés à la gestion des images dans nos applications. Les Lambda sont principalement utilisées pour le redimensionnement des photos, ainsi que pour des tâches comme le naming automatique des fichiers. Cela permet de traiter efficacement les images dès leur upload, en optimisant leur taille pour le web et mobile tout en garantissant une structure de nommage cohérente. Ces fonctions sont exécutées de manière serverless, ce qui offre une scalabilité immédiate et réduit les coûts d’infrastructure, tout en assurant des performances élevées grâce à l'exécution de code léger et optimisé.
Docker : Conteneurisation des applications pour garantir un déploiement homogène dans les environnements de développement, de staging, et de production. Docker facilite également la gestion des dépendances entre les services front-end et back-end.

Technologies front-end et mobile :

React : Framework JavaScript principal pour le développement des interfaces web. Il permet de créer des composants réutilisables, optimisant le développement et la maintenance des interfaces utilisateurs.
Next : Utilisé pour implémenter le Server-Side Rendering (SSR) améliorant les performances et le SEO de l’application.
React Native / Flutter : Plateforme utilisée pour le développement des applications mobiles Enlaps, permettant de mutualiser le code entre les plateformes iOS et Android.
Apollo: Utilisé avec GraphQL pour la gestion des données côté client, avec des politiques de caching qui améliorent la performance en limitant les requêtes redondantes.

Gestion des données et API :

GraphQL : Remplace les API REST pour une gestion plus flexible et optimisée des données. GraphQL permet aux clients de requêter exactement les données dont ils ont besoin, réduisant la charge sur les serveurs.
Sharp : Librairie utilisée pour la compression et le redimensionnement des images côté serveur, garantissant des temps de chargement plus rapides et une gestion efficace des ressources.

Automatisation et optimisation :

CI/CD (GitLab CI) : Utilisé pour l’automatisation des tests, des intégrations et des déploiements continus, garantissant que chaque modification du code passe par une série de tests automatisés avant d’être déployée en production.
Jest: Pour les tests unitaires et les tests d’intégration des composants front-end (React) et des fonctionnalités du back-end, afin de garantir la qualité du code et éviter les régressions.

Visualisation des données et optimisation graphique :

D3.js : Utilisé pour les visualisations complexes de données, comme les heatmaps interactives, avec des interpolations avancées pour offrir des visualisations en temps réel.
Shaders : Intégrés pour optimiser les rendus graphiques des visualisations 3D et heatmaps, en s'assurant que les interactions restent fluides même avec un grand volume de données.

Gestion des projets et collaboration :

GitLab : Outil de gestion de projet pour organiser les tâches, suivre l’avancement des sprints, et gérer les priorités. Je l’utilise pour coordonner l’équipe de développement et assurer une bonne répartition des tâches.
Dans la prochaine activité, j’aborderai plus en détail l’utilisation des méthodes Agile dans la gestion des projets. Je décrirai comment ces méthodes, comme les sprints. Cela facilitera la compréhension de notre processus de gestion de projet axé sur la flexibilité et l’amélioration continue, sans répétition.

Gestion de la sécurité et conformité RGPD :

OAuth 2.0 : Utilisé pour l’authentification sécurisée des utilisateurs dans les applications web et mobiles, en garantissant la protection des données personnelles.

Décrivez comment vous vous organisez pour réaliser cette activité :

Supervision des développements techniques:

Je fais un suivi rigoureux des aspects techniques, notamment en validant l’architecture et en veillant à ce que les technologies utilisées soient en ligne avec les besoins. Par exemple, j’organise des POCs avant de les intégrer en production. Je m'assure que les solutions choisies respectent les exigences de performance et de scalabilité, en collaborant étroitement avec l’équipe backend pour garantir une bonne interopérabilité avec le reste de l'infrastructure.

Revue de code et gestion de la qualité:

Je mets en place des processus de revue de code systématiques via GitLab pour garantir que le code soit maintenable et optimisé. Des outils comme Jest sont utilisés pour les tests unitaires, et GitLab CI/CD pour automatiser les déploiements continus, assurant une livraison régulière et stable des fonctionnalités.

Suivi des performances et ajustements:

Je surveille les performances des applications, notamment via des outils de monitoring, et fais des ajustements selon les résultats obtenus, par exemple en optimisant le cache côté serveur avec Next.js ou en utilisant Sharp pour compresser les images.

Quelles sont les habiletés, savoir-faire ou qualités requises pour effectuer cette activité ?

Pour réaliser cette activité, il faut des compétences techniques solides, ainsi que des capacités en gestion de projet Agile pour organiser les équipes et les tâches. Il est essentiel d’avoir un bon sens de l’analyse pour résoudre les problèmes techniques et optimiser les performances. Une excellente communication est requise pour coordonner avec les équipes produit et design. Enfin, des qualités personnelles comme la rigueur et la capacité d’adaptation sont indispensables pour faire face aux défis techniques et organisationnels.

Quelles sont les connaissances particulières nécessaires à l’accomplissement de cette activité (scientifique, économique, juridique, géographique, statistique, langue, etc) ?

Techniques scientifiques : Maîtrise des technologies web (TypeScript, React, Next, GraphQL…) et mobiles (React Native / Flutter), ainsi que des concepts d'optimisation (caching, serverless avec AWS Lambda). Des notions en algorithmes pour l'optimisation d'images et la datavisualisation (ex. interpolation bicubique) sont également importantes.

Juridique : Connaissance des régulations en matière de protection des données, notamment le RGPD, pour assurer la conformité légale des développements et le traitement des données utilisateurs.

Économique : Compétence dans l’évaluation des coûts et des bénéfices pour les décisions techniques (choix des infrastructures cloud, optimisation des ressources), afin d'assurer des solutions à la fois performantes et économiquement viables.

Langue : Une bonne maîtrise de l’anglais technique est nécessaire pour suivre les évolutions technologiques, lire la documentation, et collaborer avec des équipes internationales ou des prestataires externes.

Détaillez avec précisions en quoi cette activité couvre un ou plusieurs domaines de compétences du référentiel visé (Indiquez le domaine ou les domaines de compétences du référentiel et lister l’ensemble des rapprochements avec cette activité)

C.1.2 Définir une stratégie technique {#c.1.2-définir-une-stratégie-technique}

Études de faisabilité : J’ai mené plusieurs Proofs of Concept (POC) pour évaluer la faisabilité de solutions de visualisation complexes, en particulier sur les heatmaps avec interpolation bicubique. J’ai testé différentes approches avec des shaders pour obtenir des visualisations fluides et interactives dans le navigateur. Ces POCs m’ont permis de valider la viabilité technique avant de les intégrer dans les produits Enlaps.

Estimation des coûts, bénéfices et risques : Lors de l'implémentation du Server-Side Rendering (SSR) avec Next.js, j'ai évalué les coûts associés à l’infrastructure nécessaire pour supporter cette fonctionnalité (serveurs, cache côté serveur), tout en identifiant les bénéfices majeurs en termes de référencement SEO pour notre Single Page Application (SPA), qui avait auparavant des problèmes de visibilité. Le risque principal était la complexité d'implémentation, mais les bénéfices en termes de performances et de référencement l’ont emporté.

Normes et standards : L’utilisation de GraphQL au lieu de REST pour l’API a permis de simplifier l’exposition de notre API et de réduire la quantité de données transférées. J’ai respecté les normes et bonnes pratiques en matière de sécurité (authentification, autorisation, etc.), tout en garantissant l’ouverture de l'API à des services tiers en limitant la surface d’attaque.

Contraintes organisationnelles : Lors de la mise en place du cache partagé avec Next.js, j’ai pris en compte les compétences de l’équipe et organisé une montée en compétence sur cette technologie. J’ai également introduit des outils comme Apollo Client pour simplifier la gestion des caches côté client avec GraphQL, en intégrant des politiques de cache qui évitaient des requêtes redondantes et optimisaient la consommation de données.

Attentes éthiques, réglementaires et RGPD : Lors de l’intégration de solutions de datavisualisation complexe avec D3.js, j’ai veillé à ce que les données collectées respectent la RGPD. Cela a impliqué la mise en place de mécanismes de consentement et la minimisation des données affichées dans les visualisations, tout en protégeant les informations personnelles.

Solutions écoresponsables et écoconception : Pour optimiser la consommation des ressources, notamment lors du traitement d’images lourdes, j’ai utilisé la librairie Sharp pour compresser et redimensionner les images de manière écoresponsable. Cela a non seulement réduit les temps de chargement, mais aussi la bande passante, contribuant ainsi à une réduction de l’empreinte carbone.

C.1.3 Concevoir les architectures distribuées dans l’entreprise {#c.1.3-concevoir-les-architectures-distribuées-dans-l’entreprise}

Sélection des technologies appropriées : Pour améliorer la montée en charge et la modularité, j'ai choisi Next.js pour l'architecture front-end, car il offre des fonctionnalités avancées comme le Server-Side Rendering (SSR), tout en restant flexible pour des applications mobiles. Pour le back-end, l’adoption de GraphQL a facilité la modularité en permettant de requêter uniquement les données nécessaires, réduisant ainsi la charge sur les serveurs.

Anticipation de la montée en charge : J’ai mis en place des stratégies de cache côté serveur et client (avec Apollo Client), permettant de mieux gérer la montée en charge en réduisant le nombre de requêtes répétitives vers l’API. Cette approche a contribué à une performance optimisée, surtout lorsque l'application a été déployée à l'international, où des millions de requêtes simultanées étaient attendues.

Modularité et scalabilité : L’implémentation de GraphQL a également favorisé une meilleure scalabilité. Au lieu d’ajouter continuellement des endpoints comme dans un système REST, nous avons pu adapter l’API pour de nouvelles fonctionnalités sans alourdir la structure initiale. Les requêtes dynamiques de GraphQL nous ont permis de mieux gérer la complexité croissante des interactions front-back.

Optimisation des performances : J’ai mis en place une gestion efficace des caches avec Next.js côté serveur pour accélérer le rendu des pages, et j’ai optimisé les images avec Sharp afin de garantir des temps de chargement rapides tout en maintenant une qualité d’image optimale. Ces optimisations ont grandement amélioré l’expérience utilisateur, surtout sur mobile.

C.3.1 Définir l'architecture technique {#c.3.1-définir-l'architecture-technique}

Identification des moyens techniques : J’ai défini une architecture reposant sur Next.js pour le front-end et Apollo/GraphQL pour la gestion des données. L'utilisation d’un cache partagé entre le serveur et le client a permis de réduire la latence et d’améliorer l’efficacité des requêtes. Pour le traitement de grandes quantités de données visuelles (comme les heatmaps), j’ai utilisé des librairies de visualisation avancées comme D3.js et des shaders pour des effets en temps réel.![][image1]

Pour optimiser les rendus graphiques des visualisations 3D et des heatmaps complexes, j'ai intégré des shaders, des petits programmes qui s’exécutent directement sur le GPU (processeur graphique). Les shaders sont utilisés pour générer des effets visuels et effectuer des calculs graphiques de manière ultra-rapide. Dans mon contexte, ils permettent de maintenir une fluidité dans les interactions même lorsque le volume de données est élevé.

Un shader est essentiellement un petit programme qui s'exécute sur le GPU pour gérer des tâches spécifiques, comme le rendu des couleurs, des lumières, ou des textures dans une scène 3D. Au lieu de faire ces calculs via le CPU (processeur central), qui est plus lent pour ce type d’opérations, le GPU traite les données de manière parallèle, ce qui accélère considérablement le rendu graphique.

Dans notre cas, les shaders permettent de calculer et d’afficher les effets visuels en temps réel, par exemple pour ajuster la manière dont la lumière interagit avec un modèle 3D ou pour afficher les zones de haute température dans une heatmap.

L’un des défis avec les heatmaps, qui visualisent souvent de grandes quantités de données, est de lisser les transitions entre les zones de différentes couleurs sans perdre de précision. C'est là qu'intervient l’interpolation bicubique.

L’interpolation bicubique est une technique utilisée pour créer des transitions plus fluides et naturelles entre les couleurs ou les valeurs dans une image ou une visualisation. Contrairement à l'interpolation bilinéaire, qui ne tient compte que des quatre pixels les plus proches, l'interpolation bicubique prend en compte 16 pixels voisins, ce qui donne un rendu beaucoup plus lisse et précis. Cela permet, par exemple, de passer de manière fluide entre des zones de chaleur intense et des zones plus froides dans une heatmap, même lorsque les données sont massives.

En intégrant cette méthode via des shaders, j’ai pu optimiser les performances graphiques des heatmaps et maintenir une interaction fluide avec l'utilisateur, même en présence de grands volumes de données à traiter.

Ces optimisations ont significativement amélioré la vitesse d'affichage et la précision des rendus dans nos visualisations, apportant une expérience plus fluide et immersive à l'utilisateur.

En organisant une architecture front-back avec Apollo, j’ai défini des relations claires et optimisées entre les différents éléments. Dans ce modèle, les clients front-end interagissent directement avec des résolveurs GraphQL, permettant d’adapter les réponses aux besoins spécifiques de chaque interface et de réduire la surcharge de données inutiles. Cette architecture modulaire et optimisée permet également de découpler les services, rendant les différents modules indépendants et facilitant ainsi la maintenance et l’évolutivité de l’ensemble.

La GraphQL Gateway fait partie de mes responsabilités dans l’organisation de l’architecture front-back. En tant que point d’entrée unique pour toutes les requêtes GraphQL, cette Gateway requiert une configuration et une maintenance continues pour garantir que les interactions entre le front-end et les services back-end soient optimisées et sécurisées. Je gère les schémas fédérés au niveau de la Gateway, en veillant à ce que chaque microservice expose uniquement les données nécessaires, ce qui simplifie l’intégration et réduit la charge des requêtes.

Je suis également chargé de superviser le routage des requêtes et la logique d’agrégation pour que les données puissent être transmises de manière fluide et cohérente, quelles que soient les modifications dans les services. En tant que responsable de cette architecture, je dois régulièrement ajuster la Gateway pour suivre les évolutions des services et les nouvelles exigences des clients front-end, assurant ainsi une scalabilité et une flexibilité maximales pour l’ensemble de l’architecture.

C.3.2 Définir les modes de communication utilisés par les éléments d’un système {#c.3.2-définir-les-modes-de-communication-utilisés-par-les-éléments-d’un-système}

Identification des protocoles adaptés : En choisissant GraphQL comme protocole principal de communication entre le front-end et le back-end, j’ai optimisé la gestion des données complexes. Contrairement à REST, où plusieurs endpoints peuvent être nécessaires, GraphQL a permis de regrouper plusieurs appels en une seule requête. J’ai également mis en place des communications Bluetooth Low Energy (BLE) avec Protocol Buffers pour des interactions à faible latence avec des appareils IoT.

C.4.1 Superviser le développement d’une application logicielle {#c.4.1-superviser-le-développement-d’une-application-logicielle}

Choix de la plateforme de développement adaptée : Pour garantir une flexibilité maximale entre le web et le mobile, j’ai choisi Next.js pour le développement web et React Native pour le développement mobile. Cette approche permet de partager du code entre les plateformes, réduisant ainsi les délais de développement et facilitant la maintenance. En unifiant les composants et les styles, nous atteignons une interopérabilité optimale, tout en appliquant des normes de sécurité cohérentes entre les environnements.

L’utilisation de Next.js s’est avérée cruciale pour le développement de notre application web. Grâce à son Server-Side Rendering (SSR), Next.js permet de référencer certaines parties de notre application à page unique (SPA), qui seraient autrement moins accessibles aux moteurs de recherche en raison de la nature dynamique des SPA. En rendant certaines sections indexables, nous améliorons le SEO global, garantissant que les pages essentielles de notre application apparaissent dans les résultats de recherche. Par ailleurs, Next.js facilite l’optimisation des balises métadonnées, permettant ainsi un partage plus efficace sur les réseaux sociaux, avec des extraits bien formatés et des images correctement affichées.

En complément de React Native, j’ai choisi Flutter pour des modules spécifiques nécessitant une gestion Bluetooth avancée. Flutter offre une gestion plus fine des interactions Bluetooth, permettant de développer des fonctionnalités complexes pour le mobile, telles que la communication en basse énergie avec des appareils Bluetooth. Ce choix technique offre des options de contrôle plus détaillées, ce qui est essentiel pour les fonctionnalités requises par notre application, et garantit une expérience utilisateur stable et réactive lors des interactions avec des périphériques externes.

Cette combinaison de Next.js, React Native, et Flutter fournit ainsi une architecture flexible, adaptée aux spécificités techniques de chaque plateforme, tout en assurant un développement harmonisé et une expérience utilisateur optimale sur toutes les interfaces.

Modules algorithmiques complexes : J’ai intégré des algorithmes d’interpolation bicubique pour les visualisations de heatmaps complexes, garantissant une fluidité optimale dans les rendus visuels. Pour la gestion des images, Sharp a été utilisé pour optimiser les ressources et améliorer les temps de traitement.

Pour les fonctionnalités de modélisation d’information du bâtiment (BIM) intégrées dans notre application, j’ai mis en place des calculs matriciels avancés en utilisant WebGL. Ce choix nous permet de gérer des transformations 3D complexes (rotation, translation, échelle) directement dans le navigateur. En utilisant des matrices de transformation, nous sommes capables de manipuler efficacement des modèles 3D en temps réel, même pour des structures volumineuses et détaillées. WebGL permet d’effectuer ces calculs directement sur le GPU, ce qui réduit considérablement la charge sur le processeur et améliore la fluidité des interactions utilisateur avec les modèles BIM (le Building Information Modeling (BIM) est un processus de création et de gestion de représentations numériques des caractéristiques physiques et fonctionnelles d'un bâtiment. Il permet de centraliser toutes les données liées à un projet de construction dans un modèle 3D unique, accessible à toutes les parties prenantes (architectes, ingénieurs, constructeurs, gestionnaires).

![Représentation de l'interface du BIM][image2]

Accessibilité et RGPD : J'ai veillé à ce que toutes les fonctionnalités respectent les normes d’accessibilité web (WCAG), en intégrant des tests sur la lisibilité des éléments et l’accessibilité pour les utilisateurs ayant des handicaps visuels. Les exigences de la RGPD ont également été intégrées dans le développement de notre API et des services.

Fiche Activité n° A2: Gestion de de projet technico-fonctionnel {#fiche-activité-n°-a2:-gestion-de-de-projet-technico-fonctionnel}

Intitulé: Gestion de de projet technico-fonctionnel

Cette activité est : quotidienne x fréquente □ assez fréquente □ exceptionnelle □

Votre niveau de responsabilité

□ 1 : Exécution sous contrôle, application de consignes ou de procédures

□ 2 : Exécution autonome, amélioration ou optimisation de solutions, propositions

□ 3 : Conception de programmes, d'actions, de cahiers des charges

x 4 : Définition d’orientations et de stratégies

Décrivez cette activité:

Dans cette activité de gestion de projet, je prends en charge l’ensemble du cycle de vie du projet, depuis l’analyse des besoins jusqu’à la livraison des solutions techniques, en passant par la planification et le suivi des tâches.

Je commence par analyser les besoins fonctionnels avec les parties prenantes (produit, marketing, utilisateurs) pour comprendre les attentes spécifiques du projet. Cela me permet de définir les spécifications techniques adaptées, en choisissant les outils et technologies. Sur cette base, je propose des solutions techniques qui répondent aux exigences en matière de performance, de scalabilité, et d’accessibilité, tout en respectant les contraintes réglementaires (RGPD).

Je formalise les besoins et les solutions techniques dans un cahier des charges clair et détaillé, qui définit les fonctionnalités à implémenter, les technologies à utiliser, et les contraintes d'accessibilité. J'intègre également les contraintes liées à la protection des données et à la conformité réglementaire. Ce document sert de référence pour les équipes de développement et les parties prenantes tout au long du projet.

Ensuite, je divise le projet en sous-tâches ou modules plus petits pour faciliter leur réalisation et suivi. Je répartis ces tâches entre les développeurs front-end, back-end, et les designers UX/UI, en utilisant des outils comme GitLab pour gérer les sprints. Cette étape permet d’établir une feuille de route claire et de prioriser les tâches critiques pour assurer le respect des délais.

Tout au long de la phase de réalisation, je supervise les équipes de développement à travers des réunions quotidiennes (stand-ups) et des revues de sprint. Ces points réguliers permettent d’ajuster les priorités en fonction des imprévus et de garantir que le développement reste aligné sur le cahier des charges initial.

Une fois les développements terminés, je supervise la phase de test, incluant les tests unitaires, d'intégration, et utilisateurs. Je m’assure que toutes les fonctionnalités sont conformes aux spécifications du cahier des charges avant de lancer la mise en production. Après le déploiement, je reste attentif aux retours des utilisateurs pour apporter des ajustements si nécessaire et garantir la qualité continue du produit.

Pour réaliser cette activité, vous êtes en relation à l’interne de votre organisation :

Avec qui (fonction, rôle, service, etc) ?	A quel(s) sujet(s) ? pour faire quoi ?
Kévin PICOT : Co-fondateur et responsable de l'ingénierie	Avec Kévin, je collabore sur la planification des projets techniques. En tant que responsable de l'ingénierie, il supervise la feuille de route technique et joue un rôle clé dans la validation des solutions techniques.
Thibault Vallois : Lead Backend	Lors des réunions de planification des sprints, je coordonne avec Thibault pour découper les tâches liées aux services back-end, et nous discutons des priorités techniques qui pourraient influencer le planning global. Il intervient également pour fournir des estimations sur les tâches liées aux services API et bases de données, ce qui nous permet d’ajuster la roadmap si nécessaire.

Pour réaliser cette activité, vous êtes en relation à l’externe de votre organisation :

Avec qui (fonction, rôle, service, etc) ?	A quel(s) sujet(s) ? pour faire quoi ?
X	X

Pour effectuer cette activité, vous traitez des informations :

De quelles Informations avez-vous besoin ? Comment et auprès de qui vous les procurez-vous ?	Comment les utilisez-vous ? Quel(s) Traitement(s) effectuez-vous ?	Transmettez-vous des informations ? A qui ? Pour quoi faire ? Comment ?
Besoins fonctionnels et objectifs business : Ces informations sont fournies par les équipes produit et marketing, en collaboration avec le CTO (Benoît Farinotte) et le Responsable de l’ingénierie (Kévin Picot). Elles me permettent de comprendre les attentes des utilisateurs et les priorités stratégiques de l’entreprise.	Elles servent de base pour définir les fonctionnalités à développer et orienter les choix techniques	À l’équipe de développement (front-end, back-end, mobile) : Quoi et pourquoi ? : Je transmets les spécifications techniques, les priorités des fonctionnalités à implémenter, ainsi que les ajustements nécessaires au cours des sprints. Cela permet à l’équipe de se concentrer sur les tâches critiques tout en respectant les délais. Comment ? : Les informations sont partagées via GitLab pour la planification des tâches, et des réunions quotidiennes (stand-ups) pour faire le point sur l'avancement et ajuster les priorités.
Données techniques et architecturales : Ces informations proviennent de l’équipe de développement, en particulier du Lead Backend (Thibault Vallois), ainsi que des développeurs front-end et mobile.	Elles permettent de concevoir les spécifications techniques (API, architecture, choix des technologies) et de s'assurer que les solutions proposées sont adaptées aux besoins identifiés.	À Kévin Picot (Responsable de l’ingénierie) et Benoît Farinotte (CTO) : Quoi et pourquoi ? : Je leur fais des rapports d'avancement sur l'état des développements, les risques identifiés et les propositions d'ajustements à la roadmap technique. Ces échanges permettent d'aligner les décisions techniques avec la stratégie globale de l’entreprise. Comment ? : Les informations sont partagées via des réunions hebdomadaires ou des rapports formels, dans lesquels je présente les KPIs du projet et les éventuels obstacles rencontrés.
Contraintes réglementaires et normatives : Ces informations sont issues des discussions avec l’équipe juridique et les échanges avec le CTO pour la conformité aux régulations (ex. RGPD).	Elles servent à garantir que le projet respecte les réglementations, notamment en matière de protection des données et d’accessibilité.	À l’équipe produit et marketing : Quoi et pourquoi ? : Je leur communique l'avancée des fonctionnalités en cours de développement et les ajustements apportés en fonction des retours utilisateurs ou des priorités business. Cela leur permet d’adapter leur stratégie de lancement ou leur communication avec les clients. Comment ? : Les échanges se font via des réunions de revue de sprint ou des démonstrations des nouvelles fonctionnalités développées, pour valider l'adéquation entre les livrables et les attentes fonctionnelles.

Quels sont les outils, techniques, logiciels, produits que vous utilisez pour réaliser cette activité ?

Pour réaliser cette activité de gestion de projet, analyse des besoins fonctionnels, proposition de solutions techniques, découpage des tâches, planification et réalisation, j’utilise plusieurs outils, techniques et logiciels afin d'assurer l'efficacité et la coordination des équipes :

Outils de gestion de projet et collaboration :

GitLab : Outil de gestion de projet utilisé pour planifier les sprints, découper les tâches, et suivre l’avancement du travail. GitLab permet de gérer les priorités, assigner des tâches aux membres de l’équipe et suivre l’état des livrables en temps réel.

Outils de communication et gestion Agile :

Slack : Plateforme de communication utilisée pour les échanges rapides entre les membres de l’équipe et la gestion quotidienne des projets. Slack est souvent utilisé pour coordonner les tâches avec les équipes distribuées ou pour remonter des problèmes rapidement.

Scrum / Agile : Pour organiser mes projets, j’utilise la méthode Agile, complétée par le framework Scrum, afin d'assurer une gestion structurée et flexible des tâches.

Mon parcours vers l'adoption d'Agile et Scrum n'a pas été immédiat. Il s'est construit à travers des expériences variées, des essais avec d'autres méthodologies de gestion de projet, et une prise de conscience progressive de ce qui fonctionnait vraiment dans un environnement en constante évolution.

Au début de ma carrière, comme beaucoup, j'ai été formé aux méthodes de gestion de projet plus traditionnelles, comme Waterfall. Cela semblait logique à l'époque : définir toutes les exigences, établir un plan de projet détaillé, puis exécuter chaque phase de manière séquentielle. Toutefois, j'ai vite rencontré plusieurs défis.

Dans un de mes premiers projets importants, nous avons suivi la méthodologie Waterfall. Tout semblait bien planifié, mais au fur et à mesure de l'avancement du projet, des imprévus se sont accumulés : les besoins du client ont changé, des contraintes techniques non anticipées sont apparues, et notre équipe a dû revoir certaines hypothèses initiales. Chaque modification dans une phase impliquait un retour en arrière qui prenait énormément de temps et perturbait tout le calendrier. Il était difficile d'ajuster les priorités ou d'obtenir un retour régulier du client avant la livraison finale. Résultat, bien que nous ayons respecté le plan initial, le produit livré n'était plus en phase avec les besoins de la boite. Ce décalage a révélé la rigidité et les limites des méthodes traditionnelles dans des projets où l’incertitude et le changement sont constants.

Cette expérience m'a fait comprendre l'importance de la flexibilité et de l'adaptabilité. J'ai donc commencé à explorer d'autres approches de gestion de projet, ce qui m'a conduit à la méthode Agile. Agile proposait un modèle beaucoup plus adaptable, basé sur des cycles courts et itératifs, permettant de livrer des fonctionnalités incrémentales, de recueillir des retours réguliers, et d'ajuster le cap rapidement. Cette approche répondait beaucoup mieux à la dynamique des projets complexes.

J'ai d'abord mis en place des pratiques agiles de manière informelle pour de petites features. J'ai vu comment, grâce à la collaboration continue avec l’équipe et les parties prenantes, il devenait plus simple de réajuster le développement en fonction des priorités ou des retours du client. Les cycles courts d’itérations permettaient de s’adapter rapidement aux changements, mais aussi de réduire les risques, car chaque sprint livrait un petit incrément testable du produit. Cette flexibilité a radicalement changé ma manière de travailler.

Cependant, bien que l'approche Agile offrait une grande flexibilité, je me suis vite rendu compte qu'il manquait parfois une structure plus rigide pour organiser le travail et gérer mon équipe, surtout dans des projets plus complexes ou de plus grande envergure. C'est alors que j'ai “découvert” Scrum, qui a complété mon approche Agile avec des processus plus définis et une organisation claire des rôles et des responsabilités.

J’ai commencé à appliquer Scrum dans un projet qui impliquait une équipe distribuée, avec des membres travaillant dans différentes zones géographiques et des tâches qui devaient être clairement définies et suivies de près. Ce framework m’a permis de diviser le projet en sprints courts, et chaque sprint était suivi d'une réunion de revue et de rétrospective, où nous pouvions évaluer ce qui avait bien fonctionné et ce qui devait être amélioré. Scrum nous a également aidés à prioriser les tâches de manière plus structurée, en créant et en affinant un backlog qui servait de boussole pour l'équipe. Cela m'a montré à quel point cette organisation permettait à chacun de savoir exactement sur quoi travailler et comment nous mesurions nos progrès.

Le moment clé qui m’a convaincu d’adopter pleinement Agile et Scrum est survenu lors d’une feature où les besoins changeaient fréquemment: notre dashboard IA (j’en ferais une description détaillée plus tard). Grâce à Agile et Scrum, j’ai pu maintenir une communication continue avec l'équipe R\&D, ajuster le backlog à chaque sprint en fonction des nouvelles priorités, et livrer des incréments réguliers qui apportaient de la valeur immédiate. On pouvait tester des fonctionnalités à chaque itération, et réagir immédiatement aux imprévus. Contrairement aux approches précédentes, il n'y avait pas de longue période d'attente avant la livraison finale.

Aujourd'hui, Agile et Scrum sont devenus mes cadres de référence pour gérer les projets, car ils combinent adaptabilité, collaboration continue et structure. Ce cheminement m'a appris qu'il est essentiel d'adopter une approche centrée sur l'amélioration continue, non seulement pour les livraisons, mais aussi pour l'équipe elle-même.

Il est également important de souligner que l'adoption d'Agile et Scrum n'a pas été une décision unilatérale, mais le fruit d'un processus collaboratif avec mon équipe. Dès le début, j'ai toujours accordé une grande importance aux retours et aux idées d'amélioration venant de chacun des membres. L'une des forces de l'Agilité est justement de favoriser un environnement où chacun peut exprimer des suggestions, remettre en question les pratiques existantes et proposer des ajustements.

Mon processus commence par la planification des sprints, une étape clé pour garantir l'avancement des projets :

Collaboration avec Kevin Picot : Nous établissons ensemble un backlog clair et priorisons les tâches en fonction de leur complexité, de leur urgence, et de l'impact qu'elles auront sur les projets globaux. Cette collaboration est essentielle pour aligner la vision technique et les objectifs business.
Priorisation et répartition : J’organise ensuite les tâches pour les différents membres de l’équipe (front-end, mobile, full-stack) en veillant à une répartition équilibrée du travail et en tenant compte des compétences spécifiques de chacun. L’objectif est de garantir que chaque développeur puisse travailler sur des tâches adaptées à son domaine d’expertise tout en assurant une progression globale efficace.

Avec l’évolution de mon rôle en tant que lead développeur, j’ai pris conscience de l’importance d’une planification efficace non seulement pour le respect des délais, mais aussi pour le bien-être de l’équipe. Ce passage à un rôle de gestion de projet m’a poussé à développer des compétences clés en anticipation et en gestion des priorités, afin de m’assurer que chaque sprint contribue à l’atteinte des objectifs globaux sans créer de surcharge pour l’équipe.

Le passage à un rôle plus stratégique, centré sur la gestion des sprints et la planification des tâches, a demandé une prise de recul importante par rapport à l’exécution technique. J’ai développé une capacité à équilibrer l’opérationnel et le stratégique, en gérant les priorités à court terme tout en gardant une vue d'ensemble sur les objectifs à long terme de l'équipe et de l'entreprise. La méthode Agile, soutenue par Scrum, m’a permis d’apporter souplesse et rigueur à la gestion des projets.

Décrivez comment vous vous organisez pour réaliser cette activité :

Prenons l’exemple de la création d'un dashboard de datavisualisation, comprenant de nombreux composants graphiques, des filtres, des opérations de mutation de données et des représentations de détections sur des images, l'organisation du projet devient essentielle pour assurer une exécution fluide. Voici comment je m’organise pour découper et attribuer les tâches :

![][image3]

Découpage des tâches:

Le projet est découpé en plusieurs sous-tâches, en tenant compte des dépendances entre les différents composants du système (ex. front-end, back-end, traitement des données, intégration des APIs). Pour un dashboard complexe, les principaux modules incluent :

Composants graphiques du dashboard :
- Objectif : Intégrer des visualisations complexes comme des graphes interactifs, des cartes de chaleur (heatmaps), ou des bar charts dynamiques.
- Attribution : Ces tâches sont généralement attribuées aux développeurs front-end avec une expertise en D3.js pour les composants graphiques.
Système de masks et filtres sur les images :
- Objectif : Ajouter des masks dynamiques sur les images, permettant de filtrer et d’isoler des zones spécifiques (par exemple, masquer des objets détectés dans une image).
- Attribution : Cette partie est attribuée à des développeurs front-end expérimentés, maîtrisant Canvas ou WebGL, ainsi que des librairies comme Three.js pour le traitement des images en temps réel.
Opérations de mutation sur les données :
- Objectif : Créer des opérations de mutation de données en back-end qui permettent de modifier et mettre à jour les données en temps réel. Cela inclut le traitement des données de détection des objets, ou les ajustements manuels sur la datavisualisation.
- Attribution : Ces tâches sont attribuées aux développeurs back-end, qui travaillent avec GraphQL (pour les mutations) et Node.js pour orchestrer les modifications et gérer les interactions avec les bases de données.
Détection d'objets et représentations graphiques :
- Objectif : Intégrer un module de détection d’objets sur des photos et afficher visuellement ces objets sur le dashboard (par exemple, en plaçant des marqueurs ou en entourant les objets détectés).
- Attribution : Ces tâches combinent back-end (pour l’algorithme de détection, qui peut utiliser des services comme TensorFlow ou des algorithmes de machine learning) et front-end (pour la représentation graphique, souvent via D3.js ou des SVG interactifs).

Planification des sprints:

Après le découpage en tâches, je planifie les sprints en tenant compte des dépendances entre chaque module et en priorisant les fonctionnalités critiques :

Sprint 1 : Mise en place des composants de datavisualisation de base (graphiques et interactions simples), intégration des opérations de mutation sur les données, et mise en place des premières fonctionnalités de filtrage d’images.
Sprint 2 : Développement et intégration du système de masks dynamiques et des filtres plus complexes (par exemple, isolation des objets détectés).
Sprint 3 : Ajout des représentations graphiques pour la détection d'objets, et finalisation des fonctionnalités interactives du dashboard.
Sprint 4 : Tests et ajustements finaux, intégration avec le back-end et optimisation des performances.

Chaque sprint inclut des points de contrôle pour valider l’avancement et ajuster la roadmap en fonction des imprévus ou des retours de l’équipe.

Suivi régulier et ajustements:

Réunions quotidiennes (stand-ups)

Tous les jours, j’organise des stand-ups avec les membres de l’équipe pour :

Faire un point sur les tâches en cours.
Identifier les blocages éventuels, qu’ils soient d’ordre technique (dépendances front-back non résolues, retards dans les livraisons de données) ou organisationnel (surcharge d’une équipe).
Réajuster les priorités si des imprévus surviennent. Par exemple, si le développement du système de masks prend plus de temps que prévu, je peux allouer plus de ressources ou re-prioriser certaines tâches moins urgentes.

Revues de sprint:

À la fin de chaque sprint, j’organise une revue avec les parties prenantes (produit, marketing, ingénierie). Ces revues servent à :

Valider les fonctionnalités développées (par exemple, le bon fonctionnement des graphiques interactifs ou des systèmes de filtres).
Recueillir des retours d’expérience et ajuster les prochains sprints en fonction des besoins exprimés (ex. ajouter une fonctionnalité supplémentaire pour le filtrage des images).
Réajuster la roadmap si nécessaire, en fonction des délais ou des demandes nouvelles.

Quelles sont les habiletés, savoir-faire ou qualités requises pour effectuer cette activité ?

Pour réaliser efficacement cette activité de gestion de projet, plusieurs compétences et qualités sont nécessaires, mais certaines se sont révélées plus difficiles à maîtriser au début de mon poste, notamment la coordination et motivation des équipes et la gestion des conflits.

Coordination et motivation:

La capacité à coordonner les efforts de plusieurs équipes, tout en maintenant leur motivation, est une compétence que j'ai dû acquérir progressivement. Au départ, il m'était difficile d'assurer que chaque membre reste aligné sur les objectifs et que l'équipe garde une énergie positive malgré les défis. J'ai découvert que cette tâche est presque une dynamique sociale, où il faut savoir écouter, encourager, et maintenir un climat de confiance pour que tout le monde soit motivé et concentré.

Gestion des conflits et ajustements:

Au début de mon rôle, la gestion des conflits s'est également révélée complexe. Qu'il s'agisse de divergences d'opinions techniques ou de tensions liées aux délais, j'ai réalisé qu'il est essentiel d'aborder les désaccords avec diplomatie, en facilitant la communication pour éviter les blocages. Cette partie de mon travail m'a demandé de développer des compétences relationnelles plus fines et de trouver des compromis pour que l’équipe avance en restant soudée.

Avec le temps, j’ai compris que ces aspects relèvent beaucoup de l’intelligence émotionnelle et du leadership, des compétences qui s’acquièrent au fil des expériences. Maintenant, je vois la gestion de projet comme autant un travail technique qu'un travail de gestion humaine.

C.2.1.1 Définir les spécifications techniques de la solution {#c.2.1.1-définir-les-spécifications-techniques-de-la-solution}

Sélection des composantes techniques : Après avoir analysé les besoins fonctionnels, je choisis les composantes techniques les plus adaptées au projet, comme les progiciels, les composants applicatifs (ex : React.js pour le front-end, Flutter…), et les langages spécifiques (TypeScript, Dart, C..). Je prends également en compte les serveurs cloud (ex : AWS) et les middleware pour orchestrer les flux de données.

Définition des normes techniques et des flux de données : Je définis des normes techniques claires pour l’équipe, notamment les bonnes pratiques de codage et la gestion des versions. Je formalise également les interactions entre les composants et les flux de données (par exemple, utilisation de GraphQL pour optimiser les requêtes de données), tout en assurant une conception responsable du service numérique pour minimiser la consommation des ressources (écoresponsabilité).

Production du cahier des charges technique et fonctionnel : À partir de cette analyse, je rédige un cahier des charges technique qui spécifie les fonctionnalités à développer, les technologies à utiliser, et les contraintes à respecter. Ce document sert de base de référence pour l’équipe technique, garantissant la cohérence des implémentations futures.

###

C.2.1.2 Élaborer le cahier des charges {#c.2.1.2-élaborer-le-cahier-des-charges}

Évaluation des pratiques et outils existants : Avant d’élaborer le cahier des charges, j’analyse les outils et pratiques déjà en place dans l’entreprise. Si des technologies ou frameworks existants peuvent être réutilisés (comme des bibliothèques Ts ou des API internes), je les intègre dans la solution proposée pour gagner en efficacité et en continuité.

Prise en compte de l'accessibilité et de l'expérience utilisateur : Le cahier des charges intègre des directives précises sur les exigences en matière d’accessibilité pour les interfaces utilisateurs, et prend en compte l’expérience utilisateur (UX), en définissant des indicateurs de performance pour les interfaces web et mobiles.

Contraintes réglementaires : Je précise dans le cahier des charges les contraintes réglementaires (notamment le respect du RGPD pour la gestion des données utilisateurs). Cela inclut la gestion des consentements, la sécurité des informations personnelles, et la traçabilité des actions utilisateurs.

Définition des ressources : En collaboration avec les autres équipes, j’identifie les ressources nécessaires (humaines, financières, matérielles). Cela inclut les développeurs front-end et back-end, les designers UX/UI, les outils de développement.

###

C.2.2 Définir la méthodologie de gestion de projet {#c.2.2-définir-la-méthodologie-de-gestion-de-projet}

Sélection de la méthode de gestion de projet : J’opte pour la méthodologie Agile, en particulier Scrum, car elle favorise la flexibilité et permet d’ajuster rapidement les priorités en fonction des retours utilisateurs et des contraintes techniques. Cela inclut des sprints courts et des itérations régulières.

Appui sur des référentiels de bonnes pratiques : Je m’appuie sur des référentiels comme Scrum pour structurer le projet. Cela inclut la tenue des réunions quotidiennes (daily stand-ups), la gestion des backlogs, et l’organisation des revues de sprint pour ajuster les priorités.

Outils de suivi et planification : J'utilise des outils comme GitLab pour gérer les tâches, les assigner aux membres de l’équipe, et suivre l’avancement des sprints. Les tableaux de bord et feuilles de route permettent d’avoir une vision globale du projet et d’identifier rapidement les points bloquants.

Fiche Activité n° A3: Suivi des processus de développement et de CI/CD {#fiche-activité-n°-a3:-suivi-des-processus-de-développement-et-de-ci/cd}

Intitulé: Suivi des processus de développement et de CI/CD : merge requests, revues de code, tests unitaires / d’intégration / fonctionnels, déploiement.

Cette activité est: quotidienne x fréquente □ assez fréquente □ exceptionnelle □

Votre niveau de responsabilité

□ 1 : Exécution sous contrôle, application de consignes ou de procédures

□ 2 : Exécution autonome, amélioration ou optimisation de solutions, propositions

x 3 : Conception de programmes, d'actions, de cahiers des charges

□ 4 : Définition d’orientations et de stratégies

Décrivez cette activité:

Dans le cadre de mes responsabilités en suivi des processus de développement, je supervise l’ensemble de la chaîne, de l’intégration des modifications à la mise en production, en passant par les phases de tests et de revue de code. Mon rôle consiste à définir des méthodes efficaces, à mettre en œuvre des outils d’intégration et de livraison continue, et à garantir la sécurité des applications tout au long de leur cycle de vie.

Dans le cadre de notre plateforme CI/CD, je suis particulièrement fier d’avoir introduit une fonctionnalité ayant significativement réduit les risques de régression. Cette amélioration repose sur l’automatisation des mises à jour des interfaces TypeScript générées à partir du schéma GraphQL, assurant ainsi une cohérence constante entre le front-end et le back-end. Cette avancée a renforcé la fiabilité et la synchronisation des échanges de données, offrant une expérience utilisateur optimisée et un processus de développement plus fluide.

Fonctionnalité en détail : Mise à jour automatique des interfaces GraphQL

Notre API GraphQL est structurée autour d'un schéma, généré dynamiquement par la GraphQL Gateway. Lorsqu'un développeur back-end modifie ce schéma pour ajouter ou ajuster des resolvers, un webhook s’active et déclenche automatiquement un build CI/CD dans les applications front-end et mobile. Voici le fonctionnement détaillé de ce processus :

Génération des interfaces TypeScript
- À chaque modification du schéma, le pipeline CI/CD lance un build pour générer les interfaces TypeScript des resolvers exposés par l’API. Ce processus utilise GraphQL CodeGen, qui convertit les résolveurs du schéma en interfaces TypeScript spécifiques dans un dépôt dédié, appelé Repo shared.
- Cette étape est cruciale pour s’assurer que les changements du back-end soient intégrés sous forme de types sécurisés dans le front-end et le mobile, minimisant ainsi les risques d'incompatibilité.
Propagation des mises à jour dans les projets dépendants
- Une fois les interfaces générées, le job CI/CD crée automatiquement des builds pour les projets qui dépendent de shared, comme le front-end et le mobile. Ces projets déclenchent alors la création de merge requests (MR), intégrant les nouvelles interfaces TypeScript générées.
- Dans environ 90 % des cas, ces modifications sont parfaitement synchronisées et ne nécessitent aucune intervention humaine. Le code s’adapte automatiquement aux nouveaux types sans avoir à modifier manuellement les composants front-end ou mobile.
Gestion proactive des conflits potentiels
- Toutefois, il peut arriver qu’une mise à jour back-end affecte plus de resolvers que prévu. Dans ces cas, si les modifications nécessitent des ajustements dans le code front-end ou mobile, la merge request (et surtout l'échec de son build) permet de signaler la situation. Les développeurs peuvent ainsi visualiser les différences et apporter les ajustements nécessaires dans les composants concernés.
- Cette méthode préventive nous permet d’anticiper les conflits potentiels avant même le déploiement en production rendu impossible par l'échec de la pipeline intégrant les nouveaux interfaces, limitant ainsi drastiquement le nombre de régressions.

Ce processus automatisé a eu un impact significatif sur la réduction des régressions dans nos applications front-end et mobile. En intégrant automatiquement les modifications back-end dans les types TypeScript et en générant les MRs nécessaires, nous avons réussi à :

Diminuer les risques de déploiement en s’assurant que les applications front-end et mobile disposent des dernières modifications de l’API.
Optimiser la cohérence inter-équipes, car les développeurs front-end et mobile reçoivent automatiquement les interfaces mises à jour, facilitant la collaboration et minimisant les risques de confusion ou d'erreur.

Ce système, basé sur une orchestration rigoureuse de la CI/CD et l’automatisation des types GraphQL, représente une étape majeure vers un développement plus sûr et plus fluide pour nos applications, j’en suis très fier.

Mise en place d'outils et procédures de sécurité:

Dans mon domaine, la création et l'analyse de flux vidéo, la sécurité est primordiale en raison de la nature potentiellement confidentielle des contenus traités. Que ce soit des vidéos de surveillance, des retransmissions d'événements sensibles ou des données critiques liées à des entreprises ou des utilisateurs, la moindre faille de sécurité pourrait entraîner des violations de confidentialité aux conséquences graves, tant sur le plan juridique que pour la réputation des clients. De plus, avec la montée des cyberattaques et la sophistication des méthodes de piratage, il est impératif de garantir que toutes les données vidéo sont cryptées, protégées pendant leur transit et leur stockage, et accessibles uniquement aux utilisateurs autorisés. Cela inclut non seulement la protection des contenus eux-mêmes, mais aussi la sécurisation des métadonnées et des informations associées (comme l'identité des utilisateurs ou les événements horodatés), afin de prévenir toute exploitation malveillante ou divulgation non intentionnelle.

Pour garantir la sécurité et la confidentialité de l'application, je mets en place plusieurs protocoles de protection des logiciels :

Procédures d’authentification : Je définis des protocoles d'authentification sécurisés (OAuth 2.0) pour garantir un accès sécurisé aux utilisateurs tout en réduisant le risque d'accès non autorisé.

L’un des défis de l’application mobile est de permettre un accès hors ligne aux fonctionnalités de base, tout en maintenant la sécurité et l’intégrité des sessions. En mode hors ligne, les connexions au serveur sont impossibles, ce qui complique la gestion des tokens :

Stockage sécurisé des tokens : Pour permettre une reconnexion en ligne sécurisée dès que l’appareil retrouve un réseau, les refresh tokens sont stockés localement de manière sécurisée dans des espaces protégés du système (comme le Keychain d’iOS ou le Secure Storage d’Android). Cependant, ce stockage doit être sécurisé pour éviter les attaques potentielles en cas de vol de l’appareil.
Gestion des accès intermittents : Quand l’utilisateur passe en mode hors ligne et que l’access token expire, l’application ne peut pas utiliser le refresh token tant qu’elle n’est pas reconnectée. Pour pallier ce problème, certaines fonctionnalités non sensibles peuvent être rendues accessibles hors ligne à l’aide d’un cache local. Une fois la connexion rétablie, l’application utilise le refresh token pour renouveler l’access token et synchroniser les actions effectuées hors ligne.

Actuellement, je suis en train de pocker une implémentation de la blockchain pour assurer l'authenticité et l'intégrité des flux vidéo que nous gérons. L'objectif est d'utiliser la technologie blockchain pour enregistrer chaque frame vidéo sous forme de transactions immuables, garantissant ainsi qu'aucune image n'a été altérée, supprimée ou modifiée après l'enregistrement. Chaque frame serait horodatée et associée à un hash cryptographique, permettant de vérifier facilement si le flux vidéo est complet et intact. Je reviendrais sur cette implémentation dans la partie “veille technologique” mais il semblait pertinent de l'associer aussi à cette partie “sécurité”.

Déploiement et validation des livrables:

Dans la phase de déploiement et validation des livrables, chaque nouvelle fonctionnalité ou composant complexe passe par un processus rigoureux de validation, tests, et recettage pour garantir que tout fonctionne comme prévu avant de passer en production. Un exemple pertinent de ce processus est le développement et déploiement d'un viewer immersif 3D permettant l'intégration de modèles 3D BIM (Building Information Modeling). Ce projet, impliquant des rendus complexes et des interactions immersives, nécessitait une validation minutieuse pour assurer une performance fluide et une expérience utilisateur optimale.

1. Préparation et planification de la phase de déploiement

Avant de lancer le déploiement, une étape de préparation est essentielle :

Définition des critères de validation : Pour le viewer 3D, les critères incluaient la fluidité des animations, la précision du rendu des modèles 3D, et la réactivité des interactions utilisateur. Ces critères, validés en amont avec les parties prenantes (produit, design, et développement), servent de base pour l’évaluation des tests.
Test préprod (QA) : Nous avons configuré un environnement de staging identique à celui de production, permettant de tester le viewer 3D dans des conditions similaires, avec les mêmes capacités de rendu et ressources GPU que l'utilisateur final.

2. Validation fonctionnelle et recettage

Pendant la phase de recettage, des tests spécifiques ont été menés pour évaluer les performances et détecter d’éventuels problèmes :

Tests d’intégration des modèles BIM : Nous avons testé l’importation et le rendu de différents modèles BIM dans le viewer pour vérifier que le moteur 3D pouvait les charger et les manipuler sans ralentissement, et que la précision des détails était conservée.
Tests de performance : En raison de la complexité graphique, des tests de performance ont été effectués pour garantir que les animations et les rendus restent fluides, même sur des appareils moins puissants. Des outils comme WebGL Profiler et FPS monitoring ont permis d’identifier les zones à optimiser pour maintenir un taux d’images par seconde (FPS) acceptable.

3. Gestion des retours et ajustements

Des retours détaillés des parties prenantes et des tests utilisateurs ont permis d'affiner le viewer avant la mise en production :

Améliorations UX : Des ajustements ont été faits sur les interactions de navigation, notamment pour optimiser le zoom, la rotation et le panoramique, assurant une expérience utilisateur intuitive et immersive.
Optimisation des assets 3D : En réponse aux retours, nous avons optimisé les fichiers 3D pour réduire leur poids sans perdre de qualité, améliorant ainsi le temps de chargement.

4. Mise en production et suivi des incidents

La mise en production est la dernière étape, et un système de suivi des incidents est essentiel pour assurer une transition en douceur :

Déploiement en CI/CD : Le viewer 3D a été déployé via un pipeline CI/CD, qui inclut une étape finale de tests automatisés pour valider le bon fonctionnement du viewer après le déploiement.
Monitoring post-déploiement : Après le déploiement, des outils de monitoring (comme Sentry) sont activés pour suivre la performance et identifier d’éventuelles erreurs en temps réel. Cela permet d'intervenir rapidement si un problème survient et d'assurer une expérience utilisateur stable.

Pour réaliser cette activité, vous êtes en relation à l’interne de votre organisation :

Avec qui (fonction, rôle, service, etc) ?	A quel(s) sujet(s) ? pour faire quoi ?
Développeurs Backend	Coordination sur les merge requests et la validation des modifications dans l’API GraphQL. Nous travaillons sur l’intégration des changements dans les interfaces front-end, en vérifiant les dépendances via le CI/CD
Développeurs Front-End / Mobile	Revue des merge requests et synchronisation avec les modifications backend. Nous collaborons pour s’assurer que les interfaces et composants sont à jour avec les données API, notamment via des tests d’intégration automatisés
CTO	Suivi global des processus CI/CD et de la méthodologie Agile. Nous discutons des améliorations à apporter pour optimiser les builds et validons la feuille de route technique pour maintenir l’efficacité et la sécurité des déploiements.

Pour réaliser cette activité, vous êtes en relation à l’externe de votre organisation :

Avec qui (fonction, rôle, service, etc) ?	A quel(s) sujet(s) ? pour faire quoi ?
/	/

Pour effectuer cette activité, vous traitez des informations :

De quelles Informations avez-vous besoin ? Comment et auprès de qui vous les procurez-vous ?	Comment les utilisez-vous ? Quel(s) Traitement(s) effectuez-vous ?	Transmettez-vous des informations ? A qui ? Pour quoi faire ? Comment ?
Spécifications fonctionnelles et techniques des fonctionnalités : Besoins produits, exigences utilisateur et contraintes techniques. Recueillies auprès de l’équipe produit et des développeurs backend via réunions, tickets GitLab.	Ces informations sont analysées pour définir les objectifs de chaque sprint, planifier les tâches, et aligner les priorités avec les capacités de l’équipe. Les spécifications sont décomposées en tâches claires et assignées aux développeurs	À l’équipe de développement : Je partage les spécifications décomposées sous forme de tâches dans GitLab et via des réunions de sprint planning pour définir les priorités, clarifier les exigences et coordonner le travail entre le front-end et le back-end
État des tests (unitaires, intégration, fonctionnels) : Résultats des tests pour détecter les anomalies et les régressions. Recueillis via GitLab CI/CD	J'analyse les résultats pour identifier les tests échoués et détecter les régressions potentielles. Les correctifs sont priorisés et les développeurs concernés sont informés pour réagir rapidement et maintenir la stabilité des builds	Aux développeurs concernés : Je transmets les résultats de tests et des rapports d’erreurs via GitLab et en stand-up quotidien pour résoudre les anomalies rapidement et garantir la qualité du code livré
Mises à jour des API et changements d’architecture : Informations sur les modifications de l’API GraphQL et les impacts possibles. Partagées par les développeurs backend via les merge requests et GitLab.	Je mets à jour les interfaces TypeScript en générant automatiquement les types avec GraphQL Code Generator pour prévenir les régressions dans le front-end et mobile, tout en s’assurant que l’API est alignée avec le front-end	Aux développeurs front-end et mobile : Les modifications sont transmises via des merge requests automatiques dans GitLab, où les nouvelles interfaces sont intégrées et les développeurs peuvent examiner les impacts et ajuster le code si nécessaire
Rapports de conformité et de sécurité : Données sur les normes de sécurité, les audits et les tests de conformité. Obtenues dans les résultats des builds via Sonnar.	Les informations sont utilisées pour intégrer les tests de sécurité dans le pipeline CI/CD, et pour s'assurer que les pratiques de sécurité (comme le stockage sécurisé et l’authentification) sont respectées avant chaque déploiement.	Au responsable sécurité et au CTO : J'informe des résultats des tests de sécurité et des failles potentielles via des rapports détaillés et alertes pour organiser les correctifs nécessaires et garantir la conformité du projet aux exigences de sécurité
Retours des utilisateurs et priorités des fonctionnalités : Feedback utilisateur consolidé par l’équipe produit et marketing à partir de retours directs et des tickets support. Partagé lors des revues de sprint.	Ces retours permettent d’ajuster les priorités en fonction des besoins utilisateurs et de planifier les améliorations dans le backlog. Les ajustements sont intégrés dans les cycles suivants pour répondre aux attentes du marché	À l’équipe de développement et au produit : Je partage les feedbacks lors des revues de sprint et en backlog grooming, pour prioriser les fonctionnalités et les améliorations. Des points réguliers assurent que l'équipe reste alignée avec les attentes des utilisateurs et les objectifs de l'entreprise.

Quels sont les outils, techniques, logiciels, produits que vous utilisez pour réaliser cette activité ?

Pour réaliser cette activité j’utilise une combinaison d’outils, techniques, et logiciels qui facilitent la collaboration et automatisent le pipeline de développement. Voici les principaux outils employés :

GitLab : Utilisé pour la gestion des versions et l'intégration continue (CI/CD). GitLab permet de créer des merge requests, de réaliser des revues de code, et d'automatiser les tests et déploiements. Les pipelines GitLab CI/CD sont configurés pour exécuter les tests unitaires, d’intégration, et de sécurité à chaque commit et avant le déploiement.
GitLab CI/CD Pipelines : Les pipelines incluent des étapes d'automatisation pour chaque phase, allant de la génération des interfaces TypeScript basées sur le schéma GraphQL aux tests de sécurité, garantissant une vérification complète avant le passage en production.

3. Outils de tests automatisés

Jest : Utilisé pour les tests unitaires des composants JavaScript/TypeScript, il permet de vérifier la fonctionnalité de chaque unité de code et d’identifier les régressions rapidement.
GraphQL CodeGen : Cet outil génère automatiquement les types TypeScript depuis le schéma GraphQL, ce qui limite les erreurs de typage et facilite la synchronisation entre le front-end et le back-end.

4. Surveillance de la performance et sécurité

Sentry : Utilisé pour le monitoring des performances et le suivi des erreurs en production. Ces outils envoient des alertes en cas de dégradations de performance ou d’incidents, permettant une intervention rapide.
SonarQube : Pour l’analyse statique du code, il aide à détecter les failles de sécurité et à assurer le respect des bonnes pratiques de codage, garantissant un code plus propre et plus sécurisé (cet outil est directement intégré à tous les projets dont je suis responsable).

5. Outils de communication

Slack : Facilitant la communication rapide entre les membres de l’équipe, Slack est aussi intégré avec GitLab pour recevoir des notifications sur les merge requests, les builds, et les tests. Cela permet une collaboration fluide et des ajustements rapides en cas d’erreurs ou d’incidents.

Décrivez comment vous vous organisez pour réaliser cette activité :

1. Planification et définition des tâches

Définir les objectifs : Je commence par fixer les objectifs pour chaque fonctionnalité ou amélioration à intégrer au pipeline CI/CD. Ces objectifs sont clarifiés lors des réunions de planning avec les parties prenantes et les développeurs.
Décomposition des tâches : Une fois les objectifs définis, je segmente les activités en tâches spécifiques, telles que l’ajout de tests unitaires pour une nouvelle fonctionnalité, l’optimisation des étapes du pipeline, ou la mise en place de nouveaux outils de monitoring.

2. Configuration et surveillance du pipeline CI/CD

Automatisation des étapes CI/CD : J’organise les étapes de build, test, et déploiement au sein de GitLab CI/CD. Par exemple, pour chaque commit, le pipeline lance des tests unitaires avec Jest, des tests d’intégration avec Cypress et des vérifications de sécurité avec Sonar.
Suivi des builds : J’utilise GitLab pour monitorer en temps réel l’état des builds et des déploiements. En cas de défaillance ou d’échec de test, le pipeline envoie des notifications sur Slack, permettant de réagir rapidement.

3. Revue de code et gestion des merge requests

Processus de revue : Les développeurs soumettent leurs modifications via des merge requests sur GitLab. Je m’assure qu’elles sont bien structurées et que les tests appropriés sont inclus. Les revues de code sont ensuite réparties dans l’équipe pour valider les modifications.
Validation des merge requests : Une fois les tests réussis et la revue approuvée, les merge requests sont fusionnées, déclenchant automatiquement un nouveau build dans le pipeline CI/CD pour s’assurer qu’aucune régression n’est introduite.

4. Validation et recettage

Tests de validation fonctionnelle : Avant chaque déploiement en production, je m’assure que des tests fonctionnels et de performance sont exécutés pour valider les fonctionnalités et garantir la stabilité. L’équipe QA effectue une recette complète sur l’environnement de staging.
Recueil des feedbacks : Après le recettage, je discute avec les équipes produit et QA pour recueillir des feedbacks et identifier les ajustements à effectuer avant le passage en production.

5. Suivi post-déploiement et ajustements

Monitoring et gestion des incidents : Après le déploiement, j’utilise des outils comme Sentry pour surveiller la performance et repérer les erreurs. Les alertes sont configurées pour déclencher des notifications instantanées en cas d’incident.
Rapports et améliorations continues : Je génère des rapports de performance du pipeline et partage les résultats avec l’équipe. Les enseignements tirés sont ensuite intégrés pour ajuster et optimiser le pipeline, améliorant ainsi la stabilité et l’efficacité des prochains déploiements.

Quelles sont les habiletés, savoir-faire ou qualités requises pour effectuer cette activité ?

1. Compétences techniques approfondies

Maîtrise des outils CI/CD : Connaissance approfondie de plateformes comme GitLab CI/CD est essentielle pour configurer et gérer les pipelines d’intégration et de déploiement continus. Savoir intégrer les outils de test et de déploiement et automatiser les tâches dans le pipeline est crucial.
Connaissances en tests automatisés : Il est important de bien comprendre les tests unitaires, d’intégration et fonctionnels, ainsi que leur configuration dans le pipeline CI/CD pour garantir que le code est toujours stable et sans régression avant d’être déployé.
Sécurité des applications : La capacité à implémenter des pratiques de sécurité, comme l’intégration de tests de sécurité (analyse statique de code, vulnérabilités) via des outils comme Sonar, est cruciale pour assurer la conformité et la protection des données.

2. Savoir-faire en gestion de projet et organisation

Gestion des priorités : Savoir prioriser les tâches et organiser les sprints pour répondre aux objectifs de l’entreprise tout en respectant les contraintes de temps et de ressources.
Suivi de la qualité et contrôle des versions : Comprendre et mettre en œuvre des processus rigoureux pour la gestion des versions (versioning) et des merge requests afin de garantir la qualité du code tout au long des cycles de développement.
Capacité d'analyse et résolution de problèmes : Être capable de diagnostiquer les problèmes du pipeline CI/CD et de déboguer rapidement en cas de builds échoués, de tests de sécurité en échec ou de conflits dans les versions.

Ces habiletés et qualités sont essentielles pour assurer la fiabilité, la performance et la sécurité des applications, tout en permettant une gestion de projet efficace et une communication fluide entre les équipes.

Cette activité couvre plusieurs domaines de compétences du référentiel visé, en s’alignant notamment sur les compétences de méthodologie de gestion de projet, mise en place de plateformes de développement, protection du logiciel, et déploiement de projet. Voici comment cette activité correspond aux domaines du référentiel :

C.5.1 Mettre en place et maintenir les plateformes de développement {#c.5.1-mettre-en-place-et-maintenir-les-plateformes-de-développement}

Définition des outils de livraison continue : La sélection et la configuration d’outils comme les CIs de GitLab permettent d’automatiser les phases de build de test (de lint), et de déploiement, en assurant un flux de travail continu et fiable. Ces pipelines de livraison continue sont essentiels pour la gestion fluide et l’optimisation des délais dans le développement logiciel.

Automatisation de l’intégration continue : En intégrant des tests automatisés (unitaires, d’intégration et de sécurité) dans le pipeline CI/CD, cette activité met en place des automatismes permettant de vérifier chaque mise à jour du code. Cela assure un développement continu des applications et minimise les risques de régressions, garantissant ainsi que les applications restent stables et sécurisées à chaque étape.

C.5.2.1 Mettre en place des outils de protection du logiciel {#c.5.2.1-mettre-en-place-des-outils-de-protection-du-logiciel}

Sécurité et protection des données : L’intégration de normes de sécurité dans le pipeline CI/CD, comme les tests de vulnérabilité via Sonar et le contrôle d’accès par API access token, permet de garantir la sécurité des applications à chaque étape du développement. Ces pratiques incluent notamment l’utilisation de normes cryptographiques pour protéger les données.

Procédures d’authentification et de stockage sécurisé : La mise en place de procédures d’authentification, comme l’utilisation de tokens JWT pour sécuriser les sessions, s’intègre aux tests automatisés pour garantir que les applications restent sécurisées, notamment lors des accès aux données critiques.

C.5.3 Déployer un projet {#c.5.3-déployer-un-projet}

Validation fonctionnelle et recettage : Avant chaque déploiement, des tests fonctionnels sont réalisés pour vérifier le bon comportement de l’application. Cette validation inclut les tests de performance et les tests utilisateur en environnement de staging pour s'assurer que toutes les fonctionnalités sont opérationnelles.

Gestion des incidents et de la qualité : Les outils de monitoring, comme Sentry, permettent un suivi post-déploiement et facilitent la détection d’incidents. En surveillant les performances en temps réel, ces outils aident à assurer une haute qualité du code et à intervenir rapidement en cas de problème.

Fiche Activité n° A5: Rédaction de la documentation technique {#fiche-activité-n°-a5:-rédaction-de-la-documentation-technique}

Intitulé: Rédaction de la documentation technique

Cette activité est: quotidienne □ fréquente x assez fréquente □ exceptionnelle □

Votre niveau de responsabilité

□ 1 : Exécution sous contrôle, application de consignes ou de procédures

□ 2 : Exécution autonome, amélioration ou optimisation de solutions, propositions

x 3 : Conception de programmes, d'actions, de cahiers des charges

□ 4 : Définition d’orientations et de stratégies

Décrivez cette activité:

Pour assurer une documentation technique claire et exploitable, j’utilise Storybook et un README détaillé, ce qui permet de standardiser l’architecture et de faciliter la prise en main des composants, des bonnes pratiques et des messages échangés entre les services.

Au début de mon travail dans l’équipe, tout se passait bien, les projets avançaient et la collaboration semblait fluide. Cependant, avec le temps et la croissance de l’équipe, j’ai commencé à remarquer certaines difficultés, notamment en ce qui concerne la cohérence visuelle et fonctionnelle de nos interfaces. Plus les contributions s’accumulaient, plus il devenait difficile de maintenir des standards homogènes, surtout lorsque de nouveaux développeurs rejoignaient le projet. Les nouveaux composants étaient parfois créés sans suivre les mêmes conventions, et il arrivait souvent que chacun perde du temps à retrouver l’information ou à comprendre comment utiliser les éléments déjà existants.

Rapidement, j’ai constaté que cette absence de documentation visuelle et centralisée des composants engendrait des frictions. Chaque fois que le code évoluait, il devenait compliqué de s’assurer que tout le monde restait aligné sur les bonnes pratiques. J’ai alors pris conscience que sans un référentiel unique et visuel pour nos composants, on risquait de voir apparaître des doublons, des incohérences et même des erreurs dans l’interface.

C’est à ce moment-là que j’ai commencé à chercher une solution pour mieux organiser et documenter nos composants. Après quelques recherches, je suis tombé sur Storybook, un outil qui m’a tout de suite paru intéressant. Il permet de visualiser et de documenter chaque composant dans un environnement isolé, et surtout, il peut être intégré directement dans notre pipeline CI/CD sur GitLab. En testant Storybook, j’ai compris que chaque composant pouvait être documenté avec des exemples interactifs, des explications claires et des notes d’usage. Et surtout, dès qu’un composant est modifié, sa documentation se met automatiquement à jour.

J’ai donc décidé d’implémenter Storybook dans notre workflow. Cela me permet désormais de garantir une documentation toujours à jour, accessible à tous, et de simplifier l’onboarding des nouveaux arrivants dans l’équipe. En intégrant Storybook, j’ai pu non seulement améliorer la collaboration et la cohérence, mais aussi assurer que chaque membre de l’équipe, nouveau ou ancien, dispose d’une référence fiable pour comprendre et utiliser nos composants. Storybook est devenu un outil essentiel pour la qualité et la productivité de notre travail collectif.

Exemple de documentation de mon composant de liste virtuelle :

J’ai créé un composant de liste virtuelle dans Storybook, conçu pour afficher efficacement de très grands volumes d’éléments sans surcharger le DOM, ce qui améliore significativement les performances. Ce composant prend en charge plusieurs paramètres, accessibles dans Storybook pour configurer les comportements :

Nombre d’éléments à afficher dans la vue,
Taille de chaque élément (hauteur/largeur),
Index de l’élément de départ pour contrôler la position de départ dans la liste,
Fonctions de chargement différé pour les cas où les données doivent être chargées au défilement.

Ces paramètres sont ajustables directement dans Storybook, permettant de tester diverses configurations et de s’assurer que le composant répond bien aux besoins des différents contextes d’utilisation.

Organisation atomique des composants : Pour garder une structure claire et maintenir la réutilisabilité, j’ai adopté une organisation atomique des composants dans Storybook, les séparant en catégories d’atomes, de molécules et d’organismes. Par exemple :

Atomes : Boutons, icônes, entrées de texte.
Molécules : Composants plus complexes tels que des champs de recherche ou des boutons combinés avec des icônes.
Organismes : Composants avancés comme la liste virtuelle ou des tables de données configurables.

Cette organisation atomique permet une meilleure visibilité sur la bibliothèque de composants, simplifie la navigation dans Storybook, et garantit que chaque composant est réutilisable et modulaire.

Travailler avec Storybook force nous oblige à développer chaque composant de manière isolée du reste de l'application, ce qui présente de nombreux avantages. Développer en isolation permet de se concentrer sur la logique et le comportement d'un composant sans être distrait ou affecté par les dépendances externes ou le contexte global de l'application. Cela réduit considérablement les risques d’effets de bord indésirables et permet de garantir que le composant fonctionne parfaitement dans n’importe quel contexte d’utilisation.

Par exemple, en développant mon composant de liste virtuelle, j’ai pu tester et ajuster précisément la gestion des données volumineuses et du chargement différé, en simulant des scénarios variés directement dans Storybook. Cette isolation m'a permis de détecter et corriger des bugs spécifiques liés à la performance du défilement dans de grandes listes, avant même d'intégrer le composant dans l'application. De plus, tester des paramètres comme la taille des éléments ou l’index de départ de manière indépendante a rendu les tests plus rapides et plus fiables. Grâce à cette approche, le composant est désormais prêt à être utilisé dans différents projets sans risques de dysfonctionnement, car il a déjà été testé dans différents scénarios d’usage en isolation.

Le README est le point central de documentation pour le projet, offrant un aperçu général des bonnes pratiques, des outils utilisés, et des spécifications techniques.

Bonnes pratiques et liens vers les outils : Le README contient une section dédiée aux bonnes pratiques de développement, en détaillant les conventions de codage, les structures de fichiers, et les guidelines de sécurité. J’y ai également ajouté des liens directs vers les outils et bibliothèques utilisés, comme GitLab pour la gestion de projet, GitLab CI/CD pour l’intégration continue, et SonarQube pour l’analyse de code.

Documentation des messages Protobuf : Étant donné que le projet utilise Protocol Buffers (protobuf) pour la communication entre services, le README inclut une section dédiée à la documentation des messages Protobuf. Celle-ci détaille la structure des messages, les types de données attendus et les méthodes d’implémentation pour assurer une communication interservices fluide et cohérente. Cette documentation aide les développeurs à comprendre la structure des données échangées et garantit une mise à jour rapide si les spécifications de messages évoluent.

Grâce à Storybook et à un README structuré, la documentation de l’architecture est claire, accessible et facilement modifiable. Ces outils permettent une compréhension rapide des composants et de l’architecture, tout en favorisant la maintenabilité et l’évolutivité du projet.

Pour réaliser cette activité, vous êtes en relation à l’interne de votre organisation :

Avec qui (fonction, rôle, service, etc) ?	A quel(s) sujet(s) ? pour faire quoi ?
Développeurs Front-End	Collaboration sur la documentation des composants Storybook, pour s’assurer que chaque composant est bien documenté et modulaire. Nous vérifions ensemble les propriétés et les configurations disponibles.
Développeurs Mobiles	Échanges sur la documentation des composants réutilisables entre le web et le mobile, pour maximiser le partage de code et optimiser la consistance des interfaces sur toutes les plateformes.
Équipe Produit/Design (UI/UX)	Discussions sur les spécifications des composants et les attentes visuelles dans Storybook. Nous validons les interactions et les états des composants pour garantir la conformité aux normes UX/UI.
Équipe Backend	Coordination pour la documentation des messages Protobuf et des interactions front-back. Les développeurs back-end partagent les mises à jour d'API pour que je les intègre dans la documentation.

Pour réaliser cette activité, vous êtes en relation à l’externe de votre organisation :

Avec qui (fonction, rôle, service, etc) ?	A quel(s) sujet(s) ? pour faire quoi ?
/	/

Pour effectuer cette activité, vous traitez des informations :

De quelles Informations avez-vous besoin ? Comment et auprès de qui vous les procurez-vous ?	Comment les utilisez-vous ? Quel(s) Traitement(s) effectuez-vous ?	Transmettez-vous des informations ? A qui ? Pour quoi faire ? Comment ?
Spécifications des composants et exigences UX/UI : Requises pour documenter les composants dans Storybook et s’assurer qu’ils répondent aux standards visuels et fonctionnels. Recueillies auprès de l’équipe produit et des designers UX/UI lors de réunions de cadrage et d’échanges.	Ces informations sont utilisées pour définir les paramètres des composants (ex : tailles, couleurs, interactions) et rédiger des descriptions dans Storybook. J’ajoute également les contraintes UX/UI pour guider les développeurs sur les usages appropriés des composants.	À l’équipe de développement : Je transmets la documentation de chaque composant dans Storybook pour aider les développeurs à comprendre les configurations et l’utilisation de chaque élément dans l’interface. Partagée via Storybook et des réunions de revue des composants.
Mises à jour d’API et messages Protobuf : Nécessaires pour documenter les interactions front-end/back-end et garantir la compatibilité. Les informations sont obtenues des développeurs back-end via des mises à jour dans GitLab.	J’intègre les détails de l’API et des messages Protobuf dans le README pour que les développeurs front-end aient des informations à jour. Cela inclut les types de données, les endpoints et la structure des messages échangés.	À l’équipe front-end et mobile : Je partage les mises à jour API et les nouveaux messages Protobuf dans le README et en Slack pour permettre une intégration rapide des changements côté front-end et mobile, tout en minimisant les risques d’incompatibilité.
Bonnes pratiques de développement et sécurité : Requises pour la section des bonnes pratiques dans le README. Je recueille ces informations via plusieurs canaux : auprès du responsable sécurité pour les règles internes, via les guidelines d'équipe et des références partagées lors de réunions, et par le biais de veille technologique quotidienne. Cette veille me permet de suivre les recommandations de grands contributeurs open-source comme Airbnb pour le style de code et les pratiques en matière de sécurité.	Ces informations sont intégrées dans le README sous forme de guidelines de développement et de sécurité pour orienter les développeurs. Cela inclut des conventions de codage (ex : style de code, nommage, organisation des fichiers) et des pratiques de sécurité (authentification, protection des données).	À l’ensemble des développeurs : Je transmets le README avec les bonnes pratiques à suivre via GitLab, pour m’assurer que tous aient accès aux règles de sécurité et guidelines. Cela est intégré lors des séances d’onboarding et des revues de sécurité.

Quels sont les outils, techniques, logiciels, produits que vous utilisez pour réaliser cette activité ?

Storybook :

Storybook est la plateforme principale pour documenter et visualiser les composants d’interface utilisateur de manière isolée. Il permet d’explorer les différentes variations et états des composants, de tester leurs propriétés et interactions en direct, et de produire une documentation claire pour chaque composant UI.

Grâce à Storybook, je peux organiser les composants selon une architecture atomique (atomes, molécules, organismes), ce qui structure la bibliothèque et facilite la navigation et la réutilisation des éléments. Les développeurs peuvent rapidement comprendre les fonctionnalités et usages de chaque composant.

Markdown et README.md :

Le README.md, rédigé en Markdown, est essentiel pour structurer les informations générales sur le projet. Markdown permet de créer des sections claires avec des titres, listes, liens, et code en ligne, rendant la lecture et la navigation dans le README simple et accessible.

J’y inclus des bonnes pratiques de développement (obtenues par veille technologique, guidelines d’équipe et recommandations open-source comme celles d’Airbnb), ainsi que des liens vers des outils internes (ex : GitLab CI/CD Storybook, pour la documentation plus détaillée).

GitLab :

GitLab est la plateforme de gestion de versions et d’hébergement des dépôts où le README est stocké et partagé. Avec GitLab, les développeurs peuvent consulter la documentation, apporter des contributions et suggestions via des merge requests, et suivre les mises à jour des bonnes pratiques et des spécifications techniques.

GitLab permet également d’intégrer Storybook au pipeline CI/CD, pour s'assurer que la documentation des composants est automatiquement mise à jour en fonction des modifications dans le code.

En plus de ses fonctionnalités de gestion de versions et d’intégration continue, GitLab sera également un outil précieux pour l’onboarding des nouveaux employés. En centralisant la documentation et les spécifications techniques, GitLab permet aux nouveaux membres de l'équipe de rapidement se familiariser avec les projets en cours. Grâce à la visibilité sur les dépôts, les pratiques de code et les pipelines CI/CD, les nouveaux arrivants peuvent non seulement comprendre la structure des projets, mais aussi explorer les contributions et suggestions existantes via les merge requests. Avec l’intégration de Storybook, la documentation des composants est constamment à jour, ce qui aide les nouvelles recrues à se repérer dans les composants et les standards de l’équipe, accélérant ainsi leur montée en compétence et leur intégration au sein de l’équipe.

Décrivez comment vous vous organisez pour réaliser cette activité :

Planification et collecte d’informations:

Définir les objectifs de la documentation : J’identifie les informations essentielles à inclure dans le README et Storybook, comme les spécifications techniques des composants, les bonnes pratiques, et les détails sur les interactions entre les services. Cette étape est faite en collaboration avec l’équipe produit, les développeurs et les parties prenantes pour s’assurer que les besoins de chacun sont bien couverts.
Collecte des informations techniques : J’obtiens les informations techniques en échangeant avec les équipes front-end, back-end, et sécurité, et en effectuant une veille technologique pour intégrer des bonnes pratiques (par exemple, les conventions d’Airbnb pour le style de code). Les échanges sont organisés en réunions et via les outils de documentation partagés (README, StoryBook).

Création et structuration de la documentation:

Rédaction du README : Je commence par une ébauche du README en Markdown, structurant le document en sections claires (installation, démarrage, bonnes pratiques, liens vers des outils internes). Le README inclut les bases techniques du projet et les références vers des outils, comme GitLab CI/CD ou SonarQube, avec une section dédiée aux bonnes pratiques et à la sécurité.
Configuration de Storybook pour chaque composant : J’organise les composants dans Storybook en suivant une structure atomique (atomes, molécules, organismes), qui rend la bibliothèque plus facile à explorer. Pour chaque composant, j’ajoute des descriptions, les paramètres configurables (ex : couleurs, tailles, événements), et des exemples d’usage, comme le composant de liste virtuelle qui gère de gros volumes de données.
Documentation des messages Protobuf : Je documente les messages Protobuf utilisés pour les échanges de données interservices. Cette documentation inclut la structure des messages, les types de données, et les cas d’usage, et est intégrée au README pour que l’équipe front-end comprenne facilement les interactions avec le back-end.

Validation et itération:

Relecture et validation avec les équipes : Une fois la documentation rédigée, je la partage avec les développeurs et le responsable sécurité pour relecture et validation. J’effectue des ajustements en fonction de leurs retours, notamment pour m’assurer que les descriptions techniques sont suffisamment claires et complètes.
Tests visuels dans Storybook : J’utilise Storybook pour effectuer des tests visuels et vérifier que chaque composant se comporte comme prévu dans ses différentes configurations. Cela permet de détecter d’éventuelles erreurs dans la documentation ou des incohérences dans les composants.

Mise à jour continue:

Suivi des modifications et mise à jour de la documentation : À chaque modification de l’architecture ou des composants, je mets à jour Storybook et le README pour refléter les changements. Les modifications sont communiquées via GitLab et lors des stand-ups pour que chaque membre de l’équipe soit informé.
Veille et amélioration des bonnes pratiques : Je continue d’enrichir la documentation avec les nouvelles bonnes pratiques issues de la veille technologique et des retours d’expérience des développeurs. Cela permet de maintenir un standard de qualité élevé et d’optimiser la documentation en continu.

Cette organisation permet une documentation technique détaillée, évolutive et accessible, ce qui facilite l’intégration des nouvelles fonctionnalités, la réutilisation des composants, et la collaboration efficace entre les équipes.

Quelles sont les habiletés, savoir-faire ou qualités requises pour effectuer cette activité ?

Pour effectuer l’activité de rédaction de la documentation technique, plusieurs compétences et qualités sont requises pour garantir une documentation claire, précise et facilement exploitable par les équipes techniques.

Compétences techniques approfondies:

Maîtrise des outils de documentation : La connaissance de Markdown pour le README et de Storybook pour la documentation interactive des composants est essentielle. Il est important de comprendre comment structurer le README pour que les informations soient claires et organisées, ainsi que comment configurer Storybook pour qu’il reflète précisément les états, propriétés, et configurations des composants.
Connaissances en développement front-end et back-end : Pour documenter les interactions front-back et les composants d’interface, une solide compréhension des frameworks (par ex. React/Next.js et GraphQL) et des concepts front-back est nécessaire. Cela inclut la connaissance des protocoles d’échange de données comme Protobuf, afin d’assurer une documentation précise de la structure et des types de messages.

Savoir-faire en organisation et structuration de l’information:

Capacité de synthèse et de vulgarisation : La documentation technique doit être accessible aux développeurs de tous niveaux. Il est important de savoir synthétiser les informations techniques complexes et de les expliquer en termes clairs et concis, sans perdre en précision. Cela inclut l’usage de schémas ou d’exemples d’utilisation dans Storybook pour montrer les fonctionnalités des composants.
Organisation structurée : La capacité à structurer la documentation pour qu’elle soit facile à naviguer est cruciale. En organisant les composants selon une architecture atomique dans Storybook et en segmentant le README en sections claires (installation, configuration, bonnes pratiques), on facilite la consultation et la mise à jour de la documentation.

Cette activité couvre plusieurs domaines de compétences du référentiel visé, notamment C.3.4 et C.5.2.2.

C.3.4 : Mettre en place et documenter une architecture logicielle {#c.3.4-:-mettre-en-place-et-documenter-une-architecture-logicielle}

Création et alimentation d’une bibliothèque logicielle :

En documentant les composants dans Storybook et en les structurant selon une organisation atomique (atomes, molécules, organismes), j’alimente une bibliothèque logicielle modulaire, facilitant la compréhension et la réutilisation des éléments de l’interface.
Cette organisation en composants atomiques rend la bibliothèque plus flexible et évolutive. Chaque composant est documenté de manière autonome, permettant à l’équipe de le comprendre et de l’intégrer facilement dans divers contextes, ce qui garantit l’évolutivité de l’architecture.

Assurance de la maintenabilité :

Storybook permet de documenter visuellement chaque composant avec ses différentes configurations, interactions, et props. Cette documentation interactive permet aux développeurs d’anticiper les comportements de chaque composant, améliorant la maintenabilité à long terme.
En centralisant les spécifications des messages Protobuf dans le README, les échanges de données front-back sont clarifiés, ce qui réduit les risques de malentendus et facilite la mise à jour des composants back-end sans risque de rupture.

C.5.2.2 : Concevoir et valider la documentation technique et utilisateur {#c.5.2.2-:-concevoir-et-valider-la-documentation-technique-et-utilisateur}

Modalités d’usage et spécificités techniques :

Le README précise les modalités d’usage de chaque composant et des configurations techniques, en expliquant comment configurer et utiliser les composants dans des termes adaptés aux développeurs front-end et back-end. Storybook permet également de voir les props et configurations disponibles pour chaque composant.
Dans Storybook, chaque composant dispose d’une documentation sur ses propriétés, variantes, et interactions. Cela permet aux développeurs de visualiser immédiatement les options disponibles et les états possibles d’un composant, facilitant son utilisation dans divers cas d’usage.

Explication des enjeux pour les parties prenantes :

Le README inclut une section sur les bonnes pratiques de développement et de sécurité, expliquant leur importance pour la qualité globale du code et la sécurité de l’application. Ces informations permettent aux parties prenantes de comprendre les implications des choix techniques pour la sécurité et l’efficacité de l’application.
En documentant la structure atomique des composants, j’explique également en quoi cette organisation facilite la réutilisation et la standardisation des éléments de l’interface, ce qui est bénéfique pour l’équipe produit en termes de cohérence et pour l’équipe développement en termes d’efficacité.

Maintenabilité de l’architecture technique et logicielle :

La documentation technique dans le README et Storybook contribue directement à la maintenabilité de l’architecture logicielle en permettant aux développeurs de consulter les spécifications, configurations et bonnes pratiques à tout moment. Cela facilite la montée en compétence des nouveaux membres de l’équipe et réduit le temps nécessaire pour apporter des modifications ou correctifs dans le projet.
Les messages Protobuf documentés dans le README facilitent la compréhension des flux de données et les interactions interservices, réduisant les risques d’erreurs et assurant une base de référence stable pour la communication front-back.

Cette activité de documentation couvre pleinement les compétences du référentiel, notamment en structurant une bibliothèque de composants réutilisables (C.3.4) et en produisant une documentation technique adaptée aux utilisateurs, qu’ils soient développeurs ou parties prenantes (C.5.2.2). Grâce à Storybook et au README, l’architecture est rendue accessible, maintenable et évolutive, permettant à l’équipe de développement d’assurer une qualité et une sécurité optimales à long terme.

Fiche Organisation n°O2: WIZBII {#fiche-organisation-n°o2:-wizbii}

Raison Sociale (nom): WIZBII

Date création: 01 / 02 / 2011 Cette organisation existe-t-elle encore ? oui x non ◻

Statut (société, artisan, association, etc): Société

Effectifs (nombre de personnes): 130

Volume d’activités (chiffre d’affaires, etc): Non communiqué

Implantation (régionale, nationale, internationale): Internationale

Objet, activité(s) (vente services, production biens, etc):

Wizbii est une entreprise française spécialisée dans les services pour les jeunes et les étudiants. À l’origine, Wizbii avait pour ambition de devenir un réseau social professionnel dédié aux étudiants, facilitant leur entrée sur le marché du travail en connectant jeunes diplômés et recruteurs.

Ses activités se sont élargies au fil des années :

Organisation d’événements de recrutement comme des job datings.
Collaboration avec des banques pour offrir des services financiers à destination des jeunes, notamment en lançant des plateformes extra-bancaires en collaboration avec des partenaires tels que le Crédit Agricole.
Depuis novembre 2020, Wizbii est l'opérateur de la plateforme gouvernementale 1 jeune 1 solution, destinée à faciliter l'emploi des jeunes en France.
En 2022, Wizbii a étendu ses services à l'international avec le lancement de Wizbii Money en Espagne et en Italie.

Son activité principale tourne donc autour de l’emploi, des services financiers, et des offres commerciales destinées aux jeunes et aux étudiants.

Autres données quantitatives ou qualitatives (implantation, position concurrentielle, forme juridique, parts de marchés spécificités, etc) :

Implantation:

Siège social : Grenoble, France.
Présence géographique : Principalement en France, avec une expansion dans plusieurs pays européens, notamment la Belgique et l’Espagne. Wizbii propose ses services majoritairement en ligne, ce qui lui permet d'étendre ses activités au-delà de ses bureaux physiques.

Position concurrentielle:

Secteur d’activité : Wizbii est positionnée sur plusieurs segments :
- Emploi pour les jeunes : Le cœur de métier de Wizbii repose sur la mise en relation des jeunes diplômés et étudiants avec des opportunités professionnelles, incluant les stages, alternances, et emplois.
- Services financiers : L’entreprise a diversifié ses activités en offrant des services bancaires et financiers destinés à un public jeune, notamment à travers Wizbii Money.
- Entrepreneuriat : Wizbii a également développé des services destinés aux jeunes entrepreneurs, leur fournissant des outils et un réseau pour se lancer dans l’aventure entrepreneuriale.
Concurrents directs : Parmi les concurrents de Wizbii, on peut citer :
- LinkedIn : Bien que généraliste, LinkedIn est un acteur majeur dans le recrutement, incluant pour les jeunes diplômés.
- Jobteaser : Un autre acteur français orienté sur l’emploi des jeunes et des étudiants.
- Monster et Indeed : Acteurs globaux du marché de l’emploi, bien qu’ils ne soient pas exclusivement focalisés sur les jeunes.

Forme juridique :

Statut juridique : Wizbii est une société par actions simplifiée (SAS). Cette forme juridique lui permet une certaine flexibilité dans sa gestion et son organisation, tout en étant propice à l’accueil d’investisseurs et à la levée de fonds.

Parts de marché et performance :

Parts de marché : En 2022, Wizbii a revendiqué être la plateforme leader en France pour l’emploi des jeunes, avec une part de marché importante dans ce segment spécifique. Cependant, face à des plateformes plus généralistes, sa part de marché globale sur le marché du recrutement est plus modeste.
Utilisateurs : Environ 3 millions d’utilisateurs sont inscrits sur la plateforme Wizbii, ce qui montre son attractivité auprès des jeunes en quête d’opportunités professionnelles.
Nombre d’offres d’emploi : En 2022, Wizbii proposait plus de 60 000 offres d’emploi (y compris des stages et alternances).

Spécificités :

Focus sur les jeunes : La particularité de Wizbii est son positionnement exclusivement orienté vers les jeunes, que ce soit pour l'emploi ou l'entrepreneuriat. Son interface et ses services sont conçus pour répondre aux besoins spécifiques des étudiants, jeunes diplômés et jeunes actifs.
Wizbii Money : En 2019, Wizbii a lancé Wizbii Money, une plateforme proposant des services financiers, y compris des prêts étudiants, avec des offres adaptées aux besoins spécifiques des jeunes en début de carrière.
Partenariats : Wizbii a développé des partenariats avec des entreprises comme BNP Paribas, EDF, ou encore des agences d’État pour aider à créer des événements emploi, ce qui renforce sa visibilité et son attractivité.
Soutien à l’entrepreneuriat : Wizbii a mis en place des concours et programmes pour accompagner les jeunes entrepreneurs, ce qui distingue la plateforme dans l’accompagnement à la création d’entreprise.

Fiche Emploi n° E2: Développeur {#fiche-emploi-n°-e2:-développeur}

Reprenez la ou les expériences présenté(e)s dans le parcours en vous limitant, a priori, à 3 ou 4 expériences professionnelles.

Dénomination de votre emploi: Développeur

Période: du 01/03/2018 au 01/06/2020

Nombre de mois dans la fonction: 27

Entreprise: WIZBII

Temps plein

Vous étiez: Cadre

Vos fonctions, à ce poste, couvrent :

Plusieurs fonctions sont possibles, cochez celles qui vous correspondent

Encadrement et responsabilité hiérarchique x
Production x
Commerciale ◻
Marketing ◻
Administration ◻
Qualité x
Gestion de projet x
Gestion financière ◻
Conception et recherche x
Audit - Conseil ◻

Votre unité de travail:

Département technique, équipe de développement web, responsable de la création, du maintien, et de l'évolution des applications et plateformes SaaS.

Place de cette unité de travail dans l’organisation, activités, missions, composition et effectif:

L’équipe de développement web est un élément central du département technique chez Wizbii, responsable de la création et de l’évolution des plateformes numériques, notamment les applications web et les plateformes SaaS (Software as a Service) de l'entreprise. Cette équipe est essentielle dans la stratégie de Wizbii en matière de digitalisation, d'accompagnement des jeunes, et de gestion des services pour les utilisateurs finaux.

L’unité de travail s’intègre au cœur de la stratégie de Wizbii, qui repose sur la fourniture de services numériques à grande échelle, tels que la plateforme de recherche d’emploi, la plateforme extra-bancaire, et le projet gouvernemental 1 jeune 1 solution. Ces services doivent être constamment améliorés et maintenus, ce qui confère à cette équipe un rôle pivot dans l’organisation.

L'équipe de développement web chez Wizbii est composée de plusieurs profils complémentaires :

Développeurs front-end et back-end : Responsables de la construction et de la maintenance des interfaces utilisateurs et de la gestion des bases de données et services back-end.
Lead developers : Coordinateurs des différentes sous-équipes techniques, garantissant la cohérence des développements et le respect des bonnes pratiques de développement.
Architectes techniques : Concepteurs de l’architecture des plateformes web et SaaS, garantissant la scalabilité et la sécurité des systèmes.
Développeurs full-stack : Capables d’intervenir sur l’ensemble de la stack technologique (front et back).
DevOps : Chargés de la gestion des environnements de production et de développement, de l'automatisation du déploiement (CI/CD), et de l’optimisation des infrastructures Cloud.

L’effectif de cette unité était d’environ 50 personnes quand j’y étais.

Organisation interne de votre unité de travail

(organisation hiérarchique, répartition des rôles, modalités de fonctionnement interne, objectifs, budgets, effectif, fonctions des collaborateurs…)

Chez Wizbii, l’unité de travail qui correspond à l’équipe de développement web au sein du Département technique a une organisation structurée et hiérarchisée pour assurer la gestion des projets complexes liés aux plateformes web. L’organisation est conçue pour favoriser l’efficacité, la communication transversale, et l’innovation technologique. Voici les éléments clés de cette organisation :

Hiérarchie

CTO (Chief Technology Officer) : Rémi Alvado occupe ce poste, dirigeant l’ensemble du département technique. Il définit la stratégie technologique de l’entreprise, veille à la cohérence des choix techniques avec les objectifs business, et supervise la gestion des équipes.
Lead Developers : Sous la direction du CTO, les lead developers supervisent des sous-équipes spécifiques (front-end, back-end, full-stack). Ils jouent un rôle essentiel dans l'encadrement des équipes techniques, garantissant la qualité du code et le respect des deadlines.
Développeurs Front-End, Back-End et Full-Stack (moi) : Ces développeurs sont les principaux acteurs de la création des fonctionnalités sur les applications web et mobiles. Les développeurs front-end se concentrent sur l’interface utilisateur, tandis que les développeurs back-end gèrent la partie serveur et les bases de données.
DevOps : L’équipe DevOps gère l’infrastructure et les environnements de production, s’assurant que les pipelines CI/CD (Intégration et Déploiement Continus) sont bien en place et que le déploiement se fait en toute sécurité.
Architectes logiciels : Chargés de définir et de maintenir l'architecture des systèmes, ils veillent à la scalabilité, la sécurité et l’interopérabilité des plateformes de Wizbii.
Équipe QA (Quality Assurance) : Les spécialistes QA testent les nouvelles fonctionnalités et veillent à la qualité des livrables. Ils travaillent étroitement avec les développeurs pour identifier et résoudre les bugs avant les mises en production.

Répartition des rôles et responsabilités

CTO (Rémi Alvado) : Responsable de l'alignement des choix techniques avec les besoins stratégiques de Wizbii. Il valide les projets, les budgets techniques, et les priorités.
Lead Developers : Ils sont responsables de la planification des tâches, de l’encadrement des développeurs, et du maintien des bonnes pratiques de développement. Ils s’assurent que les objectifs sont atteints tout en respectant les contraintes techniques et les délais.
Développeurs Front-End/Back-End/Full-Stack : Ils codent, testent, et déploient les fonctionnalités. Les développeurs front-end se concentrent sur l’UX/UI tandis que les développeurs back-end s’occupent de l’architecture des serveurs et des bases de données.
DevOps : Ils veillent à l’optimisation de l’infrastructure et à la gestion des serveurs et déploiements continus. Leur rôle est crucial pour garantir la disponibilité et la performance des plateformes.
Architectes logiciels : Ces experts définissent les choix technologiques majeurs pour garantir la robustesse et la scalabilité des plateformes.
QA (Quality Assurance) : Ils effectuent des tests sur les nouvelles fonctionnalités et garantissent que les produits livrés sont de haute qualité, en réalisant des tests fonctionnels, de sécurité, et de performance.

Modalités de fonctionnement interne:

Méthodologie Agile/Scrum : L’équipe suit une organisation agile, avec des sprints de 2 à 4 semaines. Les lead developers organisent des sprint plannings et des réunions quotidiennes (stand-ups) pour ajuster les priorités, identifier les obstacles et assurer la bonne communication entre les équipes.
Pipelines CI/CD : Les pipelines CI/CD sont automatisés pour assurer des déploiements rapides et en continu. GitLab est souvent utilisé pour gérer les merge requests, automatiser les tests et le déploiement.
Revue de code : Les merge requests passent par un processus de revue de code afin de garantir la qualité du développement et de partager les bonnes pratiques.

Objectifs:

Assurer la disponibilité et la performance des plateformes : L’équipe technique est chargée de maintenir les applications stables et performantes pour les 10 millions d’utilisateurs. Cela inclut l’optimisation continue et la résolution rapide des bugs.
Développement de nouvelles fonctionnalités : Développer et intégrer de nouvelles fonctionnalités répondant aux besoins des utilisateurs, qu'il s'agisse d’améliorations sur la plateforme 1 jeune 1 solution ou des applications web/mobiles associées.
Amélioration de l'expérience utilisateur (UX) : Travailler avec l’équipe produit pour garantir une interface fluide et intuitive pour les utilisateurs.

Quelle place occupez-vous dans cette unité de travail ?

En tant que développeur fullstack, j’occupais une place essentielle dans l’équipe technique, car je suis capable de travailler à la fois sur le front-end et le back-end des applications web et mobiles. Mon rôle est de contribuer au développement de toutes les fonctionnalités des plateformes, en assurant leur bon fonctionnement de bout en bout.

Je prends en charge des features de bout en bout, depuis la conception jusqu’à la mise en production. Cela me donne une grande autonomie et la possibilité d’implémenter des fonctionnalités en veillant à leur cohérence avec l’ensemble du système. Mon rôle implique également de résoudre rapidement les bugs et d’assurer la maintenance des applications pour garantir une stabilité optimale des plateformes.

Cette expérience a été particulièrement formatrice, surtout parce qu'elle est intervenue au début de ma carrière. J'ai rapidement acquis une grande autonomie, en prenant en charge des projets de bout en bout, depuis la conception jusqu’au déploiement. Le fait de travailler sur des technologies diverses et de participer à la prise de décisions techniques m'a permis de développer une solide expertise et une capacité à gérer des projets transversaux. Cette première étape dans ma carrière m'a doté d'une vision globale du développement web et a renforcé ma capacité à m'adapter à des environnements techniques exigeants, tout en m’assurant de toujours livrer des solutions de qualité

Qui définit, contrôle et évalue vos activités ?

Mes activités sont définies, contrôlées et évaluées par deux personnes clés au sein de l’organisation de Wizbii :

Rémi Alvado (CTO) : En tant que Chief Technology Officer, Rémi est responsable de la direction technique de l’entreprise. Il définit les grandes orientations technologiques et s’assure que les projets sur lesquels je travaille sont alignés avec les objectifs techniques de l'entreprise. Il contrôle l’avancement des projets en validant les aspects techniques et en assurant la qualité du code livré. Il est également responsable de l’évaluation globale de mes performances techniques, notamment en ce qui concerne la qualité des solutions développées, le respect des bonnes pratiques de développement et la capacité à livrer dans les délais impartis.

Anthony Parizi (Product Owner) : En tant que Product Owner, Anthony joue un rôle clé dans la définition des priorités produit et s’assure que mes activités répondent aux besoins fonctionnels des utilisateurs finaux. Il contrôle l’évolution des fonctionnalités à travers la gestion du backlog et les priorités établies lors des sprints. Anthony évalue la pertinence des livrables en fonction de leur adéquation avec les exigences business et les attentes des utilisateurs.

Ces deux responsables coordonnent leurs actions pour s’assurer que mes activités contribuent à la réussite des projets en respectant à la fois les contraintes techniques et les objectifs produit.

Votre position

Présentez et commentez vos principales fonctions et/ou responsabilités. Si la nature de vos fonctions a évolué, expliquez les éléments marquants.

Lors de mon emploi chez Wizbii en tant que développeur fullstack, j’ai occupé une position clé dans le développement des différentes plateformes web et SaaS. Mon rôle s’articulait principalement autour de la conception, du développement, et de la maintenance des services, avec une responsabilité croissante au fil du temps.

Principales fonctions et responsabilités

Développement fullstack :
- J’étais responsable du développement des interfaces utilisateur (front-end), et du développement back-end, avec la gestion des API et des bases de données. Mon rôle était d'assurer que les fonctionnalités développées répondaient aux besoins des utilisateurs tout en garantissant la sécurité et la scalabilité des services.
Collaboration avec les équipes produit et technique :
- Je collaborais régulièrement avec le Product Owner (Anthony Parizi) pour m’assurer que les fonctionnalités répondaient aux exigences produit et aux besoins des utilisateurs finaux. J’interagissais également avec les équipes QA et DevOps pour garantir la qualité des livrables et la fluidité des déploiements.
Encadrement et mentorat :
- Dès ma seconde année chez Wizbii, j’ai eu la chance de prendre en charge un alternant ingénieur. Cette expérience de mentorat m’a permis de découvrir un réel intérêt pour la transmission de mes compétences techniques. J’ai particulièrement apprécié suivre son évolution, lui partager mes connaissances et l’accompagner dans ses premiers pas en tant que développeur. Encadrer un alternant a non seulement enrichi mon expérience, mais m’a également permis de développer mes compétences en gestion d’équipe et en pédagogie.

Évolution des responsabilités:

Mes fonctions ont évolué au cours de mon parcours chez Wizbii. Si mes responsabilités initiales étaient principalement centrées sur le développement technique, l’encadrement d’un alternant et ma collaboration plus étroite avec les autres équipes m’ont permis de prendre des responsabilités supplémentaires. Cette expérience m’a également permis de mieux comprendre les enjeux liés à la gestion de projet et au partage des compétences.

L'encadrement de cet alternant a marqué une étape importante dans mon parcours. Cette opportunité m’a permis de confirmer mon goût pour le mentorat, et j'ai continué à apprécier ce rôle de transmission des compétences tout au long de mon expérience professionnelle.

Vos Interlocuteurs

Identifiez vos interlocuteurs principaux (collaborateurs, supérieurs hiérarchiques ou fonctionnels, services internes, structures externes) et explicitez la nature et les modalités de vos relations.

Au sein de Wizbii, j’interagissais avec plusieurs interlocuteurs clés qui jouaient un rôle important dans la réalisation de mes missions. Ces relations étaient essentielles pour assurer la bonne coordination des projets techniques, du développement à la mise en production.

Rémi Alvado – CTO (Chief Technology Officer)

En tant que CTO, Rémi Alvado était mon supérieur hiérarchique direct. Il était responsable de définir la stratégie technologique de l’entreprise et s’assurait que les projets sur lesquels je travaillais étaient alignés avec les objectifs techniques et stratégiques de Wizbii. Nos échanges étaient réguliers, surtout lors des revues de projet et des sprint reviews, où il validait l’architecture technique et donnait son approbation sur les solutions proposées. Il avait un rôle de contrôle et d’évaluation de la qualité des développements.

Anthony Parizi – Product Owner

Anthony Parizi, en tant que Product Owner, était mon principal interlocuteur pour tout ce qui concernait les besoins fonctionnels et les attentes des utilisateurs finaux. Il gérait le backlog produit et priorisait les tâches que je devais implémenter. Nos échanges étaient fréquents, particulièrement lors des sprints plannings où nous discutions des fonctionnalités à développer et des spécifications techniques à respecter. Il m’assurait de l’alignement des livrables avec les attentes des utilisateurs et les objectifs business.

Florent Baldino – Ingénieur DevOps Senior

Florent Baldino, en tant qu’Ingénieur DevOps Senior, était un interlocuteur clé pour tout ce qui concernait la gestion de l’infrastructure, des environnements de développement, et les pipelines CI/CD. Nous collaborions étroitement pour mettre en place les processus d’intégration continue et de déploiement automatique, afin de garantir des livraisons rapides et sûres. Florent m’aidait à configurer les environnements de test et de production et intervenait lorsque des ajustements étaient nécessaires pour améliorer la scalabilité et la performance des plateformes.

Frédéric Palluel Lafleur – Lead Backend

Frédéric Palluel Lafleur, en tant que Lead Backend, supervisait toute la partie serveur et les API avec lesquelles mes développements interagissaient. Nous échangions régulièrement sur l’intégration des services back-end avec le front-end et sur la manière d’optimiser les appels API pour garantir des performances optimales. Nos discussions étaient souvent techniques, portant sur la gestion des bases de données, les requêtes GraphQL, et la coordination des mises à jour de l’architecture back-end.

Nature et modalités de mes relations

Collaborations transversales : Mes relations avec ces interlocuteurs étaient marquées par une forte collaboration transversale. Que ce soit pour valider des décisions techniques avec Rémi Alvado, ajuster les priorités produit avec Anthony Parizi, ou coordonner les déploiements avec Florent Baldino, ces échanges permettaient de garantir une cohérence entre les différents services.
Réunions et outils de gestion : Nos échanges se faisaient lors de réunions régulières (stand-ups quotidiens, sprints plannings, reviews) mais aussi via des outils comme GitLab pour la gestion des tâches et Slack pour les communications quotidiennes.
Communication technique et produit : Avec Frédéric Palluel Lafleur, la communication était particulièrement technique, et souvent orientée vers l’optimisation des performances et la gestion des APIs. Avec Anthony Parizi, les échanges étaient davantage centrés sur les besoins fonctionnels et la satisfaction des utilisateurs.

Grâce à cette collaboration fluide et organisée avec ces différents interlocuteurs, nous avons pu assurer un développement agile et efficace, en livrant des solutions de qualité tout en répondant aux attentes des utilisateurs et aux exigences stratégiques de Wizbii.

Management

Exercez-vous des fonctions d’encadrement ? ◻ Non x Oui

Si oui, nombre de collaborateurs encadrés ? 1 alternant

Changements durant votre expérience

Si des changements importants ont marqué l’évolution de votre emploi (fonction ou poste), de quel(s) ordre(s) étaient-ils ?

Le début de mon emploi chez Wizbii a marqué ma première véritable expérience en tant que développeur, ce qui représentait déjà un changement significatif pour moi. C’était l’occasion de mettre en pratique mes compétences de manière concrète et dans un cadre professionnel, en gérant des projets de bout en bout.

Cadre des services extra-bancaires:

L'un des aspects marquants de cette expérience a été mon implication dans les projets liés aux services extra-bancaires en collaboration avec des partenaires comme le Crédit Agricole. Ces projets demandaient une rigueur extrême, car ils impliquaient la gestion de données sensibles et des exigences de sécurité élevées. Chaque fonctionnalité développée nécessitait de respecter des normes strictes de protection des données, de conformité réglementaire (notamment RGPD), et de performance. Ce cadre m’a permis de perfectionner mes compétences en matière de développement sécurisé, mais aussi en gestion de projet complexe.

Passage rapide à des responsabilités supplémentaires:

Dès ma seconde année, j’ai pris en charge l'encadrement d'un alternant ingénieur. Cette nouvelle responsabilité a marqué un changement important dans ma carrière, passant du simple rôle de développeur à celui de mentor. Transmettre mes connaissances et aider un jeune développeur à grandir dans ses compétences a été une expérience particulièrement enrichissante pour moi. Cela m'a permis de développer des compétences en management et de renforcer mon intérêt pour la formation des jeunes talents.

Ces changements ont non seulement fait évoluer mon rôle au sein de l’équipe technique, mais ont également solidifié ma position en tant que développeur polyvalent, capable de gérer des responsabilités techniques tout en contribuant à la formation et à la croissance des autres membres de l’équipe.

Comment avez-vous fait face à ces changements ?

Le développement de services extra-bancaires pour Wizbii, notamment en partenariat avec des institutions financières comme le Crédit Agricole, a nécessité une rigueur technique et une compréhension approfondie des exigences réglementaires (par exemple, RGPD). Pour faire face à cette exigence de rigueur, j’ai :

Renforcé mes compétences en sécurité des données : J’ai étudié et appliqué des normes de sécurité comme l’utilisation des tokens JWT pour l’authentification, la gestion sécurisée des données sensibles, et l’optimisation des processus d’authentification pour garantir la conformité.
Mis en place des tests automatisés : J’ai instauré un processus rigoureux de tests automatisés (unitaires, d’intégration, et de sécurité) dans le cadre des pipelines CI/CD pour garantir que chaque fonctionnalité développée respectait les standards requis.
Travaillé en étroite collaboration avec l’équipe DevOps (Florent Baldino) pour garantir une infrastructure solide et éviter les risques de sécurité. Cela m’a permis de m’assurer que chaque déploiement était réalisé de manière fiable, tout en respectant les normes bancaires rigoureuses.

Prise en charge d’un alternant:

La prise en charge d’un alternant ingénieur dès ma seconde année a également représenté un défi majeur. Pour relever ce défi :

Développement de compétences en encadrement : N'ayant pas eu d’expérience de mentorat auparavant, j’ai dû apprendre à structurer mes échanges et à transmettre mes connaissances de manière pédagogique. Je me suis assuré de planifier des sessions régulières de suivi et d’échanges avec l'alternant pour l’aider à surmonter les difficultés rencontrées dans son apprentissage.
Transmission de bonnes pratiques : J’ai pris le temps de partager avec lui les bonnes pratiques de développement que j’avais intégrées, tant au niveau du code que des méthodes de travail (comme l’importance de suivre des standards de sécurité et d'utiliser des tests automatisés). Cette expérience m’a appris à être à l’écoute et à ajuster mes explications en fonction du niveau de compréhension de l’alternant.
Évolution personnelle : Cette expérience de mentorat m’a également aidé à développer de nouvelles compétences en gestion humaine, que je n’avais pas anticipées en début de carrière, mais qui se sont révélées très enrichissantes.

Adaptation et développement continu:

Pour faire face à ces changements, j’ai adopté une approche d’apprentissage continu. J’ai souvent effectué des veilles technologiques pour rester à jour sur les meilleures pratiques et les nouveaux outils, notamment dans les domaines de la sécurité et des architectures web modernes. J’ai aussi pris part à des formations internes et échangé régulièrement avec mes collègues expérimentés pour améliorer mes compétences techniques et mes capacités à gérer des responsabilités croissantes.

Expliquez si vous avez eu la possibilité de proposer et d’introduire vous-même des changements :

Oui, au cours de mon expérience chez Wizbii, j’ai eu la possibilité de proposer et de mettre en œuvre un changement significatif, qui est aussi l'une des choses dont je suis le plus fier. Il s'agit de la création d'une bibliothèque de web components utilisant le framework Stencil.

Le contexte du changement

À l'origine, nous devions maintenir des composants spécifiques pour plusieurs frameworks (React, Angular, etc.), afin d'intégrer des publicités via la régie de Wizbii sur différents produits. Cela créait un fardeau de maintenance important, car il fallait gérer et maintenir trois bibliothèques distinctes, chacune adaptée aux particularités du framework sur lequel elle s'appuyait.

La proposition et la solution

En voyant ce problème, j’ai proposé une solution plus modulaire et évolutive : créer une bibliothèque de web components en utilisant Stencil, un framework permettant de développer des composants agnostiques du framework sous-jacent. Cette solution permettait de développer des composants interopérables avec React, Angular, et n’importe quel autre framework ou même sans framework, ce qui rendait leur utilisation beaucoup plus flexible.

Les avantages de ce changement

Réduction de la maintenance : En passant d’une approche avec plusieurs bibliothèques à une seule bibliothèque de web components, nous avons drastiquement réduit la charge de maintenance. Il n'était plus nécessaire de gérer des versions spécifiques pour chaque framework, ce qui a simplifié les mises à jour et le suivi des bugs.
Compatibilité universelle : Les web components créés avec Stencil étaient compatibles nativement avec tous les frameworks, permettant ainsi une réutilisation simplifiée sur toutes les plateformes de Wizbii sans avoir à se soucier des différences entre les environnements.
Amélioration de la performance : En plus de la compatibilité, les web components sont plus légers et performants, car ils sont directement interprétés par le navigateur sans nécessiter de lourdes abstractions spécifiques aux frameworks.

Mise en œuvre et impact

Après avoir obtenu l'approbation de Rémi Alvado (CTO), j’ai piloté le développement de cette bibliothèque de web components, en collaborant avec les équipes front-end pour assurer une transition fluide. Ce projet a eu un impact immédiat sur notre efficacité : au lieu de devoir maintenir et corriger des composants pour chaque framework, nous avons désormais une solution unique qui répondait à tous les besoins.

Votre autonomie

Quelles sont vos marges d’initiative et d’autonomie dans votre fonction ? Concernent-elles vos activités, vos priorités, vos méthodes ?

Dans mon rôle de développeur chez Wizbii, j’avais un certain niveau d’autonomie dans la gestion de mes activités et méthodes de travail, même si mes responsabilités étaient plus limitées que lors de mon expérience précédente chez Enlaps.

J’avais la liberté de proposer des solutions techniques et d’apporter des améliorations à l’architecture, comme lors de la création de la bibliothèque de web components avec Stencil. Ce projet était une initiative que j'ai menée, avec une grande marge de manœuvre pour décider de l'implémentation technique et de la manière d'optimiser les processus.

Bien que les priorités générales étaient fixées par le Product Owner (Anthony Parizi) et le CTO (Rémi Alvado), j’avais la capacité de gérer mes tâches au quotidien et d’organiser mon travail pour respecter les délais fixés par les sprints Agile. Mes marges d'initiative étaient également présentes lorsque je devais ajuster certaines priorités pour résoudre des bugs critiques ou améliorer la performance des fonctionnalités sur lesquelles je travaillais.

Concernant les méthodes de développement, j’avais la liberté de choisir les outils et les approches techniques que je trouvais les plus adaptées à chaque situation, tant que cela respectait les standards de l’entreprise. Par exemple, dans l'utilisation de tests automatisés ou dans l'optimisation des performances des API, je pouvais déterminer comment organiser le travail pour garantir la qualité et la rapidité de mes livrables.

Bien que j’aie eu une autonomie considérable chez Wizbii, notamment sur les aspects techniques et dans la gestion de mes tâches quotidiennes, mes responsabilités globales étaient plus cadrées par rapport à mon rôle chez Enlaps. L'équipe de Wizbii était plus grande et mieux structurée, ce qui signifiait que les décisions stratégiques étaient généralement prises par des supérieurs hiérarchiques comme le CTO ou le Product Owner, mais j'avais toujours la liberté d'influencer les décisions techniques en fonction de mes propositions.

Dans l’ensemble, j’avais assez d’autonomie pour proposer des innovations et organiser mes méthodes de travail, mais toujours dans un cadre défini par les objectifs globaux de l’équipe et de l’entreprise.

Spécificités

Votre activité présente-t-elle des contraintes ou des spécificités qui impactent votre activité et les compétences que vous mobilisez ?

Mon activité chez Wizbii comportait plusieurs spécificités et contraintes liées au cadre particulier des services extra-bancaires, qui ont eu un impact direct sur mon travail et les compétences que j'ai dû mobiliser.

Conformité aux normes extra-bancaires:

En travaillant sur des projets liés aux services financiers, notamment en collaboration avec des partenaires comme le Crédit Agricole, j’ai été confronté à des normes de sécurité et de régulation très strictes. Les délais pour la mise en œuvre des fonctionnalités devaient s'aligner sur des régulations strictes et spécifiques aux services financiers, ce qui ajoutait une pression supplémentaire sur la qualité du code et sur la gestion des projets.

Cette rigueur imposée par le cadre extra-bancaire m’a obligé à mobiliser et développer des compétences très spécifiques, notamment en matière de sécurité et de fiabilité des services :

Approfondissement des compétences en sécurité
Gestion des erreurs et des tests
Rigueur méthodologique

Ce cadre strict a été infiniment formateur pour moi. Les exigences techniques et de sécurité auxquelles j’ai dû faire face m’ont permis de renforcer une méthodologie de travail rigoureuse, qui m’accompagne encore aujourd’hui. Ces compétences, acquises dans un environnement où chaque détail compte, ont forgé ma capacité à gérer des projets complexes avec une attention méticuleuse à la sécurité, la qualité, et la conformité, même dans mes activités actuelles en dehors du domaine bancaire.

Situations complexes

L’une des situations les plus complexes que j’ai eu à gérer chez Wizbii a été lors d’une énorme refonte du site. Nous avions pour objectif de présenter une nouvelle version du site avant la visite de plusieurs investisseurs, un moment crucial pour l’entreprise. Ce projet représentait un défi majeur en raison des délais extrêmement serrés et du besoin de coordonner les efforts de toute l’équipe technique pour livrer un site fonctionnel à temps.

Contexte de la situation

À ce moment-là, Wizbii était en pleine période de croissance et préparait une levée de fonds importante. L'objectif était de montrer aux investisseurs un site moderne, performant et capable de soutenir cette expansion. Cependant, la refonte s’est révélée beaucoup plus complexe et chronophage que prévu. Avec des délais qui se réduisaient chaque jour et la visite des investisseurs imminente, nous avons dû faire face à une situation de tension maximale pour respecter l'échéance.

Organisation et priorisation

Pour faire face à cette situation, nous avons rapidement mis en place une stratégie basée sur :

La priorisation des fonctionnalités essentielles : En collaboration avec Anthony Parizi (Product Owner), nous avons fait le choix de prioriser uniquement les fonctionnalités indispensables pour la démonstration. Nous avons convenu de mettre de côté certaines améliorations secondaires ou esthétiques pour concentrer nos efforts sur les features critiques qui devaient absolument être opérationnelles.
Définition claire des compromis : Nous avons dû faire des compromis techniques pour réduire le nombre de fonctionnalités et accélérer le développement. Par exemple, certains éléments d'optimisation du site ont été reportés pour des phases ultérieures après la présentation aux investisseurs.

Travail d’équipe intensif

Les semaines précédant la présentation ont été particulièrement intenses. Toute l’équipe technique, y compris les développeurs front-end, back-end, et DevOps, sous la supervision de Rémi Alvado (CTO), a travaillé jour et nuit pour finaliser le site. Nous avons organisé des sprints très courts pour maximiser l’efficacité et tenir des réunions quotidiennes pour ajuster les priorités en fonction de l’avancement.

Communication fluide : Nous avons instauré une communication continue entre les équipes pour éviter tout blocage. Avec Frédéric Palluel Lafleur (Lead Backend), nous avons coordonné les intégrations pour nous assurer que tout fonctionnait correctement entre le front-end et le back-end.
Test en continu : L’équipe QA a également joué un rôle essentiel en réalisant des tests en continu pour garantir que le site restait stable malgré les nombreux changements effectués à la dernière minute.

Résultat et leçons apprises

Finalement, nous avons réussi à livrer la refonte du site à temps pour la visite des investisseurs. Même si le site n’était pas à 100 % optimisé comme nous l’aurions souhaité, les fonctionnalités clés étaient en place et opérationnelles, ce qui a permis de réussir la présentation.

Cette situation a renforcé ma capacité à :

Gérer le stress et travailler sous pression tout en maintenant un haut niveau de rigueur.
Faire des compromis intelligents et prioriser ce qui est essentiel à court terme, tout en gardant une vue d’ensemble pour les développements futurs.
Collaborer efficacement avec des équipes multidisciplinaires et assurer une communication fluide dans des situations d’urgence.

Cette expérience m’a été incroyablement formatrice en matière de gestion de crise et d’adaptation rapide, des compétences qui me servent encore dans mes projets actuels.

Fiche Activité n° A6: Conception et UX/UI {#fiche-activité-n°-a6:-conception-et-ux/ui}

Intitulé: Conception et UX/UI : Compréhension des principes de la conception d'interface utilisateur et de l'expérience utilisateur. Traduction des maquettes de conception en code fonctionnel.

Cette activité est: quotidienne □ fréquente x assez fréquente □ exceptionnelle □

Votre niveau de responsabilité

□ 1 : Exécution sous contrôle, application de consignes ou de procédures

x 2 : Exécution autonome, amélioration ou optimisation de solutions, propositions

□ 3 : Conception de programmes, d'actions, de cahiers des charges

□ 4 : Définition d’orientations et de stratégies

Décrivez cette activité:

Dans le cadre de mon rôle chez Wizbii, j’ai été amené à travailler sur la conception et l'intégration d'interfaces utilisateur (UI), en m’assurant que l’expérience utilisateur (UX) soit optimale. Cette activité consistait à traduire des maquettes de conception en code fonctionnel, en respectant les exigences strictes du secteur bancaire, où l’ergonomie et la reproduction exacte des maquettes sont particulièrement critiques.

J’ai toujours veillé à ce que les interfaces soient intuitives et accessibles à tous les utilisateurs, en respectant les normes d’accessibilité (WCAG 2.1) afin de garantir une expérience fluide pour les personnes avec des handicaps visuels ou moteurs.

L’objectif était d’assurer que chaque élément de l’interface soit ergonomique et améliore la navigation et l’engagement des utilisateurs, en particulier pour des opérations complexes comme celles relatives aux services extra-bancaires.

Dans le domaine bancaire, la précision dans la traduction des maquettes est cruciale, car toute disparité visuelle ou dysfonctionnement pourrait affecter la fiabilité perçue de la plateforme par les utilisateurs. Chaque élément visuel devait être strictement aligné avec les maquettes fournies par l’équipe de design, j'ai veillé à ce que chaque couleur, chaque police, et chaque composant visuel respecte à la lettre les spécifications données. Dans ce secteur, la confiance des utilisateurs passe aussi par la rigueur visuelle de l’interface.

Pour garantir que la mise en page était exactement conforme aux maquettes fournies, j’ai poussé BackStop, un outil de test visuel automatisé. Cet outil m'a permis de m'assurer que chaque composant de l'interface était pixel-perfect en comparaison avec les maquettes, en identifiant toute différence visuelle entre les captures d’écran de la version développée et les maquettes originales.

J'ai pu automatiser les tests de régression visuelle, en vérifiant systématiquement que chaque modification du code n'introduisait aucune erreur visuelle. Cet aspect est particulièrement crucial dans le cadre des projets bancaires, où les exigences de conformité sont extrêmement élevées. Les régulations financières strictes et les attentes de transparence et de sécurité imposent que chaque détail soit précisement conforme aux attentes. Toute déviation pourrait affecter la confiance des utilisateurs et mettre en péril la crédibilité de la plateforme. BackStop a donc été essentiel pour maintenir cette rigueur tout au long du processus de développement.

À chaque changement, mon architecture générait un diff visuel dans un environnement Chrome Headless via Docker qui comparait les différences entre la version développée et la maquette originale. Si une divergence trop importante était détectée, elle apparaissait directement dans l’interface de la CI, permettant à l’équipe de visualiser immédiatement les écarts. Cela a permis de détecter rapidement les erreurs visuelles ou les modifications non désirées, assurant que l’interface restait conforme aux exigences graphiques strictes.

Dans le cadre de mon rôle chez Wizbii, j’ai aussi activement participé à la création d’une bibliothèque de composants partagés destinée à être utilisée à travers l’ensemble des projets front-end de l’entreprise. Cette librairie de composants a permis d'assurer une cohérence visuelle et fonctionnelle sur toutes les pages et sections des applications, garantissant ainsi une uniformité totale dans l’expérience utilisateur.

En développant ces composants réutilisables, j'ai facilité la maintenance du code, car chaque modification ou mise à jour d’un composant n’avait besoin d’être effectuée qu’une seule fois dans la bibliothèque, et elle se répercutait automatiquement dans toutes les applications qui l’utilisaient. Cela a permis de réduire considérablement les risques d’erreur et d’assurer que tous les projets restaient alignés sur les mêmes normes de design et de qualité. Cette approche a non seulement amélioré l'efficacité de l’équipe de développement, mais a aussi renforcé la cohérence visuelle globale des produits de Wizbii, ce qui est essentiel dans un secteur comme le bancaire, où chaque détail visuel renforce la confiance des utilisateurs.

Pour réaliser cette activité, vous êtes en relation à l’interne de votre organisation :

Avec qui (fonction, rôle, service, etc) ?	A quel(s) sujet(s) ? pour faire quoi ?
Arnaud De Marrez (Product Design Manager, Équipe Design)	Collaboration sur la conception des interfaces utilisateur. Arnaud me fournit les maquettes créées par l’équipe design. Nous discutons des guidelines UX/UI, de l’ergonomie, et des normes d’accessibilité pour s'assurer que l’expérience utilisateur est optimisée. Ensemble, nous veillons à la traduction fidèle des maquettes en code fonctionnel, en respectant les détails visuels et interactifs.
Mickael Depardon (Lead Frontend, Département Technique)	Collaboration sur la conception des interfaces utilisateur. Arnaud me fournit les maquettes créées par l’équipe design. Nous discutons des guidelines UX/UI, de l’ergonomie, et des normes d’accessibilité pour s'assurer que l’expérience utilisateur est optimisée. Ensemble, nous veillons à la traduction fidèle des maquettes en code fonctionnel, en respectant les détails visuels et interactifs.
Anthony Parizi (Product Owner, Équipe Produit)	Échanges sur la priorisation des éléments UX/UI à intégrer en fonction des objectifs produit. Anthony joue un rôle clé dans la validation des choix de conception, s'assurant que l’interface utilisateur réponde aux besoins fonctionnels tout en restant intuitive et alignée avec la vision produit. Nous travaillons ensemble pour traduire les besoins fonctionnels en maquettes et en code fonctionnel.

Pour réaliser cette activité, vous êtes en relation à l’externe de votre organisation :

Avec qui (fonction, rôle, service, etc) ?	A quel(s) sujet(s) ? pour faire quoi ?
/	/

Pour effectuer cette activité, vous traitez des informations :

De quelles Informations avez-vous besoin ? Comment et auprès de qui vous les procurez-vous ?	Comment les utilisez-vous ? Quel(s) Traitement(s) effectuez-vous ?	Transmettez-vous des informations ? A qui ? Pour quoi faire ? Comment ?
X	X	X

Quels sont les outils, techniques, logiciels, produits que vous utilisez pour réaliser cette activité ?

Outils de design et collaboration

Figma : Utilisé pour la conception des maquettes et des prototypes interactifs. Figma permet de collaborer en temps réel avec l’équipe design (Product Design Manager), de visualiser les guidelines UX/UI et de récupérer facilement les spécifications des composants pour les intégrer dans le code.

Sketch : Parfois utilisé pour la création des interfaces et des prototypes visuels, notamment pour des maquettes plus détaillées avant l’intégration.

Outils de développement front-end:

Angular : Principal framework utilisé pour développer et intégrer les composants interactifs à partir des maquettes fournies. Angular “facilite” la création de composants réutilisables et performants.

SCSS : Pour la stylisation des interfaces, en assurant que chaque élément soit conforme aux maquettes en termes de marges, espacements, typographies, et couleurs.

Outils de tests et validation:

BackStopJS : Utilisé pour les tests visuels automatisés. À chaque changement de code, BackStopJS génère des diffs visuels entre la nouvelle version et la maquette, pour s’assurer qu’il n’y a pas de divergences visuelles.

Storybook : Un environnement de développement pour tester et documenter les composants Angular en isolation. Cela permet de s’assurer que chaque composant est bien conçu et qu’il respecte les standards UX/UI avant son intégration dans l’application.

Gestion de projet et collaboration:

YouTrack : Utilisé pour la gestion des tâches et la priorisation des sprints. Il permet de suivre l’avancement des tâches liées à l’implémentation des fonctionnalités UX/UI, en collaboration avec le Product Owner et l’équipe de développement.

Techniques et méthodologies:

Responsive Design : Pour s'assurer que les interfaces fonctionnent de manière optimale sur tous les appareils (ordinateurs, tablettes, smartphones), en utilisant des media queries et des techniques d’adaptation du design.

Tests d'accessibilité : Pour garantir que les interfaces respectent les normes d’accessibilité, en particulier dans un secteur exigeant comme le bancaire.

Décrivez comment vous vous organisez pour réaliser cette activité :

La première étape consiste à analyser les maquettes fournies par l’équipe design (via Figma ou Sketch) pour comprendre les besoins en termes d'ergonomie, de composants et d'accessibilité. Je collabore étroitement avec le Product Design Manager (Arnaud De Marrez) pour m'assurer que chaque élément visuel et interactif est clair. Nous discutons des ajustements éventuels à faire pour garantir que les contraintes techniques du développement n’altèrent pas l’expérience utilisateur.

Une fois les maquettes validées, je planifie les différentes étapes de développement avec l'équipe. J’utilise Youtrack pour organiser et prioriser les tâches en fonction des objectifs fixés avec le Product Owner (Anthony Parizi). Chaque fonctionnalité ou composant est divisé en sous-tâches, ce qui permet de les répartir efficacement entre les membres de l'équipe de développement.

Je commence par développer les composants dans un environnement isolé à l’aide de Storybook, ce qui me permet de tester chaque composant individuellement et de m’assurer qu’il respecte les standards UX/UI avant de l’intégrer dans l’application principale. J’applique les principes de modularité et de réutilisabilité pour garantir une cohérence et faciliter les mises à jour futures.

Tout au long du processus, je travaille en étroite collaboration avec l’équipe design et les développeurs front-end, en échangeant sur les détails techniques et les défis rencontrés. Des réunions quotidiennes (stand-ups) permettent de synchroniser nos efforts et de partager les avancées ou les obstacles. Si nécessaire, je propose des ajustements aux maquettes ou des solutions pour optimiser le design en fonction des contraintes techniques.

Une fois les composants intégrés, je mets en place des tests automatisés avec BackStopJS. Ce système compare les différences visuelles (diffs) générées par rapport aux maquettes de référence. Si une divergence importante est détectée, elle est immédiatement signalée dans la CI, ce qui me permet de corriger les écarts avant la mise en production.

Après l'intégration, je m’assure que les interfaces sont optimisées pour les différents supports, en appliquant les techniques de responsive design et en vérifiant les performances sur différents appareils. Enfin, j'intègre les retours des utilisateurs et des parties prenantes pour apporter les dernières touches et m'assurer que le produit livré correspond aux attentes.

Quelles sont les habiletés, savoir-faire ou qualités requises pour effectuer cette activité ?

Maîtrise des outils de design et de développement : Il est crucial de bien connaître des outils comme Figma ou Sketch pour comprendre et manipuler les maquettes, ainsi que des outils de développement front-end pour intégrer ces maquettes en code fonctionnel.

Connaissance des principes UX/UI : Une bonne compréhension des principes d’ergonomie et de la conception centrée sur l’utilisateur est essentielle pour garantir une interface intuitive et agréable à utiliser.

Normes d'accessibilité : Savoir appliquer les standards d’accessibilité (comme le WCAG) est fondamental, notamment dans des secteurs comme celui des services bancaires où l’accessibilité est réglementée.

Qualités personnelles: La rigueur et la précision sont primordiales pour traduire les maquettes de manière exacte. Le moindre décalage dans les marges, espacements, ou couleurs peut impacter la cohérence visuelle et l’expérience utilisateur.

Il est important de pouvoir travailler en équipe avec des designers, développeurs, et le product owner. Cela implique de bonnes capacités de communication et la volonté d’écouter les avis de chacun pour améliorer le produit.

Il est aussi indispensable de savoir utiliser des outils de tests visuels pour garantir la conformité du produit avec les maquettes, et être capable d'ajuster rapidement en cas de divergence.

Voici les domaines de compétences du référentiel couverts par cette activité, et les rapprochements avec mon travail chez Wizbii.

C.4.2 - Construire des interfaces homme-machine {#c.4.2---construire-des-interfaces-homme-machine}

L’une des priorités dans la création des interfaces est d’appliquer des principes d’ergonomie pour rendre l’utilisation intuitive et efficace. Par exemple :

Lors de l’intégration des maquettes fournies par l’équipe design, je veille à la dispositions des éléments afin de garantir une interface lisible et agréable à naviguer. Ceci permet d’optimiser l'ergonomie de l'interface pour différentes catégories d'utilisateurs.

L’utilisation de composants réutilisables permet d'assurer une cohérence visuelle et fonctionnelle sur l’ensemble du site, facilitant ainsi la navigation pour l’utilisateur en proposant une expérience fluide et prévisible.

Cette activité met également un fort accent sur l'expérience utilisateur (UX), en intégrant des fonctionnalités qui rendent l'interface intuitive et adaptée aux besoins des utilisateurs. Par exemple :

Lors de l’élaboration des interfaces, je prends en compte les feedbacks utilisateurs obtenus lors des phases de test (en utilisant des outils comme InVision pour les prototypes). Cela permet de valider que les choix de design répondent aux attentes en matière d’ergonomie et de facilité d’usage.
En travaillant en collaboration avec le Product Owner (Anthony Parizi) et le Product Design Manager (Arnaud De Marrez), je m’assure que les fonctionnalités prioritaires sont bien alignées avec les besoins fonctionnels tout en restant simples et accessibles à l’utilisateur final.

L’intégration des normes d'accessibilité est un aspect fondamental de cette activité, surtout dans des secteurs tels que le bancaire, où les interfaces doivent être accessibles à un large éventail d’utilisateurs, y compris ceux ayant des handicaps.

Le design et les composants que j’intègre suivent des principes qui facilitent l’accès à l'information pour les utilisateurs malvoyants ou ayant des difficultés cognitives, en assurant par exemple une hiérarchie visuelle claire et des indicateurs visuels renforcés.

L’ensemble de cette activité vise à garantir que l’interface homme-machine soit facile à utiliser, rapide, et agréable, tout en maintenant les standards techniques élevés. Grâce à l’utilisation de tests visuels automatisés (BackStopJS), des composants réutilisables, et une optimisation des performances front-end, je m’assure que l'interface soit optimisée pour différents types de terminaux, qu’il s’agisse de mobiles, tablettes ou ordinateurs.

Fiche Activité n° A4: Veille et suivi des tendances et des avancées technologiques {#fiche-activité-n°-a4:-veille-et-suivi-des-tendances-et-des-avancées-technologiques}

Intitulé: Veille et suivi des tendances et des avancées technologiques. (talks)

Cette activité est: quotidienne x fréquente □ assez fréquente □ exceptionnelle □

Votre niveau de responsabilité

□ 1 : Exécution sous contrôle, application de consignes ou de procédures

□ 2 : Exécution autonome, amélioration ou optimisation de solutions, propositions

x 3 : Conception de programmes, d'actions, de cahiers des charges

□ 4 : Définition d’orientations et de stratégies

Décrivez cette activité:

Je mène une activité quotidienne de veille technologique pour rester à jour sur les nouveaux usages, les innovations et les opportunités de marché dans le domaine du développement web et mobile. Cette veille me permet d'identifier de nouvelles technologies, outils et méthodologies pouvant être intégrés dans nos projets, tout en garantissant la conformité avec les dernières normes, notamment en matière d'accessibilité numérique.

Tous les jours, de 8h à 9h, je me consacre à la veille sur plusieurs plateformes spécialisées :

Dev.to et Medium : Je consulte régulièrement ces plateformes pour lire des articles sur les dernières tendances en matière de développement, ainsi que sur les nouveaux outils et frameworks.

ShaderToy : En tant que passionné de graphismes 3D et de visualisations avancées, je me tiens au courant des nouvelles méthodes de rendu graphique et des shaders, que j’intègre parfois dans des projets professionnels.

GitHub : Pour suivre les dernières bibliothèques open-source et contribuer à des projets qui pourraient bénéficier à notre écosystème de développement.

Je ne me contente pas de consommer de l'information, mais je contribue également à la communauté technique en écrivant des articles sur des sujets technologiques. Certains de mes articles ont été lus par plusieurs milliers de personnes, ce qui a renforcé ma crédibilité dans la communauté et m'a permis de partager mes expériences et découvertes. Par exemple, j'ai publié des articles sur :

En plus de ma veille quotidienne, je contribue activement à la communauté en publiant des articles techniques. Mes articles abordent des sujets complexes en développement web, avec une démarche à la fois pédagogique et technique. Deux de mes articles ont connu un grand succès :

Les slots de transclusion sur Angular : J’ai expliqué en détail l'utilisation des slots de transclusion dans Angular pour développer des composants dynamiques et réutilisables. Cet article a été très bien accueilli par la communauté, avec plusieurs milliers de lectures.

https://wizbii.tech/un-layout-dynamique-avec-ng-content-d00e27ab26d9

Vulgarisation de l'utilisation des shaders dans le web : J’ai écrit un article pour expliquer comment les shaders peuvent être utilisés dans les applications web pour améliorer les rendus graphiques en 3D. L’article était destiné à un large public, même à ceux qui ne sont pas familiers avec la programmation graphique, et a généré beaucoup de retours positifs.

https://wizbii.tech/webgl-démystifié-️-f5a09fdf48b7

Interventions en tant que speaker:

Mon expertise technique m'a également conduit à intervenir en tant que speaker lors de conférences et talks. Parmi mes interventions notables :

Une présentation sur la programmation réactive avec RXJS, où j'ai partagé mon expérience sur la manière d'améliorer la modularité et la réactivité des applications modernes grâce à cette approche.

Une session dédiée à mon implémentation du SSR (Server-Side Rendering) via Next.js, dans laquelle j'ai démontré comment cette technique pouvait significativement améliorer la vitesse de chargement des pages et offrir une meilleure expérience utilisateur.

Cette veille me permet d’évaluer et de recommander des technologies émergentes qui peuvent apporter une valeur ajoutée à nos projets chez Enlaps. Par exemple, mon suivi des tendances UX/UI a permis d'intégrer des fonctionnalités responsive et accessibles, alignées avec les normes actuelles d'accessibilité.

Pour réaliser cette activité, vous êtes en relation à l’interne de votre organisation :

Avec qui (fonction, rôle, service, etc) ?	A quel(s) sujet(s) ? pour faire quoi ?
Équipe Front-End et Mobile (développeurs front-end, full-stack, et mobile)	Discussions techniques sur les technologies émergentes identifiées lors de la veille (par exemple, nouveaux frameworks ou outils de performance) et leur intégration dans le développement front-end.
Équipe DevOps (Florent Baldino, Ingénieur DevOps Senior)	Échanges sur les outils et processus découverts lors de ma veille, notamment pour améliorer nos pipelines CI/CD, notre gestion des containers Docker ou notre déploiement cloud.
Arnaud De Marrez (Product Design Manager, Équipe Design)	Discussions sur les nouvelles tendances UX/UI identifiées lors de ma veille, afin de garantir que nos interfaces utilisateur sont à jour et optimisées en termes d’expérience utilisateur et d’accessibilité.
Anthony Parizi (Product Owner, Équipe Produit)	Échanges réguliers sur l'impact des nouvelles technologies et tendances identifiées lors de ma veille sur les projets en cours. Nous discutons de leur intégration dans la roadmap produit.

Pour réaliser cette activité, vous êtes en relation à l’externe de votre organisation :

Avec qui (fonction, rôle, service, etc) ?	A quel(s) sujet(s) ? pour faire quoi ?
Communauté Tech (Développeurs, Designers, Contributeurs Open Source)	Interactions régulières sur des plateformes comme GitHub, Dev.to, Medium, pour échanger des connaissances techniques, proposer des améliorations, et suivre les tendances du développement.
Conférenciers et Experts techniques (Speakers, Formateurs)	Échanges lors de talks, conférences, et webinaires sur des sujets de programmation avancée (par exemple, l'utilisation des shaders, ou des innovations en développement front-end).
Plateformes de contenu technique (Medium, Dev.to)	Lecture et publication d’articles techniques, notamment pour le partage des avancées technologiques et des bonnes pratiques, ainsi que pour suivre les nouvelles tendances en matière de développement.

Pour effectuer cette activité, vous traitez des informations :

De quelles Informations avez-vous besoin ? Comment et auprès de qui vous les procurez-vous ?	Comment les utilisez-vous ? Quel(s) Traitement(s) effectuez-vous ?	Transmettez-vous des informations ? A qui ? Pour quoi faire ? Comment ?
Tendances technologiques récentes sur des plateformes comme Dev.to, Medium, GitHub.	J’analyse les nouvelles technologies (outils, frameworks, méthodologies) pour déterminer leur pertinence pour nos projets. Je compare ces technologies avec les besoins internes.	Oui, je transmets ces informations à Rémi Alvado (CTO) et à l’équipe technique pour évaluer l’implémentation de nouvelles technologies à Enlaps, via des meetings techniques ou des rapports écrits.
Feedback et discussions de la communauté open source sur GitHub ou contributions sur des projets tiers.	J’identifie les projets open source intéressants pour la maintenance ou l'optimisation de nos propres projets. Je teste et valide ces outils dans un cadre d’intégration potentielle.	Oui, je partage les résultats de mes tests avec l'équipe de développement et propose des intégrations en fonction de l'intérêt pour nos projets, notamment via des réunions de suivi.
Innovations UX/UI découvertes sur des blogs spécialisés ou lors de conférences UX/UI.	Je les applique pour proposer des améliorations sur nos interfaces utilisateurs ou introduire des nouvelles pratiques UX qui améliorent l'expérience globale du produit.	Oui, je transmets les informations à Arnaud De Marrez (Product Design Manager) pour validation et ajustements des maquettes et designs, principalement via des réunions de conception ou des briefs.
Données techniques provenant de talks ou conférences techniques (par exemple sur les shaders, SSR, etc.).	Je les utilise pour vulgariser des concepts complexes, valider de nouvelles approches, ou implémenter des optimisations de performance dans nos produits.	Oui, je présente ces informations lors de sessions internes avec les développeurs pour les former ou adapter nos méthodes aux avancées partagées lors des conférences, principalement via présentations.

Quels sont les outils, techniques, logiciels, produits que vous utilisez pour réaliser cette activité ?

J'utilise une variété d’outils, de techniques et de logiciels qui me permettent de rester à jour et d'intégrer efficacement les nouvelles technologies dans les projets. Voici les principaux outils utilisés :

Dev.to, Medium, et GitHub : Ces plateformes sont mes principales sources pour consulter les dernières tendances en matière de développement et de technologies émergentes. Dev.to et Medium fournissent des articles rédigés par la communauté tech, tandis que GitHub permet de suivre les projets open source et les contributions pertinentes.

CodePen, JSFiddle, ShaderToy : Ces environnements permettent d'expérimenter rapidement les nouvelles technologies découvertes lors de la veille. Par exemple, sur CodePen, je teste des implémentations de shaders et leurs rendus en temps réel pour évaluer leur pertinence dans nos projets.

Medium et Dev.to : En plus de consulter ces plateformes, je les utilise également pour rédiger et publier des articles techniques, partageant les résultats de mes expérimentations et les nouvelles tendances. Ces articles sont souvent le résultat de recherches approfondies et d'expérimentations réalisées avec les technologies émergentes.

En combinant ces outils, j’arrive à structurer ma veille, à expérimenter rapidement les nouvelles technologies et à partager mes découvertes avec l’équipe pour évaluer leur pertinence et leur adoption dans nos projets.

Décrivez comment vous vous organisez pour réaliser cette activité :
Je dédie un créneau horaire fixe chaque jour, généralement de 8h à 9h, pour effectuer une veille active sur différentes plateformes. Ce créneau est dédié exclusivement à la consultation d'articles, blogs, et publications techniques. J’utilise des outils d’agrégation de contenu comme Feedly pour centraliser et suivre les flux d’information provenant de Dev.to, Medium, GitHub, et des sources spécialisées comme ShaderToy pour la partie graphique.

Pour encourager la dynamique d’apprentissage au sein de l’équipe et partager les découvertes issues de ma veille, j’ai aussi mis en place des "petits-déjeuners techniques". Ces sessions ont lieu à intervalle régulier, généralement une fois par mois, et permettent à chaque membre de l’équipe de présenter un sujet technique qui lui tient à cœur ou une technologie qu’il a récemment explorée.

L’idée derrière ces rendez-vous est de favoriser la curiosité technique et de créer un espace de partage des connaissances. Cela permet à chacun de présenter une technologie, une méthode, ou un concept qu’il a trouvé intéressant, que ce soit en lien direct avec nos projets ou simplement une nouvelle technologie émergente qu’il souhaite faire découvrir.

Quelles sont les habiletés, savoir-faire ou qualités requises pour effectuer cette activité ?

La curiosité est essentielle pour explorer de nouvelles technologies, méthodologies, et innovations. Il faut être constamment à l’affût des nouveautés techniques et des tendances du marché. La capacité à apprendre rapidement de nouveaux concepts est indispensable pour assimiler les informations issues de sources diverses (articles, conférences, forums) et rester à jour dans un environnement en constante évolution.

La gestion du temps est primordiale pour intégrer la veille technologique dans un emploi du temps souvent chargé. Il faut être capable de dédier des plages horaires spécifiques pour effectuer cette veille, tout en restant organisé pour tester, documenter et partager les découvertes de manière efficace. La régularité et la discipline sont clés pour maintenir une veille continue et productive.

C.1.1 Mener une veille {#c.1.1-mener-une-veille}

Cette activité de veille et suivi des tendances technologiques couvre pleinement le domaine de compétences C.1.1 du référentiel, qui consiste à mener une veille en identifiant les nouveaux usages, innovations, et opportunités de nouveaux marchés, tout en prenant en compte des éléments tels que l’accessibilité numérique. Voici en détail les rapprochements entre cette activité et les compétences demandées dans le référentiel :

Identifier les nouveaux usages et innovations:

L'une des composantes centrales de cette activité est la capacité à identifier les nouvelles tendances et les innovations technologiques dans le domaine du développement web et mobile.

En consultant régulièrement des plateformes comme Dev.to, GitHub, Medium, et des conférences techniques, je suis en mesure d'identifier les outils émergents (comme de nouvelles bibliothèques Typescript, des frameworks ou des pratiques de programmation avancées) qui pourraient améliorer nos processus de développement.
Cette veille permet de repérer des innovations pertinentes pour mes projets, comme l’implémentation des shaders pour des rendus graphiques plus performants, ou l’utilisation de frameworks réactifs tels que RXJS pour améliorer l'architecture front-end.

Évaluer et recommander des outils, technologies et processus:

Une fois les technologies identifiées, je les teste, les évalue et en discute avec l’équipe technique pour déterminer leur pertinence.

J’utilise des environnements comme CodePen, JSFiddle ou Docker pour expérimenter et valider la faisabilité technique de ces innovations. Ces tests me permettent de faire des recommandations éclairées concernant l’adoption d'outils ou de processus susceptibles d’améliorer nos workflows.

Identifier les opportunités de nouveaux marchés:

La veille technologique me permet également d’identifier des opportunités de nouveaux marchés ou des niches en pleine expansion. Par exemple, les avancées dans le domaine de l’intelligence artificielle et de la visualisation 3D offrent des possibilités de développer des fonctionnalités innovantes dans les secteurs où Enlaps pourrait s'implanter.

Accessibilité numérique:

Un autre aspect clé de ma veille est lié à l’accessibilité numérique, un domaine de plus en plus important dans le développement web moderne.

Je veille à suivre les évolutions des normes d’accessibilité (telles que WCAG 2.1) pour m'assurer que nos interfaces sont conformes aux standards internationaux et inclusives pour tous les utilisateurs, y compris ceux souffrant de handicaps. Cette attention à l’accessibilité se reflète non seulement dans les technologies que je teste, mais aussi dans les processus que je recommande, pour garantir une accessibilité optimale de nos produits.

Partage de la veille et mobilisation de l’équipe:

Cette activité implique également de partager les informations issues de la veille avec l’équipe technique, notamment lors des petits-déjeuners techniques que j’ai mis en place pour que chaque membre de l’équipe puisse présenter un sujet technologique qui le passionne. Cela permet de stimuler l’innovation en interne et d’améliorer collectivement nos connaissances.

Le fait de vulgariser et partager les résultats de ma veille permet de mobiliser l’équipe et d’encourager l’adoption de nouvelles pratiques technologiques, tout en garantissant que tout le monde reste à jour avec les dernières avancées.

Ainsi, mon activité de veille couvre pleinement les compétences du référentiel C.1.1 en :

Identifiant les nouvelles technologies et les innovations du marché,
Évaluant et recommandant des outils et processus pertinents pour nos projets,
En prenant en compte les aspects d’accessibilité numérique,
En permettant d’anticiper les opportunités de nouveaux marchés,
Et en mobilisant l’équipe pour intégrer ces innovations de manière collaborative et fluide.

Cela garantit que nos solutions sont toujours à la pointe de la technologie et répondent aux besoins actuels et futurs de l’entreprise et de ses utilisateurs.

Fiche Organisation n°O3: Astelia {#fiche-organisation-n°o3:-astelia}

Raison Sociale (nom): Astelia

Date création: 01 / 02 / 2014 Cette organisation existe-t-elle encore ? oui ◻ non x

Statut (société, artisan, association, etc): Société

Effectifs (nombre de personnes): 20+

Volume d’activités (chiffre d’affaires, etc): 1m CA, rentabilité atteinte

Implantation (régionale, nationale, internationale): Nationale

Objet, activité(s) (vente services, production biens, etc):

Astelia est un groupement de startups innovantes, dont les principales entités sont Otiko et Minifone, qui proposent des solutions technologiques adaptées aux besoins spécifiques de leurs utilisateurs.

Otiko offre des lunettes sur mesure grâce à une application mobile innovante. Les utilisateurs peuvent mesurer leur écart pupillaire en prenant une simple photo de leur visage via l'application. Cette technologie permet de commander des lunettes parfaitement adaptées à la morphologie de chacun, sans nécessiter de déplacement en magasin. Otiko collabore avec des pharmacies partenaires où les clients peuvent essayer des montures et finaliser leur commande.

Minifone propose des services de téléassistance destinés aux personnes âgées ou dépendantes. Leur offre inclut un dispositif discret et facile d'utilisation, permettant aux utilisateurs de déclencher une alerte en cas de besoin, assurant ainsi une intervention rapide. Minifone propose également une option de détection de chute, renforçant la sécurité des utilisateurs. Le service est accessible 24h/24 et 7j/7, avec un matériel discret, sans engagement ni frais de résiliation.

Astelia, en regroupant Otiko et Minifone, s'engage à fournir des solutions technologiques accessibles et adaptées, améliorant ainsi le quotidien de ses utilisateurs.

Autres données quantitatives ou qualitatives (implantation, position concurrentielle, forme juridique, parts de marchés spécificités, etc) :

Otiko

Implantation : Fondée à Lyon, Otiko a développé un réseau de distribution en partenariat avec des pharmacies. En 2016, l'entreprise comptait environ 60 pharmacies partenaires, offrant aux clients la possibilité d'essayer des montures et de commander des lunettes sur mesure.

Forme juridique : Otiko est constituée en tant que société par actions simplifiée (SAS), une structure juridique courante en France pour les startups, offrant une flexibilité en matière de gouvernance et de levée de fonds.

Position concurrentielle : Otiko se positionne comme un acteur disruptif sur le marché de l'optique en France, proposant des lunettes à des prix nettement inférieurs à ceux des opticiens traditionnels. Cette stratégie a suscité des réactions mitigées de la part des opticiens établis, certains exprimant des préoccupations quant à la concurrence.

Spécificités : L'innovation majeure d'Otiko réside dans l'utilisation d'une application mobile permettant aux utilisateurs de mesurer leur écart pupillaire en prenant une photo de leur visage. Cette technologie simplifie le processus de commande de lunettes sur mesure, rendant le service accessible et pratique.

Minifone

Implantation : Minifone est une entreprise française spécialisée dans les services de téléassistance pour les personnes âgées ou dépendantes. Elle propose ses services sur l'ensemble du territoire français, avec une installation simple ne nécessitant pas de travaux spécifiques au domicile des utilisateurs.

Forme juridique : Minifone est également constituée en société par actions simplifiée (SAS), offrant une structure flexible adaptée à son activité.

Position concurrentielle : Minifone se distingue sur le marché de la téléassistance par une offre sans engagement, sans frais de résiliation, et un matériel discret. Cette approche centrée sur la simplicité et la transparence vise à rassurer les utilisateurs et leurs familles.

Spécificités : Les dispositifs de Minifone incluent des fonctionnalités telles que la détection de chute et une autonomie de batterie pouvant atteindre cinq ans, garantissant une fiabilité et une tranquillité d'esprit pour les utilisateurs.

Fiche Emploi n° E3: Développeur {#fiche-emploi-n°-e3:-développeur}

Reprenez la ou les expériences présenté(e)s dans le parcours en vous limitant, a priori, à 3 ou 4 expériences professionnelles.

Dénomination de votre emploi: Développeur

Période: du 01/19/2012 au 01/11/2016

Nombre de mois dans la fonction: 50+

Entreprise: Astelia + Auto entreprenariat

Temps plein

Vous étiez: Cadre chez Astelia + statut auto-entrepreneur

Vos fonctions, à ce poste, couvrent :

Plusieurs fonctions sont possibles, cochez celles qui vous correspondent

Encadrement et responsabilité hiérarchique x
Production x
Commerciale x
Marketing x
Administration ◻
Qualité ◻
Gestion de projet x
Gestion financière ◻
Conception et recherche ◻
Audit - Conseil ◻

Votre unité de travail:

Dans cette boîte, mon unité de travail était une unité de produit, centrée sur deux projets spécifiques : le site web de Minifone et l’application mobile d’Otiko.

Pour Minifone, mon travail se concentrait sur le développement du site web, avec pour objectif d’optimiser l’accessibilité, la sécurité et l’expérience utilisateur. J’améliorais les fonctionnalités principales du site, en pensant particulièrement aux besoins des personnes âgées ou de leurs proches, qui utilisaient la plateforme pour accéder aux services de téléassistance.
Pour Otiko, mon travail portait sur le développement de l'application mobile. Je m’occupais des fonctionnalités de mesure, notamment l'interface utilisateur et l’outil de prise de photo pour la personnalisation des lunettes. Étant relativement junior à l'époque, je ne me chargeais pas des fonctionnalités les plus complexes, comme la programmation détaillée de l'algorithme de reconnaissance faciale, qui était gérée par les spécialistes en vision par ordinateur. Mon rôle était de garantir la précision et l'ergonomie de l'application dans la mesure de mes compétences, en veillant à ce que l’utilisateur puisse commander des lunettes sur mesure de manière simple et intuitive.

Dans l’ensemble, mon unité de travail en tant que développeur était bien définie : je travaillais dans une unité de produit, où mon focus était entièrement dirigé vers l’évolution et la performance du site Minifone et de l’application Otiko.

Place de cette unité de travail dans l’organisation, activités, missions, composition et effectif

Mon équipe produit était rattachée directement au département marketing, sous la supervision du DG. Elle jouait un rôle crucial dans la stratégie numérique de l’entreprise, en contribuant directement à l’expérience utilisateur et en répondant aux besoins technologiques et d’accessibilité des deux principaux services proposés par Astelia.

Activités principales:

Développement et maintenance : Création de nouvelles fonctionnalités pour le site et l'application, correction des bugs et mises à jour pour améliorer la sécurité et la performance.
Optimisation UX/UI : Collaboration étroite avec les designers pour concevoir des interfaces intuitives, accessibles et attractives, adaptées aux utilisateurs finaux.
Tests et qualité : Validation des fonctionnalités développées, tests de performance, tests de compatibilité, et gestion des retours d’utilisateurs pour ajuster les produits en continu.
Veille technologique : Exploration de nouvelles technologies (notamment pour les modules de reconnaissance faciale) et intégration de solutions adaptées aux produits.

Missions spécifiques

Pour Minifone : Assurer une expérience utilisateur simple et fluide sur le site, en adaptant la navigation et les fonctionnalités aux besoins des personnes âgées. Améliorer la sécurité des données et garantir la fiabilité des services de téléassistance, notamment en lien avec les systèmes d’alerte.
Pour Otiko : Développer et maintenir le module de reconnaissance faciale et de prise de photo pour la mesure de l’écart pupillaire, garantissant une précision optimale pour un service de lunettes sur mesure. Intégrer des améliorations continues pour que l’application reste performante et intuitive.

Composition et effectif

Mon équipe produit était composée de 5 personnes + le directeur :

2 Développeurs: dont moi, nous étions responsables de l’interface utilisateur, de l’intégration des fonctionnalités de reconnaissance faciale pour Otiko et de l’ergonomie du site Minifone.
1 Designer UX/UI : créait les interfaces et travaillait étroitement avec les développeurs pour s’assurer que le design était intuitif et accessible.
Spécialistes en vision par ordinateur: responsables des algorithmes de reconnaissance pour l’application Otiko.

Ensemble, notre équipe produit avait pour mission d’assurer que les produits numériques d’Astelia soient performants, intuitifs et en constante amélioration, répondant aux besoins spécifiques des utilisateurs de Minifone et Otiko.

Organisation interne de votre unité de travail

(organisation hiérarchique, répartition des rôles, modalités de fonctionnement interne, objectifs, budgets, effectif, fonctions des collaborateurs…)

Dans mon unité de travail, nous suivions une organisation interne structurée autour d’une approche traditionnelle, utilisant des diagrammes de Gantt pour planifier et gérer nos tâches. Cette méthode permettait une visibilité claire des étapes et des délais pour chaque projet, mais elle demandait une bonne discipline de suivi pour rester alignés avec les objectifs fixés.

Organisation hiérarchique

Directeur de la boîte, Romain Freton : Il assurait la supervision globale de l’équipe. En tant que décisionnaire principal, il définissait les orientations stratégiques, validait les étapes clés, et fixait les priorités pour chaque produit.
Équipe produit (6 personnes) : Composée de développeurs, designers, et spécialistes, notre équipe fonctionnait de manière hiérarchique sous la direction de Romain, avec des rôles bien définis pour chaque membre.

Répartition des rôles et fonctions des collaborateurs

Romain Freton (Directeur) : En plus de superviser l’équipe, il validait nos progrès hebdomadaires et s’assurait que chaque étape de notre planning correspondait aux attentes globales de l’entreprise.
Développeurs (2 personnes, dont moi) :
- Moi : J’étais responsable du développement front-end pour l’application mobile Otiko, particulièrement sur les fonctionnalités liées à l’interaction avec l’utilisateur, comme la prise de mesure pour les lunettes via la reconnaissance faciale.
- Deuxième développeur : Il s’occupait du site de Minifone, gérant à la fois le front-end et le back-end pour garantir la performance, la sécurité et l’accessibilité de la plateforme.
Designer UX/UI : Chargé de créer des interfaces ergonomiques et intuitives pour les deux produits, il travaillait en collaboration avec nous pour s’assurer que les designs soient bien intégrés dans les applications.
Spécialistes en vision par ordinateur (2 personnes) : Leur mission portait sur le développement des algorithmes de reconnaissance faciale et de mesure pour Otiko, une composante essentielle pour assurer la précision des lunettes sur mesure.

Modalités de fonctionnement interne

Planification par diagrammes de Gantt : Notre travail était organisé autour de diagrammes de Gantt, avec des jalons fixés pour chaque étape du projet. Cette approche permettait une gestion linéaire du temps, chaque membre sachant précisément quand il devait compléter ses tâches pour respecter le calendrier global.
Suivi hebdomadaire avec le directeur : Nous avions des réunions de suivi chaque semaine avec Romain Freton. Lors de ces rencontres, nous faisions le point sur l’avancement des tâches, identifions les éventuels blocages, et ajustions les échéances si nécessaire. Ce suivi rapproché était essentiel pour maintenir le rythme et respecter les délais fixés.
Structure de communication : Le diagramme de Gantt structurant bien nos tâches, nous n'avions pas besoin de réajuster constamment. Nous documentions l’avancée de chaque étape dans des outils de gestion de projet pour une transparence totale sur l’avancement.

Objectifs de l’unité de travail

Minifone : Développer un site web accessible et fiable pour les utilisateurs âgés, en intégrant des systèmes d’alerte et des mesures de sécurité robustes.
Otiko : Créer une application mobile performante avec un module de reconnaissance faciale précis pour offrir des lunettes sur mesure, tout en assurant une expérience utilisateur intuitive et fluide.

Budget

Pour le budget annuel, il était d’environ 500 000 € — si mes souvenirs sont bons, car cela remonte à assez longtemps. Ce budget couvrait les développements techniques, les tests qualité, les licences de logiciels, ainsi que les salaires de l’équipe.
Investissements clés : Une partie du budget était dédiée aux technologies de vision par ordinateur et aux infrastructures de serveurs, pour garantir une performance optimale et la fiabilité des fonctionnalités critiques.

Effectif et fonctions des collaborateurs

Effectif total : 6 personnes (dans notre service)
- 1 Directeur (Romain Freton)
- 2 Développeurs (dont moi)
- 1 Designer UX/UI
- 2 Spécialistes en vision par ordinateur

En somme, notre unité de travail fonctionnait avec une structure hiérarchique traditionnelle, où chaque tâche et jalon étaient prévus dans un diagramme de Gantt. Grâce au suivi hebdomadaire avec Romain Freton et à une organisation rigoureuse, nous avons pu avancer de manière linéaire tout en assurant une gestion précise du temps et des ressources.

Quelle place occupez-vous dans cette unité de travail ?

Dans cette unité de travail, j’occupais le poste de développeur junior. Mon rôle consistait à travailler sur les fonctionnalités de mesure et de personnalisation des lunettes, en particulier l’interface utilisateur et l’outil de prise de photo.

En tant que développeur relativement junior à l’époque, je me concentrais sur des tâches spécifiques et moins complexes, contribuant à l’ergonomie et à la fluidité de l’application pour que les utilisateurs puissent naviguer facilement et commander des lunettes sur mesure. Je collaborais étroitement avec les autres membres de l’équipe, notamment les spécialistes en vision par ordinateur, qui se chargeaient des aspects plus avancés comme la reconnaissance faciale.

Ma place dans l’équipe me permettait d’apprendre des développeurs plus expérimentés et de progresser tout en contribuant activement aux objectifs de l’application Otiko.

Qui définit, contrôle et évalue vos activités ?

Dans cette unité de travail, c’est le directeur de la boîte, Romain Freton, qui définissait, contrôlait et évaluait mes activités.

Définition des activités : Romain fixait les grandes priorités et les fonctionnalités que l’équipe devait développer pour répondre aux besoins des utilisateurs et aux objectifs commerciaux. Il définissait les étapes clés et les tâches générales, en orientant mon travail vers des fonctionnalités spécifiques de l’application mobile d’Otiko.
Contrôle des activités : Il assurait un suivi hebdomadaire de nos progrès en vérifiant que chaque étape prévue dans le diagramme de Gantt avançait comme prévu. Lors de ces points hebdomadaires, il contrôlait que les livrables étaient en ligne avec les attentes et ajustait les priorités si nécessaire.
Évaluation des activités : Romain évaluait mon travail en fonction de ma progression, des résultats obtenus, et de la qualité des fonctionnalités que je développais. Il m’apportait également des retours réguliers pour m’aider à progresser, en prenant en compte mon niveau junior. Ses évaluations portaient sur la précision, l’ergonomie de l’application, et ma capacité à collaborer efficacement avec le reste de l’équipe.

###

Votre position:

Présentez et commentez vos principales fonctions et/ou responsabilités. Si la nature de vos fonctions a évolué, expliquez les éléments marquants.

Lorsque j’ai rejoint Astelia, j’étais un développeur front-end relativement junior, ce qui signifiait que mes responsabilités étaient principalement concentrées sur des tâches spécifiques, avec un niveau de complexité adapté à mon expérience. À mon arrivée, j’ai intégré l’équipe en tant qu’indépendant sous le statut d'auto-entrepreneur. Ce statut m’a offert une certaine liberté et un regard extérieur sur l’organisation, mais avec le temps et les expériences que j’ai accumulées, j’ai finalement accepté un poste à temps plein en tant que cadre. Cette transition a marqué un tournant dans mon parcours chez Astelia, car elle symbolisait un passage à des responsabilités plus approfondies et un engagement professionnel à long terme.

Au sein de l’équipe, mon rôle était axé sur le développement front-end du site minifone et de l’application Otiko, en particulier sur les fonctionnalités d’interface utilisateur et les outils de personnalisation des lunettes. Ma mission était d’assurer la précision et l’ergonomie de ces fonctionnalités, pour permettre aux utilisateurs de commander des lunettes sur mesure de manière simple et intuitive. En tant que développeur junior, je n’étais pas en charge des aspects les plus complexes, comme l’algorithme de reconnaissance faciale, qui était géré par les spécialistes en vision par ordinateur.

En avançant dans mon rôle, mes responsabilités ont commencé à évoluer. Grâce aux retours constants de Romain Freton, le directeur, et aux échanges avec des développeurs plus expérimentés, j’ai rapidement progressé. Chaque tâche, même simple, était pour moi l’occasion d’apprendre et de me familiariser avec des pratiques professionnelles structurées, et de développer des compétences techniques plus pointues, tant sur le plan du développement que de la gestion de projet.

En regardant en arrière, cette première expérience professionnelle me permet de réaliser à quel point nos méthodes de développement ont évolué. À l’époque, nous travaillions avec un diagramme de Gantt, une méthode classique de gestion de projet linéaire, qui prédéfinissait chaque étape et chaque délai. Cela assurait une structure claire, mais nous rendait peu flexibles face aux imprévus et aux ajustements, ce qui se révélait parfois frustrant. Le Gantt ne permettait pas de réagir rapidement aux retours des utilisateurs ni aux évolutions technologiques. Nous devions suivre le plan initial, ce qui créait des situations où des changements nécessaires pouvaient prendre du retard.

Avec le recul, je mesure l'impact qu’a eu cette méthode sur ma perception du développement. C’est en voyant ses limites que j’ai appris à apprécier la flexibilité des méthodes agiles. Aujourd’hui, en travaillant de manière itérative et en cycles courts, je constate combien le développement agile rend les projets plus dynamiques et adaptés aux besoins des utilisateurs. L’agile nous offre une capacité d’adaptation que je n’avais pas à mes débuts, ce qui est essentiel pour des produits en évolution constante.

En faisant cette rétrospective, je réalise combien cette première expérience chez Astelia a été déterminante. D'abord, elle m'a appris les bases du développement structuré, mais elle m’a également donné une vision plus large du processus de création de produits. Passer d’indépendant à cadre a été un chemin formateur, à la fois professionnellement et personnellement. Cette transition m’a permis de m’investir davantage, de comprendre les enjeux d’une organisation, et d’assumer des responsabilités plus variées. J’ai développé des compétences en gestion de projet et en travail d’équipe, et j’ai appris à collaborer avec des profils divers, ce qui a enrichi ma façon de penser et de coder.

En rétrospective, cette expérience chez Astelia est bien plus qu’un premier emploi ; c’est un pilier fondateur dans mon parcours, qui m’a permis de comprendre l’évolution des pratiques de développement et de construire des bases solides pour ma carrière de développeur..

Vos Interlocuteurs

Identifiez vos interlocuteurs principaux (collaborateurs, supérieurs hiérarchiques ou fonctionnels, services internes, structures externes) et explicitez la nature et les modalités de vos relations.

Mes interlocuteurs principaux chez Astelia comprenaient essentiellement des collaborateurs directs, mon supérieur hiérarchique, ainsi que quelques prestataires externes. Cela dit, je ne me souviens plus de tous les noms de mes collègues, et puisque la société n’existe plus, il m’est difficile de retrouver les informations précises sur chaque membre de l’équipe.

Interlocuteurs internes

Romain Freton (Directeur) : En tant que mon supérieur hiérarchique, Romain jouait un rôle central dans l’orientation de mon travail. Il définissait nos priorités, nous donnait des retours réguliers et fixait les grandes étapes des projets. Nous avions des réunions hebdomadaires pour discuter de l’avancement et des ajustements nécessaires. La relation avec lui était surtout axée sur des échanges réguliers pour s’assurer que mon travail correspondait aux objectifs de l’entreprise.
Mon collègue développeur : Mon principal collaborateur au quotidien était l’autre développeur de l’équipe, qui travaillait principalement sur le site de Minifone. Nous échangions fréquemment pour partager nos avancements, discuter des défis techniques, et s’assurer que nos travaux respectifs s’intégraient bien dans les produits. Nos échanges étaient souvent informels, mais essentiels pour garder une cohérence entre le site web et l’application mobile.
Designer UX/UI : Le designer était en charge de l'ergonomie et de l’aspect visuel des interfaces, ce qui était crucial pour mon travail sur l’application Otiko. Nous travaillions main dans la main pour assurer une interface utilisateur intuitive et agréable. Nos échanges étaient fréquents, notamment pour ajuster les éléments graphiques et les fonctionnalités interactives.
Spécialistes en vision par ordinateur : Deux spécialistes externes s'occupaient des algorithmes de reconnaissance faciale. Bien qu’indépendants de notre équipe, ils étaient en lien avec nous pour intégrer leurs travaux à l’application. J’échangeais avec eux surtout pour m’assurer que les fonctionnalités de base de l’application permettaient une utilisation optimale de leur algorithme de mesure.

Relations et modalités de travail

Réunions hebdomadaires : Organisées avec Romain Freton et les membres de l’équipe, ces réunions nous permettaient de faire un point sur l’avancement et de réajuster les priorités.
Échanges quotidiens : La plupart des échanges avec mes collègues se faisaient de manière informelle, directement au bureau ou via les outils internes, pour résoudre les problèmes et coordonner les tâches.
Suivi avec les spécialistes externes : Les échanges avec les spécialistes en vision par ordinateur étaient moins fréquents, mais déterminants pour l’intégration de leur algorithme. Ces discussions se faisaient généralement lors de points techniques prévus à l'avance.

Management

Exercez-vous des fonctions d’encadrement ? x Non ◻ oui

Si oui, nombre de collaborateurs encadrés ? 0

Changements durant votre expérience

Si des changements importants ont marqué l’évolution de votre emploi (fonction ou poste), de quel(s) ordre(s) étaient-ils ?

Durant mon expérience chez Astelia, plusieurs changements importants ont marqué l’évolution de mon poste et ont eu un impact sur mon travail et mes responsabilités.

Transition d’un statut d’indépendant à un poste de cadre à temps plein

Au départ, j’avais rejoint Astelia en tant qu’indépendant sous le statut d'auto-entrepreneur, avec des responsabilités limitées et des tâches spécifiques en développement front-end. Au bout de quelques mois, l’entreprise m’a proposé un poste de cadre à temps plein. Cette transition a modifié mon approche du travail : je me suis senti plus impliqué dans les projets, avec des responsabilités accrues et une vision plus large des objectifs de l’entreprise. Ce changement m’a aussi permis de travailler de manière plus rapprochée avec l’équipe et de m’intégrer davantage à la culture de l’entreprise.

Élargissement de mes responsabilités techniques

En gagnant en expérience et en devenant plus autonome, mes responsabilités ont évolué. Initialement, je m’occupais de tâches front-end basiques, mais j’ai progressivement été impliqué dans des aspects plus complexes du développement. Par exemple, on m’a confié l’intégration de fonctionnalités supplémentaires comme des options de personnalisation plus poussées pour les lunettes. Bien que les spécialistes en vision par ordinateur continuaient de gérer les algorithmes complexes, j’ai commencé à collaborer plus étroitement avec eux, ce qui m’a permis d’approfondir mes compétences techniques.

En somme, cette évolution constante de mon poste chez Astelia a enrichi mon parcours professionnel et m’a permis de gagner en compétences techniques, en autonomie, et en compréhension des dynamiques de projet et de relation client.

Comment avez-vous fait face à ces changements ?

Face à l’évolution de mes tâches, j’ai dû rapidement monter en compétences sur certains aspects techniques du développement front-end, notamment pour les fonctionnalités de personnalisation de l’application Otiko. Pour cela, j’ai pris l’initiative de suivre des ressources en ligne et de demander conseil à mes collègues plus expérimentés. Chaque nouvelle tâche était pour moi l’occasion d’apprendre et de solidifier mes compétences. En étant attentif aux retours de mes collègues et en m'appuyant sur leurs connaissances, j’ai progressivement pris confiance pour gérer des aspects techniques plus complexes.

Expliquez si vous avez eu la possibilité de proposer et d’introduire vous-même des changements :

Chez Astelia, les possibilités de proposer et d'introduire des changements étaient en effet limitées, notamment en raison du processus structuré autour des diagrammes de Gantt. Ce cadre, bien qu'organisé, laissait peu de place à des ajustements en cours de route. Le Gantt, avec son approche linéaire, exigeait de suivre un plan précis et fixé dès le départ, ce qui réduisait la flexibilité et la capacité à réagir aux besoins évolutifs du projet.

C’est ici que j’ai pris conscience des limites de ce type de méthode. Si j'ai pu proposer quelques ajustements mineurs dans l'interface utilisateur, le suivi des bugs, et les échanges informels, ces améliorations restaient restreintes par la rigidité du diagramme de Gantt. Tout changement devait être discuté et validé à chaque étape, ce qui ralentissait l’implémentation et laissait peu de marge de manœuvre pour innover ou répondre rapidement aux retours utilisateurs.

En faisant un retour sur cette expérience, je mesure aujourd'hui à quel point les méthodes agiles offrent une alternative bien plus efficace. L'agile permet des itérations courtes, des ajustements en continu et des échanges réguliers avec l’équipe et les utilisateurs, ce qui rend le développement bien plus dynamique. Cette première expérience chez Astelia m’a permis de comprendre les limites d’une planification rigide et de réaliser la valeur ajoutée d’une méthode agile, qui est bien mieux adaptée aux besoins changeants et aux attentes actuelles en développement logiciel.

Votre autonomie:

Quelles sont vos marges d’initiative et d’autonomie dans votre fonction ? Concernent-elles vos activités, vos priorités, vos méthodes ?

Cette première expérience m’a montré les limites de mon autonomie dans un cadre de travail très structuré, mais elle m’a aussi appris l’importance de l’organisation personnelle. Mon autonomie concernait surtout l’exécution de mes tâches spécifiques et la gestion des détails au quotidien, mais le Gantt limitait mes marges d’initiative pour apporter des changements plus larges. En rétrospective, cette expérience m’a fait comprendre que des méthodes comme l’agile offrent une autonomie plus dynamique et un cadre plus flexible, permettant aux développeurs de s'adapter en fonction des besoins du projet et des retours des utilisateurs.

Spécificités

Votre activité présente-t-elle des contraintes ou des spécificités qui impactent votre activité et les compétences que vous mobilisez ?

Exigence de précision dans les fonctionnalités de mesure

Travaillant sur l’application mobile d’Otiko, je devais veiller à la précision des fonctionnalités de mesure pour la personnalisation des lunettes. Cette exigence impliquait une grande attention aux détails et une rigueur dans l’interface, car la moindre imprécision pouvait affecter l’expérience utilisateur. J’ai donc appris à accorder une importance particulière à la justesse des éléments visuels et à tester minutieusement chaque fonctionnalité.

Collaboration avec des experts en vision par ordinateur

Le développement de l’application nécessitait une interaction étroite avec les spécialistes en vision par ordinateur, qui travaillaient sur l’algorithme de reconnaissance faciale. Cette collaboration m’a poussé à approfondir mes connaissances sur des concepts techniques que je ne maîtrisais pas initialement. J’ai également dû adapter mon code pour que nos modules fonctionnent de manière fluide et intégrée, ce qui a renforcé ma capacité à coordonner mon travail avec celui d’experts externes.

Adaptation pour un public spécifique

Le site Minifone s’adressait principalement aux personnes âgées, ce qui impliquait des choix de design et d’ergonomie adaptés à ce public. Bien que ce ne fût pas mon projet principal, cette spécificité m’a sensibilisé aux contraintes d’accessibilité et aux besoins d’une audience ayant des attentes particulières. J’ai intégré cette approche dans mes réflexions sur l’ergonomie de l’application Otiko, en me concentrant sur la simplicité et l’intuitivité des interfaces.

Ces spécificités ont donc exigé de moi une grande précision, une capacité de collaboration interdisciplinaire, une gestion rigoureuse du temps, et une adaptation constante aux besoins du projet et aux outils de travail.

Conclusion {#conclusion}

Mon parcours professionnel, marqué par des expériences diversifiées et progressives, m’a permis de développer des compétences techniques approfondies et une vision élargie du développement logiciel, de la gestion de projet, et du leadership.

Chez Enlaps, en tant que Lead Dev Front-End et Mobile, j’endosse une polyvalence rare, qui combine responsabilités techniques et stratégiques. Cette expérience est particulièrement enrichissante et stimulante car elle implique la supervision de l'architecture de la plateforme myTikee, la coordination des équipes, et le choix des technologies alignées aux attentes du marché. Cette position de lead exige une prise de recul constante pour garantir l’adaptabilité de nos choix techniques à long terme, mais elle nourrit également mon goût pour l'innovation et le développement d'interfaces utilisateurs modernes et performantes.

Auparavant, mon poste de développeur fullstack chez Wizbii m’a permis d’affirmer mes compétences en développement et de découvrir le plaisir du mentorat en encadrant un alternant ingénieur. Cette expérience a renforcé mon sens de la rigueur et du travail d'équipe, acquis lors de mes années dans le milieu bancaire, et m’a permis de toucher à de nombreux aspects techniques, du front-end au back-end, dans un environnement où la sécurité et la scalabilité des services étaient prioritaires. Wizbii a été une étape clé, me préparant aux responsabilités et à la gestion de projets collaboratifs et ambitieux.

Mon premier emploi chez Astelia, où j'ai commencé comme développeur front-end junior, a posé les bases de ma carrière. J’ai appris les fondamentaux du développement structuré et la collaboration en équipe, tout en passant d’un statut d'indépendant à celui de cadre. Cette transition m’a permis de comprendre la discipline nécessaire pour assurer la qualité et la précision des projets. À cette époque, nous utilisions des méthodes de gestion de projet linéaires (diagramme de Gantt), moins flexibles, mais cette expérience m’a ouvert les yeux sur les limites de ces méthodes et m’a donné un fort appétit pour les méthodes agiles, que j’ai ensuite pleinement adoptées.

Ce parcours, enrichi par des défis techniques variés et des contextes de travail dynamiques, m’a forgé un socle de compétences solide et m’a permis de trouver un équilibre entre rigueur et adaptabilité. Chaque expérience a apporté une dimension unique à mon expertise, faisant de moi un professionnel capable de concilier innovation technique, structuration des projets, et accompagnement des équipes.