[{"data":1,"prerenderedAt":4248},["ShallowReactive",2],{"portfolio-works":3},{"works":4,"tags":4103,"tools":4210},[5,34,53,805,827,1898,2411,2430,3461,3476,3506,3520,3533,3602,3976,4005,4032,4060,4074],{"slug":6,"id":6,"show":7,"title":8,"shortTitle":8,"client":8,"description":9,"tags":10,"tools":16,"link":17,"isLinkActive":7,"year":18,"imageDir":17,"frontImage":17,"gallery":19,"content":20,"sortOrder":23,"translations":24},"tournaire",false,"Tournaire","A professional web project focused on clarity, responsive implementation, and a polished user experience. The work emphasizes structured content, clean interface patterns, and a reliable frontend foundation.",[11,12,13,14,15],"web-dev","wordpress","spectra","pro","scss",[],"",2026,[],{"type":21,"content":22},"doc",[],1,{"en":25,"fr":30},{"title":8,"shortTitle":26,"summary":27,"description":9,"content":28},"Tournaire ",null,{"type":21,"content":29},[],{"title":8,"shortTitle":26,"summary":27,"description":31,"content":32},"Un projet web professionnel centré sur la clarté, l’intégration responsive et une expérience utilisateur soignée. Le travail met l’accent sur une structure de contenu lisible, des interfaces propres et une base frontend fiable.",{"type":21,"content":33},[],{"slug":35,"id":35,"show":7,"title":36,"shortTitle":36,"client":36,"description":37,"tags":38,"tools":39,"link":17,"isLinkActive":7,"year":18,"imageDir":17,"frontImage":17,"gallery":40,"content":41,"sortOrder":43,"translations":44},"ampere","Ampère","A professional project built around a clean digital presence, readable content hierarchy, and careful frontend integration. The goal was to provide a fast, accessible, and credible experience across devices.",[14,13,11,12],[],[],{"type":21,"content":42},[],2,{"en":45,"fr":49},{"title":36,"shortTitle":46,"summary":27,"description":37,"content":47},"Ampère ",{"type":21,"content":48},[],{"title":36,"shortTitle":46,"summary":27,"description":50,"content":51},"Un projet professionnel construit autour d’une présence digitale claire, d’une hiérarchie de contenu lisible et d’une intégration frontend précise. L’objectif était de proposer une expérience rapide, accessible et crédible sur tous les écrans.",{"type":21,"content":52},[],{"slug":54,"id":54,"show":55,"title":56,"shortTitle":57,"client":58,"description":59,"tags":60,"tools":62,"link":65,"isLinkActive":55,"year":18,"imageDir":66,"frontImage":67,"gallery":68,"content":69,"sortOrder":80,"translations":329},"galerie-du-design",true,"Design Gallery","Galerie","Saint Étienne Métropole","The National Design Gallery website was a challenging project that combined a tight deadline, ambitious design requirements, and high technical expectations. Built to support the public launch of a major cultural institution, the platform required a strong focus on performance, sustainability, and pixel-perfect implementation.",[11,61,14,12,15],"php",[63,64],"figma","phpstorm","https:\u002F\u002Fgalerienationaledudesign.fr\u002F","\u002Fprojects\u002Fgnd","\u002Fgnd_mockup.webp",[],{"type":21,"content":70},[71,78,84,88,93,97,101,106,111,115,119,147,151,156,160,164,196,200,205,209,213,239,243,248,252,256,282,286,291,295,299,325],{"type":72,"attrs":73,"content":74},"heading",{"level":43},[75],{"text":76,"type":77},"City of Design - Saint-Étienne","text",{"type":72,"attrs":79,"content":81},{"level":80},3,[82],{"text":83,"type":77},"Front-end Development for a High-Visibility Cultural Platform",{"type":85,"content":86},"paragraph",[87],{"text":59,"type":77},{"type":72,"attrs":89,"content":90},{"level":43},[91],{"text":92,"type":77},"Context",{"type":85,"content":94},[95],{"text":96,"type":77},"The National Design Gallery was created to showcase and promote France’s public design collections through a modern digital experience.",{"type":85,"content":98},[99],{"text":100,"type":77},"As the website was scheduled to go live alongside the institution’s official launch, it was expected to receive significant traffic from day one. Ensuring reliability, speed, and a seamless user experience was therefore a critical part of the project.",{"type":72,"attrs":102,"content":103},{"level":43},[104],{"text":105,"type":77},"Challenges",{"type":72,"attrs":107,"content":108},{"level":80},[109],{"text":110,"type":77},"Advanced Typography Integration",{"type":85,"content":112},[113],{"text":114,"type":77},"The visual identity relied heavily on custom typography, including multiple font variants and specific glyph management requirements.",{"type":85,"content":116},[117],{"text":118,"type":77},"Special attention was given to:",{"type":120,"content":121},"bulletList",[122,129,135,141],{"type":123,"content":124},"listItem",[125],{"type":85,"content":126},[127],{"text":128,"type":77},"Integrating custom typefaces and font assets.",{"type":123,"content":130},[131],{"type":85,"content":132},[133],{"text":134,"type":77},"Handling specific glyph sets and typographic behaviors.",{"type":123,"content":136},[137],{"type":85,"content":138},[139],{"text":140,"type":77},"Optimizing font loading strategies.",{"type":123,"content":142},[143],{"type":85,"content":144},[145],{"text":146,"type":77},"Maintaining visual consistency across devices and browsers.",{"type":85,"content":148},[149],{"text":150,"type":77},"The challenge was to preserve the intended artistic direction while keeping the website lightweight and performant.",{"type":72,"attrs":152,"content":153},{"level":80},[154],{"text":155,"type":77},"Performance at Scale",{"type":85,"content":157},[158],{"text":159,"type":77},"Because the platform was expected to attract a large audience during its launch period, performance was considered a core requirement from the start.",{"type":85,"content":161},[162],{"text":163,"type":77},"Key areas of focus included:",{"type":120,"content":165},[166,172,178,184,190],{"type":123,"content":167},[168],{"type":85,"content":169},[170],{"text":171,"type":77},"Asset optimization.",{"type":123,"content":173},[174],{"type":85,"content":175},[176],{"text":177,"type":77},"Efficient rendering strategies.",{"type":123,"content":179},[180],{"type":85,"content":181},[182],{"text":183,"type":77},"Progressive loading techniques.",{"type":123,"content":185},[186],{"type":85,"content":187},[188],{"text":189,"type":77},"Minimizing third-party dependencies.",{"type":123,"content":191},[192],{"type":85,"content":193},[194],{"text":195,"type":77},"Improving Core Web Vitals metrics.",{"type":85,"content":197},[198],{"text":199,"type":77},"Every technical decision was made with scalability and responsiveness in mind.",{"type":72,"attrs":201,"content":202},{"level":80},[203],{"text":204,"type":77},"Sustainable Web Development",{"type":85,"content":206},[207],{"text":208,"type":77},"Eco-design is a fundamental part of our development approach, and this project was no exception.",{"type":85,"content":210},[211],{"text":212,"type":77},"To reduce the website’s environmental footprint, we focused on:",{"type":120,"content":214},[215,221,227,233],{"type":123,"content":216},[217],{"type":85,"content":218},[219],{"text":220,"type":77},"Building a lightweight front-end architecture.",{"type":123,"content":222},[223],{"type":85,"content":224},[225],{"text":226,"type":77},"Limiting unnecessary JavaScript.",{"type":123,"content":228},[229],{"type":85,"content":230},[231],{"text":232,"type":77},"Optimizing media delivery and resource loading.",{"type":123,"content":234},[235],{"type":85,"content":236},[237],{"text":238,"type":77},"Reducing the overall cost of each user interaction.",{"type":85,"content":240},[241],{"text":242,"type":77},"This approach helped balance visual quality with digital sustainability.",{"type":72,"attrs":244,"content":245},{"level":43},[246],{"text":247,"type":77},"Development Process",{"type":85,"content":249},[250],{"text":251,"type":77},"The entire front-end was developed by a team of two developers.",{"type":85,"content":253},[254],{"text":255,"type":77},"Rather than relying on pre-built UI libraries, we designed and built every component from scratch to meet the project's specific requirements. This included:",{"type":120,"content":257},[258,264,270,276],{"type":123,"content":259},[260],{"type":85,"content":261},[262],{"text":263,"type":77},"Custom UI components.",{"type":123,"content":265},[266],{"type":85,"content":267},[268],{"text":269,"type":77},"Flexible layout systems.",{"type":123,"content":271},[272],{"type":85,"content":273},[274],{"text":275,"type":77},"Optimized animations and interactions.",{"type":123,"content":277},[278],{"type":85,"content":279},[280],{"text":281,"type":77},"High-fidelity implementation of the design system.",{"type":85,"content":283},[284],{"text":285,"type":77},"Building everything in-house gave us complete control over performance, maintainability, and user experience.",{"type":72,"attrs":287,"content":288},{"level":43},[289],{"text":290,"type":77},"Outcome",{"type":85,"content":292},[293],{"text":294,"type":77},"Despite a very compressed production timeline, the project was successfully delivered on schedule.",{"type":85,"content":296},[297],{"text":298,"type":77},"The final result is a fast, scalable, and visually refined platform that combines:",{"type":120,"content":300},[301,307,313,319],{"type":123,"content":302},[303],{"type":85,"content":304},[305],{"text":306,"type":77},"Strong performance.",{"type":123,"content":308},[309],{"type":85,"content":310},[311],{"text":312,"type":77},"Precise design execution.",{"type":123,"content":314},[315],{"type":85,"content":316},[317],{"text":318,"type":77},"A fully custom front-end architecture.",{"type":123,"content":320},[321],{"type":85,"content":322},[323],{"text":324,"type":77},"Sustainable development principles.",{"type":85,"content":326},[327],{"text":328,"type":77},"This project demonstrates our ability to deliver high-quality digital experiences under demanding constraints while maintaining a strong focus on performance, craftsmanship, and eco-conscious development.",{"en":330,"fr":538},{"title":56,"shortTitle":57,"summary":27,"description":59,"content":331},{"type":21,"content":332},[333,337,341,344,348,351,354,358,362,365,368,390,393,397,400,403,430,433,437,440,443,465,468,472,475,478,500,503,507,510,513,535],{"type":72,"attrs":334,"content":335},{"level":43},[336],{"text":76,"type":77},{"type":72,"attrs":338,"content":339},{"level":80},[340],{"text":83,"type":77},{"type":85,"content":342},[343],{"text":59,"type":77},{"type":72,"attrs":345,"content":346},{"level":43},[347],{"text":92,"type":77},{"type":85,"content":349},[350],{"text":96,"type":77},{"type":85,"content":352},[353],{"text":100,"type":77},{"type":72,"attrs":355,"content":356},{"level":43},[357],{"text":105,"type":77},{"type":72,"attrs":359,"content":360},{"level":80},[361],{"text":110,"type":77},{"type":85,"content":363},[364],{"text":114,"type":77},{"type":85,"content":366},[367],{"text":118,"type":77},{"type":120,"content":369},[370,375,380,385],{"type":123,"content":371},[372],{"type":85,"content":373},[374],{"text":128,"type":77},{"type":123,"content":376},[377],{"type":85,"content":378},[379],{"text":134,"type":77},{"type":123,"content":381},[382],{"type":85,"content":383},[384],{"text":140,"type":77},{"type":123,"content":386},[387],{"type":85,"content":388},[389],{"text":146,"type":77},{"type":85,"content":391},[392],{"text":150,"type":77},{"type":72,"attrs":394,"content":395},{"level":80},[396],{"text":155,"type":77},{"type":85,"content":398},[399],{"text":159,"type":77},{"type":85,"content":401},[402],{"text":163,"type":77},{"type":120,"content":404},[405,410,415,420,425],{"type":123,"content":406},[407],{"type":85,"content":408},[409],{"text":171,"type":77},{"type":123,"content":411},[412],{"type":85,"content":413},[414],{"text":177,"type":77},{"type":123,"content":416},[417],{"type":85,"content":418},[419],{"text":183,"type":77},{"type":123,"content":421},[422],{"type":85,"content":423},[424],{"text":189,"type":77},{"type":123,"content":426},[427],{"type":85,"content":428},[429],{"text":195,"type":77},{"type":85,"content":431},[432],{"text":199,"type":77},{"type":72,"attrs":434,"content":435},{"level":80},[436],{"text":204,"type":77},{"type":85,"content":438},[439],{"text":208,"type":77},{"type":85,"content":441},[442],{"text":212,"type":77},{"type":120,"content":444},[445,450,455,460],{"type":123,"content":446},[447],{"type":85,"content":448},[449],{"text":220,"type":77},{"type":123,"content":451},[452],{"type":85,"content":453},[454],{"text":226,"type":77},{"type":123,"content":456},[457],{"type":85,"content":458},[459],{"text":232,"type":77},{"type":123,"content":461},[462],{"type":85,"content":463},[464],{"text":238,"type":77},{"type":85,"content":466},[467],{"text":242,"type":77},{"type":72,"attrs":469,"content":470},{"level":43},[471],{"text":247,"type":77},{"type":85,"content":473},[474],{"text":251,"type":77},{"type":85,"content":476},[477],{"text":255,"type":77},{"type":120,"content":479},[480,485,490,495],{"type":123,"content":481},[482],{"type":85,"content":483},[484],{"text":263,"type":77},{"type":123,"content":486},[487],{"type":85,"content":488},[489],{"text":269,"type":77},{"type":123,"content":491},[492],{"type":85,"content":493},[494],{"text":275,"type":77},{"type":123,"content":496},[497],{"type":85,"content":498},[499],{"text":281,"type":77},{"type":85,"content":501},[502],{"text":285,"type":77},{"type":72,"attrs":504,"content":505},{"level":43},[506],{"text":290,"type":77},{"type":85,"content":508},[509],{"text":294,"type":77},{"type":85,"content":511},[512],{"text":298,"type":77},{"type":120,"content":514},[515,520,525,530],{"type":123,"content":516},[517],{"type":85,"content":518},[519],{"text":306,"type":77},{"type":123,"content":521},[522],{"type":85,"content":523},[524],{"text":312,"type":77},{"type":123,"content":526},[527],{"type":85,"content":528},[529],{"text":318,"type":77},{"type":123,"content":531},[532],{"type":85,"content":533},[534],{"text":324,"type":77},{"type":85,"content":536},[537],{"text":328,"type":77},{"title":539,"shortTitle":57,"summary":27,"description":540,"content":541},"Galerie du Design","La réalisation du site de la Galerie Nationale du Design a représenté un défi technique et organisationnel majeur. Le projet devait être livré dans un délai particulièrement court, avec des exigences de design très spécifiques et un niveau d'exigence élevé sur les performances, l'accessibilité et l'éco-conception. Le site accompagne l'ouverture officielle de cette nouvelle institution culturelle française dédiée aux collections publiques de design.",{"type":21,"content":542},[543,548,553,556,561,565,569,583,588,593,597,601,627,632,636,640,672,676,681,685,689,715,719,724,728,732,758,762,767,771,775,801],{"type":72,"attrs":544,"content":545},{"level":43},[546],{"text":547,"type":77},"Cité du design - Saint Étienne",{"type":72,"attrs":549,"content":550},{"level":80},[551],{"text":552,"type":77},"Développement Front-end d'une plateforme culturelle à forte audience",{"type":85,"content":554},[555],{"text":540,"type":77},{"type":72,"attrs":557,"content":558},{"level":43},[559],{"text":560,"type":77},"Le contexte",{"type":85,"content":562},[563],{"text":564,"type":77},"La Galerie Nationale du Design est un projet culturel d'envergure nationale destiné à accueillir et valoriser les collections publiques françaises de design. La mise en ligne du site constituait un élément stratégique de son lancement public, avec une forte visibilité attendue dès l'ouverture.",{"type":85,"content":566},[567],{"text":568,"type":77},"L'enjeu était donc double :",{"type":120,"content":570},[571,577],{"type":123,"content":572},[573],{"type":85,"content":574},[575],{"text":576,"type":77},"Garantir une expérience utilisateur irréprochable malgré un trafic important attendu lors du lancement.",{"type":123,"content":578},[579],{"type":85,"content":580},[581],{"text":582,"type":77},"Respecter des contraintes graphiques complexes tout en maintenant un excellent niveau de performance.",{"type":72,"attrs":584,"content":585},{"level":43},[586],{"text":587,"type":77},"Les défis techniques",{"type":72,"attrs":589,"content":590},{"level":80},[591],{"text":592,"type":77},"Gestion avancée de la typographie",{"type":85,"content":594},[595],{"text":596,"type":77},"L'identité visuelle du projet reposait sur plusieurs typographies personnalisées nécessitant la gestion de glyphes spécifiques et de comportements typographiques particuliers.",{"type":85,"content":598},[599],{"text":600,"type":77},"Une attention particulière a été portée à :",{"type":120,"content":602},[603,609,615,621],{"type":123,"content":604},[605],{"type":85,"content":606},[607],{"text":608,"type":77},"l'intégration des fontes custom,",{"type":123,"content":610},[611],{"type":85,"content":612},[613],{"text":614,"type":77},"la gestion des différents jeux de glyphes,",{"type":123,"content":616},[617],{"type":85,"content":618},[619],{"text":620,"type":77},"l'optimisation du chargement des polices,",{"type":123,"content":622},[623],{"type":85,"content":624},[625],{"text":626,"type":77},"la préservation de la qualité visuelle sur tous les supports.",{"type":72,"attrs":628,"content":629},{"level":80},[630],{"text":631,"type":77},"Performance et robustesse",{"type":85,"content":633},[634],{"text":635,"type":77},"Le site étant destiné à être fortement exposé lors de son lancement, les performances ont été une priorité dès le début du développement.",{"type":85,"content":637},[638],{"text":639,"type":77},"Nous avons travaillé sur :",{"type":120,"content":641},[642,648,654,660,666],{"type":123,"content":643},[644],{"type":85,"content":645},[646],{"text":647,"type":77},"la réduction du poids des assets,",{"type":123,"content":649},[650],{"type":85,"content":651},[652],{"text":653,"type":77},"l'optimisation du rendu front-end,",{"type":123,"content":655},[656],{"type":85,"content":657},[658],{"text":659,"type":77},"le chargement progressif des contenus,",{"type":123,"content":661},[662],{"type":85,"content":663},[664],{"text":665,"type":77},"la limitation des dépendances externes,",{"type":123,"content":667},[668],{"type":85,"content":669},[670],{"text":671,"type":77},"l'amélioration des métriques Core Web Vitals.",{"type":85,"content":673},[674],{"text":675,"type":77},"L'objectif était de garantir des temps de chargement rapides, même lors de pics de fréquentation.",{"type":72,"attrs":677,"content":678},{"level":80},[679],{"text":680,"type":77},"Éco-conception",{"type":85,"content":682},[683],{"text":684,"type":77},"L'éco-conception fait partie intégrante de notre démarche de développement.",{"type":85,"content":686},[687],{"text":688,"type":77},"Sur ce projet, cela s'est traduit par :",{"type":120,"content":690},[691,697,703,709],{"type":123,"content":692},[693],{"type":85,"content":694},[695],{"text":696,"type":77},"une architecture front-end légère,",{"type":123,"content":698},[699],{"type":85,"content":700},[701],{"text":702,"type":77},"une limitation du JavaScript non essentiel,",{"type":123,"content":704},[705],{"type":85,"content":706},[707],{"text":708,"type":77},"une optimisation des médias et des ressources chargées,",{"type":123,"content":710},[711],{"type":85,"content":712},[713],{"text":714,"type":77},"une attention particulière portée au coût environnemental de chaque fonctionnalité.",{"type":85,"content":716},[717],{"text":718,"type":77},"Chaque choix technique a été évalué à travers le prisme de la sobriété numérique.",{"type":72,"attrs":720,"content":721},{"level":43},[722],{"text":723,"type":77},"Le développement",{"type":85,"content":725},[726],{"text":727,"type":77},"Le front-end a été entièrement développé sur mesure par une équipe de deux développeurs.",{"type":85,"content":729},[730],{"text":731,"type":77},"Plutôt que de nous appuyer sur une bibliothèque de composants existante, nous avons conçu et développé l'ensemble des composants du site spécifiquement pour les besoins du projet :",{"type":120,"content":733},[734,740,746,752],{"type":123,"content":735},[736],{"type":85,"content":737},[738],{"text":739,"type":77},"composants d'interface personnalisés,",{"type":123,"content":741},[742],{"type":85,"content":743},[744],{"text":745,"type":77},"système de mise en page flexible,",{"type":123,"content":747},[748],{"type":85,"content":749},[750],{"text":751,"type":77},"animations optimisées,",{"type":123,"content":753},[754],{"type":85,"content":755},[756],{"text":757,"type":77},"intégration fidèle aux maquettes.",{"type":85,"content":759},[760],{"text":761,"type":77},"Cette approche nous a permis de conserver un contrôle total sur les performances, la maintenabilité et la qualité du rendu final.",{"type":72,"attrs":763,"content":764},{"level":43},[765],{"text":766,"type":77},"Résultat",{"type":85,"content":768},[769],{"text":770,"type":77},"Le projet a été livré dans les délais malgré une phase de production particulièrement resserrée.",{"type":85,"content":772},[773],{"text":774,"type":77},"Le site offre aujourd'hui :",{"type":120,"content":776},[777,783,789,795],{"type":123,"content":778},[779],{"type":85,"content":780},[781],{"text":782,"type":77},"une expérience fluide et performante,",{"type":123,"content":784},[785],{"type":85,"content":786},[787],{"text":788,"type":77},"une restitution fidèle de la direction artistique,",{"type":123,"content":790},[791],{"type":85,"content":792},[793],{"text":794,"type":77},"une architecture front-end optimisée,",{"type":123,"content":796},[797],{"type":85,"content":798},[799],{"text":800,"type":77},"une empreinte numérique maîtrisée.",{"type":85,"content":802},[803],{"text":804,"type":77},"Un projet exigeant qui illustre notre capacité à concilier excellence visuelle, contraintes techniques fortes et démarche d'éco-conception.",{"slug":806,"id":806,"show":7,"title":807,"shortTitle":807,"client":17,"description":808,"tags":809,"tools":812,"link":814,"isLinkActive":55,"year":18,"imageDir":17,"frontImage":17,"gallery":815,"content":816,"sortOrder":818,"translations":819},"portfolio","Portfolio","This portfolio is a personal playground for motion, layout, accessibility, and technical precision. It is built with Nuxt, Vue, TypeScript, and SCSS, with a focus on expressive interaction without losing sight of performance and SEO.\n\nThe project brings together my selected works, contact flow, multilingual content, static generation, and a custom visual system designed to feel personal while staying readable and useful.",[810,811,11,15],"vue","web-design",[813,64],"affinity","https:\u002F\u002Fthomasgassmann.fr",[],{"type":21,"content":817},[],4,{"en":820,"fr":823},{"title":807,"shortTitle":807,"summary":27,"description":808,"content":821},{"type":21,"content":822},[],{"title":807,"shortTitle":807,"summary":27,"description":824,"content":825},"Ce portfolio est un terrain d’expression personnel autour du mouvement, de la mise en page, de l’accessibilité et de la précision technique. Il est construit avec Nuxt, Vue, TypeScript et SCSS, avec une attention portée à l’interaction sans perdre de vue la performance et le SEO.\n\nLe projet rassemble mes réalisations, un parcours de contact, du contenu multilingue, de la génération statique et un système visuel pensé pour rester personnel, lisible et utile.",{"type":21,"content":826},[],{"slug":828,"id":828,"show":55,"title":829,"shortTitle":830,"client":831,"description":832,"tags":833,"tools":835,"link":836,"isLinkActive":55,"year":18,"imageDir":837,"frontImage":838,"gallery":839,"content":840,"sortOrder":1212,"translations":1213},"gobelet-francais","Le gobelet Français","LGF","Le Gobelet Français","Refactoring and modernization of an e-commerce platform with a focus on user experience, performance, and scalable front-end architecture. Delivered international shipping, custom checkout features, and logistics integrations that helped improve conversion and increase orders.",[834,810,14,15,61,11],"laravel",[64,63],"https:\u002F\u002Flegobeletfrancais.fr\u002F","\u002Fprojects\u002Flgf","\u002Flgf-intro.webp",[],{"type":21,"content":841},[842,846,850,855,887,892,930,935,939,943,947,979,984,988,992,1043,1048,1052,1056,1088,1093,1137,1141,1145,1149,1151,1156,1211],{"type":85,"content":843},[844],{"text":845,"type":77},"Modernization and feature development of an e-commerce platform specializing in reusable custom cups.",{"type":85,"content":847},[848],{"text":849,"type":77},"The project focused on improving the shopping experience through a front-end refactor, expanding the platform to support international shipping, and implementing custom delivery features. Alongside the technical improvements, the client experienced a noticeable increase in orders and was highly satisfied with the platform's overall performance.",{"type":72,"attrs":851,"content":852},{"level":80},[853],{"text":854,"type":77},"Objectives",{"type":120,"content":856},[857,863,869,875,881],{"type":123,"content":858},[859],{"type":85,"content":860},[861],{"text":862,"type":77},"Modernize the user interface with the new visual identity.",{"type":123,"content":864},[865],{"type":85,"content":866},[867],{"text":868,"type":77},"Improve usability across the customer journey.",{"type":123,"content":870},[871],{"type":85,"content":872},[873],{"text":874,"type":77},"Expand shipping capabilities beyond France.",{"type":123,"content":876},[877],{"type":85,"content":878},[879],{"text":880,"type":77},"Streamline address and pickup point selection.",{"type":123,"content":882},[883],{"type":85,"content":884},[885],{"text":886,"type":77},"Optimize front-end performance and maintainability.",{"type":72,"attrs":888,"content":889},{"level":80},[890],{"text":891,"type":77},"My Role",{"type":120,"content":893},[894,900,906,912,918,924],{"type":123,"content":895},[896],{"type":85,"content":897},[898],{"text":899,"type":77},"Front-end development",{"type":123,"content":901},[902],{"type":85,"content":903},[904],{"text":905,"type":77},"UI\u002FUX implementation and refactoring",{"type":123,"content":907},[908],{"type":85,"content":909},[910],{"text":911,"type":77},"Checkout improvements",{"type":123,"content":913},[914],{"type":85,"content":915},[916],{"text":917,"type":77},"Shipping workflow implementation",{"type":123,"content":919},[920],{"type":85,"content":921},[922],{"text":923,"type":77},"Performance optimization",{"type":123,"content":925},[926],{"type":85,"content":927},[928],{"text":929,"type":77},"Integration of third-party logistics services",{"type":72,"attrs":931,"content":932},{"level":80},[933],{"text":934,"type":77},"UX Challenges",{"type":85,"content":936},[937],{"text":938,"type":77},"Although the visual design remained unchanged, the interface required a significant usability overhaul.",{"type":85,"content":940},[941],{"text":942,"type":77},"The work focused on improving navigation, simplifying customer interactions, and reducing friction during checkout while preserving the existing branding.",{"type":85,"content":944},[945],{"text":946,"type":77},"Key improvements included:",{"type":120,"content":948},[949,955,961,967,973],{"type":123,"content":950},[951],{"type":85,"content":952},[953],{"text":954,"type":77},"More intuitive customer account interactions",{"type":123,"content":956},[957],{"type":85,"content":958},[959],{"text":960,"type":77},"Cleaner and more consistent UI components",{"type":123,"content":962},[963],{"type":85,"content":964},[965],{"text":966,"type":77},"Improved responsive layouts",{"type":123,"content":968},[969],{"type":85,"content":970},[971],{"text":972,"type":77},"Faster and smoother user flows",{"type":123,"content":974},[975],{"type":85,"content":976},[977],{"text":978,"type":77},"Enhanced checkout experience",{"type":72,"attrs":980,"content":981},{"level":80},[982],{"text":983,"type":77},"Technical Challenges",{"type":85,"content":985},[986],{"text":987,"type":77},"Several features required custom implementations beyond the platform's default capabilities.",{"type":85,"content":989},[990],{"text":991,"type":77},"Key technical work included:",{"type":120,"content":993},[994,1007,1013,1019,1031,1037],{"type":123,"content":995},[996],{"type":85,"content":997},[998,1000,1005],{"text":999,"type":77},"Extending the shipping system to support ",{"text":1001,"type":77,"marks":1002},"Belgium",[1003],{"type":1004},"bold",{"text":1006,"type":77}," in addition to France",{"type":123,"content":1008},[1009],{"type":85,"content":1010},[1011],{"text":1012,"type":77},"Implementing custom shipping rules and delivery methods",{"type":123,"content":1014},[1015],{"type":85,"content":1016},[1017],{"text":1018,"type":77},"Building a custom address search modal within the customer account",{"type":123,"content":1020},[1021],{"type":85,"content":1022},[1023,1025,1029],{"text":1024,"type":77},"Integrating a custom ",{"text":1026,"type":77,"marks":1027},"DPD Pickup Locker",[1028],{"type":1004},{"text":1030,"type":77}," search modal for delivery point selection",{"type":123,"content":1032},[1033],{"type":85,"content":1034},[1035],{"text":1036,"type":77},"Improving front-end architecture for easier maintenance and future development",{"type":123,"content":1038},[1039],{"type":85,"content":1040},[1041],{"text":1042,"type":77},"Optimizing rendering performance throughout the storefront",{"type":72,"attrs":1044,"content":1045},{"level":80},[1046],{"text":1047,"type":77},"Architecture",{"type":85,"content":1049},[1050],{"text":1051,"type":77},"The project emphasized maintainable, reusable front-end development.",{"type":85,"content":1053},[1054],{"text":1055,"type":77},"Key architectural improvements included:",{"type":120,"content":1057},[1058,1064,1070,1076,1082],{"type":123,"content":1059},[1060],{"type":85,"content":1061},[1062],{"text":1063,"type":77},"Refactored reusable UI components",{"type":123,"content":1065},[1066],{"type":85,"content":1067},[1068],{"text":1069,"type":77},"Cleaner code organization",{"type":123,"content":1071},[1072],{"type":85,"content":1073},[1074],{"text":1075,"type":77},"Modular feature implementation",{"type":123,"content":1077},[1078],{"type":85,"content":1079},[1080],{"text":1081,"type":77},"Improved maintainability",{"type":123,"content":1083},[1084],{"type":85,"content":1085},[1086],{"text":1087,"type":77},"Performance-oriented front-end architecture",{"type":72,"attrs":1089,"content":1090},{"level":80},[1091],{"text":1092,"type":77},"Tech Stack",{"type":120,"content":1094},[1095,1101,1107,1113,1119,1125,1131],{"type":123,"content":1096},[1097],{"type":85,"content":1098},[1099],{"text":1100,"type":77},"Vue.js",{"type":123,"content":1102},[1103],{"type":85,"content":1104},[1105],{"text":1106,"type":77},"Laravel",{"type":123,"content":1108},[1109],{"type":85,"content":1110},[1111],{"text":1112,"type":77},"TypeScript",{"type":123,"content":1114},[1115],{"type":85,"content":1116},[1117],{"text":1118,"type":77},"Custom API integrations",{"type":123,"content":1120},[1121],{"type":85,"content":1122},[1123],{"text":1124,"type":77},"Responsive Design",{"type":123,"content":1126},[1127],{"type":85,"content":1128},[1129],{"text":1130,"type":77},"Component-based architecture",{"type":123,"content":1132},[1133],{"type":85,"content":1134},[1135],{"text":1136,"type":77},"DPD Pickup integration",{"type":72,"attrs":1138,"content":1139},{"level":80},[1140],{"text":290,"type":77},{"type":85,"content":1142},[1143],{"text":1144,"type":77},"The project delivered a faster, smoother, and more reliable shopping experience while introducing new international shipping capabilities.",{"type":85,"content":1146},[1147],{"text":1148,"type":77},"The client reported a measurable increase in orders following the release and expressed high satisfaction with both the platform's performance and the overall user experience.",{"type":1150},"horizontalRule",{"type":72,"attrs":1152,"content":1153},{"level":43},[1154],{"text":1155,"type":77},"What This Project Demonstrates",{"type":120,"content":1157},[1158,1164,1170,1176,1182,1188,1194,1199,1205],{"type":123,"content":1159},[1160],{"type":85,"content":1161},[1162],{"text":1163,"type":77},"E-commerce front-end development",{"type":123,"content":1165},[1166],{"type":85,"content":1167},[1168],{"text":1169,"type":77},"UI\u002FUX refactoring without redesign",{"type":123,"content":1171},[1172],{"type":85,"content":1173},[1174],{"text":1175,"type":77},"Checkout optimization",{"type":123,"content":1177},[1178],{"type":85,"content":1179},[1180],{"text":1181,"type":77},"International shipping implementation",{"type":123,"content":1183},[1184],{"type":85,"content":1185},[1186],{"text":1187,"type":77},"Third-party logistics integration (DPD Pickup)",{"type":123,"content":1189},[1190],{"type":85,"content":1191},[1192],{"text":1193,"type":77},"Custom modal development",{"type":123,"content":1195},[1196],{"type":85,"content":1197},[1198],{"text":923,"type":77},{"type":123,"content":1200},[1201],{"type":85,"content":1202},[1203],{"text":1204,"type":77},"Component-driven architecture",{"type":123,"content":1206},[1207],{"type":85,"content":1208},[1209],{"text":1210,"type":77},"Building scalable and maintainable front-end applications",{"type":85},5,{"en":1214,"fr":1521},{"title":829,"shortTitle":830,"summary":27,"description":832,"content":1215},{"type":21,"content":1216},[1217,1220,1223,1227,1254,1258,1290,1294,1297,1300,1303,1330,1334,1337,1340,1380,1384,1387,1390,1417,1421,1458,1462,1465,1468,1469,1473,1520],{"type":85,"content":1218},[1219],{"text":845,"type":77},{"type":85,"content":1221},[1222],{"text":849,"type":77},{"type":72,"attrs":1224,"content":1225},{"level":80},[1226],{"text":854,"type":77},{"type":120,"content":1228},[1229,1234,1239,1244,1249],{"type":123,"content":1230},[1231],{"type":85,"content":1232},[1233],{"text":862,"type":77},{"type":123,"content":1235},[1236],{"type":85,"content":1237},[1238],{"text":868,"type":77},{"type":123,"content":1240},[1241],{"type":85,"content":1242},[1243],{"text":874,"type":77},{"type":123,"content":1245},[1246],{"type":85,"content":1247},[1248],{"text":880,"type":77},{"type":123,"content":1250},[1251],{"type":85,"content":1252},[1253],{"text":886,"type":77},{"type":72,"attrs":1255,"content":1256},{"level":80},[1257],{"text":891,"type":77},{"type":120,"content":1259},[1260,1265,1270,1275,1280,1285],{"type":123,"content":1261},[1262],{"type":85,"content":1263},[1264],{"text":899,"type":77},{"type":123,"content":1266},[1267],{"type":85,"content":1268},[1269],{"text":905,"type":77},{"type":123,"content":1271},[1272],{"type":85,"content":1273},[1274],{"text":911,"type":77},{"type":123,"content":1276},[1277],{"type":85,"content":1278},[1279],{"text":917,"type":77},{"type":123,"content":1281},[1282],{"type":85,"content":1283},[1284],{"text":923,"type":77},{"type":123,"content":1286},[1287],{"type":85,"content":1288},[1289],{"text":929,"type":77},{"type":72,"attrs":1291,"content":1292},{"level":80},[1293],{"text":934,"type":77},{"type":85,"content":1295},[1296],{"text":938,"type":77},{"type":85,"content":1298},[1299],{"text":942,"type":77},{"type":85,"content":1301},[1302],{"text":946,"type":77},{"type":120,"content":1304},[1305,1310,1315,1320,1325],{"type":123,"content":1306},[1307],{"type":85,"content":1308},[1309],{"text":954,"type":77},{"type":123,"content":1311},[1312],{"type":85,"content":1313},[1314],{"text":960,"type":77},{"type":123,"content":1316},[1317],{"type":85,"content":1318},[1319],{"text":966,"type":77},{"type":123,"content":1321},[1322],{"type":85,"content":1323},[1324],{"text":972,"type":77},{"type":123,"content":1326},[1327],{"type":85,"content":1328},[1329],{"text":978,"type":77},{"type":72,"attrs":1331,"content":1332},{"level":80},[1333],{"text":983,"type":77},{"type":85,"content":1335},[1336],{"text":987,"type":77},{"type":85,"content":1338},[1339],{"text":991,"type":77},{"type":120,"content":1341},[1342,1351,1356,1361,1370,1375],{"type":123,"content":1343},[1344],{"type":85,"content":1345},[1346,1347,1350],{"text":999,"type":77},{"text":1001,"type":77,"marks":1348},[1349],{"type":1004},{"text":1006,"type":77},{"type":123,"content":1352},[1353],{"type":85,"content":1354},[1355],{"text":1012,"type":77},{"type":123,"content":1357},[1358],{"type":85,"content":1359},[1360],{"text":1018,"type":77},{"type":123,"content":1362},[1363],{"type":85,"content":1364},[1365,1366,1369],{"text":1024,"type":77},{"text":1026,"type":77,"marks":1367},[1368],{"type":1004},{"text":1030,"type":77},{"type":123,"content":1371},[1372],{"type":85,"content":1373},[1374],{"text":1036,"type":77},{"type":123,"content":1376},[1377],{"type":85,"content":1378},[1379],{"text":1042,"type":77},{"type":72,"attrs":1381,"content":1382},{"level":80},[1383],{"text":1047,"type":77},{"type":85,"content":1385},[1386],{"text":1051,"type":77},{"type":85,"content":1388},[1389],{"text":1055,"type":77},{"type":120,"content":1391},[1392,1397,1402,1407,1412],{"type":123,"content":1393},[1394],{"type":85,"content":1395},[1396],{"text":1063,"type":77},{"type":123,"content":1398},[1399],{"type":85,"content":1400},[1401],{"text":1069,"type":77},{"type":123,"content":1403},[1404],{"type":85,"content":1405},[1406],{"text":1075,"type":77},{"type":123,"content":1408},[1409],{"type":85,"content":1410},[1411],{"text":1081,"type":77},{"type":123,"content":1413},[1414],{"type":85,"content":1415},[1416],{"text":1087,"type":77},{"type":72,"attrs":1418,"content":1419},{"level":80},[1420],{"text":1092,"type":77},{"type":120,"content":1422},[1423,1428,1433,1438,1443,1448,1453],{"type":123,"content":1424},[1425],{"type":85,"content":1426},[1427],{"text":1100,"type":77},{"type":123,"content":1429},[1430],{"type":85,"content":1431},[1432],{"text":1106,"type":77},{"type":123,"content":1434},[1435],{"type":85,"content":1436},[1437],{"text":1112,"type":77},{"type":123,"content":1439},[1440],{"type":85,"content":1441},[1442],{"text":1118,"type":77},{"type":123,"content":1444},[1445],{"type":85,"content":1446},[1447],{"text":1124,"type":77},{"type":123,"content":1449},[1450],{"type":85,"content":1451},[1452],{"text":1130,"type":77},{"type":123,"content":1454},[1455],{"type":85,"content":1456},[1457],{"text":1136,"type":77},{"type":72,"attrs":1459,"content":1460},{"level":80},[1461],{"text":290,"type":77},{"type":85,"content":1463},[1464],{"text":1144,"type":77},{"type":85,"content":1466},[1467],{"text":1148,"type":77},{"type":1150},{"type":72,"attrs":1470,"content":1471},{"level":43},[1472],{"text":1155,"type":77},{"type":120,"content":1474},[1475,1480,1485,1490,1495,1500,1505,1510,1515],{"type":123,"content":1476},[1477],{"type":85,"content":1478},[1479],{"text":1163,"type":77},{"type":123,"content":1481},[1482],{"type":85,"content":1483},[1484],{"text":1169,"type":77},{"type":123,"content":1486},[1487],{"type":85,"content":1488},[1489],{"text":1175,"type":77},{"type":123,"content":1491},[1492],{"type":85,"content":1493},[1494],{"text":1181,"type":77},{"type":123,"content":1496},[1497],{"type":85,"content":1498},[1499],{"text":1187,"type":77},{"type":123,"content":1501},[1502],{"type":85,"content":1503},[1504],{"text":1193,"type":77},{"type":123,"content":1506},[1507],{"type":85,"content":1508},[1509],{"text":923,"type":77},{"type":123,"content":1511},[1512],{"type":85,"content":1513},[1514],{"text":1204,"type":77},{"type":123,"content":1516},[1517],{"type":85,"content":1518},[1519],{"text":1210,"type":77},{"type":85},{"title":829,"shortTitle":830,"summary":27,"description":1522,"content":1523},"Refonte et modernisation d'une plateforme e-commerce axées sur l'expérience utilisateur, les performances et une architecture front-end évolutive. Mise en place de la livraison à l'international, de fonctionnalités de commande sur mesure et d'intégrations logistiques ayant contribué à améliorer le taux de conversion et à augmenter les commandes.",{"type":21,"content":1524},[1525,1529,1533,1538,1582,1587,1631,1636,1640,1644,1648,1680,1685,1689,1693,1737,1741,1745,1749,1781,1786,1826,1830,1834,1838,1843,1897],{"type":85,"content":1526},[1527],{"text":1528,"type":77},"Refonte front-end et amélioration de l’expérience utilisateur d’un site e-commerce spécialisé dans les gobelets réutilisables personnalisés.",{"type":85,"content":1530},[1531],{"text":1532,"type":77},"Le projet visait à moderniser l’interface existante, améliorer la fluidité du parcours d’achat, étendre les options de livraison à la Belgique et intégrer des fonctionnalités de recherche d’adresse et de points relais via des modales personnalisées.",{"type":72,"attrs":1534,"content":1535},{"level":80},[1536],{"text":1537,"type":77},"Objectifs",{"type":120,"content":1539},[1540,1546,1552,1558,1564,1570,1576],{"type":123,"content":1541},[1542],{"type":85,"content":1543},[1544],{"text":1545,"type":77},"Refactoriser l’interface avec la nouvelle identité visuelle.",{"type":123,"content":1547},[1548],{"type":85,"content":1549},[1550],{"text":1551,"type":77},"Améliorer l’expérience utilisateur sur le parcours client.",{"type":123,"content":1553},[1554],{"type":85,"content":1555},[1556],{"text":1557,"type":77},"Optimiser le tunnel d’achat.",{"type":123,"content":1559},[1560],{"type":85,"content":1561},[1562],{"text":1563,"type":77},"Ajouter la Belgique aux méthodes de livraison.",{"type":123,"content":1565},[1566],{"type":85,"content":1567},[1568],{"text":1569,"type":77},"Faciliter la recherche d’adresse dans l’espace client.",{"type":123,"content":1571},[1572],{"type":85,"content":1573},[1574],{"text":1575,"type":77},"Permettre la sélection d’un locker DPD via une modale dédiée.",{"type":123,"content":1577},[1578],{"type":85,"content":1579},[1580],{"text":1581,"type":77},"Améliorer les performances globales du site.",{"type":72,"attrs":1583,"content":1584},{"level":80},[1585],{"text":1586,"type":77},"Mon rôle",{"type":120,"content":1588},[1589,1595,1601,1607,1613,1619,1625],{"type":123,"content":1590},[1591],{"type":85,"content":1592},[1593],{"text":1594,"type":77},"Développement front-end",{"type":123,"content":1596},[1597],{"type":85,"content":1598},[1599],{"text":1600,"type":77},"Refactorisation UI\u002FUX",{"type":123,"content":1602},[1603],{"type":85,"content":1604},[1605],{"text":1606,"type":77},"Amélioration du tunnel de commande",{"type":123,"content":1608},[1609],{"type":85,"content":1610},[1611],{"text":1612,"type":77},"Intégration de nouvelles méthodes de livraison",{"type":123,"content":1614},[1615],{"type":85,"content":1616},[1617],{"text":1618,"type":77},"Création de modales personnalisées",{"type":123,"content":1620},[1621],{"type":85,"content":1622},[1623],{"text":1624,"type":77},"Optimisation des performances",{"type":123,"content":1626},[1627],{"type":85,"content":1628},[1629],{"text":1630,"type":77},"Maintenance et amélioration du code existant",{"type":72,"attrs":1632,"content":1633},{"level":80},[1634],{"text":1635,"type":77},"Défis UX",{"type":85,"content":1637},[1638],{"text":1639,"type":77},"Le principal enjeu était d’améliorer l’expérience utilisateur sans repartir sur un redesign complet.",{"type":85,"content":1641},[1642],{"text":1643,"type":77},"Le travail s’est concentré sur la clarification des interfaces existantes, la fluidification des interactions et la réduction des frictions pendant le parcours d’achat.",{"type":85,"content":1645},[1646],{"text":1647,"type":77},"Les améliorations ont notamment porté sur :",{"type":120,"content":1649},[1650,1656,1662,1668,1674],{"type":123,"content":1651},[1652],{"type":85,"content":1653},[1654],{"text":1655,"type":77},"une interface plus cohérente ;",{"type":123,"content":1657},[1658],{"type":85,"content":1659},[1660],{"text":1661,"type":77},"des composants plus lisibles ;",{"type":123,"content":1663},[1664],{"type":85,"content":1665},[1666],{"text":1667,"type":77},"une meilleure expérience responsive ;",{"type":123,"content":1669},[1670],{"type":85,"content":1671},[1672],{"text":1673,"type":77},"une navigation plus fluide ;",{"type":123,"content":1675},[1676],{"type":85,"content":1677},[1678],{"text":1679,"type":77},"un tunnel de commande plus simple et plus rassurant.",{"type":72,"attrs":1681,"content":1682},{"level":80},[1683],{"text":1684,"type":77},"Défis techniques",{"type":85,"content":1686},[1687],{"text":1688,"type":77},"Le projet nécessitait plusieurs évolutions spécifiques liées à la livraison et au compte client.",{"type":85,"content":1690},[1691],{"text":1692,"type":77},"Les principaux défis techniques incluaient :",{"type":120,"content":1694},[1695,1701,1707,1713,1719,1725,1731],{"type":123,"content":1696},[1697],{"type":85,"content":1698},[1699],{"text":1700,"type":77},"l’ajout de la Belgique dans les méthodes de livraison ;",{"type":123,"content":1702},[1703],{"type":85,"content":1704},[1705],{"text":1706,"type":77},"l’adaptation des règles de livraison existantes ;",{"type":123,"content":1708},[1709],{"type":85,"content":1710},[1711],{"text":1712,"type":77},"la création d’une modale de recherche d’adresse dans le compte client ;",{"type":123,"content":1714},[1715],{"type":85,"content":1716},[1717],{"text":1718,"type":77},"l’intégration d’une modale personnalisée pour rechercher un locker DPD ;",{"type":123,"content":1720},[1721],{"type":85,"content":1722},[1723],{"text":1724,"type":77},"la gestion des données sélectionnées par l’utilisateur ;",{"type":123,"content":1726},[1727],{"type":85,"content":1728},[1729],{"text":1730,"type":77},"l’amélioration de la maintenabilité du front-end ;",{"type":123,"content":1732},[1733],{"type":85,"content":1734},[1735],{"text":1736,"type":77},"l’optimisation des performances du site.",{"type":72,"attrs":1738,"content":1739},{"level":80},[1740],{"text":1047,"type":77},{"type":85,"content":1742},[1743],{"text":1744,"type":77},"La refactorisation a permis de rendre le front-end plus clair, plus modulaire et plus facile à faire évoluer.",{"type":85,"content":1746},[1747],{"text":1748,"type":77},"Les améliorations principales :",{"type":120,"content":1750},[1751,1757,1763,1769,1775],{"type":123,"content":1752},[1753],{"type":85,"content":1754},[1755],{"text":1756,"type":77},"composants UI plus réutilisables ;",{"type":123,"content":1758},[1759],{"type":85,"content":1760},[1761],{"text":1762,"type":77},"code mieux structuré ;",{"type":123,"content":1764},[1765],{"type":85,"content":1766},[1767],{"text":1768,"type":77},"séparation plus claire des responsabilités ;",{"type":123,"content":1770},[1771],{"type":85,"content":1772},[1773],{"text":1774,"type":77},"intégrations plus faciles à maintenir ;",{"type":123,"content":1776},[1777],{"type":85,"content":1778},[1779],{"text":1780,"type":77},"base front-end plus stable pour les futures évolutions.",{"type":72,"attrs":1782,"content":1783},{"level":80},[1784],{"text":1785,"type":77},"Stack technique",{"type":120,"content":1787},[1788,1793,1798,1803,1809,1814,1820],{"type":123,"content":1789},[1790],{"type":85,"content":1791},[1792],{"text":1100,"type":77},{"type":123,"content":1794},[1795],{"type":85,"content":1796},[1797],{"text":1106,"type":77},{"type":123,"content":1799},[1800],{"type":85,"content":1801},[1802],{"text":1112,"type":77},{"type":123,"content":1804},[1805],{"type":85,"content":1806},[1807],{"text":1808,"type":77},"Intégrations API",{"type":123,"content":1810},[1811],{"type":85,"content":1812},[1813],{"text":1124,"type":77},{"type":123,"content":1815},[1816],{"type":85,"content":1817},[1818],{"text":1819,"type":77},"Architecture par composants",{"type":123,"content":1821},[1822],{"type":85,"content":1823},[1824],{"text":1825,"type":77},"Intégration DPD Pickup",{"type":72,"attrs":1827,"content":1828},{"level":80},[1829],{"text":766,"type":77},{"type":85,"content":1831},[1832],{"text":1833,"type":77},"Le projet a permis de livrer une expérience d’achat plus rapide, plus fluide et plus fiable.",{"type":85,"content":1835},[1836],{"text":1837,"type":77},"Le client s’est montré très satisfait des performances obtenues et a constaté une augmentation du nombre de commandes après la mise en production.",{"type":72,"attrs":1839,"content":1840},{"level":43},[1841],{"text":1842,"type":77},"Ce que ce projet démontre",{"type":120,"content":1844},[1845,1851,1856,1862,1868,1874,1880,1885,1891],{"type":123,"content":1846},[1847],{"type":85,"content":1848},[1849],{"text":1850,"type":77},"Développement front-end e-commerce",{"type":123,"content":1852},[1853],{"type":85,"content":1854},[1855],{"text":1600,"type":77},{"type":123,"content":1857},[1858],{"type":85,"content":1859},[1860],{"text":1861,"type":77},"Optimisation du tunnel d’achat",{"type":123,"content":1863},[1864],{"type":85,"content":1865},[1866],{"text":1867,"type":77},"Intégration de méthodes de livraison internationales",{"type":123,"content":1869},[1870],{"type":85,"content":1871},[1872],{"text":1873,"type":77},"Intégration de services logistiques tiers",{"type":123,"content":1875},[1876],{"type":85,"content":1877},[1878],{"text":1879,"type":77},"Développement de modales personnalisées",{"type":123,"content":1881},[1882],{"type":85,"content":1883},[1884],{"text":1624,"type":77},{"type":123,"content":1886},[1887],{"type":85,"content":1888},[1889],{"text":1890,"type":77},"Amélioration d’un code existant",{"type":123,"content":1892},[1893],{"type":85,"content":1894},[1895],{"text":1896,"type":77},"Architecture front-end maintenable et évolutive",{"type":85},{"slug":1899,"id":1899,"show":55,"title":1900,"shortTitle":1900,"client":17,"description":1901,"tags":1902,"tools":1905,"link":1906,"isLinkActive":55,"year":18,"imageDir":1907,"frontImage":1908,"gallery":1909,"content":1910,"sortOrder":2090,"translations":2091},"qr-code-generator","QURCode","QURCode is a focused QR code generator designed for quick customization and export. The interface prioritizes clarity, immediate feedback and a fast workflow across desktop and mobile.",[1903,1904,11],"tailwind","react",[64],"https:\u002F\u002Fqurcode.vercel.app\u002F","\u002Fprojects\u002Fqurcode","\u002Fqurcode.webp",[],{"type":21,"content":1911},[1912,1916,1920,1925,1929,1933,1953,1957,1962,1994,1999,2003,2007,2039,2044,2048,2052,2056,2061,2065,2069,2073,2077,2082,2086],{"type":85,"content":1913},[1914],{"text":1915,"type":77},"QURCode is a web application designed to quickly generate customized QR codes. The goal was to create a simple, clean, and efficient tool that works seamlessly on both desktop and mobile devices.",{"type":85,"content":1917},[1918],{"text":1919,"type":77},"The project was built with React and Tailwind CSS and deployed on Vercel.",{"type":72,"attrs":1921,"content":1922},{"level":43},[1923],{"text":1924,"type":77},"Project Objective",{"type":85,"content":1926},[1927],{"text":1928,"type":77},"The main objective was to provide a smooth user experience, allowing users to create, customize, and export a QR code in just a few steps.",{"type":85,"content":1930},[1931],{"text":1932,"type":77},"The project focused on three key aspects:",{"type":120,"content":1934},[1935,1941,1947],{"type":123,"content":1936},[1937],{"type":85,"content":1938},[1939],{"text":1940,"type":77},"A clean and accessible interface",{"type":123,"content":1942},[1943],{"type":85,"content":1944},[1945],{"text":1946,"type":77},"Instant visual feedback during customization",{"type":123,"content":1948},[1949],{"type":85,"content":1950},[1951],{"text":1952,"type":77},"A fast and frictionless user journey",{"type":85,"content":1954},[1955],{"text":1956,"type":77},"I was responsible for the entire project, from UI design and front-end development to deployment.",{"type":72,"attrs":1958,"content":1959},{"level":80},[1960],{"text":1961,"type":77},"My main responsibilities included:",{"type":120,"content":1963},[1964,1970,1976,1982,1988],{"type":123,"content":1965},[1966],{"type":85,"content":1967},[1968],{"text":1969,"type":77},"Designing the user experience (UX)",{"type":123,"content":1971},[1972],{"type":85,"content":1973},[1974],{"text":1975,"type":77},"Creating a responsive user interface",{"type":123,"content":1977},[1978],{"type":85,"content":1979},[1980],{"text":1981,"type":77},"Developing the QR code generation and customization features",{"type":123,"content":1983},[1984],{"type":85,"content":1985},[1986],{"text":1987,"type":77},"Integrating the application with React and Tailwind CSS",{"type":123,"content":1989},[1990],{"type":85,"content":1991},[1992],{"text":1993,"type":77},"Deploying the application on Vercel",{"type":72,"attrs":1995,"content":1996},{"level":80},[1997],{"text":1998,"type":77},"Key Features",{"type":85,"content":2000},[2001],{"text":2002,"type":77},"QURCode allows users to generate a QR code from custom content and personalize its appearance according to their needs.",{"type":85,"content":2004},[2005],{"text":2006,"type":77},"Main features include:",{"type":120,"content":2008},[2009,2015,2021,2027,2033],{"type":123,"content":2010},[2011],{"type":85,"content":2012},[2013],{"text":2014,"type":77},"Instant QR code generation",{"type":123,"content":2016},[2017],{"type":85,"content":2018},[2019],{"text":2020,"type":77},"Visual customization options",{"type":123,"content":2022},[2023],{"type":85,"content":2024},[2025],{"text":2026,"type":77},"Real-time preview",{"type":123,"content":2028},[2029],{"type":85,"content":2030},[2031],{"text":2032,"type":77},"Export functionality",{"type":123,"content":2034},[2035],{"type":85,"content":2036},[2037],{"text":2038,"type":77},"Responsive interface optimized for both mobile and desktop",{"type":72,"attrs":2040,"content":2041},{"level":80},[2042],{"text":2043,"type":77},"Technical Choices",{"type":85,"content":2045},[2046],{"text":2047,"type":77},"React was used to build a dynamic and responsive interface. It made it easy to manage the application's state, including the QR code content, customization options, and real-time preview.",{"type":85,"content":2049},[2050],{"text":2051,"type":77},"Tailwind CSS enabled the rapid development of a modern, consistent, and fully responsive interface while maintaining a clean and maintainable codebase.",{"type":85,"content":2053},[2054],{"text":2055,"type":77},"Vercel was chosen for deployment because it provides a fast, reliable, and developer-friendly hosting solution for modern front-end applications.",{"type":72,"attrs":2057,"content":2058},{"level":80},[2059],{"text":2060,"type":77},"User Experience",{"type":85,"content":2062},[2063],{"text":2064,"type":77},"The interface was designed to eliminate unnecessary complexity. Users can quickly understand where to enter their content, how to customize their QR code, and how to export the final result.",{"type":85,"content":2066},[2067],{"text":2068,"type":77},"Instant visual feedback is a core part of the experience. Every change is reflected immediately, making the application intuitive and enjoyable to use.",{"type":72,"attrs":2070,"content":2071},{"level":80},[2072],{"text":1124,"type":77},{"type":85,"content":2074},[2075],{"text":2076,"type":77},"Special attention was given to the mobile experience. The goal was to maintain a simple and intuitive workflow on smaller screens, with readable, accessible, and easy-to-use interface elements.",{"type":72,"attrs":2078,"content":2079},{"level":43},[2080],{"text":2081,"type":77},"Result",{"type":85,"content":2083},[2084],{"text":2085,"type":77},"QURCode is a clean, fast, and practical application that addresses a simple need with a straightforward and user-friendly experience.",{"type":85,"content":2087},[2088],{"text":2089,"type":77},"This project allowed me to strengthen my front-end development skills while improving my expertise in building modern user interfaces and designing smooth user experiences.",6,{"en":2092,"fr":2239},{"title":1900,"shortTitle":1900,"summary":27,"description":1901,"content":2093},{"type":21,"content":2094},[2095,2098,2101,2105,2108,2111,2128,2131,2135,2162,2166,2169,2172,2199,2203,2206,2209,2212,2216,2219,2222,2226,2229,2233,2236],{"type":85,"content":2096},[2097],{"text":1915,"type":77},{"type":85,"content":2099},[2100],{"text":1919,"type":77},{"type":72,"attrs":2102,"content":2103},{"level":43},[2104],{"text":1924,"type":77},{"type":85,"content":2106},[2107],{"text":1928,"type":77},{"type":85,"content":2109},[2110],{"text":1932,"type":77},{"type":120,"content":2112},[2113,2118,2123],{"type":123,"content":2114},[2115],{"type":85,"content":2116},[2117],{"text":1940,"type":77},{"type":123,"content":2119},[2120],{"type":85,"content":2121},[2122],{"text":1946,"type":77},{"type":123,"content":2124},[2125],{"type":85,"content":2126},[2127],{"text":1952,"type":77},{"type":85,"content":2129},[2130],{"text":1956,"type":77},{"type":72,"attrs":2132,"content":2133},{"level":80},[2134],{"text":1961,"type":77},{"type":120,"content":2136},[2137,2142,2147,2152,2157],{"type":123,"content":2138},[2139],{"type":85,"content":2140},[2141],{"text":1969,"type":77},{"type":123,"content":2143},[2144],{"type":85,"content":2145},[2146],{"text":1975,"type":77},{"type":123,"content":2148},[2149],{"type":85,"content":2150},[2151],{"text":1981,"type":77},{"type":123,"content":2153},[2154],{"type":85,"content":2155},[2156],{"text":1987,"type":77},{"type":123,"content":2158},[2159],{"type":85,"content":2160},[2161],{"text":1993,"type":77},{"type":72,"attrs":2163,"content":2164},{"level":80},[2165],{"text":1998,"type":77},{"type":85,"content":2167},[2168],{"text":2002,"type":77},{"type":85,"content":2170},[2171],{"text":2006,"type":77},{"type":120,"content":2173},[2174,2179,2184,2189,2194],{"type":123,"content":2175},[2176],{"type":85,"content":2177},[2178],{"text":2014,"type":77},{"type":123,"content":2180},[2181],{"type":85,"content":2182},[2183],{"text":2020,"type":77},{"type":123,"content":2185},[2186],{"type":85,"content":2187},[2188],{"text":2026,"type":77},{"type":123,"content":2190},[2191],{"type":85,"content":2192},[2193],{"text":2032,"type":77},{"type":123,"content":2195},[2196],{"type":85,"content":2197},[2198],{"text":2038,"type":77},{"type":72,"attrs":2200,"content":2201},{"level":80},[2202],{"text":2043,"type":77},{"type":85,"content":2204},[2205],{"text":2047,"type":77},{"type":85,"content":2207},[2208],{"text":2051,"type":77},{"type":85,"content":2210},[2211],{"text":2055,"type":77},{"type":72,"attrs":2213,"content":2214},{"level":80},[2215],{"text":2060,"type":77},{"type":85,"content":2217},[2218],{"text":2064,"type":77},{"type":85,"content":2220},[2221],{"text":2068,"type":77},{"type":72,"attrs":2223,"content":2224},{"level":80},[2225],{"text":1124,"type":77},{"type":85,"content":2227},[2228],{"text":2076,"type":77},{"type":72,"attrs":2230,"content":2231},{"level":43},[2232],{"text":2081,"type":77},{"type":85,"content":2234},[2235],{"text":2085,"type":77},{"type":85,"content":2237},[2238],{"text":2089,"type":77},{"title":1900,"shortTitle":1900,"summary":27,"description":2240,"content":2241},"QURCode est un générateur de QR codes pensé pour personnaliser et exporter rapidement un résultat. L’interface privilégie la clarté, le retour immédiat et un parcours efficace sur ordinateur comme sur mobile.",{"type":21,"content":2242},[2243,2247,2251,2256,2260,2264,2284,2288,2292,2324,2329,2333,2337,2363,2368,2372,2376,2380,2385,2389,2393,2398,2402,2406,2410],{"type":85,"content":2244},[2245],{"text":2246,"type":77},"QURCode est une application web conçue pour générer rapidement des QR codes personnalisés. L’objectif était de créer un outil simple, clair et efficace, utilisable aussi bien sur ordinateur que sur mobile.",{"type":85,"content":2248},[2249],{"text":2250,"type":77},"Le projet a été développé avec React, Tailwind CSS et déployé sur Vercel.",{"type":72,"attrs":2252,"content":2253},{"level":43},[2254],{"text":2255,"type":77},"Objectif du projet",{"type":85,"content":2257},[2258],{"text":2259,"type":77},"L’objectif principal était de proposer une expérience fluide permettant à l’utilisateur de créer, personnaliser et exporter un QR code en quelques étapes seulement.",{"type":85,"content":2261},[2262],{"text":2263,"type":77},"Je voulais mettre l’accent sur trois points essentiels :",{"type":120,"content":2265},[2266,2272,2278],{"type":123,"content":2267},[2268],{"type":85,"content":2269},[2270],{"text":2271,"type":77},"une interface claire et accessible",{"type":123,"content":2273},[2274],{"type":85,"content":2275},[2276],{"text":2277,"type":77},"un retour visuel immédiat lors de la personnalisation",{"type":123,"content":2279},[2280],{"type":85,"content":2281},[2282],{"text":2283,"type":77},"un parcours rapide, sans friction inutile.",{"type":85,"content":2285},[2286],{"text":2287,"type":77},"J’ai pris en charge l’ensemble du projet, de la conception de l’interface au développement front-end, jusqu’au déploiement.",{"type":85,"content":2289},[2290],{"text":2291,"type":77},"Mes missions principales :",{"type":120,"content":2293},[2294,2300,2306,2312,2318],{"type":123,"content":2295},[2296],{"type":85,"content":2297},[2298],{"text":2299,"type":77},"conception de l’expérience utilisateur ",{"type":123,"content":2301},[2302],{"type":85,"content":2303},[2304],{"text":2305,"type":77},"création de l’interface responsive",{"type":123,"content":2307},[2308],{"type":85,"content":2309},[2310],{"text":2311,"type":77},"développement des fonctionnalités de génération et de personnalisation",{"type":123,"content":2313},[2314],{"type":85,"content":2315},[2316],{"text":2317,"type":77},"intégration avec React et Tailwind CSS",{"type":123,"content":2319},[2320],{"type":85,"content":2321},[2322],{"text":2323,"type":77},"déploiement de l’application sur Vercel",{"type":72,"attrs":2325,"content":2326},{"level":80},[2327],{"text":2328,"type":77},"Fonctionnalités principales",{"type":85,"content":2330},[2331],{"text":2332,"type":77},"QURCode permet à l’utilisateur de générer un QR code à partir d’un contenu personnalisé, puis d’adapter son apparence selon ses besoins.",{"type":85,"content":2334},[2335],{"text":2336,"type":77},"Les principales fonctionnalités sont :",{"type":120,"content":2338},[2339,2345,2351,2357],{"type":123,"content":2340},[2341],{"type":85,"content":2342},[2343],{"text":2344,"type":77},"génération instantanée du QR code personnalisation visuelle",{"type":123,"content":2346},[2347],{"type":85,"content":2348},[2349],{"text":2350,"type":77},"aperçu en temps réel",{"type":123,"content":2352},[2353],{"type":85,"content":2354},[2355],{"text":2356,"type":77},"export du résultat",{"type":123,"content":2358},[2359],{"type":85,"content":2360},[2361],{"text":2362,"type":77},"interface responsive adaptée au mobile et au desktop",{"type":72,"attrs":2364,"content":2365},{"level":80},[2366],{"text":2367,"type":77},"Choix techniques",{"type":85,"content":2369},[2370],{"text":2371,"type":77},"React a été utilisé pour construire une interface dynamique et réactive. Ce choix m’a permis de gérer facilement les états liés au contenu du QR code, aux options de personnalisation et à l’aperçu en temps réel.",{"type":85,"content":2373},[2374],{"text":2375,"type":77},"Tailwind CSS m’a permis de créer rapidement une interface moderne, cohérente et responsive, tout en gardant une structure de code claire.",{"type":85,"content":2377},[2378],{"text":2379,"type":77},"Vercel a été choisi pour le déploiement afin de bénéficier d’une mise en ligne rapide, fiable et adaptée aux projets front-end modernes.",{"type":72,"attrs":2381,"content":2382},{"level":80},[2383],{"text":2384,"type":77},"Expérience utilisateur",{"type":85,"content":2386},[2387],{"text":2388,"type":77},"L’interface a été pensée pour éviter toute complexité inutile. L’utilisateur comprend rapidement où saisir son contenu, comment personnaliser son QR code et comment exporter le résultat.",{"type":85,"content":2390},[2391],{"text":2392,"type":77},"Le retour immédiat est un élément central de l’expérience : chaque modification est visible directement, ce qui rend l’utilisation plus intuitive et plus agréable.",{"type":72,"attrs":2394,"content":2395},{"level":80},[2396],{"text":2397,"type":77},"Responsive design",{"type":85,"content":2399},[2400],{"text":2401,"type":77},"Une attention particulière a été portée à l’adaptation mobile. L’objectif était de conserver un parcours simple, même sur petit écran, avec des éléments lisibles, accessibles et faciles à manipuler.",{"type":72,"attrs":2403,"content":2404},{"level":43},[2405],{"text":766,"type":77},{"type":85,"content":2407},[2408],{"text":2409,"type":77},"QURCode est une application claire, rapide et pratique, qui répond à un besoin simple avec une expérience utilisateur directe. Le projet m’a permis de renforcer mes compétences en développement front-end moderne, tout en travaillant sur la qualité de l’interface et la fluidité du parcours utilisateur.",{"type":85},{"slug":2412,"id":2412,"show":7,"title":2413,"shortTitle":2414,"client":17,"description":2415,"tags":2416,"tools":2417,"link":17,"isLinkActive":7,"year":18,"imageDir":17,"frontImage":17,"gallery":2418,"content":2419,"sortOrder":2421,"translations":2422},"custom-boilerplate","Custom Boilerplate","Boilerplate","A custom Nuxt boilerplate designed to start projects faster with a clean structure, shared SCSS foundations, reusable base components, linting, formatting, and production-oriented defaults.\n\nThe goal is to reduce repetitive setup work while keeping enough flexibility for client websites, portfolios, and more complex application interfaces.",[11,810,15],[64],[],{"type":21,"content":2420},[],7,{"en":2423,"fr":2426},{"title":2413,"shortTitle":2414,"summary":27,"description":2415,"content":2424},{"type":21,"content":2425},[],{"title":2413,"shortTitle":2414,"summary":27,"description":2427,"content":2428},"Un boilerplate Nuxt personnalisé pour démarrer plus rapidement des projets avec une structure propre, des bases SCSS partagées, des composants réutilisables, du linting, du formatage et des réglages orientés production.\n\nL’objectif est de réduire le temps de setup répétitif tout en gardant assez de flexibilité pour des sites clients, portfolios ou interfaces applicatives plus complexes.",{"type":21,"content":2429},[],{"slug":2431,"id":2431,"show":55,"title":2432,"shortTitle":2433,"client":2432,"description":2434,"tags":2435,"tools":2436,"link":2437,"isLinkActive":55,"year":18,"imageDir":2438,"frontImage":2439,"gallery":2440,"content":2441,"sortOrder":2808,"translations":2809},"cours-legendre","Cours Legendre","Stage CL","Designing a clear and efficient web experience for internship booking An application designed to help students, from 6th grade through college, easily find and book internships. The project focused on intuitive content structuring, optimized navigation, and the creation of responsive interfaces that facilitate quick understanding of the offerings.\nThe implementation relies on reusable components, readable layouts, and a Nuxt\u002FVue stack optimized for performance and maintainability.",[810,14,11,15],[63,64],"https:\u002F\u002Fstages.cours-legendre.fr\u002F","\u002Fprojects\u002Fcours-legendre","\u002Fstages-cl.webp",[],{"type":21,"content":2442},[2443,2448,2452,2456,2460,2486,2490,2526,2530,2534,2538,2570,2574,2578,2588,2592,2636,2640,2644,2648,2680,2684,2734,2738,2742,2746,2747,2751,2807],{"type":72,"attrs":2444,"content":2445},{"level":43},[2446],{"text":2447,"type":77},"Overview",{"type":85,"content":2449},[2450],{"text":2451,"type":77},"Design and development of a web application that helps students—from middle school to higher education—search, book, and manage internship opportunities.",{"type":85,"content":2453},[2454],{"text":2455,"type":77},"The goal was to transform a complex administrative process into a simple, intuitive experience by guiding users through each step while ensuring data integrity and accessibility across all devices.",{"type":72,"attrs":2457,"content":2458},{"level":80},[2459],{"text":854,"type":77},{"type":120,"content":2461},[2462,2468,2474,2480],{"type":123,"content":2463},[2464],{"type":85,"content":2465},[2466],{"text":2467,"type":77},"Simplify a complex booking workflow.",{"type":123,"content":2469},[2470],{"type":85,"content":2471},[2472],{"text":2473,"type":77},"Reduce form abandonment with a guided multi-step experience.",{"type":123,"content":2475},[2476],{"type":85,"content":2477},[2478],{"text":2479,"type":77},"Deliver a seamless experience on both desktop and mobile.",{"type":123,"content":2481},[2482],{"type":85,"content":2483},[2484],{"text":2485,"type":77},"Allow users to save their progress and resume the process at any time.",{"type":72,"attrs":2487,"content":2488},{"level":80},[2489],{"text":891,"type":77},{"type":120,"content":2491},[2492,2498,2503,2509,2515,2520],{"type":123,"content":2493},[2494],{"type":85,"content":2495},[2496],{"text":2497,"type":77},"UX design and user flow optimization",{"type":123,"content":2499},[2500],{"type":85,"content":2501},[2502],{"text":899,"type":77},{"type":123,"content":2504},[2505],{"type":85,"content":2506},[2507],{"text":2508,"type":77},"Component architecture",{"type":123,"content":2510},[2511],{"type":85,"content":2512},[2513],{"text":2514,"type":77},"State management",{"type":123,"content":2516},[2517],{"type":85,"content":2518},[2519],{"text":923,"type":77},{"type":123,"content":2521},[2522],{"type":85,"content":2523},[2524],{"text":2525,"type":77},"Responsive implementation",{"type":72,"attrs":2527,"content":2528},{"level":80},[2529],{"text":934,"type":77},{"type":85,"content":2531},[2532],{"text":2533,"type":77},"The biggest challenge was turning a large, information-heavy form into a user-friendly experience.",{"type":85,"content":2535},[2536],{"text":2537,"type":77},"To achieve this, I designed a guided multi-step workflow featuring:",{"type":120,"content":2539},[2540,2546,2552,2558,2564],{"type":123,"content":2541},[2542],{"type":85,"content":2543},[2544],{"text":2545,"type":77},"Clear progress indicators",{"type":123,"content":2547},[2548],{"type":85,"content":2549},[2550],{"text":2551,"type":77},"Step-by-step validation",{"type":123,"content":2553},[2554],{"type":85,"content":2555},[2556],{"text":2557,"type":77},"Contextual error handling",{"type":123,"content":2559},[2560],{"type":85,"content":2561},[2562],{"text":2563,"type":77},"Automatic progress saving",{"type":123,"content":2565},[2566],{"type":85,"content":2567},[2568],{"text":2569,"type":77},"The ability to pause and resume the application without losing data",{"type":85,"content":2571},[2572],{"text":2573,"type":77},"This approach significantly reduced cognitive load and made the booking process feel approachable despite its complexity.",{"type":72,"attrs":2575,"content":2576},{"level":80},[2577],{"text":983,"type":77},{"type":85,"content":2579},[2580,2582,2586],{"text":2581,"type":77},"The application is built around a ",{"text":2583,"type":77,"marks":2584},"large multi-step form",[2585],{"type":1004},{"text":2587,"type":77}," with complex business logic and interconnected data.",{"type":85,"content":2589},[2590],{"text":2591,"type":77},"Key technical challenges included:",{"type":120,"content":2593},[2594,2600,2606,2612,2618,2624,2630],{"type":123,"content":2595},[2596],{"type":85,"content":2597},[2598],{"text":2599,"type":77},"Persistent form state across sessions",{"type":123,"content":2601},[2602],{"type":85,"content":2603},[2604],{"text":2605,"type":77},"Automatic draft saving",{"type":123,"content":2607},[2608],{"type":85,"content":2609},[2610],{"text":2611,"type":77},"Managing parent–child relationships between entities (student, legal guardian, school, internship, etc.)",{"type":123,"content":2613},[2614],{"type":85,"content":2615},[2616],{"text":2617,"type":77},"Conditional validation based on user profiles and previous answers",{"type":123,"content":2619},[2620],{"type":85,"content":2621},[2622],{"text":2623,"type":77},"Synchronizing data between multiple steps",{"type":123,"content":2625},[2626],{"type":85,"content":2627},[2628],{"text":2629,"type":77},"Preserving state while navigating forward and backward",{"type":123,"content":2631},[2632],{"type":85,"content":2633},[2634],{"text":2635,"type":77},"Building a scalable architecture for future feature development",{"type":72,"attrs":2637,"content":2638},{"level":80},[2639],{"text":1047,"type":77},{"type":85,"content":2641},[2642],{"text":2643,"type":77},"The project was built using a modular, component-driven architecture focused on maintainability and scalability.",{"type":85,"content":2645},[2646],{"text":2647,"type":77},"Key architectural principles include:",{"type":120,"content":2649},[2650,2656,2662,2668,2674],{"type":123,"content":2651},[2652],{"type":85,"content":2653},[2654],{"text":2655,"type":77},"Reusable UI components",{"type":123,"content":2657},[2658],{"type":85,"content":2659},[2660],{"text":2661,"type":77},"Clean and maintainable layouts",{"type":123,"content":2663},[2664],{"type":85,"content":2665},[2666],{"text":2667,"type":77},"Separation of business logic from presentation",{"type":123,"content":2669},[2670],{"type":85,"content":2671},[2672],{"text":2673,"type":77},"Centralized state management",{"type":123,"content":2675},[2676],{"type":85,"content":2677},[2678],{"text":2679,"type":77},"Scalable codebase designed for long-term evolution",{"type":72,"attrs":2681,"content":2682},{"level":80},[2683],{"text":1092,"type":77},{"type":120,"content":2685},[2686,2694,2701,2706,2712,2717,2723,2728],{"type":123,"content":2687},[2688],{"type":85,"content":2689},[2690],{"text":2691,"type":77,"marks":2692},"Nuxt",[2693],{"type":1004},{"type":123,"content":2695},[2696],{"type":85,"content":2697},[2698],{"text":1100,"type":77,"marks":2699},[2700],{"type":1004},{"type":123,"content":2702},[2703],{"type":85,"content":2704},[2705],{"text":1112,"type":77},{"type":123,"content":2707},[2708],{"type":85,"content":2709},[2710],{"text":2711,"type":77},"Scss",{"type":123,"content":2713},[2714],{"type":85,"content":2715},[2716],{"text":1130,"type":77},{"type":123,"content":2718},[2719],{"type":85,"content":2720},[2721],{"text":2722,"type":77},"State Management",{"type":123,"content":2724},[2725],{"type":85,"content":2726},[2727],{"text":1124,"type":77},{"type":123,"content":2729},[2730],{"type":85,"content":2731},[2732],{"text":2733,"type":77},"Form Validation",{"type":72,"attrs":2735,"content":2736},{"level":80},[2737],{"text":290,"type":77},{"type":85,"content":2739},[2740],{"text":2741,"type":77},"The result is a fast, responsive web application that successfully simplifies a highly complex booking process.",{"type":85,"content":2743},[2744],{"text":2745,"type":77},"Users are guided through every stage with a clear interface, automatic progress saving, and a seamless experience across devices, while the underlying architecture remains flexible and easy to maintain.",{"type":1150},{"type":72,"attrs":2748,"content":2749},{"level":43},[2750],{"text":1155,"type":77},{"type":120,"content":2752},[2753,2759,2765,2771,2777,2783,2789,2795,2801],{"type":123,"content":2754},[2755],{"type":85,"content":2756},[2757],{"text":2758,"type":77},"Designing complex business applications",{"type":123,"content":2760},[2761],{"type":85,"content":2762},[2763],{"text":2764,"type":77},"Building large multi-step forms",{"type":123,"content":2766},[2767],{"type":85,"content":2768},[2769],{"text":2770,"type":77},"Advanced state management",{"type":123,"content":2772},[2773],{"type":85,"content":2774},[2775],{"text":2776,"type":77},"Managing parent–child data relationships",{"type":123,"content":2778},[2779],{"type":85,"content":2780},[2781],{"text":2782,"type":77},"Scalable front-end architecture",{"type":123,"content":2784},[2785],{"type":85,"content":2786},[2787],{"text":2788,"type":77},"UX optimization for conversion and usability",{"type":123,"content":2790},[2791],{"type":85,"content":2792},[2793],{"text":2794,"type":77},"Responsive interface development",{"type":123,"content":2796},[2797],{"type":85,"content":2798},[2799],{"text":2800,"type":77},"Reusable component design",{"type":123,"content":2802},[2803],{"type":85,"content":2804},[2805],{"text":2806,"type":77},"Performance-focused development",{"type":85},8,{"en":2810,"fr":3126},{"title":2432,"shortTitle":2433,"summary":27,"description":2434,"content":2811},{"type":21,"content":2812},[2813,2817,2820,2823,2827,2849,2853,2885,2889,2892,2895,2922,2925,2929,2936,2939,2976,2980,2983,2986,3013,3017,3063,3067,3070,3073,3074,3078,3125],{"type":72,"attrs":2814,"content":2815},{"level":43},[2816],{"text":2447,"type":77},{"type":85,"content":2818},[2819],{"text":2451,"type":77},{"type":85,"content":2821},[2822],{"text":2455,"type":77},{"type":72,"attrs":2824,"content":2825},{"level":80},[2826],{"text":854,"type":77},{"type":120,"content":2828},[2829,2834,2839,2844],{"type":123,"content":2830},[2831],{"type":85,"content":2832},[2833],{"text":2467,"type":77},{"type":123,"content":2835},[2836],{"type":85,"content":2837},[2838],{"text":2473,"type":77},{"type":123,"content":2840},[2841],{"type":85,"content":2842},[2843],{"text":2479,"type":77},{"type":123,"content":2845},[2846],{"type":85,"content":2847},[2848],{"text":2485,"type":77},{"type":72,"attrs":2850,"content":2851},{"level":80},[2852],{"text":891,"type":77},{"type":120,"content":2854},[2855,2860,2865,2870,2875,2880],{"type":123,"content":2856},[2857],{"type":85,"content":2858},[2859],{"text":2497,"type":77},{"type":123,"content":2861},[2862],{"type":85,"content":2863},[2864],{"text":899,"type":77},{"type":123,"content":2866},[2867],{"type":85,"content":2868},[2869],{"text":2508,"type":77},{"type":123,"content":2871},[2872],{"type":85,"content":2873},[2874],{"text":2514,"type":77},{"type":123,"content":2876},[2877],{"type":85,"content":2878},[2879],{"text":923,"type":77},{"type":123,"content":2881},[2882],{"type":85,"content":2883},[2884],{"text":2525,"type":77},{"type":72,"attrs":2886,"content":2887},{"level":80},[2888],{"text":934,"type":77},{"type":85,"content":2890},[2891],{"text":2533,"type":77},{"type":85,"content":2893},[2894],{"text":2537,"type":77},{"type":120,"content":2896},[2897,2902,2907,2912,2917],{"type":123,"content":2898},[2899],{"type":85,"content":2900},[2901],{"text":2545,"type":77},{"type":123,"content":2903},[2904],{"type":85,"content":2905},[2906],{"text":2551,"type":77},{"type":123,"content":2908},[2909],{"type":85,"content":2910},[2911],{"text":2557,"type":77},{"type":123,"content":2913},[2914],{"type":85,"content":2915},[2916],{"text":2563,"type":77},{"type":123,"content":2918},[2919],{"type":85,"content":2920},[2921],{"text":2569,"type":77},{"type":85,"content":2923},[2924],{"text":2573,"type":77},{"type":72,"attrs":2926,"content":2927},{"level":80},[2928],{"text":983,"type":77},{"type":85,"content":2930},[2931,2932,2935],{"text":2581,"type":77},{"text":2583,"type":77,"marks":2933},[2934],{"type":1004},{"text":2587,"type":77},{"type":85,"content":2937},[2938],{"text":2591,"type":77},{"type":120,"content":2940},[2941,2946,2951,2956,2961,2966,2971],{"type":123,"content":2942},[2943],{"type":85,"content":2944},[2945],{"text":2599,"type":77},{"type":123,"content":2947},[2948],{"type":85,"content":2949},[2950],{"text":2605,"type":77},{"type":123,"content":2952},[2953],{"type":85,"content":2954},[2955],{"text":2611,"type":77},{"type":123,"content":2957},[2958],{"type":85,"content":2959},[2960],{"text":2617,"type":77},{"type":123,"content":2962},[2963],{"type":85,"content":2964},[2965],{"text":2623,"type":77},{"type":123,"content":2967},[2968],{"type":85,"content":2969},[2970],{"text":2629,"type":77},{"type":123,"content":2972},[2973],{"type":85,"content":2974},[2975],{"text":2635,"type":77},{"type":72,"attrs":2977,"content":2978},{"level":80},[2979],{"text":1047,"type":77},{"type":85,"content":2981},[2982],{"text":2643,"type":77},{"type":85,"content":2984},[2985],{"text":2647,"type":77},{"type":120,"content":2987},[2988,2993,2998,3003,3008],{"type":123,"content":2989},[2990],{"type":85,"content":2991},[2992],{"text":2655,"type":77},{"type":123,"content":2994},[2995],{"type":85,"content":2996},[2997],{"text":2661,"type":77},{"type":123,"content":2999},[3000],{"type":85,"content":3001},[3002],{"text":2667,"type":77},{"type":123,"content":3004},[3005],{"type":85,"content":3006},[3007],{"text":2673,"type":77},{"type":123,"content":3009},[3010],{"type":85,"content":3011},[3012],{"text":2679,"type":77},{"type":72,"attrs":3014,"content":3015},{"level":80},[3016],{"text":1092,"type":77},{"type":120,"content":3018},[3019,3026,3033,3038,3043,3048,3053,3058],{"type":123,"content":3020},[3021],{"type":85,"content":3022},[3023],{"text":2691,"type":77,"marks":3024},[3025],{"type":1004},{"type":123,"content":3027},[3028],{"type":85,"content":3029},[3030],{"text":1100,"type":77,"marks":3031},[3032],{"type":1004},{"type":123,"content":3034},[3035],{"type":85,"content":3036},[3037],{"text":1112,"type":77},{"type":123,"content":3039},[3040],{"type":85,"content":3041},[3042],{"text":2711,"type":77},{"type":123,"content":3044},[3045],{"type":85,"content":3046},[3047],{"text":1130,"type":77},{"type":123,"content":3049},[3050],{"type":85,"content":3051},[3052],{"text":2722,"type":77},{"type":123,"content":3054},[3055],{"type":85,"content":3056},[3057],{"text":1124,"type":77},{"type":123,"content":3059},[3060],{"type":85,"content":3061},[3062],{"text":2733,"type":77},{"type":72,"attrs":3064,"content":3065},{"level":80},[3066],{"text":290,"type":77},{"type":85,"content":3068},[3069],{"text":2741,"type":77},{"type":85,"content":3071},[3072],{"text":2745,"type":77},{"type":1150},{"type":72,"attrs":3075,"content":3076},{"level":43},[3077],{"text":1155,"type":77},{"type":120,"content":3079},[3080,3085,3090,3095,3100,3105,3110,3115,3120],{"type":123,"content":3081},[3082],{"type":85,"content":3083},[3084],{"text":2758,"type":77},{"type":123,"content":3086},[3087],{"type":85,"content":3088},[3089],{"text":2764,"type":77},{"type":123,"content":3091},[3092],{"type":85,"content":3093},[3094],{"text":2770,"type":77},{"type":123,"content":3096},[3097],{"type":85,"content":3098},[3099],{"text":2776,"type":77},{"type":123,"content":3101},[3102],{"type":85,"content":3103},[3104],{"text":2782,"type":77},{"type":123,"content":3106},[3107],{"type":85,"content":3108},[3109],{"text":2788,"type":77},{"type":123,"content":3111},[3112],{"type":85,"content":3113},[3114],{"text":2794,"type":77},{"type":123,"content":3116},[3117],{"type":85,"content":3118},[3119],{"text":2800,"type":77},{"type":123,"content":3121},[3122],{"type":85,"content":3123},[3124],{"text":2806,"type":77},{"type":85},{"title":2432,"shortTitle":2433,"summary":27,"description":3127,"content":3128},"Conception d’une expérience web claire et performante pour la réservation de stages Une application pensée pour aider les élèves, de la 6ᵉ aux études supérieures, à trouver et réserver facilement des stages. Le projet s’est concentré sur la structuration intuitive du contenu, l’optimisation de la navigation et la création d’interfaces responsives qui facilitent la compréhension rapide de l’offre.\nL’implémentation mise sur des composants réutilisables, des layouts lisibles et une stack Nuxt\u002FVue optimisée pour la performance et la maintenabilité.",{"type":21,"content":3129},[3130,3135,3139,3143,3169,3173,3205,3209,3213,3217,3249,3253,3257,3267,3271,3315,3319,3323,3327,3359,3364,3412,3416,3420,3424,3425,3429,3433,3437,3441,3445,3449,3453,3457],{"type":72,"attrs":3131,"content":3132},{"level":43},[3133],{"text":3134,"type":77},"Contexte",{"type":85,"content":3136},[3137],{"text":3138,"type":77},"Conception et développement d'une application web permettant aux élèves, de la 6ᵉ jusqu'aux études supérieures, de rechercher, réserver et gérer leurs stages. L'objectif était de rendre un parcours administratif complexe simple, rapide et compréhensible, quel que soit le niveau de l'utilisateur.",{"type":72,"attrs":3140,"content":3141},{"level":80},[3142],{"text":1537,"type":77},{"type":120,"content":3144},[3145,3151,3157,3163],{"type":123,"content":3146},[3147],{"type":85,"content":3148},[3149],{"text":3150,"type":77},"Simplifier un processus de réservation composé de nombreuses informations.",{"type":123,"content":3152},[3153],{"type":85,"content":3154},[3155],{"text":3156,"type":77},"Réduire les abandons grâce à un parcours guidé étape par étape.",{"type":123,"content":3158},[3159],{"type":85,"content":3160},[3161],{"text":3162,"type":77},"Offrir une expérience fluide sur mobile comme sur desktop.",{"type":123,"content":3164},[3165],{"type":85,"content":3166},[3167],{"text":3168,"type":77},"Garantir la sauvegarde de la progression pour permettre aux utilisateurs de reprendre leur formulaire à tout moment.",{"type":72,"attrs":3170,"content":3171},{"level":80},[3172],{"text":1586,"type":77},{"type":120,"content":3174},[3175,3181,3187,3193,3199],{"type":123,"content":3176},[3177],{"type":85,"content":3178},[3179],{"text":3180,"type":77},"Conception de l'expérience utilisateur.",{"type":123,"content":3182},[3183],{"type":85,"content":3184},[3185],{"text":3186,"type":77},"Développement du front-end.",{"type":123,"content":3188},[3189],{"type":85,"content":3190},[3191],{"text":3192,"type":77},"Architecture des composants.",{"type":123,"content":3194},[3195],{"type":85,"content":3196},[3197],{"text":3198,"type":77},"Gestion de l'état de l'application.",{"type":123,"content":3200},[3201],{"type":85,"content":3202},[3203],{"text":3204,"type":77},"Optimisation des performances et de la maintenabilité.",{"type":72,"attrs":3206,"content":3207},{"level":80},[3208],{"text":1635,"type":77},{"type":85,"content":3210},[3211],{"text":3212,"type":77},"Le principal défi consistait à transformer un formulaire particulièrement long en une expérience rassurante et facile à compléter.",{"type":85,"content":3214},[3215],{"text":3216,"type":77},"Pour y parvenir, le parcours a été découpé en étapes logiques avec :",{"type":120,"content":3218},[3219,3225,3231,3237,3243],{"type":123,"content":3220},[3221],{"type":85,"content":3222},[3223],{"text":3224,"type":77},"une progression claire,",{"type":123,"content":3226},[3227],{"type":85,"content":3228},[3229],{"text":3230,"type":77},"une validation des données à chaque étape,",{"type":123,"content":3232},[3233],{"type":85,"content":3234},[3235],{"text":3236,"type":77},"des messages d'erreur contextualisés,",{"type":123,"content":3238},[3239],{"type":85,"content":3240},[3241],{"text":3242,"type":77},"une sauvegarde automatique de l'avancement,",{"type":123,"content":3244},[3245],{"type":85,"content":3246},[3247],{"text":3248,"type":77},"la possibilité de reprendre la saisie sans perdre les informations déjà renseignées.",{"type":85,"content":3250},[3251],{"text":3252,"type":77},"Cette approche réduit la charge cognitive et améliore significativement l'expérience utilisateur.",{"type":72,"attrs":3254,"content":3255},{"level":80},[3256],{"text":1684,"type":77},{"type":85,"content":3258},[3259,3261,3265],{"text":3260,"type":77},"Le projet repose sur un ",{"text":3262,"type":77,"marks":3263},"formulaire multi-étapes",[3264],{"type":1004},{"text":3266,"type":77}," avec une logique métier importante.",{"type":85,"content":3268},[3269],{"text":3270,"type":77},"Les principaux enjeux techniques étaient :",{"type":120,"content":3272},[3273,3279,3285,3297,3303,3309],{"type":123,"content":3274},[3275],{"type":85,"content":3276},[3277],{"text":3278,"type":77},"sauvegarde persistante de l'état du formulaire ;",{"type":123,"content":3280},[3281],{"type":85,"content":3282},[3283],{"text":3284,"type":77},"synchronisation des données entre plusieurs étapes ;",{"type":123,"content":3286},[3287],{"type":85,"content":3288},[3289,3291,3295],{"text":3290,"type":77},"gestion de relations ",{"text":3292,"type":77,"marks":3293},"parent \u002F enfant",[3294],{"type":1004},{"text":3296,"type":77}," (élève, représentant légal, établissement, etc.) ;",{"type":123,"content":3298},[3299],{"type":85,"content":3300},[3301],{"text":3302,"type":77},"validation conditionnelle selon le profil de l'utilisateur ;",{"type":123,"content":3304},[3305],{"type":85,"content":3306},[3307],{"text":3308,"type":77},"conservation des données lors des retours en arrière ou des interruptions de session ;",{"type":123,"content":3310},[3311],{"type":85,"content":3312},[3313],{"text":3314,"type":77},"architecture modulaire facilitant les évolutions futures.",{"type":72,"attrs":3316,"content":3317},{"level":80},[3318],{"text":1047,"type":77},{"type":85,"content":3320},[3321],{"text":3322,"type":77},"L'application a été construite autour de composants réutilisables afin de garantir une interface cohérente et facilement maintenable.",{"type":85,"content":3324},[3325],{"text":3326,"type":77},"L'architecture met l'accent sur :",{"type":120,"content":3328},[3329,3335,3341,3347,3353],{"type":123,"content":3330},[3331],{"type":85,"content":3332},[3333],{"text":3334,"type":77},"composants UI réutilisables ;",{"type":123,"content":3336},[3337],{"type":85,"content":3338},[3339],{"text":3340,"type":77},"layouts clairs et évolutifs ;",{"type":123,"content":3342},[3343],{"type":85,"content":3344},[3345],{"text":3346,"type":77},"séparation de la logique métier et de la présentation ;",{"type":123,"content":3348},[3349],{"type":85,"content":3350},[3351],{"text":3352,"type":77},"gestion centralisée de l'état ;",{"type":123,"content":3354},[3355],{"type":85,"content":3356},[3357],{"text":3358,"type":77},"code scalable pour accompagner les évolutions du produit.",{"type":72,"attrs":3360,"content":3361},{"level":80},[3362],{"text":3363,"type":77},"Technologies",{"type":120,"content":3365},[3366,3373,3380,3385,3390,3395,3400,3406],{"type":123,"content":3367},[3368],{"type":85,"content":3369},[3370],{"text":2691,"type":77,"marks":3371},[3372],{"type":1004},{"type":123,"content":3374},[3375],{"type":85,"content":3376},[3377],{"text":1100,"type":77,"marks":3378},[3379],{"type":1004},{"type":123,"content":3381},[3382],{"type":85,"content":3383},[3384],{"text":1112,"type":77},{"type":123,"content":3386},[3387],{"type":85,"content":3388},[3389],{"text":2711,"type":77},{"type":123,"content":3391},[3392],{"type":85,"content":3393},[3394],{"text":1819,"type":77},{"type":123,"content":3396},[3397],{"type":85,"content":3398},[3399],{"text":1124,"type":77},{"type":123,"content":3401},[3402],{"type":85,"content":3403},[3404],{"text":3405,"type":77},"Gestion d'état",{"type":123,"content":3407},[3408],{"type":85,"content":3409},[3410],{"text":3411,"type":77},"Validation de formulaires",{"type":72,"attrs":3413,"content":3414},{"level":80},[3415],{"text":766,"type":77},{"type":85,"content":3417},[3418],{"text":3419,"type":77},"Le résultat est une application performante offrant un parcours de réservation fluide malgré la complexité du processus.",{"type":85,"content":3421},[3422],{"text":3423,"type":77},"L'interface guide progressivement l'utilisateur, sécurise la saisie grâce à la sauvegarde automatique et propose une expérience cohérente sur tous les appareils.",{"type":1150},{"type":72,"attrs":3426,"content":3427},{"level":43},[3428],{"text":1842,"type":77},{"type":85,"content":3430},[3431],{"text":3432,"type":77},"✔ Conception d'applications métier complexes",{"type":85,"content":3434},[3435],{"text":3436,"type":77},"✔ Développement de formulaires multi-étapes",{"type":85,"content":3438},[3439],{"text":3440,"type":77},"✔ Gestion avancée de l'état (State Management)",{"type":85,"content":3442},[3443],{"text":3444,"type":77},"✔ Gestion de relations de données parent \u002F enfant",{"type":85,"content":3446},[3447],{"text":3448,"type":77},"✔ Architecture front-end scalable",{"type":85,"content":3450},[3451],{"text":3452,"type":77},"✔ Optimisation UX pour réduire la friction utilisateur",{"type":85,"content":3454},[3455],{"text":3456,"type":77},"✔ Développement d'interfaces responsives",{"type":85,"content":3458},[3459],{"text":3460,"type":77},"✔ Création de composants réutilisables",{"slug":3462,"id":3462,"show":7,"title":3462,"shortTitle":3462,"client":17,"description":17,"tags":3463,"tools":3464,"link":3465,"isLinkActive":7,"year":3466,"imageDir":17,"frontImage":17,"gallery":3467,"content":27,"sortOrder":3468,"translations":3469},"crowseek",[],[],"https:\u002F\u002Fcrowseek.com",2025,[],9,{"en":3470,"fr":3473},{"title":27,"shortTitle":27,"summary":27,"description":27,"content":3471},{"type":21,"content":3472},[],{"title":27,"shortTitle":27,"summary":27,"description":27,"content":3474},{"type":21,"content":3475},[],{"slug":3477,"id":3477,"show":55,"title":3478,"shortTitle":3479,"client":3480,"description":3481,"tags":3482,"tools":3484,"link":3486,"isLinkActive":55,"year":3466,"imageDir":3487,"frontImage":3488,"gallery":3489,"content":3495,"sortOrder":3497,"translations":3498},"hominum","Hominum Website","Hominum","Hominum Games","Hominum Games, a 500 m² leisure venue in Nice dedicated to multi-activity entertainment, wanted to establish a strong, playful, and recognizable visual universe that reflects its immersive gaming DNA 🕹️.\n\nVingt Deux carried out a complete graphic redesign, starting from their existing logo, creating a colorful, retro, and welcoming universe aligned with vintage video-game codes.\n\nIn parallel, we designed and developed the hominum.games website, with full UX\u002FUI and custom web integration, to deliver a smooth, immersive, high-performance experience.\n\nThe hominum.games site was built to offer immersive, intuitive navigation: fluid structure, animated illustrations, integration of varied activities (escape games, archery, retro gaming…), and responsive SEO-optimized pages. The goal: capture attention, inform effectively, and convert.",[14,11,12,3483,61],"elementor",[3483,3485,63],"vsc","https:\u002F\u002Fhominum.games\u002F","\u002Fprojects\u002Fhominum","\u002F2-1080_1350.jpg",[3490,3491,3492,3493,3494],"\u002F1-1080_1350.jpg","\u002F3-1080_1350.jpg","\u002F4-1080_1350.jpg","\u002F5-1080_1350.jpg","\u002F7-1080_1350.jpg",{"type":21,"content":3496},[],10,{"en":3499,"fr":3502},{"title":3478,"shortTitle":3479,"summary":27,"description":3481,"content":3500},{"type":21,"content":3501},[],{"title":3478,"shortTitle":3479,"summary":27,"description":3503,"content":3504},"Hominum Games, lieu de loisirs de 500 m² à Nice dédié aux activités immersives, voulait installer un univers visuel fort, ludique et reconnaissable, fidèle à son ADN gaming.\n\nLe travail a porté sur une refonte graphique complète à partir du logo existant, avec un univers coloré, rétro et accueillant inspiré des codes du jeu vidéo vintage.\n\nEn parallèle, le site hominum.games a été conçu et intégré pour offrir une expérience fluide, immersive et performante, avec une navigation claire autour des différentes activités.",{"type":21,"content":3505},[],{"slug":3507,"id":3507,"show":7,"title":3507,"shortTitle":3507,"client":17,"description":17,"tags":3508,"tools":3509,"link":3510,"isLinkActive":55,"year":3466,"imageDir":17,"frontImage":17,"gallery":3511,"content":27,"sortOrder":3512,"translations":3513},"aps",[],[],"https:\u002F\u002Fapsaumon.com\u002F",[],11,{"en":3514,"fr":3517},{"title":27,"shortTitle":27,"summary":27,"description":27,"content":3515},{"type":21,"content":3516},[],{"title":27,"shortTitle":27,"summary":27,"description":27,"content":3518},{"type":21,"content":3519},[],{"slug":3521,"id":3521,"show":7,"title":3521,"shortTitle":3521,"client":17,"description":17,"tags":3522,"tools":3523,"link":17,"isLinkActive":55,"year":3466,"imageDir":17,"frontImage":17,"gallery":3524,"content":27,"sortOrder":3525,"translations":3526},"Les Écuries de Lodbrok",[],[],[],12,{"en":3527,"fr":3530},{"title":27,"shortTitle":27,"summary":27,"description":27,"content":3528},{"type":21,"content":3529},[],{"title":27,"shortTitle":27,"summary":27,"description":27,"content":3531},{"type":21,"content":3532},[],{"slug":3534,"id":3534,"show":55,"title":3535,"shortTitle":3536,"client":3537,"description":3538,"tags":3539,"tools":3540,"link":3541,"isLinkActive":55,"year":3542,"imageDir":3543,"frontImage":3544,"gallery":3545,"content":3551,"sortOrder":3569,"translations":3570},"cdr","CDR Website","CDR","CDR Construction","For over 10 years, CDR Construction has established itself as a recognized player in construction and property development, combining rigorous execution, local commitment, and a strong service mindset.\n\nWe redesigned the user journey to clarify the offering, showcase achievements, and better convey CDR’s commitment to quality.\n\nA modern, fluid, responsive site, optimized for performance and designed for future scalability.\nElegant presentation of flagship projects to reinforce proof of expertise and credibility.",[61,12,14,11,3483],[3485,63,3483],"https:\u002F\u002Fcdr-construction.fr\u002F",2024,"\u002Fprojects\u002Fcdr","\u002F1080_1350-5.jpg",[3544,3546,3547,3548,3549,3550],"\u002F1080_1350-1.jpg","\u002F1080_1350-2.jpg","\u002F1080_1350-4.jpg","\u002F1080_1350-6.jpg","\u002F1080_1350-7.jpg",{"type":21,"content":3552},[3553,3557,3561,3565],{"type":85,"content":3554},[3555],{"text":3556,"type":77},"For over 10 years, CDR Construction has established itself as a recognized player in construction and property development, combining rigorous execution, local commitment, and a strong service mindset.",{"type":85,"content":3558},[3559],{"text":3560,"type":77},"We redesigned the user journey to clarify the offering, showcase achievements, and better convey CDR’s commitment to quality.",{"type":85,"content":3562},[3563],{"text":3564,"type":77},"A modern, fluid, responsive site, optimized for performance and designed for future scalability.",{"type":85,"content":3566},[3567],{"text":3568,"type":77},"Elegant presentation of flagship projects to reinforce proof of expertise and credibility.",13,{"en":3571,"fr":3586},{"title":3535,"shortTitle":3536,"summary":27,"description":3538,"content":3572},{"type":21,"content":3573},[3574,3577,3580,3583],{"type":85,"content":3575},[3576],{"text":3556,"type":77},{"type":85,"content":3578},[3579],{"text":3560,"type":77},{"type":85,"content":3581},[3582],{"text":3564,"type":77},{"type":85,"content":3584},[3585],{"text":3568,"type":77},{"title":3535,"shortTitle":3536,"summary":27,"description":3587,"content":3588},"Depuis plus de 10 ans, CDR Construction s’impose comme un acteur reconnu de la construction et de la promotion immobilière, avec une approche rigoureuse, locale et orientée service.\n\nLe parcours utilisateur a été repensé pour clarifier l’offre, valoriser les réalisations et mieux transmettre l’exigence de qualité de CDR.\n\nLe résultat est un site moderne, fluide, responsive et pensé pour évoluer, avec une présentation plus crédible des projets phares.",{"type":21,"content":3589},[3590,3594,3598],{"type":85,"content":3591},[3592],{"text":3593,"type":77},"Depuis plus de 10 ans, CDR Construction s’impose comme un acteur reconnu de la construction et de la promotion immobilière, avec une approche rigoureuse, locale et orientée service.",{"type":85,"content":3595},[3596],{"text":3597,"type":77},"Le parcours utilisateur a été repensé pour clarifier l’offre, valoriser les réalisations et mieux transmettre l’exigence de qualité de CDR.",{"type":85,"content":3599},[3600],{"text":3601,"type":77},"Le résultat est un site moderne, fluide, responsive et pensé pour évoluer, avec une présentation plus crédible des projets phares.",{"slug":3603,"id":3603,"show":55,"title":3604,"shortTitle":3605,"client":3606,"description":3607,"tags":3608,"tools":3609,"link":3610,"isLinkActive":55,"year":3466,"imageDir":3611,"frontImage":3612,"gallery":3613,"content":3619,"sortOrder":3743,"translations":3744},"so-access","So'Access Website","So'Access","Auvergne Habitat","So’Access, a brand of the Auvergne Habitat group, wanted to strengthen its image and optimize the digital experience: a modernized visual universe, fluid ergonomics, and comprehensive digital support.\n\nOur work covered rebuilding the visual universe, UX\u002FUI, website development, as well as SEA acquisition and social-media strategy to promote home ownership in the Clermont metropolitan area via rent-to-own (PSLA) and existing properties.\n\nThe responsive platform was custom-built, integrating a powerful search engine, an alert form, detailed listings (new and existing), and clearly explained PSLA mechanisms (tax benefits, guarantees, conditions).",[12,11,61,3483,14],[3485,63,3483],"https:\u002F\u002Fsoaccess.auvergne-habitat.fr\u002F","\u002Fprojects\u002Fso-access","\u002Fso_access-Use-case_horizontal.jpg",[3614,3615,3616,3617,3618],"\u002Fso_access-Use-case_2.jpg","\u002Fso_access-Use-case_3.jpg","\u002Fso_access-Use-case_4.jpg","\u002Fso_access-Use-case_5.jpg","\u002Fso_access-Use-case_6-1.jpg",{"type":21,"content":3620},[3621,3634,3638,3670,3675,3679,3717,3722,3726,3731,3735,3739],{"type":85,"content":3622},[3623,3627,3629,3632],{"text":3624,"type":77,"marks":3625},"So’Access",[3626],{"type":1004},{"text":3628,"type":77},", a brand of ",{"text":3606,"type":77,"marks":3630},[3631],{"type":1004},{"text":3633,"type":77},", is a leading social housing and homeownership provider in the Clermont-Ferrand metropolitan area. The goal of the project was to modernize the brand's digital identity and deliver a user-friendly platform that helps future homeowners find the right property more easily.",{"type":72,"attrs":3635,"content":3636},{"level":80},[3637],{"text":854,"type":77},{"type":120,"content":3639},[3640,3646,3652,3658,3664],{"type":123,"content":3641},[3642],{"type":85,"content":3643},[3644],{"text":3645,"type":77},"Modernize the brand's visual identity.",{"type":123,"content":3647},[3648],{"type":85,"content":3649},[3650],{"text":3651,"type":77},"Improve the overall user experience.",{"type":123,"content":3653},[3654],{"type":85,"content":3655},[3656],{"text":3657,"type":77},"Simplify the property search process.",{"type":123,"content":3659},[3660],{"type":85,"content":3661},[3662],{"text":3663,"type":77},"Highlight homeownership schemes, including the PSLA program.",{"type":123,"content":3665},[3666],{"type":85,"content":3667},[3668],{"text":3669,"type":77},"Generate more qualified leads through digital tools.",{"type":72,"attrs":3671,"content":3672},{"level":80},[3673],{"text":3674,"type":77},"What We Delivered",{"type":85,"content":3676},[3677],{"text":3678,"type":77},"The project involved designing and developing a fully responsive WordPress platform featuring:",{"type":120,"content":3680},[3681,3687,3693,3699,3705,3711],{"type":123,"content":3682},[3683],{"type":85,"content":3684},[3685],{"text":3686,"type":77},"A redesigned UX\u002FUI.",{"type":123,"content":3688},[3689],{"type":85,"content":3690},[3691],{"text":3692,"type":77},"A powerful property search engine.",{"type":123,"content":3694},[3695],{"type":85,"content":3696},[3697],{"text":3698,"type":77},"Detailed property and development pages.",{"type":123,"content":3700},[3701],{"type":85,"content":3702},[3703],{"text":3704,"type":77},"Contact and property alert forms.",{"type":123,"content":3706},[3707],{"type":85,"content":3708},[3709],{"text":3710,"type":77},"Clear explanations of homeownership programs and eligibility schemes.",{"type":123,"content":3712},[3713],{"type":85,"content":3714},[3715],{"text":3716,"type":77},"Several custom WordPress features, with a strong focus on automating the connection between prospective buyers and available properties.",{"type":72,"attrs":3718,"content":3719},{"level":80},[3720],{"text":3721,"type":77},"Smart Property Search Form",{"type":85,"content":3723},[3724],{"text":3725,"type":77},"I built a custom search form that allows users to define their property preferences, including budget, location, property type, number of bedrooms, and other criteria. These preferences are stored to create a personalized buyer profile.",{"type":72,"attrs":3727,"content":3728},{"level":80},[3729],{"text":3730,"type":77},"Automated Property Matching & Email Alerts",{"type":85,"content":3732},[3733],{"text":3734,"type":77},"I also developed an automated matching system that continuously compares newly published properties with each user's saved search criteria. Whenever a property matches a user's preferences, the platform automatically sends an email notification, allowing potential buyers to discover new opportunities as soon as they become available.",{"type":72,"attrs":3736,"content":3737},{"level":43},[3738],{"text":290,"type":77},{"type":85,"content":3740},[3741],{"text":3742,"type":77},"This feature significantly improves the user experience by eliminating the need for repetitive searches while enabling So’Access to promote newly available properties more effectively and increase qualified leads.",14,{"en":3745,"fr":3849},{"title":3604,"shortTitle":3605,"summary":27,"description":3607,"content":3746},{"type":21,"content":3747},[3748,3758,3762,3789,3793,3796,3828,3832,3835,3839,3842,3846],{"type":85,"content":3749},[3750,3753,3754,3757],{"text":3624,"type":77,"marks":3751},[3752],{"type":1004},{"text":3628,"type":77},{"text":3606,"type":77,"marks":3755},[3756],{"type":1004},{"text":3633,"type":77},{"type":72,"attrs":3759,"content":3760},{"level":80},[3761],{"text":854,"type":77},{"type":120,"content":3763},[3764,3769,3774,3779,3784],{"type":123,"content":3765},[3766],{"type":85,"content":3767},[3768],{"text":3645,"type":77},{"type":123,"content":3770},[3771],{"type":85,"content":3772},[3773],{"text":3651,"type":77},{"type":123,"content":3775},[3776],{"type":85,"content":3777},[3778],{"text":3657,"type":77},{"type":123,"content":3780},[3781],{"type":85,"content":3782},[3783],{"text":3663,"type":77},{"type":123,"content":3785},[3786],{"type":85,"content":3787},[3788],{"text":3669,"type":77},{"type":72,"attrs":3790,"content":3791},{"level":80},[3792],{"text":3674,"type":77},{"type":85,"content":3794},[3795],{"text":3678,"type":77},{"type":120,"content":3797},[3798,3803,3808,3813,3818,3823],{"type":123,"content":3799},[3800],{"type":85,"content":3801},[3802],{"text":3686,"type":77},{"type":123,"content":3804},[3805],{"type":85,"content":3806},[3807],{"text":3692,"type":77},{"type":123,"content":3809},[3810],{"type":85,"content":3811},[3812],{"text":3698,"type":77},{"type":123,"content":3814},[3815],{"type":85,"content":3816},[3817],{"text":3704,"type":77},{"type":123,"content":3819},[3820],{"type":85,"content":3821},[3822],{"text":3710,"type":77},{"type":123,"content":3824},[3825],{"type":85,"content":3826},[3827],{"text":3716,"type":77},{"type":72,"attrs":3829,"content":3830},{"level":80},[3831],{"text":3721,"type":77},{"type":85,"content":3833},[3834],{"text":3725,"type":77},{"type":72,"attrs":3836,"content":3837},{"level":80},[3838],{"text":3730,"type":77},{"type":85,"content":3840},[3841],{"text":3734,"type":77},{"type":72,"attrs":3843,"content":3844},{"level":43},[3845],{"text":290,"type":77},{"type":85,"content":3847},[3848],{"text":3742,"type":77},{"title":3604,"shortTitle":3605,"summary":27,"description":3850,"content":3851},"So’Access, marque du groupe Auvergne Habitat, souhaitait renforcer son image et optimiser son expérience digitale : univers visuel modernisé, ergonomie plus fluide et accompagnement digital complet.\n\nLe travail a couvert la refonte de l’univers visuel, l’UX\u002FUI, le développement du site ainsi que les leviers d’acquisition pour promouvoir l’accession à la propriété dans la métropole clermontoise.\n\nLa plateforme responsive intègre une recherche efficace, des formulaires d’alerte, des fiches détaillées et une présentation claire des mécanismes PSLA.",{"type":21,"content":3852},[3853,3866,3871,3903,3908,3912,3950,3955,3959,3964,3968,3972],{"type":85,"content":3854},[3855,3858,3860,3864],{"text":3624,"type":77,"marks":3856},[3857],{"type":1004},{"text":3859,"type":77},", marque du ",{"text":3861,"type":77,"marks":3862},"groupe Auvergne Habitat",[3863],{"type":1004},{"text":3865,"type":77},", est un acteur majeur du logement et de l'accession à la propriété dans la métropole clermontoise. L'objectif était de moderniser son image de marque et de proposer une plateforme digitale capable d'accompagner efficacement les futurs acquéreurs dans leur recherche de logement.",{"type":72,"attrs":3867,"content":3868},{"level":80},[3869],{"text":3870,"type":77},"Les objectifs",{"type":120,"content":3872},[3873,3879,3885,3891,3897],{"type":123,"content":3874},[3875],{"type":85,"content":3876},[3877],{"text":3878,"type":77},"Moderniser l'identité visuelle de la marque.",{"type":123,"content":3880},[3881],{"type":85,"content":3882},[3883],{"text":3884,"type":77},"Améliorer l'expérience utilisateur sur l'ensemble du parcours.",{"type":123,"content":3886},[3887],{"type":85,"content":3888},[3889],{"text":3890,"type":77},"Faciliter la recherche de programmes immobiliers.",{"type":123,"content":3892},[3893],{"type":85,"content":3894},[3895],{"text":3896,"type":77},"Valoriser les dispositifs d'accession à la propriété, notamment le PSLA.",{"type":123,"content":3898},[3899],{"type":85,"content":3900},[3901],{"text":3902,"type":77},"Générer davantage de contacts qualifiés grâce à des outils digitaux.",{"type":72,"attrs":3904,"content":3905},{"level":80},[3906],{"text":3907,"type":77},"Les réalisations",{"type":85,"content":3909},[3910],{"text":3911,"type":77},"Le projet a consisté en la conception et le développement d'une plateforme WordPress entièrement responsive intégrant :",{"type":120,"content":3913},[3914,3920,3926,3932,3938,3944],{"type":123,"content":3915},[3916],{"type":85,"content":3917},[3918],{"text":3919,"type":77},"une interface UX\u002FUI repensée ;",{"type":123,"content":3921},[3922],{"type":85,"content":3923},[3924],{"text":3925,"type":77},"un moteur de recherche performant ;",{"type":123,"content":3927},[3928],{"type":85,"content":3929},[3930],{"text":3931,"type":77},"des fiches programmes détaillées ;",{"type":123,"content":3933},[3934],{"type":85,"content":3935},[3936],{"text":3937,"type":77},"des formulaires de contact et d'alerte ;",{"type":123,"content":3939},[3940],{"type":85,"content":3941},[3942],{"text":3943,"type":77},"une présentation claire des dispositifs d'accession à la propriété.",{"type":123,"content":3945},[3946],{"type":85,"content":3947},[3948],{"text":3949,"type":77},"fonctionnalités personnalisées sur WordPress, avec une attention particulière portée à l'automatisation de la mise en relation entre les acquéreurs et les logements disponibles.",{"type":72,"attrs":3951,"content":3952},{"level":80},[3953],{"text":3954,"type":77},"Formulaire intelligent de recherche",{"type":85,"content":3956},[3957],{"text":3958,"type":77},"J'ai développé un formulaire sur mesure permettant aux utilisateurs de renseigner leurs critères de recherche (type de bien, budget, localisation, nombre de pièces, etc.). Ces informations sont enregistrées afin de constituer un profil de recherche personnalisé.",{"type":72,"attrs":3960,"content":3961},{"level":80},[3962],{"text":3963,"type":77},"Système d'alertes automatiques",{"type":85,"content":3965},[3966],{"text":3967,"type":77},"J'ai également conçu un système de correspondance qui compare automatiquement les nouveaux logements publiés avec les critères enregistrés par les utilisateurs. Lorsqu'un bien correspond à leur recherche, une notification est envoyée automatiquement par e-mail, leur permettant d'être informés en temps réel des nouvelles opportunités.",{"type":72,"attrs":3969,"content":3970},{"level":43},[3971],{"text":766,"type":77},{"type":85,"content":3973},[3974],{"text":3975,"type":77},"Cette fonctionnalité améliore l'expérience des futurs acquéreurs en leur évitant d'effectuer des recherches répétitives, tout en permettant à So’Access de valoriser rapidement les nouveaux programmes immobiliers et d'augmenter les prises de contact qualifiées.",{"slug":3977,"id":3977,"show":55,"title":3978,"shortTitle":3979,"client":3980,"description":3981,"tags":3982,"tools":3983,"link":3984,"isLinkActive":55,"year":3466,"imageDir":3985,"frontImage":3986,"gallery":3987,"content":3994,"sortOrder":3996,"translations":3997},"ultrawatt","Ultrawatt Website","Ultrawatt","Ultrawatt Pro","Ultrawatt’s new website delivers an optimized, immersive user experience designed to attract and retain consumer attention. Targeted, persuasive copywriting complements the intuitive interface, highlighting Ultrawatt’s products while educating consumers on their unique value.",[14,11,3483,12,61],[3483,3485,63],"https:\u002F\u002Fultrawatt.fr\u002F","\u002Fprojects\u002Fultrawatt","\u002FUSE-CASE-Ultrawatt-_3-scaled_2.jpg",[3988,3989,3990,3991,3992,3993],"\u002FUSE-CASE-Ultrawatt - scaled_7.jpg","\u002FUSE-CASE-Ultrawatt-_2-scaled_1.jpg","\u002FUSE-CASE-Ultrawatt-_4-scaled_3.jpg","\u002FUSE-CASE-Ultrawatt-_5-scaled_4.jpg","\u002FUSE-CASE-Ultrawatt-_6-scaled_5.jpg","\u002FUSE-CASE-Ultrawatt-_Plan-de-travail-1-scaled_6.jpg",{"type":21,"content":3995},[],15,{"en":3998,"fr":4001},{"title":3978,"shortTitle":3979,"summary":27,"description":3981,"content":3999},{"type":21,"content":4000},[],{"title":3978,"shortTitle":3979,"summary":27,"description":4002,"content":4003},"Le nouveau site d’Ultrawatt propose une expérience plus immersive et optimisée pour attirer puis retenir l’attention. L’interface met en avant les produits tout en clarifiant leur valeur pour l’utilisateur.\n\nLe travail associe hiérarchie visuelle, contenus ciblés et intégration responsive pour créer un site vitrine plus lisible et convaincant.",{"type":21,"content":4004},[],{"slug":4006,"id":4006,"show":55,"title":4007,"shortTitle":4008,"client":4008,"description":4009,"tags":4010,"tools":4011,"link":4012,"isLinkActive":55,"year":3466,"imageDir":4013,"frontImage":4014,"gallery":4015,"content":4021,"sortOrder":4023,"translations":4024},"solarbear","Solarbear Website","Solarbear","Solarbear needed a clearer digital presence to present its offer with confidence and make key information easy to scan. The interface focuses on readability, visual hierarchy, and a responsive structure adapted to both discovery and conversion.\n\nThe project combines UX\u002FUI work, web integration, and content organization to create a polished showcase experience.",[11,12,3483,61,14],[3485,63,3483],"https:\u002F\u002Fsolarbear.fr\u002F","\u002Fprojects\u002Fsolarbear","\u002F474396528.jpg",[4016,4017,4018,4019,4020],"\u002F47415259.jpg","\u002F474237712.jpg","\u002F474242256.jpg","\u002F474258569.jpg","\u002F474433953.jpg",{"type":21,"content":4022},[],16,{"en":4025,"fr":4028},{"title":4007,"shortTitle":4008,"summary":27,"description":4009,"content":4026},{"type":21,"content":4027},[],{"title":4007,"shortTitle":4008,"summary":27,"description":4029,"content":4030},"Solarbear avait besoin d’une présence digitale plus claire pour présenter son offre avec confiance et rendre les informations essentielles faciles à parcourir. L’interface met l’accent sur la lisibilité, la hiérarchie visuelle et une structure responsive adaptée à la découverte comme à la conversion.\n\nLe projet combine UX\u002FUI, intégration web et organisation de contenu pour créer une expérience vitrine soignée.",{"type":21,"content":4031},[],{"slug":4033,"id":4033,"show":55,"title":4034,"shortTitle":4035,"client":4035,"description":4036,"tags":4037,"tools":4038,"link":4039,"isLinkActive":55,"year":3542,"imageDir":4040,"frontImage":4041,"gallery":4042,"content":4049,"sortOrder":4051,"translations":4052},"bpa","BPA Website","BPA","BPA, a major player in bakery and pastry, entrusted us with a large-scale mission: reinvent its image while staying true to its DNA. The goal? Unite its identity, modernize its digital footprint, and assert its B2B positioning. We refined every detail: a complete overhaul of the visual identity, definition of brand codes, UX design, and development of an immersive website.\n\nA digital experience designed to be fluid, intuitive, and immersive. The site’s ergonomics were rethought to simplify navigation and maximize content impact. Every visual and functional element was calibrated to showcase BPA’s universe and make key information easy to access.\n\nA high-performance, modern, and engaging website. Built to deliver a smooth experience across all devices, the new BPA site is far more than a showcase: it’s a tool that asserts its leadership and strengthens connections with its audiences.",[3483,14,12,11,61],[63,3485,3483],"https:\u002F\u002Fbpa.fr\u002F","\u002Fprojects\u002Fbpa","\u002Fmockup.jpg",[4043,4044,4045,4046,4047,4048],"\u002F01.png","\u002Fuse-case-bpa_Plan-de-travail-1-copie-3-1.png","\u002Fuse-case_Plan-de-travail-1-copie-1.png","\u002Fuse-case_Plan-de-travail-1-copie-2.png","\u002Fuse-case_Plan-de-travail-1-copie-5.png","\u002Fuse-case_Plan-de-travail-1.png",{"type":21,"content":4050},[],17,{"en":4053,"fr":4056},{"title":4034,"shortTitle":4035,"summary":27,"description":4036,"content":4054},{"type":21,"content":4055},[],{"title":4034,"shortTitle":4035,"summary":27,"description":4057,"content":4058},"BPA, acteur majeur de la boulangerie-pâtisserie, avait besoin de moderniser son image tout en restant fidèle à son ADN. L’objectif : unifier son identité, renforcer son empreinte digitale et affirmer son positionnement B2B.\n\nL’expérience digitale a été pensée pour être fluide, intuitive et immersive. L’ergonomie du site a été retravaillée pour simplifier la navigation et maximiser l’impact des contenus.\n\nLe résultat est un site moderne, performant et engageant, pensé pour fonctionner sur tous les écrans et soutenir la crédibilité de la marque.",{"type":21,"content":4059},[],{"slug":4061,"id":4061,"show":7,"title":4061,"shortTitle":4061,"client":17,"description":17,"tags":4062,"tools":4063,"link":4064,"isLinkActive":55,"year":3542,"imageDir":17,"frontImage":17,"gallery":4065,"content":27,"sortOrder":4066,"translations":4067},"random-wheel-spin",[],[],"https:\u002F\u002Frandom-wheel-topaz.vercel.app\u002F",[],18,{"en":4068,"fr":4071},{"title":27,"shortTitle":27,"summary":27,"description":27,"content":4069},{"type":21,"content":4070},[],{"title":27,"shortTitle":27,"summary":27,"description":27,"content":4072},{"type":21,"content":4073},[],{"slug":4075,"id":4075,"show":55,"title":4076,"shortTitle":4077,"client":4078,"description":4079,"tags":4080,"tools":4081,"link":4082,"isLinkActive":7,"year":3542,"imageDir":4083,"frontImage":4084,"gallery":4085,"content":4092,"sortOrder":4094,"translations":4095},"appi","APPI Website","APPI","Appi Interim","APPI Intérim, a specialist in recruitment for aerospace, industry, and logistics, needed a more ergonomic and effective website to streamline connections between candidates and companies. We redesigned the digital experience by rethinking the UX\u002FUI and developing a high-performance WordPress site aligned with the demands of modern recruitment.\n\nWe structured the site to offer smooth, intuitive navigation. The goal: enable candidates to quickly find relevant job offers and recruiters to easily access key information. A redesign focused on user experience, readability, and simplicity of interaction.\n\nA site built to be fast, secure, and SEO-optimized, ensuring better visibility in search engines and a seamless experience across all devices. A tailor-made platform adapted to the needs of APPI Intérim and its ecosystem.\n\nWith a modernized design and improved user experience, the site becomes a true tool serving recruitment, strengthening APPI Intérim’s employer brand.",[14,61,3483,12,11],[3483,3485,63],"https:\u002F\u002Fappi-interim.fr\u002F","\u002Fprojects\u002Fappi","\u002FAPPI-use-case_04.png",[4086,4087,4088,4089,4090,4091],"\u002FAPPI-use-case-01.png","\u002FAPPI-use-case_02.png","\u002FAPPI-use-case_03-1.png","\u002FAPPI-use-case_05.png","\u002FAPPI-use-case_06.png","\u002FAPPI-use-case_07.png",{"type":21,"content":4093},[],19,{"en":4096,"fr":4099},{"title":4076,"shortTitle":4077,"summary":27,"description":4079,"content":4097},{"type":21,"content":4098},[],{"title":4076,"shortTitle":4077,"summary":27,"description":4100,"content":4101},"APPI Intérim, spécialiste du recrutement pour l’aéronautique, l’industrie et la logistique, avait besoin d’un site plus ergonomique pour faciliter la mise en relation entre candidats et entreprises.\n\nL’expérience digitale a été repensée autour d’une navigation simple, lisible et efficace : accès rapide aux offres, informations clés pour les recruteurs et parcours plus fluide.\n\nLe site a été construit pour être rapide, sécurisé et optimisé SEO, avec une plateforme adaptée aux besoins d’APPI Intérim et de son écosystème.",{"type":21,"content":4102},[],[4104,4112,4118,4125,4131,4137,4142,4147,4152,4157,4162,4166,4172,4178,4184,4188,4193,4199,4204],{"id":4105,"name":4105,"needTranslation":7,"sortOrder":4106,"usageCount":4106,"translations":4107},"perso",0,{"en":4108,"fr":4110},{"label":4109},"Personal",{"label":4111},"Personnel",{"id":14,"name":14,"needTranslation":7,"sortOrder":23,"usageCount":4106,"translations":4113},{"en":4114,"fr":4116},{"label":4115},"Professional",{"label":4117},"Professionnel",{"id":4119,"name":4119,"needTranslation":7,"sortOrder":43,"usageCount":4106,"translations":4120},"school",{"en":4121,"fr":4123},{"label":4122},"School",{"label":4124},"École",{"id":811,"name":811,"needTranslation":7,"sortOrder":80,"usageCount":4106,"translations":4126},{"en":4127,"fr":4129},{"label":4128},"Web Design",{"label":4130},"Web design",{"id":11,"name":11,"needTranslation":7,"sortOrder":818,"usageCount":4106,"translations":4132},{"en":4133,"fr":4135},{"label":4134},"Website Development",{"label":4136},"Développement web",{"id":3483,"name":3483,"needTranslation":7,"sortOrder":1212,"usageCount":4106,"translations":4138},{"en":4139,"fr":4141},{"label":4140},"Elementor Pro",{"label":4140},{"id":12,"name":12,"needTranslation":7,"sortOrder":2090,"usageCount":4106,"translations":4143},{"en":4144,"fr":4146},{"label":4145},"Wordpress",{"label":4145},{"id":61,"name":61,"needTranslation":7,"sortOrder":2421,"usageCount":4106,"translations":4148},{"en":4149,"fr":4151},{"label":4150},"Php",{"label":4150},{"id":810,"name":810,"needTranslation":7,"sortOrder":2808,"usageCount":4106,"translations":4153},{"en":4154,"fr":4156},{"label":4155},"Vue",{"label":4155},{"id":1904,"name":1904,"needTranslation":7,"sortOrder":3468,"usageCount":4106,"translations":4158},{"en":4159,"fr":4161},{"label":4160},"React",{"label":4160},{"id":15,"name":15,"needTranslation":7,"sortOrder":3497,"usageCount":4106,"translations":4163},{"en":4164,"fr":4165},{"label":2711},{"label":2711},{"id":4167,"name":4167,"needTranslation":7,"sortOrder":3512,"usageCount":4106,"translations":4168},"ux-ui",{"en":4169,"fr":4171},{"label":4170},"UX\u002FUI Design",{"label":4170},{"id":4173,"name":4173,"needTranslation":7,"sortOrder":3525,"usageCount":4106,"translations":4174},"framer-motion",{"en":4175,"fr":4177},{"label":4176},"Framer Motion",{"label":4176},{"id":4179,"name":4179,"needTranslation":7,"sortOrder":3569,"usageCount":4106,"translations":4180},"gsap",{"en":4181,"fr":4183},{"label":4182},"GSAP",{"label":4182},{"id":834,"name":834,"needTranslation":7,"sortOrder":3743,"usageCount":4106,"translations":4185},{"en":4186,"fr":4187},{"label":1106},{"label":1106},{"id":13,"name":13,"needTranslation":7,"sortOrder":3996,"usageCount":4106,"translations":4189},{"en":4190,"fr":4192},{"label":4191},"Spectra",{"label":4191},{"id":4194,"name":4194,"needTranslation":7,"sortOrder":4023,"usageCount":4106,"translations":4195},"strapi",{"en":4196,"fr":4198},{"label":4197},"Strapi",{"label":4197},{"id":1903,"name":1903,"needTranslation":7,"sortOrder":4051,"usageCount":4106,"translations":4200},{"en":4201,"fr":4203},{"label":4202},"Tailwindcss",{"label":4202},{"id":4205,"name":4205,"needTranslation":7,"sortOrder":4094,"usageCount":4106,"translations":4206},"lenis",{"en":4207,"fr":4209},{"label":4208},"Lenis",{"label":4208},[4211,4216,4221,4226,4231,4236,4242],{"id":64,"name":64,"icon":64,"sortOrder":4106,"usageCount":4106,"translations":4212},{"en":4213,"fr":4215},{"label":4214},"PhpStorm",{"label":4214},{"id":813,"name":813,"icon":813,"sortOrder":23,"usageCount":4106,"translations":4217},{"en":4218,"fr":4220},{"label":4219},"Affinity",{"label":4219},{"id":3483,"name":3483,"icon":3483,"sortOrder":43,"usageCount":4106,"translations":4222},{"en":4223,"fr":4225},{"label":4224},"Elementor",{"label":4224},{"id":3485,"name":3485,"icon":3485,"sortOrder":80,"usageCount":4106,"translations":4227},{"en":4228,"fr":4230},{"label":4229},"Visual Studio Code",{"label":4229},{"id":63,"name":63,"icon":63,"sortOrder":818,"usageCount":4106,"translations":4232},{"en":4233,"fr":4235},{"label":4234},"Figma",{"label":4234},{"id":4237,"name":4237,"icon":4237,"sortOrder":1212,"usageCount":4106,"translations":4238},"claude",{"en":4239,"fr":4241},{"label":4240},"Claude Code",{"label":4240},{"id":4243,"name":4243,"icon":4243,"sortOrder":2090,"usageCount":4106,"translations":4244},"codex",{"en":4245,"fr":4247},{"label":4246},"Codex",{"label":4246},1782894609492]