[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"seo-sitemap":3,"sitemap-works":12},{"id":4,"title":5,"description":6,"extension":7,"image":8,"key":9,"meta":10,"stem":9,"__hash__":11},"seo_fr\u002Fsitemap.json","Plan du site","L'index complet de Studio9P : les pages du studio et l'ensemble de nos projets web, du plus récent au plus ancien.","json",null,"sitemap",{},"K1MFozQ4kigNLhlYqmoUieHdPqOsIBsUXKfdpZBphRY",[13,71,112,152,196,239,276,398,436,475,513,554,590,625,665,707,745,785,821,894,936,974,1022,1053],{"id":14,"title":15,"body":8,"description":16,"extension":7,"meta":17,"navigation":64,"path":65,"seo":66,"slug":69,"stem":69,"__hash__":70},"content_fr\u002Fun-beau-jour.json","Un Beau Jour","ce site incontournable du mariage a fait peau neuve avec un rebranding signé Studio Rime et une nouvelle plateforme entièrement repensée par 9P. passage de wordpress à Webflow, design exigeant et plus actuel, l’avant \u002F après est saisissant ! Longue vie à Ubj 2.0 !",{"modules":18,"preview":53,"layout":54,"thumbnail":55,"date":56,"url":57,"cover":58,"tags":59,"year":63},[19,24,33,42,47,50],{"type":20,"style":21,"format":22,"video":23},"video_module","contain","landscape","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1790777813\u002Fportfolio\u002Fun-beau-jour\u002Fvideo.mp4",{"type":25,"item":26},"carousel_module",[27,29,31],{"image":28},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790777683\u002Fportfolio\u002Fun-beau-jour\u002Fmobile_1.webp",{"image":30},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790777682\u002Fportfolio\u002Fun-beau-jour\u002Fmobile_2.webp",{"image":32},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790777687\u002Fportfolio\u002Fun-beau-jour\u002Fmobile_3.webp",{"type":34,"item":35},"image_group_module",[36,38,40],{"image":37},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790777681\u002Fportfolio\u002Fun-beau-jour\u002Fimage_1.webp",{"image":39},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790777686\u002Fportfolio\u002Fun-beau-jour\u002Fimage_2.webp",{"image":41},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790777680\u002Fportfolio\u002Fun-beau-jour\u002Fimage_3.webp",{"type":43,"style":44,"title":45,"text":46},"text_module","fullsize","L’ancien site d’Un Beau Jour","",{"type":48,"style":21,"image":49},"image_module","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790777684\u002Fportfolio\u002Fun-beau-jour\u002Fimage_old.webp",{"type":48,"style":51,"image":52},"cover","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790777680\u002Fportfolio\u002Fun-beau-jour\u002Ffull_width.webp","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790777821\u002Fportfolio\u002Fun-beau-jour\u002Fpreview.webp","work","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1790777689\u002Fportfolio\u002Fun-beau-jour\u002Fthumbnail.mp4","2026-09-07T16:15:00.000+02:00","https:\u002F\u002Fwww.unbeaujour.fr\u002F","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790777685\u002Fportfolio\u002Fun-beau-jour\u002Fcover.webp",[60,61,62],"design system","design & integration","transition de wordpress à webflow","2026",true,"\u002Fun-beau-jour",{"title":67,"description":68},"Refonte du site Un Beau Jour","Transformation digitale d’Un Beau Jour : un design system moderne et une migration de WordPress vers Webflow pour ce site de mariage.","un-beau-jour","KlCNcrjTrXXT2jeu0BNu6Mw74g-msA1mCCz1tw9J-GA",{"id":72,"title":73,"body":8,"description":74,"extension":7,"meta":75,"navigation":64,"path":105,"seo":106,"slug":109,"stem":110,"__hash__":111},"content_fr\u002Fcaractère-bois.json","Caractère Bois","L’atelier de menuiserie bordelais a musclé sa communication avec un rebranding signé Studio Ouam et un nouveau site par nos soins sous Webflow.",{"modules":76,"preview":95,"layout":54,"thumbnail":96,"date":97,"url":98,"cover":99,"tags":100,"year":104},[77,79,87,93],{"type":20,"style":21,"format":22,"video":78},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1790774042\u002Fportfolio\u002Fcaract%C3%A8re-bois\u002Fvideo.mp4",{"type":25,"item":80},[81,83,85],{"image":82},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790774039\u002Fportfolio\u002Fcaract%C3%A8re-bois\u002Fmobile_1.webp",{"image":84},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790774039\u002Fportfolio\u002Fcaract%C3%A8re-bois\u002Fmobile_2.webp",{"image":86},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790774038\u002Fportfolio\u002Fcaract%C3%A8re-bois\u002Fmobile_3.webp",{"type":34,"item":88},[89,91],{"image":90},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790774038\u002Fportfolio\u002Fcaract%C3%A8re-bois\u002Fimage_1.webp",{"image":92},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790774038\u002Fportfolio\u002Fcaract%C3%A8re-bois\u002Fimage2.webp",{"type":48,"style":51,"image":94},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790774039\u002Fportfolio\u002Fcaract%C3%A8re-bois\u002Ffull_width.webp","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790775678\u002Fportfolio\u002Fcaract%C3%A8re-bois\u002Fpreview.webp","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1790774039\u002Fportfolio\u002Fcaract%C3%A8re-bois\u002Fthumbnail.mp4","2025-11-10T15:14:00.000+01:00","https:\u002F\u002Fwww.caractere-bois.fr\u002F","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790774039\u002Fportfolio\u002Fcaract%C3%A8re-bois\u002Fcover.webp",[101,102,103],"Digital branding","UX design","Webflow","2025","\u002Fcaractere-bois",{"title":107,"description":108},"Caractère Bois : branding et site Webflow","Refonte du site de l’atelier de menuiserie Caractère Bois, un projet mêlant UX design et Webflow pour moderniser son image digitale.","caractere-bois","caractère-bois","06RLqFnomvPpKNbuxtS3T_3xMwL56e5K97PySdXRw0k",{"id":113,"title":114,"body":8,"description":115,"extension":7,"meta":116,"navigation":64,"path":146,"seo":147,"slug":150,"stem":150,"__hash__":151},"content_fr\u002Fvap.json","VAP","La très dynamique boite de prod spécialiste des contenus sociaux  a fait appel à nos amis de studio Ouam pour son branding, nous avons saisi la balle au bond pour produire ce site portfolio directement décliné de leur univers graphique, coloré et survolté !",{"modules":117,"preview":136,"layout":54,"thumbnail":137,"date":138,"url":139,"cover":140,"tags":141,"year":104},[118,120,128,134],{"type":20,"style":21,"format":22,"video":119},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1790773476\u002Fportfolio\u002Fvap\u002Fvideo.mp4",{"type":25,"item":121},[122,124,126],{"image":123},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790773019\u002Fportfolio\u002Fvap\u002Fmobile_1.webp",{"image":125},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790773020\u002Fportfolio\u002Fvap\u002Fmobile_2.webp",{"image":127},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790773017\u002Fportfolio\u002Fvap\u002Fmobile_3.webp",{"type":34,"item":129},[130,132],{"image":131},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790773016\u002Fportfolio\u002Fvap\u002Fimage_1.webp",{"image":133},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790773017\u002Fportfolio\u002Fvap\u002Fimage_2.webp",{"type":48,"style":51,"image":135},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790773018\u002Fportfolio\u002Fvap\u002Ffull_width.webp","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790775691\u002Fportfolio\u002Fvap\u002Fpreview.webp","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1790773113\u002Fportfolio\u002Fvap\u002Fthumbnail.mp4","2025-10-30T18:02:00.000+01:00","https:\u002F\u002Fwww.wearevap.com\u002F","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790773371\u002Fportfolio\u002Fvap\u002Fcover.webp",[142,143,144,145],"digital branding","motion design","3D design","webflow","\u002Fvap",{"title":148,"description":149},"VAP : site portfolio et design digital","VAP, la boîte de prod spécialiste des contenus sociaux, décline son univers coloré en portfolio sous Webflow avec motion et 3D.","vap","hrclI4Y-8IPfrCij6Ll39XUJFr0TWxPwVfGt0ByL7Zw",{"id":153,"title":154,"body":8,"description":155,"extension":7,"meta":156,"navigation":64,"path":190,"seo":191,"slug":194,"stem":194,"__hash__":195},"content_fr\u002Fcosmo-av.json","Cosmo AV","Spécialisé dans le vidéo mapping, Cosmo AV souhaitait faire une refonte de leur site Wordpress pour le moderniser afin de mieux refléter leur expertise tout en étant autonome sur la création de nouveaux contenus. Nous avons opté pour Webflow, qui permet une édition rapide des contenus, sans se priver de belles animations.",{"modules":157,"preview":180,"layout":181,"thumbnail":182,"date":183,"url":184,"cover_video":159,"cover":185,"tags":186,"year":189},[158,160,169,174,176,178],{"type":20,"style":21,"format":22,"video":159},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1757336983\u002Fcosmoav_screencast.mp4",{"type":25,"item":161,"style":168},[162,164,166],{"image":163},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1757409006\u002FArtex__01.webp",{"image":165},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1757344642\u002Fcosmo_loop_mobile.mp4",{"image":167},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1757409006\u002FArtex__03.webp","flex",{"type":170,"gradient":171,"inverse":172,"image":173},"token_module",0.2,false,"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1753445845\u002Fmini_cosmo.webp",{"type":48,"style":21,"image":175},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1753445848\u002Fshow_cosmo.webp",{"type":48,"style":21,"image":177},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1753445844\u002Fabout__cosmo.webp",{"type":48,"style":51,"image":179},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1753707192\u002Fend_cosmo.webp","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1764154599\u002Fwww.cosmoav.com__iPhone_SE.png","case_study","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1757413328\u002Fcosmo_loop_desktop.mp4","2025-07-25T12:13:59.329Z","https:\u002F\u002Fwww.cosmoav.com\u002F","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1753707192\u002Fhero_cosmo.webp",[102,187,188,103],"Development","WebGL","2024","\u002Fcosmo-av",{"title":192,"description":193},"Refonte du site de Cosmo AV","Moderniser le site de Cosmo AV avec Webflow et WebGL pour sublimer son expertise du vidéo mapping dans des animations fluides.","cosmo-av","rV1gzjnXSWAmw5gqEyq5ZOsrQV4cA5y2lXyovqZ9lfA",{"id":197,"title":198,"body":8,"description":199,"extension":7,"meta":200,"navigation":64,"path":233,"seo":234,"slug":237,"stem":237,"__hash__":238},"content_fr\u002Fletsignit.json","Letsignit","Letsignit est une solution en mode SaaS conçue pour aider les entreprises à uniformiser leurs signatures e-mails, transformer ces signatures en points de contact marketing et assurer une gestion centralisée et sécurisée à l’échelle de l’organisation.",{"modules":201,"preview":224,"layout":181,"thumbnail":225,"date":226,"url":227,"cover_video":203,"cover":228,"tags":229,"year":189},[202,204,206,210,218,220,222],{"type":20,"style":21,"format":22,"video":203},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1757336983\u002Flsi_screencast.mp4",{"type":170,"gradient":171,"inverse":172,"image":205},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1753445454\u002Fmini.webp",{"type":43,"style":207,"title":208,"text":209},"content_right","Un site entièrement administrable avec Webflow","Le service marketing de Letsignit avait un pré-requis très important : la liberté éditoriale sur le site. Nous leur avons donc proposé de tout baser sur Webflow, qui permet d’éditer très facilement (et sans connaissances techniques) les pages existantes et surtout d’en créer de nouvelles : landing pages de transformation, pages produits etc.\n\nNous avons créer le design system à partir de leur branding, puis des modules réutilisables sur l’ensemble de leur pages.",{"type":25,"style":168,"item":211},[212,214,216],{"image":213},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1757409207\u002FLsi_01.webp",{"image":215},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1757345027\u002Flets_loop_mobile.mp4",{"image":217},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1757409207\u002FLsi_02.webp",{"type":48,"style":21,"image":219},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1753445453\u002Fblog_lsi.webp",{"type":48,"style":21,"image":221},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1753445453\u002Fmail_lsi.webp",{"type":48,"style":51,"image":223},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1753445453\u002Fend_lsi.webp","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1764154235\u002Fletsignit.com_fr_iPhone_SE.png","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1757413423\u002Flets_loop_desktop.mp4","2025-07-25T12:06:49.577Z","https:\u002F\u002Fletsignit.com\u002F","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1753707192\u002Flsi_hero.webp",[230,231,102,187,103,232],"Concept","Rebranding","Monitoring","\u002Fletsignit",{"title":235,"description":236},"Refonte web et rebranding de Letsignit","Accompagnement de Letsignit sur son rebranding et la création d’un site Webflow flexible au service de sa stratégie marketing.","letsignit","Od8rlCxn52i952PyJ2MtGWqcXGEvYR1AlybBnjA9RvA",{"id":240,"title":241,"body":8,"description":242,"extension":7,"meta":243,"navigation":64,"path":270,"seo":271,"slug":274,"stem":274,"__hash__":275},"content_fr\u002Fleonard-oliviero.json","Léonard Oliviéro","Le talentueux photographe qui signe les prods de Girard Perregaux ou encore Jean Michel Frank a un nouveau portfolio désigné par Hugo Maury et développé par 9P.",{"modules":244,"preview":261,"layout":181,"thumbnail":262,"date":263,"url":264,"cover_video":246,"cover":265,"tags":266,"year":189},[245,247,255,257,259],{"type":20,"style":21,"format":22,"video":246},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1757336983\u002Fscreen_cast_leonard.mp4",{"type":25,"style":168,"item":248},[249,251,253],{"image":250},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1753439041\u002Fmobile_01_leonard.webp",{"image":252},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1757343306\u002Fleonard_loop_mobile.mp4",{"image":254},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1753439041\u002Fmobile_02_leonard.webp",{"type":48,"style":21,"image":256},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1753439041\u002Facier_leonard.webp",{"type":48,"style":21,"image":258},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1753439042\u002Fmontre_leonard.webp",{"type":48,"style":51,"image":260},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1753439041\u002Flast_leonard.webp","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1764154102\u002Fleonardoliviero.com__iPhone_SE.png","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1790776523\u002Fportfolio\u002Fleonard-olivi%C3%A9ro\u002Fthumbnail.mp4","2025-07-25T10:19:44.419Z","https:\u002F\u002Fleonardoliviero.com\u002F","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1753707191\u002Fhero_leo.webp",[267,268,269],"Minimal design","Portfolio","Micro-interaction","\u002Fleonard-oliviero",{"title":272,"description":273},"Portfolio de Léonard Oliviéro","Le photographe Léonard Oliviéro dévoile un portfolio au design minimaliste, où les micro-interactions mettent ses images en valeur.","leonard-oliviero","ta9seeZZMxzfnBpIaYQOuuEbRMUI8cdchaqz8Rc3e_Q",{"id":277,"title":278,"body":8,"description":279,"extension":7,"meta":280,"navigation":64,"path":392,"seo":393,"slug":396,"stem":396,"__hash__":397},"content_fr\u002Fyame.json","Yamê","Yamê est un artiste complet, qui a développé autour de sa musique un univers riche, empreint des racines camerounaises de sa famille. Pour son l’album Ebêm, il a imaginé un dispositif complet avec un court métrage (produit par le studio Mathematics) racontant le concept global, et un site expérience permettant de naviguer librement dans ce lore, et d’y découvrir des pépites, des contenus inédits, mais aussi les jalons qui ont fait son succès, comme la vidéo COLORS avec ses 100 millions de vues.",{"modules":281,"preview":382,"layout":181,"thumbnail":383,"date":384,"url":385,"cover_video":283,"cover":386,"tags":387,"year":104},[282,284,286,294,296,298,301,308,310,313,315,319,325,328,334,337,340,342,345,347,350,356,358,360,363,366,372,374,380],{"type":20,"style":21,"format":22,"video":283},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1753352371\u002Fmola_screen_cast.mp4",{"type":170,"gradient":171,"inverse":172,"image":285},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1753438354\u002F%EF%B8%8F.png",{"type":25,"item":287,"style":168},[288,290,292],{"image":289},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1753438299\u002Fmobile_01_yame.webp",{"image":291},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1758789017\u002Fyame_mobile.mp4",{"image":293},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1753438299\u002Fmobile_02_yame.webp",{"type":43,"style":207,"text":295},"Yamê est venu à nous avec le concept général, celui d’un plateau rotatif sur lequel son avatar à “bécane” se promène à moto. Ici c’est le décor qui défile, à la manière du site [www.joshuas.world](http:\u002F\u002Fwww.joshuas.world). Les paysages sont variés, à l’image des changements d’univers dans le court-métrage : le désert, la forêt, le palais etc. Nous nous sommes coordonnés avec Mathematics, qui avait déjà avancé sur les planches créatives du film avec Yamê, afin de coordonner nos décors avec les leurs.",{"type":48,"style":51,"image":297},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1753438299\u002Fforest_yame.webp",{"type":43,"style":207,"text":299,"title":300},"Conçu comme un espace évolutif, le site propose régulièrement de nouveaux contenus, et voit son décor évoluer en fonction. Le site poursuit plusieurs missions complémentaires. Il propose d’abord une variété de contenus dédiés à l’album Ebem.\n\n\\\nIl offre également un espace sécurisé, accessible uniquement aux détenteurs de la clé collector. Par ailleurs, il invite les utilisateurs à embarquer sur la bécane de Yamê à travers un mini-jeu interactif. Enfin, il réserve quelques surprises supplémentaires grâce à des easter eggs dissimulés dans le décor.","Coordination des contenus, design 2D et features",{"type":302,"item":303},"double_image_module",[304,306],{"image":305},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1758729940\u002Fux.webp",{"image":307},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1758729939\u002Fkey.webp",{"type":48,"style":51,"image":309,"caption":46},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1758729940\u002Fpalace.webp",{"type":43,"style":207,"title":311,"text":312},"Design 3D et texturing","Tous les décors ont été conçus sur Blender par le studio. Les planches d’inspiration du film de Mathematics ont servi de base, puis [Hugo Maury](https:\u002F\u002Fmaury.io) (designer senior) a produit des planches pour chaque univers, ainsi que les objets qui les composent. \n\n\\\nCes éléments (décors posés sur le plateau, et objets du décor) ont ensuite été designés en 3D par Thomas (designer junior), puis texturés par Hugo et Thomas.",{"type":48,"style":21,"image":314},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1758729938\u002FAsset_Manager.webp",{"type":43,"style":316,"title":317,"text":318},"small_title","De la modélisation 3D à l’intégration dans la scène ","Dans ce projet, l’ensemble de la chaîne 3D s’est articulé autour de trois pôles indissociables : la modélisation des objets, leur texturing, puis leur intégration au sein d’une scène unique. L’objectif était d’instaurer un processus fluide, permettant à chaque collaborateur de travailler en parallèle sur ses propres assets et de pouvoir intégrer ses modifications sans craindre de conflit sur les fichiers de travail et ainsi itérer plus rapidement.",{"type":302,"item":320},[321,323],{"image":322},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1758729940\u002FWeight_painting.webp",{"image":324},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1758729938\u002Fasset_drive.webp",{"type":43,"style":316,"title":326,"text":327},"Composition de la scène et instances","La scène principale, elle aussi versionnée de manière isolée, ne contient qu’un unique design spécifique : la forme organique du sol. Les gros volumes (bâtiments, structures, mobiliers volumineux) sont importés depuis l’Asset Manager, positionnés manuellement puis regroupés par type sous des empties (objet null). Chaque groupe partage la même géométrie, ce qui permet d’exporter ces objets sous formes d’instances. \n\n\\\nPour peupler la scène de petits assets (cailloux, plantes, accessoires), nous utilisons un autre procédé : on duplique la surface du sol autant de fois qu’il existe d’assets, et chaque copie devient l’entrée d’un Geometry Node. Avec un opérateur Mesh Boolean, on supprime les endroits du sol où l’on ne souhaite n’avoir aucune instance, puis à l’aide d’une texture de weight-paint, on dessine les zones exactes d’apparition des instances. Le Geometry Node lit ces données de densité et distribue sur la surface du sol.",{"type":302,"item":329},[330,332],{"image":331},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1758729938\u002Fasset_browser_palace.webp",{"image":333},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1758729939\u002Fnode.webp",{"type":43,"style":316,"title":335,"text":336},"Cycle de mise à jour","Dès qu’un asset évolue (forme, UV, textures), le designer réalise sa modélisation dans son fichier dédié et update sa version sur le drive. Dans la scène principale, un simple « Link Object Data » suffit pour rapatrier la nouvelle géométrie et les nouvelles ressources, sans impacter le reste de la composition ni générer de conflits de version.",{"type":43,"style":316,"title":338,"text":339},"Export final et optimisation","Pour l’export, nous sélectionnons le format GLB en gardant l’option « Geometry Node Instance ». En post-processing, gltf-pipeline intervient pour:\n\n* compresser la géométrie en DRACO\n* convertir les textures en KTX2\n\n\\\nLe résultat pèse moins de 7 Mo, garantissant un chargement rapide et une exécution fluide en WebGL.",{"type":48,"style":51,"image":341},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1758729940\u002Ftimeline_dev.webp",{"type":43,"style":207,"title":343,"text":344},"Développement","La direction artistique repose sur un style graphique proche du comic\u002Fcartoon. Pour reproduire ce style, on combine généralement plusieurs techniques. \n\n\\\nLe seuillage des ombres permet de simplifier les zones sombres, tandis que le tracé des contours met en évidence les formes principales. Enfin, l’ajout d’effets de textures vient enrichir l’ensemble et lui donner plus de profondeur.",{"type":48,"style":21,"image":346},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1758729939\u002Fhead_yame.webp",{"type":43,"style":316,"title":348,"text":349},"Seuillage des ombres","Le seuillage des ombres est assez simple : THREE.js le gère automatiquement avec le matériau MeshToonMaterial.Le principe consiste à échantillonner l’ombrage – c’est-à-dire les variations de luminosité quand la lumière frappe une surface sous différents angles – puis à regrouper toutes ces nuances en quelques couleurs (généralement 3 à 5).",{"type":302,"item":351},[352,354],{"image":353},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1758729945\u002Fyame_moto_profil.webp",{"image":355},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1758729940\u002Fwebgl_demo.webp",{"type":43,"style":207,"text":357},"Ce shader avait un inconvénient : on ne pouvait pas définir séparément les couleurs des zones éclairées et ombragées.\n\n\\\nPar défaut, THREE.js utilise deux composantes :\n\n* « color » (ou albedo) : la couleur diffusée par la lumière\n* « emissive » : la couleur que le matériau émet de lui-même\n\nCes deux couleurs sont simplement additionnées au rendu.\n\n\\\nNous avons donc modifié le shader pour :\n\n1. fixer des seuils d’irradiance\n2. interpoler librement les couleurs intermédiaires selon l’éclairement\n\n\\\nRésultat : à gauche, le rendu initial où toutes les textures partagent les mêmes tons ; à droite, le rendu modifié, qui permet de décaler manuellement la teinte en fonction de l’exposition à la lumière.",{"type":48,"style":21,"image":359},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1758729938\u002Fbig_rock.webp",{"type":43,"style":316,"title":361,"text":362},"Le tracé des contours","Cet étape est essentielle dans un rendu toon, les contours rappellent les rendus comics mais permettent aussi de distinguer mieux les volumes qui à cause des aplats de couleurs ont tendance à devenir moins visible. Pour définir ces contours on combine deux techniques : \\\nUn texturing graphique appliqué directement dans les textures et permettant de donner les reliefs et aspérité à l’intérieur de chaque volume propre. Un postprocessing de contours permettant de distinguer les volumes entre eux. \n\nPour ce dernier point, on utilise un algorithme de détection des contours (type sobel). Cet algorithme est basé sur une matrice de convolution qui va accentuer les différences aux abords d’un pixels. Pour chaque pixel d’une image on vient regarder ses voisins immédiats et plus leur différence est marquée, plus le pixel résultant sera intense, ce filtre agit comme un révélateur de contraste. En appliquant et combinant cette technique sur des rendus particuliers comme une texture de normale (voir image de gauche) ou une texture de profondeur (image central) on arrive à faire ressortir les contours de certains objets.",{"type":48,"style":21,"image":364,"caption":365},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1758729940\u002Fwiki.webp","Image Source : \u003Chttps:\u002F\u002Fen.wikipedia.org\u002Fwiki\u002FCel_shading>",{"type":302,"item":367},[368,370],{"image":369},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1758729939\u002Fmontain.webp",{"image":371},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1758729939\u002Fmonatain_01.webp",{"type":43,"style":207,"text":373},"Cette méthode marche généralement bien mais pose quelques problèmes et peut permettre l’apparition d’artefacts indésirables. Il peut arriver que des faces d’objet différents se retrouvent juste les unes derrière les autres (différence de profondeur faible) et orienté de la même manière (direction des faces identiques) pour que les différences ne soient pas assez marquées, dans ces cas le contraste est trop faible et la figure le contour n’apparaît pas. \n\n\\\nPour pallier ce problème nous avons séparé par couleurs unique chaque entité dont nous voulions voir les contours. Un algorithme déterministe distribue régulièrement les couleurs les plus éloignées les unes des autres et chaque objet se voit attribuer une couleur.",{"type":302,"item":375},[376,378],{"image":377},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1758729944\u002Fyame_color.webp",{"image":379},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1758729939\u002Fcontour.webp",{"type":48,"style":51,"image":381},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1758729944\u002Fyame_shop.webp","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1764154124\u002Fmola-zone.com__iPhone_SE.png","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1790776668\u002Fportfolio\u002Fyame\u002Fthumbnail.mp4","2025-07-25T10:05:49.392Z","https:\u002F\u002Fmola-zone.com\u002F","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1759159146\u002FYame_minia.webp",[388,389,390,391],"VUE.JS","UX & UI design","3D Design","Project management","\u002Fyame",{"title":394,"description":395},"Yamê : expérience web immersive 3D","Pour l’album Ebêm, Yamê imagine un site expérientiel : un univers 3D interactif mêlant lore, mini-jeu et contenus exclusifs.","yame","zESqJaJ5cGiT7CshTv9I6uVl6mrkoSkbDtdqLz_aDE8",{"id":399,"title":400,"body":8,"description":401,"extension":7,"meta":402,"navigation":64,"path":430,"seo":431,"slug":434,"stem":434,"__hash__":435},"content_fr\u002Fricky.json","Ricky","Découvrez les coulisses de la réalisation de notre prank lancé en 2025 : la création d’un assistant IA spécialisé dans l’humour ! Ricky a été aussi l’occasion de démontrer nos capacités en design 3D, intégration WebGL au sein de Webflow... et d’une bonne rigolade :)",{"modules":403,"preview":424,"layout":181,"thumbnail":425,"date":426,"url":427,"cover_video":405,"cover":428,"tags":429,"year":189},[404,406,408,416,418,420,422],{"type":20,"style":21,"format":22,"video":405},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1757340227\u002Fricky_desktop.mp4",{"type":170,"gradient":171,"inverse":172,"image":407},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1754641340\u002FSubtract.webp",{"type":25,"style":168,"item":409},[410,412,414],{"image":411},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1754640938\u002Fwww.whoisricky.lol__Iphone_14_15_Pro_1.webp",{"image":413},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1757343004\u002Fricky_loop_mobile.mp4",{"image":415},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1754640938\u002Fwww.whoisricky.lol__Iphone_14_15_Pro_2_1.webp",{"type":48,"style":21,"image":417},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1757409581\u002Fricky_desktop_screen_03.webp",{"type":48,"style":21,"image":419},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1757409580\u002Fricky_desktop_screen_02.webp",{"type":48,"style":21,"image":421},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1757422780\u002Fricky_desktop_screen_01_2.webp",{"type":48,"style":51,"image":423},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1754640938\u002FSlide_16_9_-_18_2x.webp","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1764154077\u002Fwww.whoisricky.lol__iPhone_SE.png","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1757412407\u002Fricky_loop_desktop.mp4","2024-08-08T10:12:00.000+02:00","https:\u002F\u002Fwww.whoisricky.lol\u002F","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1754640938\u002FSlide_16_9_-_17_2x.webp",[389,390,188,103],"\u002Fricky",{"title":432,"description":433},"Ricky : assistant IA et expérience 3D","Retour sur la création de Ricky, un assistant IA humoristique mêlant design 3D et WebGL sous Webflow pour une expérience décalée.","ricky","C64yYXuXtnhEkM5ALw5XE6usnk-5mZKhZaaeqxe1v8E",{"id":437,"title":438,"body":8,"description":439,"extension":7,"meta":440,"navigation":64,"path":469,"seo":470,"slug":473,"stem":473,"__hash__":474},"content_fr\u002Fevaneos.json","Evaneos","Pour accompagner sa campagne \"Winter\", Evaneos a fait appel à nos amis de Rodéo Studio pour le design et nous a confié le développement de son activation digitale. Le résultat est une carte interactive fluide et immersive qui invite les utilisateurs à fuir l'hiver pour mettre le cap sur des îles secrètes.",{"modules":441,"preview":460,"layout":54,"thumbnail":461,"date":462,"url":463,"cover":464,"tags":465,"year":189},[442,444,452,458],{"type":20,"style":21,"format":22,"video":443},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1790771886\u002Fportfolio\u002Fevaneos\u002Fvideo.mp4",{"type":25,"item":445},[446,448,450],{"image":447},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790771632\u002Fportfolio\u002Fevaneos\u002Fmobile_1.webp",{"image":449},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790771632\u002Fportfolio\u002Fevaneos\u002Fmobile_2.webp",{"image":451},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790771634\u002Fportfolio\u002Fevaneos\u002Fmobile_3.webp",{"type":34,"item":453},[454,456],{"image":455},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790771630\u002Fportfolio\u002Fevaneos\u002Fimage_1.webp",{"image":457},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790771630\u002Fportfolio\u002Fevaneos\u002Fimage_2.webp",{"type":48,"style":51,"image":459},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790771631\u002Fportfolio\u002Fevaneos\u002Ffull_width.webp","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790775906\u002Fportfolio\u002Fevaneos\u002Fpreview.webp","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1790771878\u002Fportfolio\u002Fevaneos\u002Fthumbnail.mp4","2024-07-22T14:13:00.000+02:00","https:\u002F\u002Fevaneos-winter-24.netlify.app\u002F","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790771633\u002Fportfolio\u002Fevaneos\u002Fcover.webp",[466,467,468],"Online experience","Vue.JS","Motion design","\u002Fevaneos",{"title":471,"description":472},"Expérience interactive pour Evaneos","L’activation digitale d’Evaneos prend la forme d’une carte interactive et immersive invitant à rejoindre des destinations secrètes l’hiver.","evaneos","ZoZ5jCccyGu0F1coR3YpnfK7OBwHEWJiTmz0j6Ehchw",{"id":476,"title":477,"body":8,"description":478,"extension":7,"meta":479,"navigation":64,"path":507,"seo":508,"slug":511,"stem":511,"__hash__":512},"content_fr\u002Fartex-plored.json","Artex-plored","Accompagner Artex sur la création de son media sur la connaissance des Arts ? Challenge accepted avec ce site sur mesure basé sur le CMS français Prismic.",{"modules":480,"preview":499,"layout":181,"thumbnail":500,"date":501,"url":502,"cover":503,"tags":504,"year":506},[481,483,491,493,495,497],{"type":20,"style":21,"format":22,"video":482},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1757341020\u002Fartex_desktop.mp4",{"type":25,"style":168,"item":484},[485,487,489],{"image":486},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1757409395\u002FArtex_mobile_02.webp",{"image":488},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1757345370\u002Fartex_loop_mobile.mp4",{"image":490},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1757409395\u002FArtex_mobile_01.webp",{"type":48,"style":21,"image":492},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1709562230\u002FArtex_01.jpg",{"type":170,"gradient":171,"inverse":172,"image":494},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1709565270\u002FV.png",{"type":48,"style":21,"image":496},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1709562232\u002FArtex_02.jpg",{"type":48,"style":51,"image":498},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1709562233\u002FArtex_04.jpg","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1764154152\u002Fartexplored.com__iPhone_SE.png","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1757413830\u002Fartex_loop_desktop.mp4","2024-03-04T14:26:32.511Z","https:\u002F\u002Fartexplored.com\u002F","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1709562234\u002FArtex_03.jpg",[467,505,391],"Prismic","2023","\u002Fartex-plored",{"title":509,"description":510},"Artex-plored : média dédié aux arts","Conception d’un site sur mesure pour Artex, un média dédié à la connaissance des arts, développé avec Vue.js et le CMS français Prismic.","artex-plored","JzDsGhyYZQhg_2npx8S9U2gxqkpJfh8iBWvzrLQoo00",{"id":514,"title":515,"body":8,"description":516,"extension":7,"meta":517,"navigation":64,"path":548,"seo":549,"slug":552,"stem":552,"__hash__":553},"content_fr\u002Faccent.json","Accent","L’équipe de Club-Mate France a créé une nouvelle gamme de softs haut de gamme, mêlant recettes classiques et une touche de saveurs bien françaises.\\\nVoici Accent !",{"modules":518,"preview":541,"layout":181,"thumbnail":542,"date":543,"url":544,"cover":545,"tags":546,"year":189},[519,521,525,527,535,537,539],{"type":20,"style":21,"format":22,"video":520},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1757411200\u002Faccent_website.mp4",{"type":43,"style":522,"title":523,"text":524},[44],"PLANTER LE DÉCOR","Pour le premier screen, on a voulu mêler le produit et ses ingrédients emblématiques (clémentine, gentiane, gingembre) dans une belle animation entièrement en WebGL.\\\nPour le design des pages, Emilie Besnard est partie du branding minimaliste pour décliner des principes animés (patterns, dégradés, charte typo...).",{"type":170,"gradient":171,"inverse":172,"image":526},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1709563997\u002FAccent_token.png",{"type":25,"style":168,"item":528},[529,531,533],{"image":530},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1709563857\u002FAccent_01.png",{"image":532},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1757411900\u002Faccent_loop_mobile.mp4",{"image":534},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1709563857\u002FAccent_02.png",{"type":48,"style":21,"image":536},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1709561331\u002FCapture_d_e%CC%81cran_le_2022-02-09_a%CC%80_18.50_1.jpg",{"type":48,"style":21,"image":538},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1709561331\u002FCapture_d_e%CC%81cran_le_2022-02-09_a%CC%80_18.50_3.jpg",{"type":48,"style":51,"image":540},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1709561331\u002FCapture_d_e%CC%81cran_le_2022-02-09_a%CC%80_18.50_4.jpg","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1764154207\u002Faccentboissons.com__iPhone_SE.png","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1757412171\u002Faccent_loop_desktop.mp4","2024-03-04T14:06:53.729Z","https:\u002F\u002Faccentboissons.com\u002F","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1709561074\u002FCapture_d_e%CC%81cran_le_2022-07-27_a%CC%80_10.58_1.jpg",[547,102,144,468,343],"Conception","\u002Faccent",{"title":550,"description":551},"Accent : site vitrine et expérience 3D","Accent, la gamme de boissons de Club-Mate France, prend vie sur un site immersif mêlant design minimaliste, animations WebGL et motion design.","accent","jZn5FMzTzdb3tCtnVHmtjmen5aYEvIj3QptHtRYbFvk",{"id":555,"title":556,"body":8,"description":557,"extension":7,"meta":558,"navigation":64,"path":584,"seo":585,"slug":588,"stem":588,"__hash__":589},"content_fr\u002Fgirard-perregaux.json","Girard-Perregaux","Pour cette landing page de la maison SAINT LAURENT, nous avons travaillé avec le photographe Léonard Oliviero et le designer Hugo Maury. Résultat : tout le monde croit à de la 3D, mais il s’agit de vraies images !",{"modules":559,"preview":574,"layout":54,"thumbnail":575,"date":576,"url":577,"cover_video":578,"cover":579,"tags":580,"year":506},[560,562,570,572],{"type":48,"style":21,"image":561},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790763771\u002Fportfolio\u002Fgirard-perregaux\u002Fhero.webp",{"type":25,"item":563},[564,566,568],{"image":565},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790763305\u002Fportfolio\u002Fgirard-perregaux\u002Fmobile_1.webp",{"image":567},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790763305\u002Fportfolio\u002Fgirard-perregaux\u002Fmobile_2.webp",{"image":569},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790763305\u002Fportfolio\u002Fgirard-perregaux\u002Fmobile_3.webp",{"type":48,"style":21,"image":571},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790769736\u002Fportfolio\u002Fgirard-perregaux\u002Ffull_layout.webp",{"type":48,"style":51,"image":573},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790763307\u002Fportfolio\u002Fgirard-perregaux\u002Ffull_width.webp","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790775754\u002Fportfolio\u002Fgirard-perregaux\u002Fpreview.webp","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1790865193\u002Fportfolio\u002Fgirard-perregaux\u002Fthumbnail.mp4","2023-11-30T18:00:00.000+01:00","https:\u002F\u002Fsaintlaurent-rivedroite-girardperregaux.ysl.com\u002F","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1790763546\u002Fportfolio\u002Fgirard-perregaux\u002Fcover_video.mp4","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1790763307\u002Fportfolio\u002Fgirard-perregaux\u002Fcover.webp",[581,582,467,583],"Photo \u002F video shoot","Digital expertise","Scroll motion","\u002Fgirard-perregaux",{"title":586,"description":587},"Girard-Perregaux et Saint Laurent","Landing page immersive pour Saint Laurent et Girard-Perregaux, mêlant expertise digitale et scroll motion pour un rendu saisissant.","girard-perregaux","a-UiRMU9ceCsrr9_Sc5TUSRePQVJPpJ0qQ60avHr4a8",{"id":591,"title":592,"body":8,"description":593,"extension":7,"meta":594,"navigation":64,"path":619,"seo":620,"slug":623,"stem":623,"__hash__":624},"content_fr\u002Fartefact-3000.json","Artefact 3000","Nous accompagnons régulièrement les agences et studios sur le développement de leurs sites et portfolios. Le projet d’Artefact3000 Studio, basé sur un fil conducteur en WebGL, est un bon exemple du “one page” dynamique et efficace.",{"modules":595,"preview":612,"layout":181,"thumbnail":613,"date":614,"url":615,"cover":616,"tags":617,"year":506},[596,598,606,608,610],{"type":20,"style":21,"format":22,"video":597},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1757414356\u002Fartefact_desktop.mp4",{"type":25,"item":599,"style":168},[600,602,604],{"image":601},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1757414890\u002Fstudio.artefact3000.com__Iphone_14_15_Pro_1.webp",{"image":603},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1757414919\u002Fartefact_loop_mobile.mp4",{"image":605},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1757414890\u002Fstudio.artefact3000.com__Iphone_14_15_Pro.webp",{"type":48,"style":21,"image":607},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1683128784\u002Fstudio-9p\u002Fuploads\u002FArte01.jpg",{"type":48,"style":21,"image":609},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1683128784\u002Fstudio-9p\u002Fuploads\u002FArte02.jpg",{"type":48,"style":51,"image":611},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1683128784\u002Fstudio-9p\u002Fuploads\u002FArte04.jpg","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1764154179\u002Fstudio.artefact3000.com_en__iPhone_SE.png","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1757414525\u002Fartefact_loop_desktop.mp4","2023-05-03T15:33:07.397Z","https:\u002F\u002Fstudio.artefact3000.com\u002F","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1683128784\u002Fstudio-9p\u002Fuploads\u002FArte03.jpg",[467,618,391],"WebGL \u002F Three.JS","\u002Fartefact-3000",{"title":621,"description":622},"Artefact 3000 : site one page en WebGL","Le portfolio d’Artefact 3000 Studio repose sur un fil conducteur WebGL pour livrer une expérience web immersive développée avec Three.js.","artefact-3000","tQTxT8upWh8IdsOyrI-7Hjok0I32xc4moNwCyDdrkp0",{"id":626,"title":627,"body":8,"description":628,"extension":7,"meta":629,"navigation":64,"path":659,"seo":660,"slug":663,"stem":663,"__hash__":664},"content_fr\u002Fstid-security.json","STID security","Véritable opération commando, cette landing page a été produite en 4 semaines pour permettre à STID Security de communiquer sur un salon à Las Vegas. Conçue exclusivement pour le marché US, cette mini-home est l’exemple type d’une solution d’urgence pour pallier l’absence d’un site complet pendant une refonte.",{"modules":630,"preview":652,"layout":181,"thumbnail":653,"date":654,"url":655,"cover":656,"tags":657,"year":189},[631,633,638,640,642,650],{"type":20,"style":21,"format":22,"video":632},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1790847222\u002Fportfolio\u002Fstid\u002FSTid_US_landing_page.mp4",{"type":25,"title":634,"description":635,"style":636,"item":637},"VITE... ET BIEN","En réduisant le scope au strict nécessaire à la présentation de la marque et la compréhension de son offre, on se donne les moyens de produire un one-page de qualité, “Apple Style”. Avec le designer Quentin Goupille, on a donc pu opter pour un layout mêlant 2D & 3D avec une présentation “Wireframes” de l’offre STid.","lap",[],{"type":48,"style":21,"image":639},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1683128787\u002Fstudio-9p\u002Fuploads\u002FStiD_Case01.jpg",{"type":48,"style":21,"image":641},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1683128789\u002Fstudio-9p\u002Fuploads\u002FStiD_Case02.jpg",{"type":25,"style":168,"item":643},[644,646,648],{"image":645},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1759159642\u002Fstid-security.com_us__Iphone_14_15_Pro_1.webp",{"image":647},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1759159642\u002Fstid-security.com_us__Iphone_14_15_Pro_2.webp",{"image":649},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1759159642\u002Fstid-security.com_us__Iphone_14_15_Pro.webp",{"type":48,"style":51,"image":651},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1683128791\u002Fstudio-9p\u002Fuploads\u002FStiD_Case04.jpg","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1778598810\u002Fstudio9p-rebranded\u002FStid.png","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1683811136\u002Fstudio-9p\u002Fuploads\u002FStiD_Heros.jpg","2023-05-03T15:25:13.539Z","https:\u002F\u002Fstid-security.com\u002Fus\u002F","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1684334896\u002Fstudio-9p\u002Fuploads\u002FnewStiD_Hero.jpg",[102,144,658],"WebGL & Three.JS","\u002Fstid-security",{"title":661,"description":662},"STID Security : landing page immersive","Opération commando pour STID Security : une landing page WebGL et 3D pensée pour le marché américain et un salon à Las Vegas.","stid-security","lBiiLFcRIVapUuefaZ8r1BtJS1miOHxNjyy1P-dGulQ",{"id":666,"title":667,"body":8,"description":668,"extension":7,"meta":669,"navigation":64,"path":700,"seo":701,"slug":704,"stem":705,"__hash__":706},"content_fr\u002Fubisoft-12-trials-1.json","AC15, Hall Of Fame","Conclusion de la séquence Assassins Creed à l’été 2022, le All of Fame est une expérience contemplative et participative en WebGL. La communauté des joueurs d’Assassin’s Creed, toutes générations confondues, est appelée à venir se rassembler au sein d’une monumentale statue représentant l’Assassin des 15 ans de la Saga.",{"modules":670,"preview":692,"layout":181,"thumbnail":693,"date":694,"url":695,"cover":696,"tags":697,"year":699},[671,673,677,679,681,684,688,690],{"type":20,"style":21,"format":22,"video":672},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1790847923\u002Fportfolio\u002FAC15\u002FAC15_Hall_of_Fame.mp4",{"type":25,"title":674,"description":675,"style":636,"item":676},"POÉSIE TEXTURÉE","Toute la problématique était de faire une place à chaque joueur au sein d’un environnement défini. Le choix artistique s’est donc porté sur “l’explosion” de la statue d’or en milliers de petites particules. Chacune d’entre elles pouvait être adoptée par un joueur, qui venait y inscrire son gamertag.",[],{"type":48,"style":21,"image":678},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1683128789\u002Fstudio-9p\u002Fuploads\u002FHOF01.jpg",{"type":48,"style":21,"image":680},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1683128790\u002Fstudio-9p\u002Fuploads\u002FHOF02.jpg",{"type":170,"gradient":682,"inverse":172,"image":683},0.5,"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1660657927\u002Fstudio-9p\u002FLogo_AC15.png",{"type":25,"title":685,"description":686,"style":168,"item":687},"GOLD ON THE CEILING","Une fois le modèle 3D de la statue retouché et optimisé, le texturing et de le lightning commencent. La texture dorée est produite en combinant une “normale” pour la rugosité de la matière et la capacité de la texture à renvoyer la lumière pour reproduire le rendu de l’or dans la réalité.",[],{"type":48,"style":21,"image":689},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1759159982\u002FCapture_d_e%CC%81cran_le_2022-02-09_a%CC%80_18.50_2.jpg",{"type":48,"style":51,"image":691},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1683128794\u002Fstudio-9p\u002Fuploads\u002FHOF05.jpg","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1778598753\u002Fstudio9p-rebranded\u002FAC15_-_Hall_of_fame.png","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1683128790\u002Fstudio-9p\u002Fuploads\u002FHOF04.jpg","2022-08-18T14:07:00.000+02:00","https:\u002F\u002Fwww.ubisoft.com\u002Fen-gb\u002Fgame\u002Fassassins-creed\u002F15th-anniversary\u002Fhall-of-fame\u002F","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1684330562\u002FBG.jpg",[102,698,391],"Développement Front & Back","2022","\u002Fubisoft-12-trials-1",{"title":702,"description":703},"Assassin’s Creed : Hall of Fame","Célébrer les 15 ans d’Assassin’s Creed avec une expérience WebGL immersive et participative signée pour Ubisoft.","ubisoft-ac15-hall-of-fame","ubisoft-12-trials-1","qSktYSuwArh9aM6Vt4GGzgM09-Q3T7TN5EfaloHQHRo",{"id":708,"title":709,"body":8,"description":710,"extension":7,"meta":711,"navigation":64,"path":739,"seo":740,"slug":743,"stem":743,"__hash__":744},"content_fr\u002Fbigflo-oli.json","Bigflo & Oli","Bigflo & Oli galèrent à choisir le nom et la pochette de leur nouvel album ! Ils ont donc demandé à leur fans de les aider, en votant pour leur artwork favori. Mais plutôt que de faire un bête vote sur Instagram, le label Polydor France (Universal Music) a eu l’idée d’une expérience digitale plus originale et nous a chargés de sa conception. Notre réponse : un véritable outil de personnalisation du CD, en 3D (WebGL) pour visualiser en live le résultat.",{"modules":712,"preview":735,"layout":181,"thumbnail":736,"date":737,"cover":736,"tags":738,"year":699},[713,715,719,721,723,733],{"type":20,"style":21,"format":22,"video":714},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1790847644\u002Fportfolio\u002Fbigflo-oli\u002FAnnonce_Les_autres_c_est_nous_par_David_Castello-lopez.mp4",{"type":25,"title":716,"description":717,"style":636,"item":718},"Un boost pour les pré-commandes","Derrière le story-telling, l’opération vise à faire parler de l’album avant sa sortie, et plus précisément de sa “préco” comme l’explique David Castello Lopes dans la vidéo ci-dessus. La précommande sert à placer l’album haut dans les charts dès le jour de sa sortie.",[],{"type":48,"style":21,"image":720},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1759161284\u002Fbigol.webp",{"type":170,"gradient":682,"inverse":172,"image":722},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1660659353\u002Fstudio-9p\u002FB_O_Logo.png",{"type":25,"style":168,"title":724,"description":725,"item":726},"12 possibilités = 12 versions de l’album","La version la plus plébiscitée sera la version finale de l’album mise dans les bacs et sur les plateformes. Mais la promesse faite aux fans ne s’arrêtent pas là, car ils pourront aussi recevoir la version qu’ils ont choisi directement chez eux !",[727,729,731],{"image":728},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1660737711\u002Fstudio-9p\u002FB_O_Carrousel1.png",{"image":730},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1660737711\u002Fstudio-9p\u002FB_O_Carrousel2.png",{"image":732},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1660737711\u002Fstudio-9p\u002FB_O_Carrousel3.png",{"type":48,"style":51,"image":734},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1660659476\u002Fstudio-9p\u002FB_O_End.jpg","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1778598752\u002Fstudio9p-rebranded\u002FBig_flo_Oli.png","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1660658958\u002Fstudio-9p\u002FB_O_Main_Cover.jpg","2022-08-16T14:04:07.816Z",[102,188,343],"\u002Fbigflo-oli",{"title":741,"description":742},"Expérience WebGL pour Bigflo & Oli","Un outil de personnalisation 3D pour Bigflo & Oli et Polydor France, imaginé pour que les fans votent l’artwork de leur nouvel album.","bigflo-oli","bWcbgaAlfu7rLtj5ryRa89tYyAUXbbgOmeFi_5HIQsY",{"id":746,"title":747,"body":8,"description":748,"extension":7,"meta":749,"navigation":64,"path":779,"seo":780,"slug":783,"stem":783,"__hash__":784},"content_fr\u002Fubisoft-12-trials.json","Ubisoft 12 Trials","La saga Assassin’s Creed fête ses 15 ans en 2022 ! A cette occasion, Ubisoft lance une série d’évènements et d’activations, permettant à toutes les générations de fans de (re)vivre chaque épisode de cette grande épopée. Sollicitée par Ubisoft pour produire un grand jeu d’été sur ce thème, l’agence Biborg a fait appel à 9P pour l’accompagner sur le volet production. Le résultat : Twelve Trials, un jeu challengeant les connaissances des fans d’Assassin’s Creed. Pendant 12 semaines, ils devront passer un “trial” à la difficulté croissante pour remporter un voyage en Italie sur les traces d’Ezio Auditore !",{"modules":750,"preview":772,"layout":181,"thumbnail":773,"date":774,"url":775,"cover":773,"tags":776,"year":699},[751,753,757,759,760,770],{"type":43,"style":44,"text":752},"\u003Ciframe width=\"560\" height=\"315\" src=\"https:\u002F\u002Fwww.youtube.com\u002Fembed\u002FBZebR7se7ig\" title=\"YouTube video player\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\" allowfullscreen>\u003C\u002Fiframe>",{"type":25,"title":754,"description":755,"style":636,"item":756},"Un challenge pour les fans... et 9P","Faire durer une activation sur une période aussi longue (3 mois) est une première pour nous. Chaque semaine, le site est remanié aux couleurs d’un épisode de la série, et un nouvel ensemble de 10 questions est proposé aux fans.",[],{"type":48,"style":21,"image":758},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1759219782\u002Fvalha_1.webp",{"type":170,"gradient":682,"inverse":172,"image":683},{"type":25,"title":761,"description":762,"style":168,"item":763},"Rester captivants en variant les plaisirs","Assassin’s Creed est un univers très riche dans lequel puiser pour créer des énigmes à poser aux fans. Mais l’expérience en ligne doit rester suffisamment variée pour ne pas lasser les utilisateurs. Problème : 10 questions x 12 épisodes = 120 questions en tout, impossible de créer chaque questions en “one shot” sans exploser le budget et le temps de prod ! La solution : passer par des templates, des modèles conçus pour s’adapter facilement à tout type de contenu. Avec 6 templates prévus, mélangés à des questions passionnantes, l’expérience devient parfaitement variée et sans linéarité.",[764,766,768],{"image":765},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1759162968\u002F1201.webp",{"image":767},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1759162968\u002F1202.webp",{"image":769},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1759162968\u002F1203.webp",{"type":48,"style":51,"image":771},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1660658086\u002Fstudio-9p\u002FUbisoft_12_Trials_End.jpg","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1778598811\u002Fstudio9p-rebranded\u002FUbisoft_12_trials.png","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1660656993\u002Fstudio-9p\u002FUbisoft_12_Trials.jpg","2022-08-16T13:31:21.493Z","https:\u002F\u002Fac15-twelve-trials.neuviemepage.com\u002Ffr-fr\u002Fgame\u002Fassassins-creed\u002F15th-anniversary\u002F12-trials\u002Ftrial",[777,698,778],"UX Design","Project Management","\u002Fubisoft-12-trials",{"title":781,"description":782},"Ubisoft : Twelve Trials","La plateforme de jeu des 15 ans d’Assassin’s Creed mise sur des épreuves interactives et challengeantes pour les fans d’Ubisoft.","ubisoft-12-trials","V3oRjm44aME2qIO2Re9N0pTQbN0O0NOwLegSnJiC-1w",{"id":786,"title":787,"body":8,"description":788,"extension":7,"meta":789,"navigation":64,"path":815,"seo":816,"slug":819,"stem":819,"__hash__":820},"content_fr\u002Fstudio-ouam.json","Studio Ouam","Le plus fresh des studios de branding bordelais (qui signe notre nouvelle identité visuelle) a travaillé avec 9P pour le dev de son nouveau site. Au programme, des animations cartoons, des éléments élastiques, bref de l’énergie !",{"modules":790,"preview":808,"layout":181,"thumbnail":809,"date":810,"url":811,"cover":809,"tags":812,"year":814},[791,793,796,804,806],{"type":48,"style":21,"image":792},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1644428500\u002Fstudio-9p\u002FGrid_Image_Studio_Ouam.jpg",{"type":170,"gradient":794,"inverse":172,"image":795},-0.5,"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1644420735\u002Fstudio-9p\u002FOtto.png",{"type":25,"item":797,"style":168},[798,800,802],{"image":799},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1759162978\u002Fouam03.webp",{"image":801},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1759162977\u002Fouam01.webp",{"image":803},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1759162978\u002Fouam02.webp",{"type":20,"style":21,"format":22,"video":805},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1790783433\u002Fthumbnail-Studio-Ouam.mp4",{"type":48,"style":51,"image":807},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1644420764\u002Fstudio-9p\u002FScreen_Image_Studio_Ouam.jpg","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1778598777\u002Fstudio9p-rebranded\u002FOuam.png","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1644420757\u002Fstudio-9p\u002FCover_Image_Studio_Ouam.jpg","2022-02-03T16:55:29.058Z","https:\u002F\u002Fstudioouam.com\u002F",[468,343,813],"WordPress","2021","\u002Fstudio-ouam",{"title":817,"description":818},"Studio Ouam : site web et motion design","Studio Ouam, le studio de branding bordelais, mise sur l’énergie et les animations cartoons pour un site dynamique sous WordPress.","studio-ouam","BaXySXcM8qEuiGBWsyT4GMYCA-5ronpTcO9-OxbEmCo",{"id":822,"title":823,"body":8,"description":824,"extension":7,"meta":825,"navigation":64,"path":888,"seo":889,"slug":892,"stem":892,"__hash__":893},"content_fr\u002Fle-fooding.json","Le Fooding","En plein confinement, le Fooding a fait peau neuve. Un chantier de refonte gigantesque, mêlant les problématiques édito, branding, business et technique.\n\nDu premier wireframe aux dernières features en production en ce moment même, 9P a travaillé main dans la main avec les équipes du Fooding pour offrir une plateforme plus claire, plus accessible et 100% optimisée smartphones pour l’usage en mobilité, le seul qui compte quand on cherche où bien manger, dormir ou boire un verre.",{"modules":826,"preview":878,"layout":181,"thumbnail":879,"date":880,"url":881,"cover":879,"tags":882,"year":814},[827,829,831,833,835,839,849,859,861,864,866,868,876],{"type":48,"style":21,"image":828},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1645030311\u002Fstudio-9p\u002FGrid-Home-Resto-Fooding.jpg",{"type":48,"style":21,"image":830},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1645030311\u002Fstudio-9p\u002FGrid-Fiche-Resto-Fooding.jpg",{"type":48,"style":21,"image":832},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1645030310\u002Fstudio-9p\u002FGrid-Home-Ville-Fooding.jpg",{"type":48,"style":21,"image":834},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1645030310\u002Fstudio-9p\u002FGrid-Radio-Fooding.jpg",{"type":43,"title":836,"text":837,"link":46,"style":838},"Une Refonte Totale","Le premier site Fooding avait 10 ans, et malgré une structure solide, il demandait d’être repensé pour répondre aux challenges d’aujourd’hui (responsive, SEO, performance, etc).\n\nLe Fooding comprend en réalité plusieurs sections principales : le guide (le plus connu), la partie média (avec des articles), et les recettes. Chaque section suit sa propre logique de lecture, de filtrage, de recherche, etc. Le premier challenge reposait donc sur une signalétique claire pour différencier ces différents contenus, sur la home notamment.\n\nLa nouvelle version se veut plus orientée \"média\", donnant la part belle aux articles. Elle devait également revaloriser les différentes sections du site, notamment les recettes, mais aussi présenter plus clairement les verticales du guide (restaurants, chambres, bars, commerces de bouche et caves).","column",{"type":840,"reverse_flow":172,"column":841},"grid_module",[842,846],{"type":843,"text":844,"color":845},"title","Avant \u002F Après","#a19e81",{"type":847,"image":848},"image","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1645004249\u002Fstudio-9p\u002FFooding-Avant-Apres.mp4",{"type":25,"style":168,"item":850,"title":857,"description":858},[851,853,855],{"image":852},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1759162969\u002Ffooding02.webp",{"image":854},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1759162971\u002Ffooding03.webp",{"image":856},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1759162968\u002Ffooding01.webp","Bénéfice Immédiat","Dès les premières semaines suivant la mise en ligne, le taux de rebond est passé de 65 à 35%, le temps moyen passé sur le site a triplé pour atteindre plus de 3 minutes et le nombre de pages vues a augmenté de 63,7%.",{"type":860},"separator_module",{"type":43,"title":862,"text":863,"style":44},"La Plateforme Technique","Wordpress a été choisi comme CMS pour faciliter la prise en main par l’équipe éditoriale du Fooding, mais il est utilisé ici dans un format “headless” afin de se libérer des templates natifs et de pouvoir déployer un framework FrontEnd basé sur Vue.js, plus performant et pérenne.",{"type":170,"gradient":682,"inverse":172,"image":865},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1644401280\u002Fstudio-9p\u002Fuploads\u002Fcible-fooding.png",{"type":48,"style":51,"image":867},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1644401054\u002Fstudio-9p\u002Fuploads\u002Fimage-1-pleine-largeur-fooding.jpg",{"type":840,"reverse_flow":64,"column":869,"title":875},[870,872],{"type":847,"image":871},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1644401174\u002Fstudio-9p\u002Fuploads\u002Fneverrrrrr-image-fooding.png",{"type":873,"text":874},"text","Le site est en constante amélioration. Après une première salve d’updates à 3 mois après sa mise en ligne, de nouvelles fonctionnalités et correctifs sont déjà en préparation. En lien chaque semaine avec l’équipe produit côté client, nous gardons une veille constante sur la plateforme afin de proposer des évolutions et de traiter les demandes et les nouvelles problématiques en quasi temps réel.","Work Is. Never. Over.",{"type":48,"style":51,"image":877},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1644401198\u002Fstudio-9p\u002Fuploads\u002Fimage-2-pleine-largeur-fooding.jpg","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1778598752\u002Fstudio9p-rebranded\u002FFooding.png","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1644400347\u002Fstudio-9p\u002Fuploads\u002Fimage-cover-fooding.jpg","2021-12-07T18:15:37.809Z","https:\u002F\u002Flefooding.com\u002F",[883,884,885,886,887],"UX design & (re)branding","Editorial structure & rubricage","Redesign of the search experience","FRONT & Back & PWA* Development","Agile projectmanagement & monitoring","\u002Fle-fooding",{"title":890,"description":891},"Refonte digitale du Fooding","Repenser l’expérience UX et le branding du Fooding pour créer une plateforme média et guide entièrement optimisée pour le mobile.","le-fooding","r5pvGoR3id-0oxjteEu3xLnFPW0gayyTiSHjoP-hobI",{"id":895,"title":896,"body":8,"description":897,"extension":7,"meta":898,"navigation":64,"path":930,"seo":931,"slug":934,"stem":934,"__hash__":935},"content_fr\u002Fi-love-bio-x-deezer.json","I Love Bio x Deezer","Deezer propose aux marques des expériences musicales directement sur leur plateforme. Pour cette collab’ avec la marque I Love Bio, ils ont fait appel au studio pour réaliser un mini-jeu mêlant les tops playlist du moment et l’univers fruité des produits de la marque de soin du corps. \n\nLe brief ? Une expérience inspirée de Fruit Ninja© adapté à l’environnement de la douche du matin. Nous avons donc imaginé mettre les joueurs dans la peau d’un tube de gel douche, chargé de récupérer les fruits qui tombent dans sa direction à la manière d’un Tetris !",{"modules":899,"preview":925,"layout":181,"thumbnail":926,"date":927,"cover":926,"tags":928,"year":814},[900,908,911,913,915,917,919,921,923],{"type":25,"style":168,"item":901},[902,904,906],{"image":903},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1759162968\u002Fbio01.webp",{"image":905},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1759162968\u002Fbio02.webp",{"image":907},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1759162968\u002Fbio03.webp",{"type":43,"style":44,"title":909,"text":910},"3D DESIGN & WEBGL","Pour cette expérience, tout a été désigné chez 9P, du décor aux fruits inspirés directement de l’univers 2D de la marque I Love Bio. Le rendu utilisé, appelé \"cel shading\", permet un look 2D sur un objet 3D. La technique a été popularisée par des jeux comme Pokémon, Zelda ou Fruit Ninja. L’ensemble a ensuite été animé dans Blender et intégré dans la scène Three.js du jeu.",{"type":48,"style":21,"image":912},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1644425383\u002Fstudio-9p\u002FGrid_Image_1_ILB.jpg",{"type":170,"gradient":794,"inverse":172,"image":914},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1644425495\u002Fstudio-9p\u002FCoco_ILB.png",{"type":48,"style":21,"image":916},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1644425436\u002Fstudio-9p\u002FGrid_Image_2_ILB.jpg",{"type":48,"style":21,"image":918},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1644425437\u002Fstudio-9p\u002FGrid_Image_3_ILB.jpg",{"type":48,"style":21,"image":920},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1644425436\u002Fstudio-9p\u002FGrid_Image_4_ILB.jpg",{"type":48,"style":21,"image":922},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1644425437\u002Fstudio-9p\u002FGrid_Image_5_ILB.jpg",{"type":48,"style":51,"image":924},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1644425531\u002Fstudio-9p\u002FScreen_Image_ILB.jpg","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1778598752\u002Fstudio9p-rebranded\u002FI_love_bio.png","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1644425071\u002Fstudio-9p\u002FCover_Image_ILB.jpg","2021-10-07T17:45:00.000+02:00",[547,144,102,929],"Développement (PWA)","\u002Fi-love-bio-x-deezer",{"title":932,"description":933},"I Love Bio x Deezer : mini-jeu 3D","Expérience interactive pour I Love Bio et Deezer : un jeu WebGL en cel shading qui marie les playlists du moment et l’univers fruité.","i-love-bio-x-deezer","hS7IDlAghksMkoJGYoAdPMACkSrExGWUMsjt8fosJog",{"id":937,"title":938,"body":8,"description":939,"extension":7,"meta":940,"navigation":64,"path":968,"seo":969,"slug":972,"stem":972,"__hash__":973},"content_fr\u002Fmedecins-du-monde.json","Médecins du Monde","Nous accompagnons les actions de Médecins du Monde depuis nos débuts. Cette année, “MdM” a lancé son premier podcast, “La Voix est libre”, qui retrace les 20 ans de lutte de l’ONG.\n\nNous avons conçu un mini-site mêlant les épisodes du podcast en libre écoute, une frise interactive avec des informations complémentaires, le tout servi par une interface innovante en WebGL (3D) symbolisant le tourbillon de l’action de MdM depuis ses débuts.",{"modules":941,"preview":960,"layout":181,"thumbnail":961,"date":962,"url":963,"cover":961,"tags":964,"year":967},[942,950,952,954,956,958],{"type":25,"style":168,"item":943},[944,946,948],{"image":945},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1759162975\u002Fmede02.webp",{"image":947},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1759162974\u002Fmede01.webp",{"image":949},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1759162975\u002Fmede03.webp",{"type":20,"style":21,"format":22,"video":951},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1645106561\u002FVideo-Podcast-MdM.mp4",{"type":170,"gradient":794,"inverse":172,"image":953},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1644484023\u002Fstudio-9p\u002FLogo_MdM.png",{"type":48,"style":21,"image":955},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1645116619\u002Fstudio-9p\u002FGrid_Image_1_MdM.jpg",{"type":48,"style":21,"image":957},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1645116619\u002Fstudio-9p\u002FGrid_Image_2_MdM.jpg",{"type":48,"style":51,"image":959},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1644484546\u002Fstudio-9p\u002FScreen_Image_MdM.jpg","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1778598754\u002Fstudio9p-rebranded\u002Fmedecindumonde.png","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1644484026\u002Fstudio-9p\u002FCover_Image_MdM.jpg","2020-06-11T10:43:00.000+02:00","https:\u002F\u002Fpodcast.medecinsdumonde.org\u002F",[965,102,966],"Conception & branding","Développement (Three.js)","2020","\u002Fmedecins-du-monde",{"title":970,"description":971},"Médecins du Monde : site podcast interactif","Mini-site 3D pour le podcast de Médecins du Monde : une expérience WebGL immersive qui retrace 20 ans de lutte de l’ONG.","medecins-du-monde","AAlZJJmm4_4l4hHCJwpv_OgzO5GgOmReDTJ9UWuxeZg",{"id":975,"title":976,"body":8,"description":977,"extension":7,"meta":978,"navigation":64,"path":1016,"seo":1017,"slug":1020,"stem":1020,"__hash__":1021},"content_fr\u002Fclub-mate.json","Club-Mate","Depuis longtemps mythique à Berlin, la marque nous a fait confiance pour son lancement sur le territoire français. Au programme : plateforme de marque, charte graphique et éditoriale, et bien sûr... site web. Nous avons développé un univers animé et coloré, basé sur un jeu d’origamis mêlant les formes géométriques issues de la mythique bouteille jaune.",{"modules":979,"preview":1007,"layout":181,"thumbnail":1008,"date":1009,"url":1010,"cover":1008,"tags":1011,"year":1015},[980,988,992,994,996,1005],{"type":25,"item":981,"style":168},[982,984,986],{"image":983},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1759162973\u002Fmate02.webp",{"image":985},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1759163615\u002FScreenRecording_09-29-2025_18-31-19_1.mp4",{"image":987},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1759162973\u002Fmate03.webp",{"type":43,"style":989,"title":990,"text":991},[44],"Club-Mate s’est fait connaître sans pub","En Allemagne, le Club-Mate s’est imposé sans le moindre marketing. Pour la France, il fallait donc développer un univers de marque plus fourni pour faire connaître cette boisson pétillante prisée des fêtards et des hackers. Résultat ? Un site haut en couleurs, des formes géométriques animées et des textes forts pour porter les valeurs du Club-Mate francophone !",{"type":170,"gradient":682,"inverse":172,"image":993},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1644423623\u002Fstudio-9p\u002FBouteille_Club_Mate.png",{"type":48,"style":21,"image":995},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1645031103\u002Fstudio-9p\u002FGrid_Image_Club_Mate_V2.jpg",{"type":997,"item":998},"mosaic_module",[999,1001,1003],{"image":1000},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1644506480\u002Fstudio-9p\u002Fclub-mate-mos-1.jpg",{"image":1002},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1644506480\u002Fstudio-9p\u002Fclub-mate-mos-2.jpg",{"image":1004},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1644506480\u002Fstudio-9p\u002Fclub-mate-mos-3.jpg",{"type":48,"style":51,"image":1006},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1644423625\u002Fstudio-9p\u002FScreen_Image_Club_Mate.jpg","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1778598753\u002Fstudio9p-rebranded\u002FClubmate.png","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1644423624\u002Fstudio-9p\u002FCover_Image_Club_Mate.jpg","2019-06-13T17:02:00.000+02:00","https:\u002F\u002Fclub-mate.fr\u002F",[1012,1013,102,468,698,813,1014],"Identité visuelle","Photographie","Suivi & évolutions","2019","\u002Fclub-mate",{"title":1018,"description":1019},"Club-Mate : identité et site web","Comment accompagner le lancement de Club-Mate en France ? Avec un univers visuel coloré et du motion design pensés pour la marque.","club-mate","-RW0BKLvPlaTBbDLGDO7E6hpbYHuoRyA_EKn-jjccTE",{"id":1023,"title":1024,"body":8,"description":1025,"extension":7,"meta":1026,"navigation":64,"path":1047,"seo":1048,"slug":1051,"stem":1051,"__hash__":1052},"content_fr\u002Fnoel-aux-gobelins.json","Noël aux Gobelins","Le Mobilier National s’est associé à Lego pour créer une animation de fin d’année à destination des enfants (et pas seulement). Le concept ? Recréer une tapisserie du XVIe siècle à l’aide de petites briques de couleur. Et pour les petites mains qui ne pouvaient pas se déplacer jusqu’à Paris, 9P a créé une version en ligne de l’expérience !",{"modules":1027,"preview":1041,"layout":181,"thumbnail":1042,"date":1043,"url":46,"cover":1042,"tags":1044,"year":1015},[1028,1035,1037,1039],{"type":840,"reverse_flow":172,"title":1029,"column":1030},"Une \u003C\u002Fbr> expérience \u003C\u002Fbr> IRL \u002F WebGL ",[1031,1033],{"type":847,"image":1032},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1644422654\u002Fstudio-9p\u002FGrille_Image_Gauche_Gobelins.jpg",{"type":873,"text":1034},"Pendant que les petites mains parisiennes reconstituaient la tapisserie dans la Galerie des Gobelins, les autres enfants participaient en ligne sur notre jeu ! Une expérience WebGL leur permettait de vivre l’évènement en plaçant des briques virtuelles de chez eux, sur le plateau de jeu à Paris.",{"type":170,"gradient":682,"inverse":172,"image":1036},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1644422653\u002Fstudio-9p\u002FLego_Gobelins.png",{"type":20,"style":21,"format":22,"video":1038},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1645106291\u002FVideo-Lego-Gobelins.mp4",{"type":48,"style":51,"image":1040},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1644422655\u002Fstudio-9p\u002FScreen_Image_2_Gobelins.jpg","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1778598753\u002Fstudio9p-rebranded\u002FLego.png","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1644422655\u002Fstudio-9p\u002FCover_Image_Gobelins.jpg","2019-06-11T10:44:00.000+02:00",[1045,1046,966],"DA & UX design","Production vidéo","\u002Fnoel-aux-gobelins",{"title":1049,"description":1050},"Noël aux Gobelins : expérience interactive","Comment Studio 9P a transposé l’installation Lego du Mobilier National en une expérience web immersive grâce à Three.js.","noel-aux-gobelins","0ZVu10w-mAhOSS0HKTZk9u8402P_nYHJFZRSZm62bYw",{"id":1054,"title":1055,"body":8,"description":1056,"extension":7,"meta":1057,"navigation":64,"path":1083,"seo":1084,"slug":1087,"stem":1087,"__hash__":1088},"content_fr\u002Fgreenpeace-orizon.json","Greenpeace, Orizon","L’agence Artefact a imaginé Orizon, l’agence immobilière du futur qui vous dit où investir en fonction de la montée des eaux. Le site produit par 9P croise de vraies données immo et un modèle de prédiction du réchauffement climatique pour des résultats plus que réalistes.\n\nHeureusement, tout ça pour la bonne cause, un hoax de Greenpeace pour sensibiliser le public sur les dangers de d’inactivité face au émissions de CO2.",{"modules":1058,"preview":1077,"layout":181,"thumbnail":1078,"date":1079,"url":1080,"cover":1078,"tags":1081,"year":1082},[1059,1061,1064,1066,1069,1071,1073,1075],{"type":43,"style":44,"text":1060},"\u003Ciframe width=\"560\" height=\"315\" src=\"https:\u002F\u002Fwww.youtube.com\u002Fembed\u002F9vn0wJgm9ko\" title=\"YouTube video player\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\" allowfullscreen>\u003C\u002Fiframe>",{"type":43,"style":44,"title":1062,"text":1063},"Du fake très réaliste","Spécialisée dans la data, l’agence Artefact a conçu pour Orizon un véritable algorithme croisant des modèlisations de la montée sur les côtes françaises et des bases de données d’annonces immobilières. Studio 9P a ensuite intégré cette API au vrai \u002F faux site Orizon pour permettre aux visiteurs de vivre l’expérience avec des résultats plus vrais que nature.",{"type":48,"style":21,"image":1065},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1644485352\u002Fstudio-9p\u002FGrid_Image_1_Greenpeace.jpg",{"type":170,"gradient":1067,"inverse":172,"image":1068},0.47,"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1644861943\u002Fstudio-9p\u002FPin_Greenpeace.png",{"type":48,"style":21,"image":1070},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1644485352\u002Fstudio-9p\u002FGrid_Image_2_Greenpeace.jpg",{"type":48,"style":21,"image":1072},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1644485350\u002Fstudio-9p\u002FGrid_Image_3_Greenpeace.jpg",{"type":20,"style":21,"format":22,"video":1074},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fvideo\u002Fupload\u002Fv1645105386\u002FVideo-Reveal-Greenpeace.mp4",{"type":48,"style":51,"image":1076},"https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1644485348\u002Fstudio-9p\u002FScreen_Image_Greenpeace.jpg","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1778598756\u002Fstudio9p-rebranded\u002FOrizon.png","https:\u002F\u002Fres.cloudinary.com\u002Fneuvieme-page\u002Fimage\u002Fupload\u002Fv1644485346\u002Fstudio-9p\u002FCover_Image_Greenpeace.jpg","2017-06-10T10:27:00.000+02:00","https:\u002F\u002Forizon.immo\u002F",[102,343],"2017","\u002Fgreenpeace-orizon",{"title":1085,"description":1086},"Greenpeace Orizon : UX et développement","Le site Orizon, hoax réaliste conçu pour Greenpeace, sensibilise au réchauffement climatique grâce à un simulateur immobilier innovant.","greenpeace-orizon","WrYY1L2qI-5HjtzZwuqq3pbBBixbwK07O1LaNoKmP-c"]