Projets | Locomotive

<!doctype html> <html class="has-no-js is-first-loading is-loading" lang="fr" data-template="work-list" data-theme="default"> <head> <meta charset="utf-8"> <meta http-equiv="x-ua-compatible" content="ie=edge"> <base href="https://locomotive.ca/"> <title>Projets | Locomotive</title> <link rel="canonical" href="https://locomotive.ca/fr/projets"> <meta property="og:url" content="https://locomotive.ca/fr/projets"> <meta property="og:title" content="Projets | Locomotive"> <meta property="twitter:title" content="Projets | Locomotive"> <meta property="og:site_name" content="Locomotive"> <meta name="description" content="Nous dessinons, développons et délivrons des produits digitaux qui mènent nos clients au succès grâce à des sites internet originaux et de qualité, des e-commerces faciles et intuitifs, des images de marque fortes et une créativité sans faille. Faits à MTL"> <meta property="og:description" content="Nous dessinons, développons et délivrons des produits digitaux qui mènent nos clients au succès grâce à des sites internet originaux et de qualité, des e-commerces faciles et intuitifs, des images de marque fortes et une créativité sans faille. Faits à MTL"> <meta property="twitter:description" content="Nous dessinons, développons et délivrons des produits digitaux qui mènent nos clients au succès grâce à des sites internet originaux et de qualité, des e-commerces faciles et intuitifs, des images de marque fortes et une créativité sans faille. Faits à MTL"> <meta property="og:image" content="https://locomotive.ca/uploads/metadata/Open_Graph_Loco_%281%29.png"> <meta property="twitter:image" content="https://locomotive.ca/uploads/metadata/Open_Graph_Loco_%281%29.png"> <meta name="twitter:card" content="summary_large_image"> <meta name="twitter:site" content="@LocomotiveMTL">  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="HandheldFriendly" content="true">  <link rel="apple-touch-icon" sizes="180x180" href="assets/images/favicons/apple-touch-icon.png"> <link rel="icon" type="image/png" sizes="32x32" href="assets/images/favicons/favicon-32x32.png"> <link rel="icon" type="image/png" sizes="16x16" href="assets/images/favicons/favicon-16x16.png"> <link rel="manifest" href="site.webmanifest"> <link rel="mask-icon" href="assets/images/favicons/safari-pinned-tab.svg" color="#000000"> <meta name="msapplication-TileColor" content="#da532c"> <meta name="theme-color" content="#ffffff">  <style media="all"> /*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace, monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}button,[type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html{box-sizing:border-box}template,[hidden]{display:none}*,:before,:after{box-sizing:inherit}address{font-style:inherit}dfn,cite,em,i{font-style:italic}b,strong{font-weight:700}a{text-decoration:none}a svg{pointer-events:none}ul,ol{margin:0;padding:0;list-style:none}p,figure{margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:1em;font-weight:initial;margin:0}a,area,button,input,label,select,textarea,[tabindex]{touch-action:manipulation}[hreflang]>abbr[title]{text-decoration:none}table{border-spacing:0;border-collapse:collapse}hr{display:block;margin:1em 0;padding:0;height:1px;border:0;border-top:1px solid #CCCCCC}audio,canvas,iframe,img,svg,video{vertical-align:middle}audio:not([controls]){display:none;height:0}img,svg{max-width:100%;height:auto}img[width],img[height],svg[width],svg[height]{max-width:none}img{font-style:italic}svg{fill:currentColor}input,select,textarea{display:block;margin:0;padding:0;width:100%;outline:0;border:0;border-radius:0;background:none transparent;color:inherit;font:inherit;line-height:normal;-webkit-appearance:none;-moz-appearance:none;appearance:none}select{text-transform:none}select::-ms-expand{display:none}select::-ms-value{background:none;color:inherit}textarea{overflow:auto;resize:vertical}button,.c-button{display:inline-block;overflow:visible;margin:0;padding:0;outline:0;border:0;background:none transparent;color:inherit;vertical-align:middle;text-align:center;text-decoration:none;text-transform:none;font:inherit;line-height:normal;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}button:focus,button:hover,.c-button:focus,.c-button:hover{text-decoration:none}:root{--spacing-micro-mobile: 8;--spacing-micro: 14;--spacing-tiny-mobile: 20;--spacing-tiny: 20;--spacing-small-mobile: 30;--spacing-small: 30;--spacing-medium-mobile: 40;--spacing-medium: 40;--spacing-large-mobile: 52;--spacing-large: 80;--spacing-big-mobile: 80;--spacing-big: 150;--spacing-huge-mobile: 100;--spacing-huge: 200;--spacing-enormous-mobile: 140;--spacing-enormous: 250;--color: #000;--color-bg: #fff;--border: solid var(--border-size);--grid-columns: 12;--grid-gutter: 20px;--grid-margin: 2.66667rem;--grid-color: var(--color);--header-height: 4rem;--head-padding-vh: 0.25;--about-head-content-offset-vh: 0.15;--menu-color: #fff;--menu-color-bg: #312DFB;--font-size: 15px;--font-size-medium: 1.73333rem;--font-size-huge: 7.63889vw;--font-size-h1: 4.66667rem;--font-size-h2: 1.73333rem;--font-size-h3: 1.46667rem;--font-size-h4: 1.33333rem;--font-size-h5: 1.2rem;--font-size-h6: 1.06667rem}@media (min-width: 1025px){:root{--border-size: 2px}}@media (max-width: 1024px){:root{--border-size: 1px}}@media (max-width: 1024px){:root{--grid-columns: 8;--grid-margin: 1.33333rem}}@media (max-width: 699px){:root{--grid-columns: 4;--grid-gutter: calc(20px/2)}}@media (max-width: 1024px){:root{--font-size-medium: 1.6rem;--font-size-h1: 3.33333rem}}@media (max-width: 699px){:root{--font-size-h1: 2.4rem;--font-size-medium: 18px;--about-head-content-offset-vh: 0.20;--font-size-huge: 40px}}@media (max-width: 699px){:root{--font-size: 15px}}@media (min-width: 700px) and (max-width: 1024px){:root{--font-size: 15px}}@media (min-width: 1025px) and (max-width: 1199px){:root{--font-size: 15px}}@media (min-width: 1200px) and (max-width: 1599px){:root{--font-size: 15px}}@media (min-width: 1600px) and (max-width: 1999px){:root{--font-size: 17px}}@media (min-width: 2000px) and (max-width: 2399px){:root{--font-size: 19px}}@media (min-width: 2400px){:root{--font-size: 21px}}html{min-height:100%;line-height:1.3;font-family:ff("primary");color:var(--color);background-color:var(--color-bg);line-height:1.3;font-size:var(--font-size);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;transition:background-color .3s cubic-bezier(0.215, 0.61, 0.355, 1);width:100%}html.is-loading{cursor:wait}html.has-scroll-smooth{overflow:hidden;position:fixed;top:0;left:0;right:0;bottom:0}html.has-scroll-dragging{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}html[data-theme="dark"]{--color-bg: #000;--color: #fff;--menu-color: #000;--menu-color-bg: #DA382E}html[data-theme="primary"]{--color-bg: #DA382E;--menu-color: #fff;--menu-color-bg: #000}html[data-theme="secondary"]{--color-bg: #312DFB;--color: #fff;--menu-color: #000;--menu-color-bg: #fff}body{width:100%}.is-first-loading body{overflow:hidden}::-moz-selection{background-color:var(--color);color:var(--color-bg);text-shadow:none}::selection{background-color:var(--color);color:var(--color-bg);text-shadow:none}a{color:currentColor}a:focus,a:hover{color:currentColor}.focus-visible:not(input):not(textarea){outline-color:var(--color);outline-style:auto;outline-width:10px;outline-offset:5px}.grecaptcha-badge{visibility:hidden}.c-preloader{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000;color:#fff;z-index:9999;transition:opacity .9s cubic-bezier(0.215, 0.61, 0.355, 1)}.c-preloader svg{display:block;width:calc(min(250px, 70vw));height:10vh}html:not(.is-first-loading) .c-preloader{opacity:0;pointer-events:none}.c-preloader_outer{position:absolute;top:0;left:0;width:100%;height:100%;z-index:100;display:flex;align-items:center;justify-content:center}.c-preloader_logo{display:block;opacity:1;animation:preloaderAppear .9s cubic-bezier(0.215, 0.61, 0.355, 1) .3s;animation-fill-mode:backwards}@keyframes preloaderAppear{0%{opacity:0;transform:scale(0.9) translate3d(0, 0, 0)}100%{opacity:1;transform:scale(1) translate3d(0, 0, 0)}}@keyframes preloaderDisappear{0%{opacity:1;transform:scale(1) translate3d(0, 0, 0)}100%{opacity:0;transform:scale(1.1) translate3d(0, 0, 0)}} </style> <link id="main-css" rel="stylesheet" href="https://locomotive.ca/assets/styles/main.css?v=1723754399977" media="print" onload="this.media='all'; this.onload=null; this.isLoaded=true"> <script async defer src="https://www.google.com/recaptcha/api.js?render=explicit"></script>  <script type="text/plain" data-category="analytics" src="https://www.googletagmanager.com/gtag/js?id=G-WYYJ9ZP43V"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-WYYJ9ZP43V'); gtag('consent', 'default', { 'ad_storage': 'denied', 'analytics_storage': 'denied' }); </script> </head> <body data-module-load data-load="wrapper" data-module-hovers data-module-cookie-consent data-cookie-consent-config="{"language":{"autoDetect":"document","default":"fr","translations":{"fr":{"consentModal":{"title":"Nous utilisons des cookies !","description":"Ce site web utilise des témoins (cookies) essentiels pour garantir son bon fonctionnement, ainsi que des cookies de suivi pour comprendre comment vous interagissez avec lui. Ces derniers ne seront configurés qu'après avoir obtenu votre consentement. {{revisionMessage}} <button class=\"cc__link\" data-cookie-consent=\"show-preferences\">Préférences</button>","revisionMessage":"<br><br>Notre <a href=\"fr/politique-de-confidentialite?hide-cookie-consent\" target=\"_self\" rel=\"\">Politique de confidentialité</a> a changé depuis votre dernière visite.","footer":"<a href=\"fr/politique-de-confidentialite?hide-cookie-consent\" target=\"_self\" rel=\"\">politique de confidentialité</a>","acceptAllBtn":"Tout accepter","acceptNecessaryBtn":"Accepter le nécessaire"},"preferencesModal":{"title":"Préférences de témoins","acceptAllBtn":"Tout accepter","acceptNecessaryBtn":"Accepter le nécessaire","savePreferencesBtn":"Enregistrer mes préférences","closeIconLabel":"Accepter le nécessaire","sections":[{"description":"Nous utilisons certains témoins (cookies) pour personnaliser nos contenus et améliorer votre expérience numérique. D'autres sont indispensables au bon fonctionnement et à la sécurité de notre site Web et ne peuvent pas être désactivés.<br><br>Vous pouvez activer ou désactiver votre autorisation à recueillir vos données de navigation en tout temps. Si vous désactivez certains témoins, votre expérience de navigation peut être affectée.<br><br>Pour en savoir plus, consultez notre <a href=\"fr/politique-de-confidentialite?hide-cookie-consent\" target=\"_self\" rel=\"\">politique de confidentialité</a>."},{"title":"Témoins strictement nécessaires<span class=\"pm__badge\">Requis</span>","description":"Ces cookies sont stockés pour garantir le bon fonctionnement de notre site Web. Ils ne peuvent pas être désactivés.","linkedCategory":"necessary","cookieTable":{"headers":{"name":"Nom","service":"Service","duration":"Durée","purpose":"Usage"},"body":[{"name":"PHPSESSID","service":"Locomotive","duration":"Session","purpose":"Utilisé pour partager des données de fonctionnalités à travers les pages du site Web comme le suivi de la langue actuelle."},{"name":"locomotive.quickpreload","service":"Locomotive","duration":"Session","purpose":"Utilisé pour raccourcir la durée de l'écran de préchargement lors de la navigation sur les pages suivantes."},{"name":"cc_cookie","service":"Locomotive","duration":"6 mois","purpose":"Utilisé pour stocker vos préférences de consentement de témoins."},{"name":"_grecaptcha","service":"Google reCAPTCHA","duration":"6 mois","purpose":"Utilisé pour stocker l'évaluation si la visite, l'interaction, ou la soumission du formulaire, est légitime ou malveillante."},{"name":"__cf_bm","service":"Cloudflare","duration":"30 minutes","purpose":"Utilisé pour stocker l'évaluation si la visite est légitime ou malveillante."}]}},{"title":"Témoins de performance","description":"Ces cookies sont utilisés pour analyser la navigation sur le site afin d'améliorer son bon fonctionnement.","linkedCategory":"analytics","cookieTable":{"headers":{"name":"Nom","service":"Service","duration":"Durée","purpose":"Usage"},"body":[{"name":"_ga","service":"Google Analytics","duration":"2 ans","purpose":"Utilisé pour distinguer les utilisateurs uniques et compter les pages vues."},{"name":"_gat","service":"Google Analytics","duration":"1 minute","purpose":"Utilisé pour limiter la fréquence de collecte des données."},{"name":"_gid","service":"Google Analytics","duration":"1 jour","purpose":"Utilisé pour distinguer les utilisateurs uniques et compter les pages vues."}]}}]}}}},"guiOptions":{"consentModal":{"layout":"box inline","position":"bottom right","equalWeightButtons":false},"preferencesModal":{"equalWeightButtons":false}},"revision":1,"categories":{"necessary":{"enabled":true,"readOnly":true},"analytics":{"autoClear":{"cookies":[{"name":"_ga"},{"name":"_gat"},{"name":"_gid"},{"name":"/^_gat?_/"}]}}}}"> <script> window.preloaderEnterPromise = new Promise(resolve => { setTimeout(resolve, 1200); }) window.preloaderPromise = new Promise(resolve => { window.preloaderPromiseResolve = resolve; }) </script> <div class="c-preloader" aria-hidden="true" id="preloader"> <div class="c-preloader_outer"> <div class="c-preloader_inner"> <div class="c-preloader_head" id="preloaderHead" style="display: none;"> </div> <div class="c-preloader_content" id="preloaderContent" style="display: none;"> <div> Digital<br> Digital-First<br> Digital-First Design<br> Digital-First Design<br> Digital-First Agency<br> Digital-First Agency<br> </div> <div> Basée<br> Basée à<br> Basée à Montréal<br> Basée à Montréal<br> Basée à Montréal, Canada<br> Basée à Montréal, Canada<br> Basée à Montréal, Canada<br> </div> </div> <div class="c-preloader_logo"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 246.5033 33.28001" id="preloaderLogo"> <g> <path d="M0,.64v32H32V.64Zm30,30H2v-28H30Z" transform="translate(0 0.00001)"/> <polygon points="20.12 19.4 16.12 19.4 16.12 12.32 14.24 12.32 14.24 20.96 20.12 20.96 20.12 19.4"/> </g> <path d="M52.41557,8.24h-6.4l2.28-2.28c2.32-2.32,4-3.2,6.12-3.2s3.8.88,6.12,3.2l2.28,2.28h-6.4v1.6h7.6v7.6h1.6v-6.4l6,6,1.2-1.2-6-6h6.4V8.24h-7.6V.64h-1.6v6.4l-2.28-2.28c-2.6-2.6-4.64-3.6-7.32-3.6s-4.72,1-7.32,3.6l-2.28,2.28V.64h-1.6v7.6h-7.6v1.6h6.4l-6,6,1.2,1.2,6-6v6.4h1.6V9.84h7.6Z" transform="translate(0 0.00001)"/> <path d="M86.13717.64h-10.52v.84c3.84,0,4.16.52,4.16,2.96v24.4c0,2.44-.32,2.96-4.16,2.96v.84h18.96l.12-.52,1.92-9.48-.84-.16c-1.64,7.96-2.36,8.8-4.96,8.8h-6.84c-1.64,0-2-.4-2-2.36V4.44c0-2.44.32-2.96,4.16-2.96Z" transform="translate(0 0.00001)"/> <path d="M105.56207,10.96c-4.72,0-7.4002,5.08-7.4002,11.24,0,6.28,3.04022,11.08,7.4002,11.08,4.68,0,7.36-5.08,7.36-11.24C112.92206,15.76,109.88208,10.96,105.56207,10.96Zm0,21c-3.2,0-5.2-4.36-5.2-9.76,0-5.36,1.72-9.92,5.2-9.92,3.16,0,5.2,4.36,5.2,9.76C110.76208,27.4,109.00208,31.96,105.56207,31.96Z" transform="translate(0 0.00001)"/> <path d="M121.77708,33.28c3.6,0,5.16-3.32,6.08-10.56l-.84-.16c-1.04,6.68-2.28,8.76-4.6,8.76-3.04,0-4.8-4.4-4.8-9.64,0-4.64,1.32-9.4,4.8-9.4a2.04221,2.04221,0,0,1,2.24,2.24c0,.84-.28,1.64-.28,2.2a1.25663,1.25663,0,0,0,1.28,1.36c1,0,1.56-.8,1.56-2.24a4.66084,4.66084,0,0,0-4.43418-4.877q-.18279-.00869-.36582-.003c-4.52,0-6.96,5.04-6.96,11.44C115.45707,28.68,117.77707,33.28,121.77708,33.28Z" transform="translate(0 0.00001)"/> <path d="M136.9881,10.96c-4.72,0-7.4,5.08-7.4,11.24,0,6.28,3.04,11.08,7.4,11.08,4.68,0,7.36-5.08,7.36-11.24C144.34808,15.76,141.30811,10.96,136.9881,10.96Zm0,21c-3.2,0-5.2-4.36-5.2-9.76,0-5.36,1.72-9.92,5.2-9.92,3.16,0,5.2,4.36,5.2,9.76C142.18811,27.4,140.4281,31.96,136.9881,31.96Z" transform="translate(0 0.00001)"/> <path d="M146.17506,32.64h7.08V31.8c-2.2,0-2.48-.48-2.48-2.96V16.04c1.44-1.88,2.88-3.2,4.64-3.2,1.64,0,2.56,1.12,2.56,3.52V28.84c0,2.48-.28,2.96-2.48,2.96v.84h6.96V31.8c-2.2,0-2.48-.48-2.48-2.96v-13c1.4-1.76,2.84-3,4.52-3,1.6,0,2.52,1.12,2.52,3.52V28.84c0,2.48-.28,2.96-2.48,2.96v.84h7.04V31.8c-2.28,0-2.56-.48-2.56-2.96V16.28c0-3.16-1.08-5.32-3.76-5.32-2.32,0-3.88,1.56-5.32,3.76h-.08c-.32-2.28-1.44-3.76-3.68-3.76-2.28,0-3.88,1.56-5.28,3.76h-.12V12.08l-.52-.48h-4.36v.84c2.52,0,2.84.48,2.84,3v13.4c0,2.48-.28,2.96-2.56,2.96Z" transform="translate(0 0.00001)"/> <path d="M180.3681,10.96c-4.72,0-7.4,5.08-7.4,11.24,0,6.28,3.04,11.08,7.4,11.08,4.68,0,7.36-5.08,7.36-11.24C187.72809,15.76,184.68811,10.96,180.3681,10.96Zm0,21c-3.2,0-5.2-4.36-5.2-9.76,0-5.36,1.72-9.92,5.2-9.92,3.16,0,5.2,4.36,5.2,9.76C185.56805,27.4,183.80811,31.96,180.3681,31.96Z" transform="translate(0 0.00001)"/> <path d="M199.87808,22.72l-.84-.16c-1.4,6.68-2.12,8.92-3.44,8.92-1.8,0-1.96-2.8-1.96-6.72V12.92h4.88V11.6h-4.88V6h-1c-.08,3.4-1.08,5.8-3.92,5.8v1.12h2.92V26.2c0,5.28,1.28,7.08,3.48,7.08,2.76,0,3.48-3.32,4.76-10.56Z" transform="translate(0 0.00001)"/> <g> <path d="M205.82108,28.84V12.08l-.48-.48h-4.24v.84c2.44,0,2.72.48,2.72,3v13.4c0,2.48-.28,2.96-2.6,2.96v.84h7.2V31.8C206.10107,31.8,205.82108,31.32,205.82108,28.84Z" transform="translate(0 0.00001)"/> <rect x="202.34108" y="3.36001" width="3.96001" height="3.56"/> </g> <path d="M220.75908,15.24l-3.96,13.64h-.2l-3.88-13.64c-.68-2.36-.72-2.8,2-2.8V11.6h-7.28v.84c1.8,0,2.36.44,3.08,2.8l5.2,17.76h1.12l5.28-17.76c.72-2.36,1.32-2.8,3.24-2.8V11.6h-6.56v.84c2.72,0,2.68.44,1.96,2.8Z" transform="translate(0 0.00001)"/> <path d="M236.76508,22.56c-1.04,6.68-2.68,8.8-4.76,8.8-3.24,0-5.04-4.36-5.04-9.6,0-.44,0-.84.04-1.28h10.36c0-5.56-2.16-9.52-5.92-9.52-4.16,0-6.6,5.12-6.6,11.48,0,6.28,2.36,10.84,6.56,10.84,3.44,0,5.28-3.32,6.2-10.56Zm-5.32-10.28c2.72,0,3.76,3.68,3.76,6.88h-8.08C227.52509,15.4,228.92511,12.28,231.44507,12.28Z" transform="translate(0 0.00001)"/> <g> <path d="M241.66309,0a4.86034,4.86034,0,1,0,4.84,4.92l.00012-.01178A4.87429,4.87429,0,0,0,241.66309,0Zm0,9.04q-.03132.00018-.0625,0a4.08887,4.08887,0,0,1-4.0575-4.12q-.00064-.04239-.00043-.08471A4.09794,4.09794,0,0,1,241.66309.76q.04422.00018.08856.00134A4.05635,4.05635,0,0,1,245.70306,4.92l.00068.06714A4.04677,4.04677,0,0,1,241.66309,9.04Z" transform="translate(0 0.00001)"/> <path d="M242.23743,5.24692A1.49633,1.49633,0,0,0,243.743,3.76q-.00045-.06555-.00653-.13092a1.53782,1.53782,0,0,0-1.67346-1.389h-2.16V7.48h.72V5.24h.64l1.64,2.24h.88l-1.68-2.24C242.14771,5.24429,242.19257,5.24661,242.23743,5.24692ZM240.62305,4.6V2.96h1.36c.64,0,1,.28,1,.8,0,.52-.4.84-1,.84Z" transform="translate(0 0.00001)"/> </g> </svg> </div> </div> </div> </div> <div class="c-header_bg"></div> <div data-load="container"> <header data-module-header> <div class="c-header" data-header="header"> <a href="fr" class="c-header_logo" data-header="logo"> <span class="c-header_logo_inner" data-hover-shuffle>Locomotive</span>® </a> <span aria-hidden="true" class="c-header_icon"></span> <nav class="c-header_menu || c-header-menu"> <ul class="c-header-menu_list"> <li class="c-header-menu_item"><a href="fr/projets" class="c-header-menu_link -current" data-hover-shuffle>Projets</a></li> <li class="c-header-menu_item"><a href="fr/agence" class="c-header-menu_link" data-hover-shuffle>Agence</a></li> <li class="c-header-menu_item"><a href="fr/carrieres" class="c-header-menu_link" data-hover-shuffle>Carrières</a></li> <li class="c-header-menu_item"> <a target="_blank" rel="noopener noreferrer" href="https://store.locomotive.ca/fr" class="c-header-menu_link" data-hover-shuffle>Store</a> </li> </ul> </nav> <a href="fr/contact" class="c-header_cta " data-hover-shuffle>Contact</a> <button class="c-header_menu-toggler" data-header="menu-toggler" data-header-open-label="Menu" data-header-close-label="Fermer" aria-expanded="false" aria-controls="mobile-menu" aria-label="Navigation mobile"> Menu </button> </div> <nav class="c-menu" data-header="menu" id="mobile-menu" aria-label="Navigation mobile"> <div class="c-menu_inner"> <ul class="c-menu_nav"> <li class="c-menu_nav_item"> <a href="fr/projets" class="c-menu_nav_link -current">Projets</a> </li> <li class="c-menu_nav_item"> <a href="fr/agence" class="c-menu_nav_link ">Agence</a> </li> <li class="c-menu_nav_item"> <a href="fr/carrieres" class="c-menu_nav_link ">Carrières</a> </li> <li class="c-menu_nav_item"> <a href="fr/contact" class="c-menu_nav_link ">Contact</a> </li> <li class="c-menu_nav_item"> <a class="c-menu_nav_link" target="_blank" rel="noopener noreferrer" href="https://store.locomotive.ca/fr">Store</a> </li> </ul> <div class="c-menu_footer"> <a href="https://locomotive.ca/en/work" class="c-menu_langswitcher" data-load="false">English</a> <span class="c-menu_location"> <span class="u-screen-reader-text">Montréal, Quebec</span> <span aria-hidden="true">🛑🚹🚺</span> </span> </div> </div> </nav> </header> <div class="o-scroll" data-module-scroll="main" data-scroll-smooth="true" > <main> <section class="u-head-padding"> <div class="o-container c-work-list"> <div class="c-work-list_head"> <div class="c-work-list_desc"> <h1 class="o-text -medium">Nous développons des sites et des campagnes créatives qui captent l’attention, génèrent des résultats et remportent des prix.</h1> </div> <div class="c-work-list_filters || c-work-filters" data-module-work-filters> <div class="c-work-filters_dropdown-wrapper"> <select class="c-work-filters_dropdown" data-work-filters="select"> <option value="tout" data-work-filters-data="{"name":"Tous les projets","shortName":"Tout","slug":"tout","qty":38}" selected > Tous les projets (38) </option> <option value="branding" data-work-filters-data="{"id":"595450c9-25d5-45d7-b3bb-4a8bbc02a53a","ident":null,"title":"Branding","active":true,"name":"Branding","shortName":"Branding","slug":"branding","qty":12}" > Branding (12) </option> <option value="digital" data-work-filters-data="{"id":"75d24d0e-8c03-4c9a-b23b-0378299c5c7c","ident":null,"title":"Digital","active":true,"name":"Digital","shortName":"Digital","slug":"digital","qty":38}" > Digital (38) </option> <option value="experience" data-work-filters-data="{"id":"3b432ec5-dda8-4cf9-a57b-c89223368244","ident":null,"title":"Exp\u00e9rience","active":true,"name":"Exp\u00e9rience","shortName":"Exp\u00e9rience","slug":"experience","qty":20}" > Expérience (20) </option> <option value="e-commerce" data-work-filters-data="{"id":"6e4eb72a-50cc-4e4b-8f64-d2e50f2dfbcb","ident":null,"title":"E-commerce","active":true,"name":"E-commerce","shortName":"E-commerce","slug":"e-commerce","qty":7}" > E-commerce (07) </option> <option value="content" data-work-filters-data="{"id":"1f9d0880-118e-4607-aa35-dc0860d3f466","ident":null,"title":"Contenu","active":true,"name":"Contenu","shortName":"Contenu","slug":"content","qty":8}" > Contenu (08) </option> </select> </div> <button class="c-work-filters_toggler || c-form_select-wrapper" data-work-filters="toggler" aria-expanded="false" aria-controls="work-filters-content"> <span data-work-filters="toggler-open-label" class="c-work-filters_toggler_open-label || c-form_select"> <span data-work-filters="currentCategoryName"> Tous les projets </span> <sup data-work-filters="currentCategoryQty"> 38 </sup> </span> <span data-work-filters="toggler-close-label" class="c-work-filters_toggler_close-label -hidden"> Fermer </span> </button> <div class="c-work-filters_content" id="work-filters-content" data-work-filters="content"> <div class="c-work-filters_list"> <button class="c-work-filters_item" data-work-filters="category-button" data-work-filters-data="{"name":"Tous les projets","shortName":"Tout","slug":"tout","qty":38}">Tout<sup> <svg role="img"><use xlink:href="assets/images/sprite.svg#round-arrow"></use></svg> 38 <svg role="img"><use xlink:href="assets/images/sprite.svg#round-arrow"></use></svg> </sup></button> <button class="c-work-filters_item" data-work-filters="category-button" data-work-filters-data="{"id":"595450c9-25d5-45d7-b3bb-4a8bbc02a53a","ident":null,"title":"Branding","active":true,"name":"Branding","shortName":"Branding","slug":"branding","qty":12}">Branding<sup> <svg role="img"><use xlink:href="assets/images/sprite.svg#round-arrow"></use></svg> 12 <svg role="img"><use xlink:href="assets/images/sprite.svg#round-arrow"></use></svg> </sup></button> <button class="c-work-filters_item" data-work-filters="category-button" data-work-filters-data="{"id":"75d24d0e-8c03-4c9a-b23b-0378299c5c7c","ident":null,"title":"Digital","active":true,"name":"Digital","shortName":"Digital","slug":"digital","qty":38}">Digital<sup> <svg role="img"><use xlink:href="assets/images/sprite.svg#round-arrow"></use></svg> 38 <svg role="img"><use xlink:href="assets/images/sprite.svg#round-arrow"></use></svg> </sup></button> <button class="c-work-filters_item" data-work-filters="category-button" data-work-filters-data="{"id":"3b432ec5-dda8-4cf9-a57b-c89223368244","ident":null,"title":"Exp\u00e9rience","active":true,"name":"Exp\u00e9rience","shortName":"Exp\u00e9rience","slug":"experience","qty":20}">Expérience<sup> <svg role="img"><use xlink:href="assets/images/sprite.svg#round-arrow"></use></svg> 20 <svg role="img"><use xlink:href="assets/images/sprite.svg#round-arrow"></use></svg> </sup></button> <button class="c-work-filters_item" data-work-filters="category-button" data-work-filters-data="{"id":"6e4eb72a-50cc-4e4b-8f64-d2e50f2dfbcb","ident":null,"title":"E-commerce","active":true,"name":"E-commerce","shortName":"E-commerce","slug":"e-commerce","qty":7}">E-commerce<sup> <svg role="img"><use xlink:href="assets/images/sprite.svg#round-arrow"></use></svg> 07 <svg role="img"><use xlink:href="assets/images/sprite.svg#round-arrow"></use></svg> </sup></button> <button class="c-work-filters_item" data-work-filters="category-button" data-work-filters-data="{"id":"1f9d0880-118e-4607-aa35-dc0860d3f466","ident":null,"title":"Contenu","active":true,"name":"Contenu","shortName":"Contenu","slug":"content","qty":8}">Contenu<sup> <svg role="img"><use xlink:href="assets/images/sprite.svg#round-arrow"></use></svg> 08 <svg role="img"><use xlink:href="assets/images/sprite.svg#round-arrow"></use></svg> </sup></button> </div> </div> </div> </div> <div class="c-work-list_list"> <article class="c-work-list_item || c-work-list-item" data-module-work-list-item data-scroll data-scroll-call="inview, WorkListItem"> <header class="c-work-list-item_head" data-hover-shuffle="children"> <span class="c-work-list-item_head-title" data-hover-shuffle-child>Stenger Bike</span> <span class="c-work-list-item_head-summary" data-hover-shuffle-child>E-Commerce</span> <span class="c-work-list-item_head-location"><span>Hösbach, Allemagne</span></span> <button class="c-work-list-item_head-btn" data-work-list-item="toggler" data-work-list-item-label-open="Ouvrir" data-work-list-item-label-close="Fermer" aria-expanded="false" aria-controls="work-list-item-0"> <span class="u-screen-reader-text">Fermer</span> </button> <div class="c-image c-work-list-item_head-visual " data-work-list-item="preview"> <span class="c-image_inner" style="background-image: url('uploads/image-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/image-300w.png" > </span> </div> </header> <main class="c-work-list-item_content" data-work-list-item="content" aria-label="Stenger Bike preview" id="work-list-item-0"> <div class="c-work-list-item_content-inner" data-work-list-item="content-inner"> <div class="c-work-list-item_gallery" data-module-work-gallery> <div class="c-image c-work-list-item_gallery-item " data-work-list-item="image" data-work-gallery="slide"> <span class="c-image_inner" style="background-image: url('uploads/projects/Stenger-Bike/Fullscreen_Stenger-Bike-10w.jpg');"> <img class="c-image_img " alt="" width="1000" height="703" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20703'%3E%3C/svg%3E" data-src="uploads/projects/Stenger-Bike/Fullscreen_Stenger-Bike-1000w.jpg" > </span> </div> </div> <div class="c-image c-work-list-item_visual " data-work-list-item="preview-target" aria-hidden="true"> <span class="c-image_inner" style="background-image: url('uploads/image-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/image-300w.png" > </span> </div> <p class="c-work-list-item_description">Stenger Bike est une entreprise axée sur le client, spécialisée dans les produits et services de cyclisme de haute qualité. Ils offrent des expériences d'achat sans faille, des conseils d'experts et une gamme complète de services, comprenant la vente, la location, des conseils et des services de réparation et d'entretien de vélos de premier ordre.</p> <ul class="c-work-list-item_categories"> <li>Branding</li> <li>Digital</li> <li>E-commerce</li> </ul> <span class="c-work-list-item_notes"> <span>©2024</span> <span> </span> </span> <div class="c-work-list-item_actions"> <a class="c-button -full " data-hover-shuffle="children" href="/fr/projets/stenger-bike" data-icon="→" > <span class="c-button_label" data-hover-shuffle-child> Étude de cas </span> </a> <a class="c-button -full " data-hover-shuffle="children" href="https://stenger-bike.de/en" target="_blank" rel="noopener noreferrer" data-icon="↗" > <span class="c-button_label" data-hover-shuffle-child> Visiter le site </span> </a> </div> </div> </main> </article> <article class="c-work-list_item || c-work-list-item" data-module-work-list-item data-scroll data-scroll-call="inview, WorkListItem"> <header class="c-work-list-item_head" data-hover-shuffle="children"> <span class="c-work-list-item_head-title" data-hover-shuffle-child>Mate Libre</span> <span class="c-work-list-item_head-summary" data-hover-shuffle-child>Boisson</span> <span class="c-work-list-item_head-location"><span>Montréal, Canada</span></span> <button class="c-work-list-item_head-btn" data-work-list-item="toggler" data-work-list-item-label-open="Ouvrir" data-work-list-item-label-close="Fermer" aria-expanded="false" aria-controls="work-list-item-1"> <span class="u-screen-reader-text">Fermer</span> </button> <div class="c-image c-work-list-item_head-visual " data-work-list-item="preview"> <span class="c-image_inner" style="background-image: url('uploads/projects/Mate_Libre/mate-intro-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/Mate_Libre/mate-intro-300w.jpg" > </span> </div> </header> <main class="c-work-list-item_content" data-work-list-item="content" aria-label="Mate Libre preview" id="work-list-item-1"> <div class="c-work-list-item_content-inner" data-work-list-item="content-inner"> <div class="c-work-list-item_gallery" data-module-work-gallery> <div class="c-image c-work-list-item_gallery-item " data-work-list-item="image" data-work-gallery="slide"> <span class="c-image_inner" style="background-image: url('uploads/projects/Mate_Libre/Image_Mate_Libre_%281926x1354%29-10w.jpg');"> <img class="c-image_img " alt="" width="1000" height="703" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20703'%3E%3C/svg%3E" data-src="uploads/projects/Mate_Libre/Image_Mate_Libre_%281926x1354%29-1000w.jpg" > </span> </div> </div> <div class="c-image c-work-list-item_visual " data-work-list-item="preview-target" aria-hidden="true"> <span class="c-image_inner" style="background-image: url('uploads/projects/Mate_Libre/mate-intro-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/Mate_Libre/mate-intro-300w.jpg" > </span> </div> <p class="c-work-list-item_description">Mate Libre, dédié à fournir une énergie piquante entièrement naturelle sans additifs artificiels, exploite la puissance de la yerba mate sud-américaine, un superaliment aux nombreux bienfaits pour la santé.</p> <ul class="c-work-list-item_categories"> <li>Digital</li> <li>E-commerce</li> </ul> <span class="c-work-list-item_notes"> <span>©2023</span> <span> 3 prix </span> </span> <div class="c-work-list-item_actions"> <a class="c-button -full " data-hover-shuffle="children" href="/fr/projets/mate-libre" data-icon="→" > <span class="c-button_label" data-hover-shuffle-child> Étude de cas </span> </a> <a class="c-button -full " data-hover-shuffle="children" href="https://matelibre.com/" target="_blank" rel="noopener noreferrer" data-icon="↗" > <span class="c-button_label" data-hover-shuffle-child> Visiter le site </span> </a> </div> </div> </main> </article> <article class="c-work-list_item || c-work-list-item" data-module-work-list-item data-scroll data-scroll-call="inview, WorkListItem"> <header class="c-work-list-item_head" data-hover-shuffle="children"> <span class="c-work-list-item_head-title" data-hover-shuffle-child>Nord Quantique</span> <span class="c-work-list-item_head-summary" data-hover-shuffle-child>Technologie</span> <span class="c-work-list-item_head-location"><span>Montréal, Canada</span></span> <button class="c-work-list-item_head-btn" data-work-list-item="toggler" data-work-list-item-label-open="Ouvrir" data-work-list-item-label-close="Fermer" aria-expanded="false" aria-controls="work-list-item-2"> <span class="u-screen-reader-text">Fermer</span> </button> <div class="c-image c-work-list-item_head-visual " data-work-list-item="preview"> <span class="c-image_inner" style="background-image: url('uploads/projects/NQ/NQ-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/NQ/NQ-300w.jpg" > </span> </div> </header> <main class="c-work-list-item_content" data-work-list-item="content" aria-label="Nord Quantique preview" id="work-list-item-2"> <div class="c-work-list-item_content-inner" data-work-list-item="content-inner"> <div class="c-work-list-item_gallery" data-module-work-gallery> <div class="c-image c-work-list-item_gallery-item " data-work-list-item="image" data-work-gallery="slide"> <span class="c-image_inner" style="background-image: url('uploads/projects/NQ/Image2_NordQuantique-10w.jpg');"> <img class="c-image_img " alt="" width="1000" height="703" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20703'%3E%3C/svg%3E" data-src="uploads/projects/NQ/Image2_NordQuantique-1000w.jpg" > </span> </div> </div> <div class="c-image c-work-list-item_visual " data-work-list-item="preview-target" aria-hidden="true"> <span class="c-image_inner" style="background-image: url('uploads/projects/NQ/NQ-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/NQ/NQ-300w.jpg" > </span> </div> <p class="c-work-list-item_description">Nord Quantique est une entreprise d'informatique quantique se concentrant sur la correction d'erreurs dans ses processeurs. Leur approche, basée sur une architecture supraconductrice utilisant des qubits bosoniques, vise à réduire le nombre de qubits nécessaires pour créer un ordinateur quantique universel. Leur positionnement en tête de la compétition mondiale découle de cette stratégie axée sur la qualité des qubits plutôt que leur quantitéé</p> <ul class="c-work-list-item_categories"> <li>Digital</li> </ul> <span class="c-work-list-item_notes"> <span>©2024</span> <span> </span> </span> <div class="c-work-list-item_actions"> <a class="c-button -full " data-hover-shuffle="children" href="https://nordquantique.ca/fr" target="_blank" rel="noopener noreferrer" data-icon="↗" > <span class="c-button_label" data-hover-shuffle-child> Visiter le site </span> </a> </div> </div> </main> </article> <article class="c-work-list_item || c-work-list-item" data-module-work-list-item data-scroll data-scroll-call="inview, WorkListItem"> <header class="c-work-list-item_head" data-hover-shuffle="children"> <span class="c-work-list-item_head-title" data-hover-shuffle-child>Hervé Baillargeon</span> <span class="c-work-list-item_head-summary" data-hover-shuffle-child>Cinéma</span> <span class="c-work-list-item_head-location"><span>Montréal, Canada</span></span> <button class="c-work-list-item_head-btn" data-work-list-item="toggler" data-work-list-item-label-open="Ouvrir" data-work-list-item-label-close="Fermer" aria-expanded="false" aria-controls="work-list-item-3"> <span class="u-screen-reader-text">Fermer</span> </button> <div class="c-image c-work-list-item_head-visual " data-work-list-item="preview"> <span class="c-image_inner" style="background-image: url('uploads/projects/Herve/Image_Herve_%28903x568%29-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/Herve/Image_Herve_%28903x568%29-300w.jpg" > </span> </div> </header> <main class="c-work-list-item_content" data-work-list-item="content" aria-label="Hervé Baillargeon preview" id="work-list-item-3"> <div class="c-work-list-item_content-inner" data-work-list-item="content-inner"> <div class="c-work-list-item_gallery" data-module-work-gallery> <div class="c-image c-work-list-item_gallery-item " data-work-list-item="image" data-work-gallery="slide"> <span class="c-image_inner" style="background-image: url('uploads/projects/Herve/Image2_Herve_%281926x1354%29-10w.jpg');"> <img class="c-image_img " alt="" width="1000" height="703" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20703'%3E%3C/svg%3E" data-src="uploads/projects/Herve/Image2_Herve_%281926x1354%29-1000w.jpg" > </span> </div> </div> <div class="c-image c-work-list-item_visual " data-work-list-item="preview-target" aria-hidden="true"> <span class="c-image_inner" style="background-image: url('uploads/projects/Herve/Image_Herve_%28903x568%29-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/Herve/Image_Herve_%28903x568%29-300w.jpg" > </span> </div> <p class="c-work-list-item_description">Hervé Baillargeon est un réalisateur montréalais qui se distingue par sa grande sensibilité et sa capacité à évoquer le drame et l'humour avec justesse.</p> <ul class="c-work-list-item_categories"> <li>Digital</li> </ul> <span class="c-work-list-item_notes"> <span>©2023</span> <span> </span> </span> <div class="c-work-list-item_actions"> <a class="c-button -full " data-hover-shuffle="children" href="https://hervebaillargeon.com/" target="_blank" rel="noopener noreferrer" data-icon="↗" > <span class="c-button_label" data-hover-shuffle-child> Visiter le site </span> </a> </div> </div> </main> </article> <article class="c-work-list_item || c-work-list-item" data-module-work-list-item data-scroll data-scroll-call="inview, WorkListItem"> <header class="c-work-list-item_head" data-hover-shuffle="children"> <span class="c-work-list-item_head-title" data-hover-shuffle-child>Ethnocare</span> <span class="c-work-list-item_head-summary" data-hover-shuffle-child>Médical</span> <span class="c-work-list-item_head-location"><span>Montréal, Canada</span></span> <button class="c-work-list-item_head-btn" data-work-list-item="toggler" data-work-list-item-label-open="Ouvrir" data-work-list-item-label-close="Fermer" aria-expanded="false" aria-controls="work-list-item-4"> <span class="u-screen-reader-text">Fermer</span> </button> <div class="c-image c-work-list-item_head-visual " data-work-list-item="preview"> <span class="c-image_inner" style="background-image: url('uploads/Image_Ethnocare_%28903x568%29-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/Image_Ethnocare_%28903x568%29-300w.jpg" > </span> </div> </header> <main class="c-work-list-item_content" data-work-list-item="content" aria-label="Ethnocare preview" id="work-list-item-4"> <div class="c-work-list-item_content-inner" data-work-list-item="content-inner"> <div class="c-work-list-item_gallery" data-module-work-gallery> <div class="c-image c-work-list-item_gallery-item " data-work-list-item="image" data-work-gallery="slide"> <span class="c-image_inner" style="background-image: url('uploads/Image_Ethnocare_%281926x1354%29-10w.jpg');"> <img class="c-image_img " alt="" width="1000" height="703" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20703'%3E%3C/svg%3E" data-src="uploads/Image_Ethnocare_%281926x1354%29-1000w.jpg" > </span> </div> </div> <div class="c-image c-work-list-item_visual " data-work-list-item="preview-target" aria-hidden="true"> <span class="c-image_inner" style="background-image: url('uploads/Image_Ethnocare_%28903x568%29-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/Image_Ethnocare_%28903x568%29-300w.jpg" > </span> </div> <p class="c-work-list-item_description">Ethnocare se spécialise dans le développement de produits orthopédiques de haute performance qui intègrent les dernières technologies afin de permettre aux personnes vivant avec une limitation physique d’être significativement plus actives et confortables au quotidien. Ethnocare met de l’avant une gamme de solutions évolutives et adaptatives qui améliorent la mobilité et le confort des personnes amputées</p> <ul class="c-work-list-item_categories"> <li>Digital</li> <li>Expérience</li> <li>E-commerce</li> </ul> <span class="c-work-list-item_notes"> <span>©2023</span> <span> </span> </span> <div class="c-work-list-item_actions"> <a class="c-button -full " data-hover-shuffle="children" href="https://ethnocare.ca/" target="_blank" rel="noopener noreferrer" data-icon="↗" > <span class="c-button_label" data-hover-shuffle-child> Visiter le site </span> </a> </div> </div> </main> </article> <article class="c-work-list_item || c-work-list-item" data-module-work-list-item data-scroll data-scroll-call="inview, WorkListItem"> <header class="c-work-list-item_head" data-hover-shuffle="children"> <span class="c-work-list-item_head-title" data-hover-shuffle-child>Candiac</span> <span class="c-work-list-item_head-summary" data-hover-shuffle-child>Municipalité</span> <span class="c-work-list-item_head-location"><span>Candiac, Canada</span></span> <button class="c-work-list-item_head-btn" data-work-list-item="toggler" data-work-list-item-label-open="Ouvrir" data-work-list-item-label-close="Fermer" aria-expanded="false" aria-controls="work-list-item-5"> <span class="u-screen-reader-text">Fermer</span> </button> <div class="c-image c-work-list-item_head-visual " data-work-list-item="preview"> <span class="c-image_inner" style="background-image: url('uploads/projects/Candiac/Image_Candiac_CaseStudy-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/Candiac/Image_Candiac_CaseStudy-300w.jpg" > </span> </div> </header> <main class="c-work-list-item_content" data-work-list-item="content" aria-label="Candiac preview" id="work-list-item-5"> <div class="c-work-list-item_content-inner" data-work-list-item="content-inner"> <div class="c-work-list-item_gallery" data-module-work-gallery> <div class="c-image c-work-list-item_gallery-item " data-work-list-item="image" data-work-gallery="slide"> <span class="c-image_inner" style="background-image: url('uploads/projects/Candiac/Image2_Candiac_CaseStudy-10w.jpg');"> <img class="c-image_img " alt="" width="1000" height="703" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20703'%3E%3C/svg%3E" data-src="uploads/projects/Candiac/Image2_Candiac_CaseStudy-1000w.jpg" > </span> </div> </div> <div class="c-image c-work-list-item_visual " data-work-list-item="preview-target" aria-hidden="true"> <span class="c-image_inner" style="background-image: url('uploads/projects/Candiac/Image_Candiac_CaseStudy-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/Candiac/Image_Candiac_CaseStudy-300w.jpg" > </span> </div> <p class="c-work-list-item_description">La Ville de Candiac, Québec, a de nouveau confié à Locomotive la refonte de son site web. En nous appuyant sur notre travail précédent, nous avons rafraîchi l'image du site, ajouté de nouvelles fonctionnalités et mis un fort accent sur l'accessibilité et l'expérience utilisateur. Notre équipe a veillé à ce que le portail mis à jour reflète la communauté dynamique de Candiac et offre une expérience numérique fluide et inclusive pour tous les utilisateurs.</p> <ul class="c-work-list-item_categories"> <li>Digital</li> </ul> <span class="c-work-list-item_notes"> <span>©2024</span> <span> </span> </span> <div class="c-work-list-item_actions"> <a class="c-button -full " data-hover-shuffle="children" href="https://candiac.ca/" target="_blank" rel="noopener noreferrer" data-icon="↗" > <span class="c-button_label" data-hover-shuffle-child> Visiter le site </span> </a> </div> </div> </main> </article> <article class="c-work-list_item || c-work-list-item" data-module-work-list-item data-scroll data-scroll-call="inview, WorkListItem"> <header class="c-work-list-item_head" data-hover-shuffle="children"> <span class="c-work-list-item_head-title" data-hover-shuffle-child>La Ligne Aide Maltraitance</span> <span class="c-work-list-item_head-summary" data-hover-shuffle-child>Cause sociale</span> <span class="c-work-list-item_head-location"><span>Montréal, Canada</span></span> <button class="c-work-list-item_head-btn" data-work-list-item="toggler" data-work-list-item-label-open="Ouvrir" data-work-list-item-label-close="Fermer" aria-expanded="false" aria-controls="work-list-item-6"> <span class="u-screen-reader-text">Fermer</span> </button> <div class="c-image c-work-list-item_head-visual " data-work-list-item="preview"> <span class="c-image_inner" style="background-image: url('uploads/projects/LAMAA/Image_LAMAA_%28903x568%29-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/LAMAA/Image_LAMAA_%28903x568%29-300w.jpg" > </span> </div> </header> <main class="c-work-list-item_content" data-work-list-item="content" aria-label="La Ligne Aide Maltraitance preview" id="work-list-item-6"> <div class="c-work-list-item_content-inner" data-work-list-item="content-inner"> <div class="c-work-list-item_gallery" data-module-work-gallery> <div class="c-image c-work-list-item_gallery-item " data-work-list-item="image" data-work-gallery="slide"> <span class="c-image_inner" style="background-image: url('uploads/projects/LAMAA/Image2_LAMAA%281926x1354%29-10w.jpg');"> <img class="c-image_img " alt="" width="1000" height="703" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20703'%3E%3C/svg%3E" data-src="uploads/projects/LAMAA/Image2_LAMAA%281926x1354%29-1000w.jpg" > </span> </div> </div> <div class="c-image c-work-list-item_visual " data-work-list-item="preview-target" aria-hidden="true"> <span class="c-image_inner" style="background-image: url('uploads/projects/LAMAA/Image_LAMAA_%28903x568%29-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/LAMAA/Image_LAMAA_%28903x568%29-300w.jpg" > </span> </div> <p class="c-work-list-item_description">La Ligne Aide Maltraitance Adultes Aînés est une ligne téléphonique provinciale d'écoute, de référence et d'accompagnement spécialisée en matière de maltraitance envers les aînés et les adultes en situation de vulnérabilité.</p> <ul class="c-work-list-item_categories"> <li>Digital</li> <li>Contenu</li> </ul> <span class="c-work-list-item_notes"> <span>©2023</span> <span> </span> </span> <div class="c-work-list-item_actions"> <a class="c-button -full " data-hover-shuffle="children" href="https://lignemaltraitance.ca/fr" target="_blank" rel="noopener noreferrer" data-icon="↗" > <span class="c-button_label" data-hover-shuffle-child> Visiter le site </span> </a> </div> </div> </main> </article> <article class="c-work-list_item || c-work-list-item" data-module-work-list-item data-scroll data-scroll-call="inview, WorkListItem"> <header class="c-work-list-item_head" data-hover-shuffle="children"> <span class="c-work-list-item_head-title" data-hover-shuffle-child>Héma-Québec</span> <span class="c-work-list-item_head-summary" data-hover-shuffle-child>Événement</span> <span class="c-work-list-item_head-location"><span>Montréal, Canada</span></span> <button class="c-work-list-item_head-btn" data-work-list-item="toggler" data-work-list-item-label-open="Ouvrir" data-work-list-item-label-close="Fermer" aria-expanded="false" aria-controls="work-list-item-7"> <span class="u-screen-reader-text">Fermer</span> </button> <div class="c-image c-work-list-item_head-visual " data-work-list-item="preview"> <span class="c-image_inner" style="background-image: url('uploads/projects/HEMA-QC/Image_HEMAQC%28903x568%29-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/HEMA-QC/Image_HEMAQC%28903x568%29-300w.jpg" > </span> </div> </header> <main class="c-work-list-item_content" data-work-list-item="content" aria-label="Héma-Québec preview" id="work-list-item-7"> <div class="c-work-list-item_content-inner" data-work-list-item="content-inner"> <div class="c-work-list-item_gallery" data-module-work-gallery> <div class="c-image c-work-list-item_gallery-item " data-work-list-item="image" data-work-gallery="slide"> <span class="c-image_inner" style="background-image: url('uploads/projects/HEMA-QC/Image2_HEMAQC%281926x1354%29-10w.jpg');"> <img class="c-image_img " alt="" width="1000" height="703" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20703'%3E%3C/svg%3E" data-src="uploads/projects/HEMA-QC/Image2_HEMAQC%281926x1354%29-1000w.jpg" > </span> </div> </div> <div class="c-image c-work-list-item_visual " data-work-list-item="preview-target" aria-hidden="true"> <span class="c-image_inner" style="background-image: url('uploads/projects/HEMA-QC/Image_HEMAQC%28903x568%29-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/HEMA-QC/Image_HEMAQC%28903x568%29-300w.jpg" > </span> </div> <p class="c-work-list-item_description">Héma-Québec fête son 25e anniversaire. Découvrez les donneurs, receveurs, bénévoles, employés, partenaires et professionnels du réseau de la santé qui sont au cœur de sa mission et de son histoire.</p> <ul class="c-work-list-item_categories"> <li>Digital</li> <li>Expérience</li> </ul> <span class="c-work-list-item_notes"> <span>©2023</span> <span> </span> </span> <div class="c-work-list-item_actions"> <a class="c-button -full " data-hover-shuffle="children" href="https://25ans.hema-quebec.qc.ca/fr" target="_blank" rel="noopener noreferrer" data-icon="↗" > <span class="c-button_label" data-hover-shuffle-child> Visiter le site </span> </a> </div> </div> </main> </article> <article class="c-work-list_item || c-work-list-item" data-module-work-list-item data-scroll data-scroll-call="inview, WorkListItem"> <header class="c-work-list-item_head" data-hover-shuffle="children"> <span class="c-work-list-item_head-title" data-hover-shuffle-child>Lightship</span> <span class="c-work-list-item_head-summary" data-hover-shuffle-child>Technologie</span> <span class="c-work-list-item_head-location"><span>San Francisco, USA</span></span> <button class="c-work-list-item_head-btn" data-work-list-item="toggler" data-work-list-item-label-open="Ouvrir" data-work-list-item-label-close="Fermer" aria-expanded="false" aria-controls="work-list-item-8"> <span class="u-screen-reader-text">Fermer</span> </button> <div class="c-image c-work-list-item_head-visual " data-work-list-item="preview"> <span class="c-image_inner" style="background-image: url('uploads/projects/LIGHTSHIP/Lightship_Website_2-10w.png');"> <img class="c-image_img " alt="Site web de Lightship" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/LIGHTSHIP/Lightship_Website_2-300w.jpg" > </span> </div> </header> <main class="c-work-list-item_content" data-work-list-item="content" aria-label="Lightship preview" id="work-list-item-8"> <div class="c-work-list-item_content-inner" data-work-list-item="content-inner"> <div class="c-work-list-item_gallery" data-module-work-gallery> <div class="c-image c-work-list-item_gallery-item " data-work-list-item="image" data-work-gallery="slide"> <span class="c-image_inner" style="background-image: url('uploads/projects/LIGHTSHIP/Lightship_Website_1-10w.jpg');"> <img class="c-image_img " alt="" width="1000" height="703" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20703'%3E%3C/svg%3E" data-src="uploads/projects/LIGHTSHIP/Lightship_Website_1-1000w.jpg" > </span> </div> </div> <div class="c-image c-work-list-item_visual " data-work-list-item="preview-target" aria-hidden="true"> <span class="c-image_inner" style="background-image: url('uploads/projects/LIGHTSHIP/Lightship_Website_2-10w.png');"> <img class="c-image_img " alt="Site web de Lightship" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/LIGHTSHIP/Lightship_Website_2-300w.jpg" > </span> </div> <p class="c-work-list-item_description">Lightship est une entreprise américaine novatrice qui révolutionne le monde du véhicule récréatif. Avec une forte orientation vers la durabilité et la préservation de l'environnement, Lightship a introduit les premières caravanes de voyage entièrement électriques au monde, faisant entrer les voyages dans l'ère électrique.</p> <ul class="c-work-list-item_categories"> <li>Digital</li> <li>Expérience</li> <li>E-commerce</li> </ul> <span class="c-work-list-item_notes"> <span>©2023</span> <span> 2 prix </span> </span> <div class="c-work-list-item_actions"> <a class="c-button -full " data-hover-shuffle="children" href="/fr/projets/lightship" data-icon="→" > <span class="c-button_label" data-hover-shuffle-child> Étude de cas </span> </a> <a class="c-button -full " data-hover-shuffle="children" href="https://lightshiprv.com" target="_blank" rel="noopener noreferrer" data-icon="↗" > <span class="c-button_label" data-hover-shuffle-child> Visiter le site </span> </a> </div> </div> </main> </article> <article class="c-work-list_item || c-work-list-item" data-module-work-list-item data-scroll data-scroll-call="inview, WorkListItem"> <header class="c-work-list-item_head" data-hover-shuffle="children"> <span class="c-work-list-item_head-title" data-hover-shuffle-child>PP Fragment</span> <span class="c-work-list-item_head-summary" data-hover-shuffle-child>Typographie</span> <span class="c-work-list-item_head-location"><span>Montréal, Canada</span></span> <button class="c-work-list-item_head-btn" data-work-list-item="toggler" data-work-list-item-label-open="Ouvrir" data-work-list-item-label-close="Fermer" aria-expanded="false" aria-controls="work-list-item-9"> <span class="u-screen-reader-text">Fermer</span> </button> <div class="c-image c-work-list-item_head-visual " data-work-list-item="preview"> <span class="c-image_inner" style="background-image: url('uploads/projects/PP_FRAGMENT/PP_Fragment_Small-10w.png');"> <img class="c-image_img " alt="Site web de Fragment" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/PP_FRAGMENT/PP_Fragment_Small-300w.jpg" > </span> </div> </header> <main class="c-work-list-item_content" data-work-list-item="content" aria-label="PP Fragment preview" id="work-list-item-9"> <div class="c-work-list-item_content-inner" data-work-list-item="content-inner"> <div class="c-work-list-item_gallery" data-module-work-gallery> <div class="c-image c-work-list-item_gallery-item " data-work-list-item="image" data-work-gallery="slide"> <span class="c-image_inner" style="background-image: url('uploads/projects/PP_FRAGMENT/PP_Fragment_Big-10w.jpg');"> <img class="c-image_img " alt="PP Fragment" width="1000" height="704" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20704'%3E%3C/svg%3E" data-src="uploads/projects/PP_FRAGMENT/PP_Fragment_Big-1000w.jpg" > </span> </div> </div> <div class="c-image c-work-list-item_visual " data-work-list-item="preview-target" aria-hidden="true"> <span class="c-image_inner" style="background-image: url('uploads/projects/PP_FRAGMENT/PP_Fragment_Small-10w.png');"> <img class="c-image_img " alt="Site web de Fragment" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/PP_FRAGMENT/PP_Fragment_Small-300w.jpg" > </span> </div> <p class="c-work-list-item_description">PP Fragment est un ensemble de polices conçu par Pangram Pangram, une fonderie basée à Montréal. Cet ensemble de polices puise son inspiration dans la typographie et la signalisation vintage, mélangeant harmonieusement des formes de lettres du 19e siècle avec une typographie moderne. Cette collection est la 35e publication de Pangram, et chaque police de l'ensemble possède des caractéristiques distinctes qui se complètent parfaitement, créant un design cohérent.</p> <ul class="c-work-list-item_categories"> <li>Digital</li> <li>Expérience</li> <li>Contenu</li> </ul> <span class="c-work-list-item_notes"> <span>©2022</span> <span> 2 prix </span> </span> <div class="c-work-list-item_actions"> <a class="c-button -full " data-hover-shuffle="children" href="/fr/projets/pp-fragment" data-icon="→" > <span class="c-button_label" data-hover-shuffle-child> Étude de cas </span> </a> <a class="c-button -full " data-hover-shuffle="children" href="https://pp-fragment.com" target="_blank" rel="noopener noreferrer" data-icon="↗" > <span class="c-button_label" data-hover-shuffle-child> Visiter le site </span> </a> </div> </div> </main> </article> <article class="c-work-list_item || c-work-list-item" data-module-work-list-item data-scroll data-scroll-call="inview, WorkListItem"> <header class="c-work-list-item_head" data-hover-shuffle="children"> <span class="c-work-list-item_head-title" data-hover-shuffle-child>SWTCH</span> <span class="c-work-list-item_head-summary" data-hover-shuffle-child>Technologie</span> <span class="c-work-list-item_head-location"><span>Toronto, Canada</span></span> <button class="c-work-list-item_head-btn" data-work-list-item="toggler" data-work-list-item-label-open="Ouvrir" data-work-list-item-label-close="Fermer" aria-expanded="false" aria-controls="work-list-item-10"> <span class="u-screen-reader-text">Fermer</span> </button> <div class="c-image c-work-list-item_head-visual " data-work-list-item="preview"> <span class="c-image_inner" style="background-image: url('uploads/projects/SWTCH/Image_Nom_du_projet_%28903x568%29-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/SWTCH/Image_Nom_du_projet_%28903x568%29-300w.jpg" > </span> </div> </header> <main class="c-work-list-item_content" data-work-list-item="content" aria-label="SWTCH preview" id="work-list-item-10"> <div class="c-work-list-item_content-inner" data-work-list-item="content-inner"> <div class="c-work-list-item_gallery" data-module-work-gallery> <div class="c-image c-work-list-item_gallery-item " data-work-list-item="image" data-work-gallery="slide"> <span class="c-image_inner" style="background-image: url('uploads/projects/SWTCH/Image2_Nom_du_projet_%281926x1354%29-10w.jpg');"> <img class="c-image_img " alt="" width="1000" height="703" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20703'%3E%3C/svg%3E" data-src="uploads/projects/SWTCH/Image2_Nom_du_projet_%281926x1354%29-1000w.jpg" > </span> </div> </div> <div class="c-image c-work-list-item_visual " data-work-list-item="preview-target" aria-hidden="true"> <span class="c-image_inner" style="background-image: url('uploads/projects/SWTCH/Image_Nom_du_projet_%28903x568%29-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/SWTCH/Image_Nom_du_projet_%28903x568%29-300w.jpg" > </span> </div> <p class="c-work-list-item_description">SWTCH est un pionnier dans le développement de solutions de recharge pour véhicules électriques destinées aux immeubles multifamiliaux et commerciaux. À travers l'Amérique du Nord, la solution SWTCH utilise l'infrastructure électrique existante du bâtiment pour déployer un système de recharge rentable et adaptatif qui fonctionne pour les conducteurs de véhicules électriques d’aujourd'hui et de demain.</p> <ul class="c-work-list-item_categories"> <li>Branding</li> <li>Digital</li> <li>Expérience</li> </ul> <span class="c-work-list-item_notes"> <span>©2023</span> <span> </span> </span> <div class="c-work-list-item_actions"> <a class="c-button -full " data-hover-shuffle="children" href="https://swtchenergy.com/" target="_blank" rel="noopener noreferrer" data-icon="↗" > <span class="c-button_label" data-hover-shuffle-child> Visiter le site </span> </a> </div> </div> </main> </article> <article class="c-work-list_item || c-work-list-item" data-module-work-list-item data-scroll data-scroll-call="inview, WorkListItem"> <header class="c-work-list-item_head" data-hover-shuffle="children"> <span class="c-work-list-item_head-title" data-hover-shuffle-child>Books of Design</span> <span class="c-work-list-item_head-summary" data-hover-shuffle-child>Arts et culture</span> <span class="c-work-list-item_head-location"><span>Montréal, Canada</span></span> <button class="c-work-list-item_head-btn" data-work-list-item="toggler" data-work-list-item-label-open="Ouvrir" data-work-list-item-label-close="Fermer" aria-expanded="false" aria-controls="work-list-item-11"> <span class="u-screen-reader-text">Fermer</span> </button> <div class="c-image c-work-list-item_head-visual " data-work-list-item="preview"> <span class="c-image_inner" style="background-image: url('uploads/projects/Books_of_Design/Image_Nom_du_projet_%28903x568%29-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/Books_of_Design/Image_Nom_du_projet_%28903x568%29-300w.jpg" > </span> </div> </header> <main class="c-work-list-item_content" data-work-list-item="content" aria-label="Books of Design preview" id="work-list-item-11"> <div class="c-work-list-item_content-inner" data-work-list-item="content-inner"> <div class="c-work-list-item_gallery" data-module-work-gallery> <div class="c-image c-work-list-item_gallery-item " data-work-list-item="image" data-work-gallery="slide"> <span class="c-image_inner" style="background-image: url('uploads/projects/Books_of_Design/Image2_Nom_du_projet_%281926x1354%29-10w.jpg');"> <img class="c-image_img " alt="" width="1000" height="703" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20703'%3E%3C/svg%3E" data-src="uploads/projects/Books_of_Design/Image2_Nom_du_projet_%281926x1354%29-1000w.jpg" > </span> </div> </div> <div class="c-image c-work-list-item_visual " data-work-list-item="preview-target" aria-hidden="true"> <span class="c-image_inner" style="background-image: url('uploads/projects/Books_of_Design/Image_Nom_du_projet_%28903x568%29-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/Books_of_Design/Image_Nom_du_projet_%28903x568%29-300w.jpg" > </span> </div> <p class="c-work-list-item_description">The Books of Design est une ode aux designers. Par ce projet, le client designstripe souhaite célébrer un grand nombre de créateurs qui ont façonné l’évolution du design, par la mise en lumière de leur histoire, mouvement artistique et support visuel.</p> <ul class="c-work-list-item_categories"> <li>Branding</li> <li>Digital</li> <li>Expérience</li> <li>Contenu</li> </ul> <span class="c-work-list-item_notes"> <span>©2023</span> <span> 3 prix </span> </span> <div class="c-work-list-item_actions"> <a class="c-button -full " data-hover-shuffle="children" href="/fr/projets/books-of-desing" data-icon="→" > <span class="c-button_label" data-hover-shuffle-child> Étude de cas </span> </a> <a class="c-button -full " data-hover-shuffle="children" href="https://booksofdesign.designstripe.com/artists/alphonse-mucha" target="_blank" rel="noopener noreferrer" data-icon="↗" > <span class="c-button_label" data-hover-shuffle-child> Visiter le site </span> </a> </div> </div> </main> </article> <article class="c-work-list_item || c-work-list-item" data-module-work-list-item data-scroll data-scroll-call="inview, WorkListItem"> <header class="c-work-list-item_head" data-hover-shuffle="children"> <span class="c-work-list-item_head-title" data-hover-shuffle-child>PandaPay</span> <span class="c-work-list-item_head-summary" data-hover-shuffle-child>Fintech</span> <span class="c-work-list-item_head-location"><span>Montréal, Canada</span></span> <button class="c-work-list-item_head-btn" data-work-list-item="toggler" data-work-list-item-label-open="Ouvrir" data-work-list-item-label-close="Fermer" aria-expanded="false" aria-controls="work-list-item-12"> <span class="u-screen-reader-text">Fermer</span> </button> <div class="c-image c-work-list-item_head-visual " data-work-list-item="preview"> <span class="c-image_inner" style="background-image: url('uploads/projects/PandaPay/Image_Nom_du_projet_%28903x568%29-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/PandaPay/Image_Nom_du_projet_%28903x568%29-300w.jpg" > </span> </div> </header> <main class="c-work-list-item_content" data-work-list-item="content" aria-label="PandaPay preview" id="work-list-item-12"> <div class="c-work-list-item_content-inner" data-work-list-item="content-inner"> <div class="c-work-list-item_gallery" data-module-work-gallery> <div class="c-image c-work-list-item_gallery-item " data-work-list-item="image" data-work-gallery="slide"> <span class="c-image_inner" style="background-image: url('uploads/projects/PandaPay/Image2_Nom_du_projet_%281926x1354%29-10w.jpg');"> <img class="c-image_img " alt="" width="1000" height="703" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20703'%3E%3C/svg%3E" data-src="uploads/projects/PandaPay/Image2_Nom_du_projet_%281926x1354%29-1000w.jpg" > </span> </div> </div> <div class="c-image c-work-list-item_visual " data-work-list-item="preview-target" aria-hidden="true"> <span class="c-image_inner" style="background-image: url('uploads/projects/PandaPay/Image_Nom_du_projet_%28903x568%29-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/PandaPay/Image_Nom_du_projet_%28903x568%29-300w.jpg" > </span> </div> <p class="c-work-list-item_description">PandaPay est une entreprise de solutions de paiement qui fait les choses différemment pour offrir aux entrepreneurs un véritable partenaire qui vous facilitera la vie simplement, sans se cacher. Noir ou blanc, pas de zone grise. PandaPay sait ce que c'est que d'être un entrepreneur et se soucie vraiment de la réussite de chacun.</p> <ul class="c-work-list-item_categories"> <li>Digital</li> <li>Expérience</li> <li>Contenu</li> </ul> <span class="c-work-list-item_notes"> <span>©2023</span> <span> </span> </span> <div class="c-work-list-item_actions"> <a class="c-button -full " data-hover-shuffle="children" href="https://pandapay.ca/fr/" target="_blank" rel="noopener noreferrer" data-icon="↗" > <span class="c-button_label" data-hover-shuffle-child> Visiter le site </span> </a> </div> </div> </main> </article> <article class="c-work-list_item || c-work-list-item" data-module-work-list-item data-scroll data-scroll-call="inview, WorkListItem"> <header class="c-work-list-item_head" data-hover-shuffle="children"> <span class="c-work-list-item_head-title" data-hover-shuffle-child>Carlton Villa</span> <span class="c-work-list-item_head-summary" data-hover-shuffle-child>Immobilier</span> <span class="c-work-list-item_head-location"><span>Barbade, Caraïbes</span></span> <button class="c-work-list-item_head-btn" data-work-list-item="toggler" data-work-list-item-label-open="Ouvrir" data-work-list-item-label-close="Fermer" aria-expanded="false" aria-controls="work-list-item-13"> <span class="u-screen-reader-text">Fermer</span> </button> <div class="c-image c-work-list-item_head-visual " data-work-list-item="preview"> <span class="c-image_inner" style="background-image: url('uploads/projects/Barbados/Image_Nom_du_projet_%28903x568%29-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/Barbados/Image_Nom_du_projet_%28903x568%29-300w.jpg" > </span> </div> </header> <main class="c-work-list-item_content" data-work-list-item="content" aria-label="Carlton Villa preview" id="work-list-item-13"> <div class="c-work-list-item_content-inner" data-work-list-item="content-inner"> <div class="c-work-list-item_gallery" data-module-work-gallery> <div class="c-image c-work-list-item_gallery-item " data-work-list-item="image" data-work-gallery="slide"> <span class="c-image_inner" style="background-image: url('uploads/projects/Barbados/Image2_Nom_du_projet_%281926x1354%29-10w.jpg');"> <img class="c-image_img " alt="" width="1000" height="703" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20703'%3E%3C/svg%3E" data-src="uploads/projects/Barbados/Image2_Nom_du_projet_%281926x1354%29-1000w.jpg" > </span> </div> </div> <div class="c-image c-work-list-item_visual " data-work-list-item="preview-target" aria-hidden="true"> <span class="c-image_inner" style="background-image: url('uploads/projects/Barbados/Image_Nom_du_projet_%28903x568%29-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/Barbados/Image_Nom_du_projet_%28903x568%29-300w.jpg" > </span> </div> <p class="c-work-list-item_description">Carlton Villa est une propriété exclusive en bord de mer à Saint James, Barbade, proposant des espaces de vie spacieux, des finitions haut de gamme, une grande piscine et un accès direct à la plage. Cette propriété exclusive incarne l'opulence des Caraïbes, invitant les personnes fortunées et les investisseurs internationaux à posséder un coin de paradis dans un lieu prestigieux, entouré de commodités haut de gamme.</p> <ul class="c-work-list-item_categories"> <li>Branding</li> <li>Digital</li> <li>Expérience</li> </ul> <span class="c-work-list-item_notes"> <span>©2023</span> <span> </span> </span> <div class="c-work-list-item_actions"> <a class="c-button -full " data-hover-shuffle="children" href="/fr/projets/carlton-villa" data-icon="→" > <span class="c-button_label" data-hover-shuffle-child> Étude de cas </span> </a> <a class="c-button -full " data-hover-shuffle="children" href="https://carltonvilla.com/" target="_blank" rel="noopener noreferrer" data-icon="↗" > <span class="c-button_label" data-hover-shuffle-child> Visiter le site </span> </a> </div> </div> </main> </article> <article class="c-work-list_item || c-work-list-item" data-module-work-list-item data-scroll data-scroll-call="inview, WorkListItem"> <header class="c-work-list-item_head" data-hover-shuffle="children"> <span class="c-work-list-item_head-title" data-hover-shuffle-child>Age of Union</span> <span class="c-work-list-item_head-summary" data-hover-shuffle-child>Cause sociale</span> <span class="c-work-list-item_head-location"><span>Montréal, Canada</span></span> <button class="c-work-list-item_head-btn" data-work-list-item="toggler" data-work-list-item-label-open="Ouvrir" data-work-list-item-label-close="Fermer" aria-expanded="false" aria-controls="work-list-item-14"> <span class="u-screen-reader-text">Fermer</span> </button> <div class="c-image c-work-list-item_head-visual " data-work-list-item="preview"> <span class="c-image_inner" style="background-image: url('uploads/projects/AOU/AOU_thumbnail-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/AOU/AOU_thumbnail-300w.png" > </span> </div> </header> <main class="c-work-list-item_content" data-work-list-item="content" aria-label="Age of Union preview" id="work-list-item-14"> <div class="c-work-list-item_content-inner" data-work-list-item="content-inner"> <div class="c-work-list-item_gallery" data-module-work-gallery> <div class="c-image c-work-list-item_gallery-item " data-work-list-item="image" data-work-gallery="slide"> <span class="c-image_inner" style="background-image: url('uploads/projects/AOU/main_image-10w.png');"> <img class="c-image_img " alt="" width="1000" height="703" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20703'%3E%3C/svg%3E" data-src="uploads/projects/AOU/main_image-1000w.png" > </span> </div> </div> <div class="c-image c-work-list-item_visual " data-work-list-item="preview-target" aria-hidden="true"> <span class="c-image_inner" style="background-image: url('uploads/projects/AOU/AOU_thumbnail-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/AOU/AOU_thumbnail-300w.png" > </span> </div> <p class="c-work-list-item_description">Age of Union, fondé par Dax Dasilva, un leader de la technologie et militant écologiste, est une alliance environnementale qui vise à fournir de l'aide à une communauté mondiale de créateurs de changement travaillant sur le terrain pour protéger les écosystèmes menacés de la planète. L'alliance s'est engagée à fournir 40 millions de dollars pour financer des initiatives dans cinq pays afin d'atteindre cet objectif.</p> <ul class="c-work-list-item_categories"> <li>Digital</li> <li>Expérience</li> </ul> <span class="c-work-list-item_notes"> <span>©2022</span> <span> 3 prix </span> </span> <div class="c-work-list-item_actions"> <a class="c-button -full " data-hover-shuffle="children" href="/fr/projets/age-of-union" data-icon="→" > <span class="c-button_label" data-hover-shuffle-child> Étude de cas </span> </a> <a class="c-button -full " data-hover-shuffle="children" href="https://ageofunion.com" target="_blank" rel="noopener noreferrer" data-icon="↗" > <span class="c-button_label" data-hover-shuffle-child> Visiter le site </span> </a> </div> </div> </main> </article> <article class="c-work-list_item || c-work-list-item" data-module-work-list-item data-scroll data-scroll-call="inview, WorkListItem"> <header class="c-work-list-item_head" data-hover-shuffle="children"> <span class="c-work-list-item_head-title" data-hover-shuffle-child>Pangram Pangram Foundry</span> <span class="c-work-list-item_head-summary" data-hover-shuffle-child>Typographie</span> <span class="c-work-list-item_head-location"><span>Montréal, Canada</span></span> <button class="c-work-list-item_head-btn" data-work-list-item="toggler" data-work-list-item-label-open="Ouvrir" data-work-list-item-label-close="Fermer" aria-expanded="false" aria-controls="work-list-item-15"> <span class="u-screen-reader-text">Fermer</span> </button> <div class="c-image c-work-list-item_head-visual " data-work-list-item="preview"> <span class="c-image_inner" style="background-image: url('uploads/projects/PANGRAM/Frame_1466-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/PANGRAM/Frame_1466-300w.png" > </span> </div> </header> <main class="c-work-list-item_content" data-work-list-item="content" aria-label="Pangram Pangram Foundry preview" id="work-list-item-15"> <div class="c-work-list-item_content-inner" data-work-list-item="content-inner"> <div class="c-work-list-item_gallery" data-module-work-gallery> <div class="c-image c-work-list-item_gallery-item " data-work-list-item="image" data-work-gallery="slide"> <span class="c-image_inner" style="background-image: url('uploads/projects/PANGRAM/visual_2_%28motion%29_%281%29-10w.png');"> <img class="c-image_img " alt="" width="1000" height="703" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20703'%3E%3C/svg%3E" data-src="uploads/projects/PANGRAM/visual_2_%28motion%29_%281%29-1000w.png" > </span> </div> </div> <div class="c-image c-work-list-item_visual " data-work-list-item="preview-target" aria-hidden="true"> <span class="c-image_inner" style="background-image: url('uploads/projects/PANGRAM/Frame_1466-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/PANGRAM/Frame_1466-300w.png" > </span> </div> <p class="c-work-list-item_description">Pangram Pangram Foundry propose des polices de caractères haut-de-gamme aux designers depuis 2015. La fonderie donne un accès gratuit à des fontes de qualité pour un usage personnel et vend des licences pour des projets commerciaux.</p> <ul class="c-work-list-item_categories"> <li>Digital</li> <li>Expérience</li> <li>E-commerce</li> </ul> <span class="c-work-list-item_notes"> <span>©2023</span> <span> 6 prix </span> </span> <div class="c-work-list-item_actions"> <a class="c-button -full " data-hover-shuffle="children" href="/fr/projets/pangram-pangram-foundry" data-icon="→" > <span class="c-button_label" data-hover-shuffle-child> Étude de cas </span> </a> <a class="c-button -full " data-hover-shuffle="children" href="https://pangrampangram.com/" target="_blank" rel="noopener noreferrer" data-icon="↗" > <span class="c-button_label" data-hover-shuffle-child> Visiter le site </span> </a> </div> </div> </main> </article> <article class="c-work-list_item || c-work-list-item" data-module-work-list-item data-scroll data-scroll-call="inview, WorkListItem"> <header class="c-work-list-item_head" data-hover-shuffle="children"> <span class="c-work-list-item_head-title" data-hover-shuffle-child>Haven Studios</span> <span class="c-work-list-item_head-summary" data-hover-shuffle-child>Divertissement</span> <span class="c-work-list-item_head-location"><span>Montréal, Canada</span></span> <button class="c-work-list-item_head-btn" data-work-list-item="toggler" data-work-list-item-label-open="Ouvrir" data-work-list-item-label-close="Fermer" aria-expanded="false" aria-controls="work-list-item-16"> <span class="u-screen-reader-text">Fermer</span> </button> <div class="c-image c-work-list-item_head-visual " data-work-list-item="preview"> <span class="c-image_inner" style="background-image: url('uploads/projects/HAVEN/CTA_PORTALS-10w.png');"> <img class="c-image_img " alt="" width="300" height="185" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20185'%3E%3C/svg%3E" data-src="uploads/projects/HAVEN/CTA_PORTALS-300w.png" > </span> </div> </header> <main class="c-work-list-item_content" data-work-list-item="content" aria-label="Haven Studios preview" id="work-list-item-16"> <div class="c-work-list-item_content-inner" data-work-list-item="content-inner"> <div class="c-work-list-item_gallery" data-module-work-gallery> <div class="c-image c-work-list-item_gallery-item " data-work-list-item="image" data-work-gallery="slide"> <span class="c-image_inner" style="background-image: url('uploads/projects/HAVEN/Frame_1462-10w.png');"> <img class="c-image_img " alt="" width="1000" height="703" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20703'%3E%3C/svg%3E" data-src="uploads/projects/HAVEN/Frame_1462-1000w.png" > </span> </div> </div> <div class="c-image c-work-list-item_visual " data-work-list-item="preview-target" aria-hidden="true"> <span class="c-image_inner" style="background-image: url('uploads/projects/HAVEN/CTA_PORTALS-10w.png');"> <img class="c-image_img " alt="" width="300" height="185" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20185'%3E%3C/svg%3E" data-src="uploads/projects/HAVEN/CTA_PORTALS-300w.png" > </span> </div> <p class="c-work-list-item_description">Haven Studios est un espace créatif où les idées, la passion et l'optimisme intrépide prospèrent. Nouvellement acquise par Sony, l'équipe est liée par leur passion pour les grands jeux et les merveilleux souvenirs qu'ils créent ensemble.</p> <ul class="c-work-list-item_categories"> <li>Digital</li> <li>Expérience</li> </ul> <span class="c-work-list-item_notes"> <span>©2022</span> <span> 2 prix </span> </span> <div class="c-work-list-item_actions"> <a class="c-button -full " data-hover-shuffle="children" href="/fr/projets/haven-studios" data-icon="→" > <span class="c-button_label" data-hover-shuffle-child> Étude de cas </span> </a> <a class="c-button -full " data-hover-shuffle="children" href="https://havenstudios.com" target="_blank" rel="noopener noreferrer" data-icon="↗" > <span class="c-button_label" data-hover-shuffle-child> Visiter le site </span> </a> </div> </div> </main> </article> <article class="c-work-list_item || c-work-list-item" data-module-work-list-item data-scroll data-scroll-call="inview, WorkListItem"> <header class="c-work-list-item_head" data-hover-shuffle="children"> <span class="c-work-list-item_head-title" data-hover-shuffle-child>Musée Virtuel Elektra </span> <span class="c-work-list-item_head-summary" data-hover-shuffle-child>Arts et culture</span> <span class="c-work-list-item_head-location"><span>Montréal, Canada</span></span> <button class="c-work-list-item_head-btn" data-work-list-item="toggler" data-work-list-item-label-open="Ouvrir" data-work-list-item-label-close="Fermer" aria-expanded="false" aria-controls="work-list-item-17"> <span class="u-screen-reader-text">Fermer</span> </button> <div class="c-image c-work-list-item_head-visual " data-work-list-item="preview"> <span class="c-image_inner" style="background-image: url('uploads/projects/ELEKTRA/Rectangle_109-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/ELEKTRA/Rectangle_109-300w.png" > </span> </div> </header> <main class="c-work-list-item_content" data-work-list-item="content" aria-label="Musée Virtuel Elektra preview" id="work-list-item-17"> <div class="c-work-list-item_content-inner" data-work-list-item="content-inner"> <div class="c-work-list-item_gallery" data-module-work-gallery> <div class="c-image c-work-list-item_gallery-item " data-work-list-item="image" data-work-gallery="slide"> <span class="c-image_inner" style="background-image: url('uploads/projects/ELEKTRA/visual_2_%28motion%29-10w.png');"> <img class="c-image_img " alt="" width="1000" height="703" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20703'%3E%3C/svg%3E" data-src="uploads/projects/ELEKTRA/visual_2_%28motion%29-1000w.png" > </span> </div> </div> <div class="c-image c-work-list-item_visual " data-work-list-item="preview-target" aria-hidden="true"> <span class="c-image_inner" style="background-image: url('uploads/projects/ELEKTRA/Rectangle_109-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/ELEKTRA/Rectangle_109-300w.png" > </span> </div> <p class="c-work-list-item_description">Elektra Virtual Museum (EVM) est un tout nouvel univers en immersion 3D, libéré des contraintes du monde réel, créé pour encourager et promouvoir la recherche et la création contemporaine.</p> <ul class="c-work-list-item_categories"> <li>Digital</li> <li>Expérience</li> </ul> <span class="c-work-list-item_notes"> <span>©2024</span> <span> 2 prix </span> </span> <div class="c-work-list-item_actions"> <a class="c-button -full " data-hover-shuffle="children" href="/fr/projets/musee-virtuel-elektra" data-icon="→" > <span class="c-button_label" data-hover-shuffle-child> Étude de cas </span> </a> <a class="c-button -full " data-hover-shuffle="children" href="https://evm.elektramontreal.ca" target="_blank" rel="noopener noreferrer" data-icon="↗" > <span class="c-button_label" data-hover-shuffle-child> Visiter le site </span> </a> </div> </div> </main> </article> <article class="c-work-list_item || c-work-list-item" data-module-work-list-item data-scroll data-scroll-call="inview, WorkListItem"> <header class="c-work-list-item_head" data-hover-shuffle="children"> <span class="c-work-list-item_head-title" data-hover-shuffle-child>DrDabber</span> <span class="c-work-list-item_head-summary" data-hover-shuffle-child>Loisirs</span> <span class="c-work-list-item_head-location"><span>Las Vegas, USA</span></span> <button class="c-work-list-item_head-btn" data-work-list-item="toggler" data-work-list-item-label-open="Ouvrir" data-work-list-item-label-close="Fermer" aria-expanded="false" aria-controls="work-list-item-18"> <span class="u-screen-reader-text">Fermer</span> </button> <div class="c-image c-work-list-item_head-visual " data-work-list-item="preview"> <span class="c-image_inner" style="background-image: url('uploads/projects/DABBER/vlcsnap-2021-11-08-16h26m21s557-10w.png');"> <img class="c-image_img " alt="" width="300" height="186" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20186'%3E%3C/svg%3E" data-src="uploads/projects/DABBER/vlcsnap-2021-11-08-16h26m21s557-300w.png" > </span> </div> </header> <main class="c-work-list-item_content" data-work-list-item="content" aria-label="DrDabber preview" id="work-list-item-18"> <div class="c-work-list-item_content-inner" data-work-list-item="content-inner"> <div class="c-work-list-item_gallery" data-module-work-gallery> <div class="c-image c-work-list-item_gallery-item " data-work-list-item="image" data-work-gallery="slide"> <span class="c-image_inner" style="background-image: url('uploads/projects/DABBER/Frame_1465-10w.png');"> <img class="c-image_img " alt="" width="1000" height="703" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20703'%3E%3C/svg%3E" data-src="uploads/projects/DABBER/Frame_1465-1000w.png" > </span> </div> </div> <div class="c-image c-work-list-item_visual " data-work-list-item="preview-target" aria-hidden="true"> <span class="c-image_inner" style="background-image: url('uploads/projects/DABBER/vlcsnap-2021-11-08-16h26m21s557-10w.png');"> <img class="c-image_img " alt="" width="300" height="186" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20186'%3E%3C/svg%3E" data-src="uploads/projects/DABBER/vlcsnap-2021-11-08-16h26m21s557-300w.png" > </span> </div> <p class="c-work-list-item_description">Dr. Dabber est une entreprise de vaporisateur orientée technologie qui conçoit des produits pour répondre aux besoins spécifiques de ses clients. Ils privilégient la performance et la qualité, tout en promouvant une expérience positive et agréable pour l'utilisateur.</p> <ul class="c-work-list-item_categories"> <li>Branding</li> <li>Digital</li> <li>Expérience</li> <li>E-commerce</li> <li>Contenu</li> </ul> <span class="c-work-list-item_notes"> <span>©2022</span> <span> 3 prix </span> </span> <div class="c-work-list-item_actions"> <a class="c-button -full " data-hover-shuffle="children" href="/fr/projets/drdabber" data-icon="→" > <span class="c-button_label" data-hover-shuffle-child> Étude de cas </span> </a> <a class="c-button -full " data-hover-shuffle="children" href="https://experience.drdabber.com/" target="_blank" rel="noopener noreferrer" data-icon="↗" > <span class="c-button_label" data-hover-shuffle-child> Visiter le site </span> </a> </div> </div> </main> </article> <article class="c-work-list_item || c-work-list-item" data-module-work-list-item data-scroll data-scroll-call="inview, WorkListItem"> <header class="c-work-list-item_head" data-hover-shuffle="children"> <span class="c-work-list-item_head-title" data-hover-shuffle-child>Baillat Studio</span> <span class="c-work-list-item_head-summary" data-hover-shuffle-child>Design et production</span> <span class="c-work-list-item_head-location"><span>Montréal, Canada</span></span> <button class="c-work-list-item_head-btn" data-work-list-item="toggler" data-work-list-item-label-open="Ouvrir" data-work-list-item-label-close="Fermer" aria-expanded="false" aria-controls="work-list-item-19"> <span class="u-screen-reader-text">Fermer</span> </button> <div class="c-image c-work-list-item_head-visual " data-work-list-item="preview"> <span class="c-image_inner" style="background-image: url('uploads/projects/BAILLAT/Screen_Shot_2022-10-17_at_1.28_1-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/BAILLAT/Screen_Shot_2022-10-17_at_1.28_1-300w.png" > </span> </div> </header> <main class="c-work-list-item_content" data-work-list-item="content" aria-label="Baillat Studio preview" id="work-list-item-19"> <div class="c-work-list-item_content-inner" data-work-list-item="content-inner"> <div class="c-work-list-item_gallery" data-module-work-gallery> <div class="c-image c-work-list-item_gallery-item " data-work-list-item="image" data-work-gallery="slide"> <span class="c-image_inner" style="background-image: url('uploads/projects/BAILLAT/baillat_visuel_main-10w.png');"> <img class="c-image_img " alt="" width="3852" height="2708" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%203852%202708'%3E%3C/svg%3E" data-src="uploads/projects/BAILLAT/baillat_visuel_main-1000w.png" > </span> </div> </div> <div class="c-image c-work-list-item_visual " data-work-list-item="preview-target" aria-hidden="true"> <span class="c-image_inner" style="background-image: url('uploads/projects/BAILLAT/Screen_Shot_2022-10-17_at_1.28_1-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/BAILLAT/Screen_Shot_2022-10-17_at_1.28_1-300w.png" > </span> </div> <p class="c-work-list-item_description">Baillat est un studio créatif à Montréal qui utilise l'art, le design et l'émotion pour créer des identités et des expériences uniques. L'équipe de Baillat Studio aborde les projets avec intuition, émotion et une volonté d'expérimenter, ce qui leur permet de repousser les limites et de créer le travail époustouflant pour lequel ils sont connus.</p> <ul class="c-work-list-item_categories"> <li>Digital</li> </ul> <span class="c-work-list-item_notes"> <span>©2021</span> <span> 5 prix </span> </span> <div class="c-work-list-item_actions"> <a class="c-button -full " data-hover-shuffle="children" href="/fr/projets/baillat-studio" data-icon="→" > <span class="c-button_label" data-hover-shuffle-child> Étude de cas </span> </a> <a class="c-button -full " data-hover-shuffle="children" href="https://baillatstudio.com" target="_blank" rel="noopener noreferrer" data-icon="↗" > <span class="c-button_label" data-hover-shuffle-child> Visiter le site </span> </a> </div> </div> </main> </article> <article class="c-work-list_item || c-work-list-item" data-module-work-list-item data-scroll data-scroll-call="inview, WorkListItem"> <header class="c-work-list-item_head" data-hover-shuffle="children"> <span class="c-work-list-item_head-title" data-hover-shuffle-child>K72</span> <span class="c-work-list-item_head-summary" data-hover-shuffle-child>Marketing</span> <span class="c-work-list-item_head-location"><span>Montréal, Canada</span></span> <button class="c-work-list-item_head-btn" data-work-list-item="toggler" data-work-list-item-label-open="Ouvrir" data-work-list-item-label-close="Fermer" aria-expanded="false" aria-controls="work-list-item-20"> <span class="u-screen-reader-text">Fermer</span> </button> <div class="c-image c-work-list-item_head-visual " data-work-list-item="preview"> <span class="c-image_inner" style="background-image: url('uploads/projects/K72/K72_small_list_v2-10w.png');"> <img class="c-image_img " alt="" width="300" height="188" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20188'%3E%3C/svg%3E" data-src="uploads/projects/K72/K72_small_list_v2-300w.jpg" > </span> </div> </header> <main class="c-work-list-item_content" data-work-list-item="content" aria-label="K72 preview" id="work-list-item-20"> <div class="c-work-list-item_content-inner" data-work-list-item="content-inner"> <div class="c-work-list-item_gallery" data-module-work-gallery> <div class="c-image c-work-list-item_gallery-item " data-work-list-item="image" data-work-gallery="slide"> <span class="c-image_inner" style="background-image: url('uploads/projects/K72/visual_2_%28motion%29-10w.png');"> <img class="c-image_img " alt="" width="3852" height="2708" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%203852%202708'%3E%3C/svg%3E" data-src="uploads/projects/K72/visual_2_%28motion%29-1000w.png" > </span> </div> </div> <div class="c-image c-work-list-item_visual " data-work-list-item="preview-target" aria-hidden="true"> <span class="c-image_inner" style="background-image: url('uploads/projects/K72/K72_small_list_v2-10w.png');"> <img class="c-image_img " alt="" width="300" height="188" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20188'%3E%3C/svg%3E" data-src="uploads/projects/K72/K72_small_list_v2-300w.jpg" > </span> </div> <p class="c-work-list-item_description">K72 est une agence de marque qui adopte une approche holistique pour construire des marques, en se concentrant à la fois sur le présent et le futur. L'agence croit que dépasser les zones de confort et embrasser les frictions est la clé pour créer des stratégies, des marques et des communications convaincantes qui résonnent vraiment. K72 valorise la transparence et l'honnêteté et soutient pleinement les causes et les croyances qu'elle choisit de défendre.</p> <ul class="c-work-list-item_categories"> <li>Digital</li> <li>Expérience</li> </ul> <span class="c-work-list-item_notes"> <span>©2021</span> <span> 7 prix </span> </span> <div class="c-work-list-item_actions"> <a class="c-button -full " data-hover-shuffle="children" href="/fr/projets/k72" data-icon="→" > <span class="c-button_label" data-hover-shuffle-child> Étude de cas </span> </a> <a class="c-button -full " data-hover-shuffle="children" href="https://k72.ca/" target="_blank" rel="noopener noreferrer" data-icon="↗" > <span class="c-button_label" data-hover-shuffle-child> Visiter le site </span> </a> </div> </div> </main> </article> <article class="c-work-list_item || c-work-list-item" data-module-work-list-item data-scroll data-scroll-call="inview, WorkListItem"> <header class="c-work-list-item_head" data-hover-shuffle="children"> <span class="c-work-list-item_head-title" data-hover-shuffle-child>SOS Violence Conjugale</span> <span class="c-work-list-item_head-summary" data-hover-shuffle-child>Cause sociale</span> <span class="c-work-list-item_head-location"><span>Montréal, Canada</span></span> <button class="c-work-list-item_head-btn" data-work-list-item="toggler" data-work-list-item-label-open="Ouvrir" data-work-list-item-label-close="Fermer" aria-expanded="false" aria-controls="work-list-item-21"> <span class="u-screen-reader-text">Fermer</span> </button> <div class="c-image c-work-list-item_head-visual " data-work-list-item="preview"> <span class="c-image_inner" style="background-image: url('uploads/projects/SOS/Frame_1466-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/SOS/Frame_1466-300w.jpg" > </span> </div> </header> <main class="c-work-list-item_content" data-work-list-item="content" aria-label="SOS Violence Conjugale preview" id="work-list-item-21"> <div class="c-work-list-item_content-inner" data-work-list-item="content-inner"> <div class="c-work-list-item_gallery" data-module-work-gallery> <div class="c-image c-work-list-item_gallery-item " data-work-list-item="image" data-work-gallery="slide"> <span class="c-image_inner" style="background-image: url('uploads/projects/SOS/Frame_1461-1-10w.png');"> <img class="c-image_img " alt="" width="1000" height="644" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20644'%3E%3C/svg%3E" data-src="uploads/projects/SOS/Frame_1461-1-1000w.png" > </span> </div> </div> <div class="c-image c-work-list-item_visual " data-work-list-item="preview-target" aria-hidden="true"> <span class="c-image_inner" style="background-image: url('uploads/projects/SOS/Frame_1466-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/SOS/Frame_1466-300w.jpg" > </span> </div> <p class="c-work-list-item_description">SOS violence conjugale est au service des victimes de violence conjugale et de l’ensemble des personnes concernées par cette problématique, depuis 1987. L’organisme accueille, évalue, informe, sensibilise et soutient gratuitement et anonymement les victimes, 24h sur 24, sept jours sur sept. L’agence étant sensible à ce thème, il était tout naturel de collaborer avec l’organisme à l’élaboration d’un nouvel outil en ligne pour supporter les victimes et leur entourage dans leur cheminement.</p> <ul class="c-work-list-item_categories"> <li>Branding</li> <li>Digital</li> <li>Expérience</li> <li>Contenu</li> </ul> <span class="c-work-list-item_notes"> <span>©2020</span> <span> 3 prix </span> </span> <div class="c-work-list-item_actions"> <a class="c-button -full " data-hover-shuffle="children" href="/fr/projets/sos-violence-conjugale" data-icon="→" > <span class="c-button_label" data-hover-shuffle-child> Étude de cas </span> </a> <a class="c-button -full " data-hover-shuffle="children" href="https://sosviolenceconjugale.ca/" target="_blank" rel="noopener noreferrer" data-icon="↗" > <span class="c-button_label" data-hover-shuffle-child> Visiter le site </span> </a> </div> </div> </main> </article> <article class="c-work-list_item || c-work-list-item" data-module-work-list-item data-scroll data-scroll-call="inview, WorkListItem"> <header class="c-work-list-item_head" data-hover-shuffle="children"> <span class="c-work-list-item_head-title" data-hover-shuffle-child>Editorial New</span> <span class="c-work-list-item_head-summary" data-hover-shuffle-child>Typographie</span> <span class="c-work-list-item_head-location"><span>Montréal, Canada</span></span> <button class="c-work-list-item_head-btn" data-work-list-item="toggler" data-work-list-item-label-open="Ouvrir" data-work-list-item-label-close="Fermer" aria-expanded="false" aria-controls="work-list-item-22"> <span class="u-screen-reader-text">Fermer</span> </button> <div class="c-image c-work-list-item_head-visual " data-work-list-item="preview"> <span class="c-image_inner" style="background-image: url('uploads/projects/EDITORIAL/ligature_image_1-10w.png');"> <img class="c-image_img " alt="" width="300" height="185" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20185'%3E%3C/svg%3E" data-src="uploads/projects/EDITORIAL/ligature_image_1-300w.png" > </span> </div> </header> <main class="c-work-list-item_content" data-work-list-item="content" aria-label="Editorial New preview" id="work-list-item-22"> <div class="c-work-list-item_content-inner" data-work-list-item="content-inner"> <div class="c-work-list-item_gallery" data-module-work-gallery> <div class="c-image c-work-list-item_gallery-item " data-work-list-item="image" data-work-gallery="slide"> <span class="c-image_inner" style="background-image: url('uploads/projects/EDITORIAL/Frame_1462-10w.png');"> <img class="c-image_img " alt="" width="3852" height="2708" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%203852%202708'%3E%3C/svg%3E" data-src="uploads/projects/EDITORIAL/Frame_1462-1000w.png" > </span> </div> </div> <div class="c-image c-work-list-item_visual " data-work-list-item="preview-target" aria-hidden="true"> <span class="c-image_inner" style="background-image: url('uploads/projects/EDITORIAL/ligature_image_1-10w.png');"> <img class="c-image_img " alt="" width="300" height="185" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20185'%3E%3C/svg%3E" data-src="uploads/projects/EDITORIAL/ligature_image_1-300w.png" > </span> </div> <p class="c-work-list-item_description">Editorial New est une famille de police créee par Pangram Pangram Foundry. Il s'agit d'une police sérif, étroite et élégante, qui a été conçu pour les textes longs, mais avec une personnalité suffisamment forte pour être utilisée dans les titres.</p> <ul class="c-work-list-item_categories"> <li>Digital</li> <li>Expérience</li> <li>Contenu</li> </ul> <span class="c-work-list-item_notes"> <span>©2019</span> <span> 6 prix </span> </span> <div class="c-work-list-item_actions"> <a class="c-button -full " data-hover-shuffle="children" href="/fr/projets/editorial-new" data-icon="→" > <span class="c-button_label" data-hover-shuffle-child> Étude de cas </span> </a> <a class="c-button -full " data-hover-shuffle="children" href="https://editorialnew.com/" target="_blank" rel="noopener noreferrer" data-icon="↗" > <span class="c-button_label" data-hover-shuffle-child> Visiter le site </span> </a> </div> </div> </main> </article> <article class="c-work-list_item || c-work-list-item" data-module-work-list-item data-scroll data-scroll-call="inview, WorkListItem"> <header class="c-work-list-item_head" data-hover-shuffle="children"> <span class="c-work-list-item_head-title" data-hover-shuffle-child>C'est pas violent</span> <span class="c-work-list-item_head-summary" data-hover-shuffle-child>Cause sociale</span> <span class="c-work-list-item_head-location"><span>Montréal, Canada</span></span> <button class="c-work-list-item_head-btn" data-work-list-item="toggler" data-work-list-item-label-open="Ouvrir" data-work-list-item-label-close="Fermer" aria-expanded="false" aria-controls="work-list-item-23"> <span class="u-screen-reader-text">Fermer</span> </button> <div class="c-image c-work-list-item_head-visual " data-work-list-item="preview"> <span class="c-image_inner" style="background-image: url('uploads/projects/ITSNOTVIOLENT/Visual_brand-10w.png');"> <img class="c-image_img " alt="" width="300" height="200" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20200'%3E%3C/svg%3E" data-src="uploads/projects/ITSNOTVIOLENT/Visual_brand-300w.png" > </span> </div> </header> <main class="c-work-list-item_content" data-work-list-item="content" aria-label="C'est pas violent preview" id="work-list-item-23"> <div class="c-work-list-item_content-inner" data-work-list-item="content-inner"> <div class="c-work-list-item_gallery" data-module-work-gallery> <div class="c-image c-work-list-item_gallery-item " data-work-list-item="image" data-work-gallery="slide"> <span class="c-image_inner" style="background-image: url('uploads/projects/ITSNOTVIOLENT/visual_2_%28motion%29-10w.png');"> <img class="c-image_img " alt="" width="1000" height="703" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20703'%3E%3C/svg%3E" data-src="uploads/projects/ITSNOTVIOLENT/visual_2_%28motion%29-1000w.png" > </span> </div> </div> <div class="c-image c-work-list-item_visual " data-work-list-item="preview-target" aria-hidden="true"> <span class="c-image_inner" style="background-image: url('uploads/projects/ITSNOTVIOLENT/Visual_brand-10w.png');"> <img class="c-image_img " alt="" width="300" height="200" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20200'%3E%3C/svg%3E" data-src="uploads/projects/ITSNOTVIOLENT/Visual_brand-300w.png" > </span> </div> <p class="c-work-list-item_description">SOS Violence Conjugale est au service des victimes de violence conjugale de façon anonyme et gratuite depuis 1987. Avec sa nouvelle campagne, l’organisme souhaitait créer une expérience interactive qui sensibilise les jeunes à une forme plus insidieuse de violence conjugale, dissimulée dans les communication par message texte.</p> <ul class="c-work-list-item_categories"> <li>Branding</li> <li>Digital</li> <li>Expérience</li> <li>Contenu</li> </ul> <span class="c-work-list-item_notes"> <span>©2018</span> <span> 4 prix </span> </span> <div class="c-work-list-item_actions"> <a class="c-button -full " data-hover-shuffle="children" href="/fr/projets/c-est-pas-violent" data-icon="→" > <span class="c-button_label" data-hover-shuffle-child> Étude de cas </span> </a> <a class="c-button -full " data-hover-shuffle="children" href="https://cestpasviolent.com/" target="_blank" rel="noopener noreferrer" data-icon="↗" > <span class="c-button_label" data-hover-shuffle-child> Visiter le site </span> </a> </div> </div> </main> </article> <article class="c-work-list_item || c-work-list-item" data-module-work-list-item data-scroll data-scroll-call="inview, WorkListItem"> <header class="c-work-list-item_head" data-hover-shuffle="children"> <span class="c-work-list-item_head-title" data-hover-shuffle-child>2nd Street USA</span> <span class="c-work-list-item_head-summary" data-hover-shuffle-child>Mode</span> <span class="c-work-list-item_head-location"><span>Los Angeles, USA</span></span> <button class="c-work-list-item_head-btn" data-work-list-item="toggler" data-work-list-item-label-open="Ouvrir" data-work-list-item-label-close="Fermer" aria-expanded="false" aria-controls="work-list-item-24"> <span class="u-screen-reader-text">Fermer</span> </button> <div class="c-image c-work-list-item_head-visual " data-work-list-item="preview"> <span class="c-image_inner" style="background-image: url('uploads/projects/2ND_STREET/2nd_street_01-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/2ND_STREET/2nd_street_01-300w.jpg" > </span> </div> </header> <main class="c-work-list-item_content" data-work-list-item="content" aria-label="2nd Street USA preview" id="work-list-item-24"> <div class="c-work-list-item_content-inner" data-work-list-item="content-inner"> <div class="c-work-list-item_gallery" data-module-work-gallery> <div class="c-image c-work-list-item_gallery-item " data-work-list-item="image" data-work-gallery="slide"> <span class="c-image_inner" style="background-image: url('uploads/projects/2ND_STREET/2nd_street_02-10w.jpg');"> <img class="c-image_img " alt="" width="1000" height="703" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20703'%3E%3C/svg%3E" data-src="uploads/projects/2ND_STREET/2nd_street_02-1000w.jpg" > </span> </div> </div> <div class="c-image c-work-list-item_visual " data-work-list-item="preview-target" aria-hidden="true"> <span class="c-image_inner" style="background-image: url('uploads/projects/2ND_STREET/2nd_street_01-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/2ND_STREET/2nd_street_01-300w.jpg" > </span> </div> <p class="c-work-list-item_description">2nd Street offre une large gamme de vêtements de marque d'occasion à travers plus de 500 magasins au Japon et aux États-Unis. Locomotive a créé une expérience inspirée de la mode pour mettre en valeur leurs offres uniques et aider la marque en pleine croissance. Le site Web propose un contenu éditorial de qualité et des promotions pour donner aux utilisateurs un aperçu des pièces de vêtements disponibles à l'achat.</p> <ul class="c-work-list-item_categories"> <li>Digital</li> <li>Expérience</li> </ul> <span class="c-work-list-item_notes"> <span>©2019</span> <span> 1 prix </span> </span> <div class="c-work-list-item_actions"> <a class="c-button -full " data-hover-shuffle="children" href="https://2ndstreetusa.com/" target="_blank" rel="noopener noreferrer" data-icon="↗" > <span class="c-button_label" data-hover-shuffle-child> Visiter le site </span> </a> </div> </div> </main> </article> <article class="c-work-list_item || c-work-list-item" data-module-work-list-item data-scroll data-scroll-call="inview, WorkListItem"> <header class="c-work-list-item_head" data-hover-shuffle="children"> <span class="c-work-list-item_head-title" data-hover-shuffle-child>ADCC</span> <span class="c-work-list-item_head-summary" data-hover-shuffle-child>Design</span> <span class="c-work-list-item_head-location"><span>Toronto, Canada</span></span> <button class="c-work-list-item_head-btn" data-work-list-item="toggler" data-work-list-item-label-open="Ouvrir" data-work-list-item-label-close="Fermer" aria-expanded="false" aria-controls="work-list-item-25"> <span class="u-screen-reader-text">Fermer</span> </button> <div class="c-image c-work-list-item_head-visual " data-work-list-item="preview"> <span class="c-image_inner" style="background-image: url('uploads/projects/ADCC/adcc_01-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/ADCC/adcc_01-300w.png" > </span> </div> </header> <main class="c-work-list-item_content" data-work-list-item="content" aria-label="ADCC preview" id="work-list-item-25"> <div class="c-work-list-item_content-inner" data-work-list-item="content-inner"> <div class="c-work-list-item_gallery" data-module-work-gallery> <div class="c-image c-work-list-item_gallery-item " data-work-list-item="image" data-work-gallery="slide"> <span class="c-image_inner" style="background-image: url('uploads/projects/ADCC/adcc_02-10w.png');"> <img class="c-image_img " alt="" width="1000" height="703" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20703'%3E%3C/svg%3E" data-src="uploads/projects/ADCC/adcc_02-1000w.png" > </span> </div> </div> <div class="c-image c-work-list-item_visual " data-work-list-item="preview-target" aria-hidden="true"> <span class="c-image_inner" style="background-image: url('uploads/projects/ADCC/adcc_01-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/ADCC/adcc_01-300w.png" > </span> </div> <p class="c-work-list-item_description">Pour les ADCC Awards 2022, le Advertising & Design Club of Canada nous ont approchés, ainsi que Baillat, afin de créer un site Web pour leur appel à candidatures. La campagne « Connecting the Dots » vous amenait sur une plateforme ludique et interactive qui invitait les utilisateurs à découvrir comment relier les points grâce à un petit jeu de roulette. L'objectif des prix ADCC est de reconnaître et de récompenser le meilleur travail créatif du Canada dans les domaines de la publicité, du design et de l'interactivité.</p> <ul class="c-work-list-item_categories"> <li>Digital</li> </ul> <span class="c-work-list-item_notes"> <span>©2022</span> <span> 2 prix </span> </span> <div class="c-work-list-item_actions"> <a class="c-button -full " data-hover-shuffle="children" href="https://theadccawards.com" target="_blank" rel="noopener noreferrer" data-icon="↗" > <span class="c-button_label" data-hover-shuffle-child> Visiter le site </span> </a> </div> </div> </main> </article> <article class="c-work-list_item || c-work-list-item" data-module-work-list-item data-scroll data-scroll-call="inview, WorkListItem"> <header class="c-work-list-item_head" data-hover-shuffle="children"> <span class="c-work-list-item_head-title" data-hover-shuffle-child>Brews & Grooves</span> <span class="c-work-list-item_head-summary" data-hover-shuffle-child>Loisirs</span> <span class="c-work-list-item_head-location"><span>New York, USA</span></span> <button class="c-work-list-item_head-btn" data-work-list-item="toggler" data-work-list-item-label-open="Ouvrir" data-work-list-item-label-close="Fermer" aria-expanded="false" aria-controls="work-list-item-26"> <span class="u-screen-reader-text">Fermer</span> </button> <div class="c-image c-work-list-item_head-visual " data-work-list-item="preview"> <span class="c-image_inner" style="background-image: url('uploads/projects/BREWS_GROOVE/brews-groove01.jpg');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/BREWS_GROOVE/brews-groove01-300w.jpg" > </span> </div> </header> <main class="c-work-list-item_content" data-work-list-item="content" aria-label="Brews & Grooves preview" id="work-list-item-26"> <div class="c-work-list-item_content-inner" data-work-list-item="content-inner"> <div class="c-work-list-item_gallery" data-module-work-gallery> <div class="c-image c-work-list-item_gallery-item " data-work-list-item="image" data-work-gallery="slide"> <span class="c-image_inner" style="background-image: url('uploads/projects/BREWS_GROOVE/brews-groove02-10w.jpg');"> <img class="c-image_img " alt="" width="1000" height="703" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20703'%3E%3C/svg%3E" data-src="uploads/projects/BREWS_GROOVE/brews-groove02-1000w.jpg" > </span> </div> </div> <div class="c-image c-work-list-item_visual " data-work-list-item="preview-target" aria-hidden="true"> <span class="c-image_inner" style="background-image: url('uploads/projects/BREWS_GROOVE/brews-groove01.jpg');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/BREWS_GROOVE/brews-groove01-300w.jpg" > </span> </div> <p class="c-work-list-item_description">En collaboration avec Rogue Studio, Locomotive a lancé un site web, un compte Instagram et une campagne d'infolettres saisonnières axés sur les accords d'albums et de bières. Une excellente occasion de promouvoir des produits locaux et des artistes indépendants, tout en s'impliquant dans un projet de contenu de haute qualité. Le site web présentait les accords classés par catégorie, un article complet pour chaque accord et un lecteur audio pour l'écoute des albums sélectionnés. </p> <ul class="c-work-list-item_categories"> <li>Branding</li> <li>Digital</li> </ul> <span class="c-work-list-item_notes"> <span>©2020</span> <span> 5 prix </span> </span> <div class="c-work-list-item_actions"> <a class="c-button -full " data-hover-shuffle="children" href="https://www.brewsandgrooves.com/" target="_blank" rel="noopener noreferrer" data-icon="↗" > <span class="c-button_label" data-hover-shuffle-child> Visiter le site </span> </a> </div> </div> </main> </article> <article class="c-work-list_item || c-work-list-item" data-module-work-list-item data-scroll data-scroll-call="inview, WorkListItem"> <header class="c-work-list-item_head" data-hover-shuffle="children"> <span class="c-work-list-item_head-title" data-hover-shuffle-child>Born&Bred</span> <span class="c-work-list-item_head-summary" data-hover-shuffle-child>Design et marketing</span> <span class="c-work-list-item_head-location"><span>San Francisco, USA</span></span> <button class="c-work-list-item_head-btn" data-work-list-item="toggler" data-work-list-item-label-open="Ouvrir" data-work-list-item-label-close="Fermer" aria-expanded="false" aria-controls="work-list-item-27"> <span class="u-screen-reader-text">Fermer</span> </button> <div class="c-image c-work-list-item_head-visual " data-work-list-item="preview"> <span class="c-image_inner" style="background-image: url('uploads/projects/BORN_BRED/born_bred_01-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/BORN_BRED/born_bred_01-300w.jpg" > </span> </div> </header> <main class="c-work-list-item_content" data-work-list-item="content" aria-label="Born&Bred preview" id="work-list-item-27"> <div class="c-work-list-item_content-inner" data-work-list-item="content-inner"> <div class="c-work-list-item_gallery" data-module-work-gallery> <div class="c-image c-work-list-item_gallery-item " data-work-list-item="image" data-work-gallery="slide"> <span class="c-image_inner" style="background-image: url('uploads/projects/BORN_BRED/born_bred_02-10w.jpg');"> <img class="c-image_img " alt="" width="1000" height="703" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20703'%3E%3C/svg%3E" data-src="uploads/projects/BORN_BRED/born_bred_02-1000w.jpg" > </span> </div> </div> <div class="c-image c-work-list-item_visual " data-work-list-item="preview-target" aria-hidden="true"> <span class="c-image_inner" style="background-image: url('uploads/projects/BORN_BRED/born_bred_01-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/BORN_BRED/born_bred_01-300w.jpg" > </span> </div> <p class="c-work-list-item_description">Locomotive collabore avec l'agence créative Born&Bred afin de concevoir un univers numérique à la fois ludique, minimaliste et fonctionnel, mettant l'accent sur la narration et l'esthétique de l'agence de San Francisco. L’expérience s’axe autour de son portfolio de projets et de la mise en valeur de son équipe talentueuse.</p> <ul class="c-work-list-item_categories"> <li>Branding</li> <li>Digital</li> <li>Expérience</li> </ul> <span class="c-work-list-item_notes"> <span>©2019</span> <span> 3 prix </span> </span> <div class="c-work-list-item_actions"> <a class="c-button -full " data-hover-shuffle="children" href="https://bornandbredbrand.com/" target="_blank" rel="noopener noreferrer" data-icon="↗" > <span class="c-button_label" data-hover-shuffle-child> Visiter le site </span> </a> </div> </div> </main> </article> <article class="c-work-list_item || c-work-list-item" data-module-work-list-item data-scroll data-scroll-call="inview, WorkListItem"> <header class="c-work-list-item_head" data-hover-shuffle="children"> <span class="c-work-list-item_head-title" data-hover-shuffle-child>Equestrian Canada</span> <span class="c-work-list-item_head-summary" data-hover-shuffle-child>Sports</span> <span class="c-work-list-item_head-location"><span>Ottawa, Canada</span></span> <button class="c-work-list-item_head-btn" data-work-list-item="toggler" data-work-list-item-label-open="Ouvrir" data-work-list-item-label-close="Fermer" aria-expanded="false" aria-controls="work-list-item-28"> <span class="u-screen-reader-text">Fermer</span> </button> <div class="c-image c-work-list-item_head-visual " data-work-list-item="preview"> <span class="c-image_inner" style="background-image: url('uploads/projects/EQUESTRIAN/Equestrian_Canada_01.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/EQUESTRIAN/Equestrian_Canada_01-300w.png" > </span> </div> </header> <main class="c-work-list-item_content" data-work-list-item="content" aria-label="Equestrian Canada preview" id="work-list-item-28"> <div class="c-work-list-item_content-inner" data-work-list-item="content-inner"> <div class="c-work-list-item_gallery" data-module-work-gallery> <div class="c-image c-work-list-item_gallery-item " data-work-list-item="image" data-work-gallery="slide"> <span class="c-image_inner" style="background-image: url('uploads/projects/EQUESTRIAN/Equestrian_Canada_02-10w.png');"> <img class="c-image_img " alt="" width="1000" height="703" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20703'%3E%3C/svg%3E" data-src="uploads/projects/EQUESTRIAN/Equestrian_Canada_02-1000w.png" > </span> </div> </div> <div class="c-image c-work-list-item_visual " data-work-list-item="preview-target" aria-hidden="true"> <span class="c-image_inner" style="background-image: url('uploads/projects/EQUESTRIAN/Equestrian_Canada_01.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/EQUESTRIAN/Equestrian_Canada_01-300w.png" > </span> </div> <p class="c-work-list-item_description">Canada Équestre (CH) est l'organisme national de régie du sport et de l'industrie équestre au Canada, dont le mandat est de représenter, de promouvoir et de faire progresser tous les intérêts équestres et équestres. Avec plus de 18 000 détenteurs de licence sportive et 90 000 participants inscrits, CH avait besoin d'un site Web puissant pour partager des nouvelles, des formations et des événements avec un grand nombre de personnes.</p> <ul class="c-work-list-item_categories"> <li>Branding</li> <li>Digital</li> </ul> <span class="c-work-list-item_notes"> <span>©2016</span> <span> </span> </span> <div class="c-work-list-item_actions"> <a class="c-button -full " data-hover-shuffle="children" href="https://www.canadaequestre.ca/" target="_blank" rel="noopener noreferrer" data-icon="↗" > <span class="c-button_label" data-hover-shuffle-child> Visiter le site </span> </a> </div> </div> </main> </article> <article class="c-work-list_item || c-work-list-item" data-module-work-list-item data-scroll data-scroll-call="inview, WorkListItem"> <header class="c-work-list-item_head" data-hover-shuffle="children"> <span class="c-work-list-item_head-title" data-hover-shuffle-child>The English Bus</span> <span class="c-work-list-item_head-summary" data-hover-shuffle-child>Tourisme</span> <span class="c-work-list-item_head-location"><span>Londres, UK</span></span> <button class="c-work-list-item_head-btn" data-work-list-item="toggler" data-work-list-item-label-open="Ouvrir" data-work-list-item-label-close="Fermer" aria-expanded="false" aria-controls="work-list-item-29"> <span class="u-screen-reader-text">Fermer</span> </button> <div class="c-image c-work-list-item_head-visual " data-work-list-item="preview"> <span class="c-image_inner" style="background-image: url('uploads/projects/ENGLISHBUS/the_english_bus_01-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/ENGLISHBUS/the_english_bus_01-300w.jpg" > </span> </div> </header> <main class="c-work-list-item_content" data-work-list-item="content" aria-label="The English Bus preview" id="work-list-item-29"> <div class="c-work-list-item_content-inner" data-work-list-item="content-inner"> <div class="c-work-list-item_gallery" data-module-work-gallery> <div class="c-image c-work-list-item_gallery-item " data-work-list-item="image" data-work-gallery="slide"> <span class="c-image_inner" style="background-image: url('uploads/projects/ENGLISHBUS/the_english_bus_02-10w.jpg');"> <img class="c-image_img " alt="" width="1000" height="703" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20703'%3E%3C/svg%3E" data-src="uploads/projects/ENGLISHBUS/the_english_bus_02-1000w.jpg" > </span> </div> </div> <div class="c-image c-work-list-item_visual " data-work-list-item="preview-target" aria-hidden="true"> <span class="c-image_inner" style="background-image: url('uploads/projects/ENGLISHBUS/the_english_bus_01-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/ENGLISHBUS/the_english_bus_01-300w.jpg" > </span> </div> <p class="c-work-list-item_description">Locomotive s’est vu confier la stratégie numérique, la direction artistique et la mise en place de la technologie de réservation et d’achat en ligne. Nous avons également réaliser des vidéos afin de faire voyager l'utilisateur avant même son départ. Un système personnalisé utilisant la technologie Charcoal fut mis en place, permettant à l'administrateur de faciliter sa logistique au quotidien tout en augmentant l’intelligence d'affaires. </p> <ul class="c-work-list-item_categories"> <li>Branding</li> <li>Digital</li> <li>E-commerce</li> </ul> <span class="c-work-list-item_notes"> <span>©2018</span> <span> 1 prix </span> </span> <div class="c-work-list-item_actions"> <a class="c-button -full " data-hover-shuffle="children" href="https://theenglishbus.com/" target="_blank" rel="noopener noreferrer" data-icon="↗" > <span class="c-button_label" data-hover-shuffle-child> Visiter le site </span> </a> </div> </div> </main> </article> <article class="c-work-list_item || c-work-list-item" data-module-work-list-item data-scroll data-scroll-call="inview, WorkListItem"> <header class="c-work-list-item_head" data-hover-shuffle="children"> <span class="c-work-list-item_head-title" data-hover-shuffle-child>Incroyable Érable</span> <span class="c-work-list-item_head-summary" data-hover-shuffle-child>Alimentaire</span> <span class="c-work-list-item_head-location"><span>Québec, Canada</span></span> <button class="c-work-list-item_head-btn" data-work-list-item="toggler" data-work-list-item-label-open="Ouvrir" data-work-list-item-label-close="Fermer" aria-expanded="false" aria-controls="work-list-item-30"> <span class="u-screen-reader-text">Fermer</span> </button> <div class="c-image c-work-list-item_head-visual " data-work-list-item="preview"> <span class="c-image_inner" style="background-image: url('uploads/projects/ERABLE/Erable_01.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/ERABLE/Erable_01-300w.png" > </span> </div> </header> <main class="c-work-list-item_content" data-work-list-item="content" aria-label="Incroyable Érable preview" id="work-list-item-30"> <div class="c-work-list-item_content-inner" data-work-list-item="content-inner"> <div class="c-work-list-item_gallery" data-module-work-gallery> <div class="c-image c-work-list-item_gallery-item " data-work-list-item="image" data-work-gallery="slide"> <span class="c-image_inner" style="background-image: url('uploads/projects/ERABLE/Erable_02-10w.png');"> <img class="c-image_img " alt="" width="1000" height="703" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20703'%3E%3C/svg%3E" data-src="uploads/projects/ERABLE/Erable_02-1000w.png" > </span> </div> </div> <div class="c-image c-work-list-item_visual " data-work-list-item="preview-target" aria-hidden="true"> <span class="c-image_inner" style="background-image: url('uploads/projects/ERABLE/Erable_01.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/ERABLE/Erable_01-300w.png" > </span> </div> <p class="c-work-list-item_description">Les Producteurs et productrices acéricoles du Québec (PPAQ) font la promotion localement la marque Érable du Québec et coordonnent les efforts de valorisation des produits d’érable à l’international. Locomotive a repensé le site web pour présenter un plus grand nombre de recettes, un système de recherche performant et de nombreuses autres possibilités : catégories, thématiques, présentation des Ambassadeurs de l'érable et des différentes missions de la FPAQ.</p> <ul class="c-work-list-item_categories"> <li>Digital</li> </ul> <span class="c-work-list-item_notes"> <span>©2018</span> <span> 3 prix </span> </span> <div class="c-work-list-item_actions"> <a class="c-button -full " data-hover-shuffle="children" href="https://erableduquebec.ca/" target="_blank" rel="noopener noreferrer" data-icon="↗" > <span class="c-button_label" data-hover-shuffle-child> Visiter le site </span> </a> </div> </div> </main> </article> <article class="c-work-list_item || c-work-list-item" data-module-work-list-item data-scroll data-scroll-call="inview, WorkListItem"> <header class="c-work-list-item_head" data-hover-shuffle="children"> <span class="c-work-list-item_head-title" data-hover-shuffle-child>Ville de Mirabel</span> <span class="c-work-list-item_head-summary" data-hover-shuffle-child>Municipalité</span> <span class="c-work-list-item_head-location"><span>Mirabel, Canada</span></span> <button class="c-work-list-item_head-btn" data-work-list-item="toggler" data-work-list-item-label-open="Ouvrir" data-work-list-item-label-close="Fermer" aria-expanded="false" aria-controls="work-list-item-31"> <span class="u-screen-reader-text">Fermer</span> </button> <div class="c-image c-work-list-item_head-visual " data-work-list-item="preview"> <span class="c-image_inner" style="background-image: url('uploads/projects/MIRABEL/mirabel_01.jpg');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/MIRABEL/mirabel_01-300w.jpg" > </span> </div> </header> <main class="c-work-list-item_content" data-work-list-item="content" aria-label="Ville de Mirabel preview" id="work-list-item-31"> <div class="c-work-list-item_content-inner" data-work-list-item="content-inner"> <div class="c-work-list-item_gallery" data-module-work-gallery> <div class="c-image c-work-list-item_gallery-item " data-work-list-item="image" data-work-gallery="slide"> <span class="c-image_inner" style="background-image: url('uploads/projects/MIRABEL/mirabel_02-10w.jpg');"> <img class="c-image_img " alt="" width="1000" height="703" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20703'%3E%3C/svg%3E" data-src="uploads/projects/MIRABEL/mirabel_02-1000w.jpg" > </span> </div> </div> <div class="c-image c-work-list-item_visual " data-work-list-item="preview-target" aria-hidden="true"> <span class="c-image_inner" style="background-image: url('uploads/projects/MIRABEL/mirabel_01.jpg');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/MIRABEL/mirabel_01-300w.jpg" > </span> </div> <p class="c-work-list-item_description">La ville de Mirabel avait besoin d'une refonte de son site Web, Locomotive a donc proposé une nouvelle arborescence, un design renouvelé et l'intégration d'outils numériques performants : un calendrier, une carte interactive et un outil de recherche avancée. Une vision fortement supportée par l'implémentation de Charcoal CMS, un gestionnaire de contenu libre de droits et développé par Locomotive spécifiquement pour les villes et organismes gouvernementaux. </p> <ul class="c-work-list-item_categories"> <li>Digital</li> </ul> <span class="c-work-list-item_notes"> <span>©2019</span> <span> </span> </span> <div class="c-work-list-item_actions"> <a class="c-button -full " data-hover-shuffle="children" href="https://mirabel.ca" target="_blank" rel="noopener noreferrer" data-icon="↗" > <span class="c-button_label" data-hover-shuffle-child> Visiter le site </span> </a> </div> </div> </main> </article> <article class="c-work-list_item || c-work-list-item" data-module-work-list-item data-scroll data-scroll-call="inview, WorkListItem"> <header class="c-work-list-item_head" data-hover-shuffle="children"> <span class="c-work-list-item_head-title" data-hover-shuffle-child>Moment Zero</span> <span class="c-work-list-item_head-summary" data-hover-shuffle-child>Technologie</span> <span class="c-work-list-item_head-location"><span>Montréal, Canada</span></span> <button class="c-work-list-item_head-btn" data-work-list-item="toggler" data-work-list-item-label-open="Ouvrir" data-work-list-item-label-close="Fermer" aria-expanded="false" aria-controls="work-list-item-32"> <span class="u-screen-reader-text">Fermer</span> </button> <div class="c-image c-work-list-item_head-visual " data-work-list-item="preview"> <span class="c-image_inner" style="background-image: url('uploads/projects/MOMENT/moments-01.jpg');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/MOMENT/moments-01-300w.jpg" > </span> </div> </header> <main class="c-work-list-item_content" data-work-list-item="content" aria-label="Moment Zero preview" id="work-list-item-32"> <div class="c-work-list-item_content-inner" data-work-list-item="content-inner"> <div class="c-work-list-item_gallery" data-module-work-gallery> <div class="c-image c-work-list-item_gallery-item " data-work-list-item="image" data-work-gallery="slide"> <span class="c-image_inner" style="background-image: url('uploads/projects/MOMENT/moments-02-10w.jpg');"> <img class="c-image_img " alt="" width="1000" height="703" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20703'%3E%3C/svg%3E" data-src="uploads/projects/MOMENT/moments-02-1000w.jpg" > </span> </div> </div> <div class="c-image c-work-list-item_visual " data-work-list-item="preview-target" aria-hidden="true"> <span class="c-image_inner" style="background-image: url('uploads/projects/MOMENT/moments-01.jpg');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/MOMENT/moments-01-300w.jpg" > </span> </div> <p class="c-work-list-item_description">Le Service Géologique des États-Unis (USGS) a enregistré toutes ses activités sismiques depuis 1970, et c’est une immersion dans ces données que Moment Zero propose. Les données ont été extraites du répertoire web des séismes de l’USGS en utilisant leur API, et une simple implémentation Charcoal a permis d’alimenter l’interface utilisateur avec l’ensemble des données.</p> <ul class="c-work-list-item_categories"> <li>Branding</li> <li>Digital</li> </ul> <span class="c-work-list-item_notes"> <span>©2018</span> <span> 9 prix </span> </span> <div class="c-work-list-item_actions"> <a class="c-button -full " data-hover-shuffle="children" href="https://moment-zero.com" target="_blank" rel="noopener noreferrer" data-icon="↗" > <span class="c-button_label" data-hover-shuffle-child> Visiter le site </span> </a> </div> </div> </main> </article> <article class="c-work-list_item || c-work-list-item" data-module-work-list-item data-scroll data-scroll-call="inview, WorkListItem"> <header class="c-work-list-item_head" data-hover-shuffle="children"> <span class="c-work-list-item_head-title" data-hover-shuffle-child>Ville de Rivière-du-Loup</span> <span class="c-work-list-item_head-summary" data-hover-shuffle-child>Municipalité</span> <span class="c-work-list-item_head-location"><span>Rivière-du-Loup, Canada</span></span> <button class="c-work-list-item_head-btn" data-work-list-item="toggler" data-work-list-item-label-open="Ouvrir" data-work-list-item-label-close="Fermer" aria-expanded="false" aria-controls="work-list-item-33"> <span class="u-screen-reader-text">Fermer</span> </button> <div class="c-image c-work-list-item_head-visual " data-work-list-item="preview"> <span class="c-image_inner" style="background-image: url('uploads/projects/RDL/Loup_01.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/RDL/Loup_01-300w.png" > </span> </div> </header> <main class="c-work-list-item_content" data-work-list-item="content" aria-label="Ville de Rivière-du-Loup preview" id="work-list-item-33"> <div class="c-work-list-item_content-inner" data-work-list-item="content-inner"> <div class="c-work-list-item_gallery" data-module-work-gallery> <div class="c-image c-work-list-item_gallery-item " data-work-list-item="image" data-work-gallery="slide"> <span class="c-image_inner" style="background-image: url('uploads/projects/RDL/Loup_02-10w.png');"> <img class="c-image_img " alt="" width="1000" height="703" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20703'%3E%3C/svg%3E" data-src="uploads/projects/RDL/Loup_02-1000w.png" > </span> </div> </div> <div class="c-image c-work-list-item_visual " data-work-list-item="preview-target" aria-hidden="true"> <span class="c-image_inner" style="background-image: url('uploads/projects/RDL/Loup_01.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/RDL/Loup_01-300w.png" > </span> </div> <p class="c-work-list-item_description">La ville de Rivière-du-Loup avait grandement besoin d'une refonte de son portail en ligne. Cette ville touristique avait besoin d'un site Web plus efficace pour faciliter l'accès aux services pour les citoyens et mieux informer les résidents, les gens d'affaires et les touristes. Locomotive a participé activement au projet en proposant une optimisation de l’architecture du site, et en mettant en ligne un portail à la fine pointe de la technologie.</p> <ul class="c-work-list-item_categories"> <li>Digital</li> </ul> <span class="c-work-list-item_notes"> <span>©2017</span> <span> </span> </span> <div class="c-work-list-item_actions"> <a class="c-button -full " data-hover-shuffle="children" href="http://villerdl.ca/fr" target="_blank" rel="noopener noreferrer" data-icon="↗" > <span class="c-button_label" data-hover-shuffle-child> Visiter le site </span> </a> </div> </div> </main> </article> <article class="c-work-list_item || c-work-list-item" data-module-work-list-item data-scroll data-scroll-call="inview, WorkListItem"> <header class="c-work-list-item_head" data-hover-shuffle="children"> <span class="c-work-list-item_head-title" data-hover-shuffle-child>Rugby Canada</span> <span class="c-work-list-item_head-summary" data-hover-shuffle-child>Sports</span> <span class="c-work-list-item_head-location"><span>Toronto, Canada</span></span> <button class="c-work-list-item_head-btn" data-work-list-item="toggler" data-work-list-item-label-open="Ouvrir" data-work-list-item-label-close="Fermer" aria-expanded="false" aria-controls="work-list-item-34"> <span class="u-screen-reader-text">Fermer</span> </button> <div class="c-image c-work-list-item_head-visual " data-work-list-item="preview"> <span class="c-image_inner" style="background-image: url('uploads/projects/RUGBY/rugbycanada-01-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/RUGBY/rugbycanada-01-300w.jpg" > </span> </div> </header> <main class="c-work-list-item_content" data-work-list-item="content" aria-label="Rugby Canada preview" id="work-list-item-34"> <div class="c-work-list-item_content-inner" data-work-list-item="content-inner"> <div class="c-work-list-item_gallery" data-module-work-gallery> <div class="c-image c-work-list-item_gallery-item " data-work-list-item="image" data-work-gallery="slide"> <span class="c-image_inner" style="background-image: url('uploads/projects/RUGBY/rugbycanada-02-10w.jpg');"> <img class="c-image_img " alt="" width="1000" height="703" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20703'%3E%3C/svg%3E" data-src="uploads/projects/RUGBY/rugbycanada-02-1000w.jpg" > </span> </div> </div> <div class="c-image c-work-list-item_visual " data-work-list-item="preview-target" aria-hidden="true"> <span class="c-image_inner" style="background-image: url('uploads/projects/RUGBY/rugbycanada-01-10w.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/RUGBY/rugbycanada-01-300w.jpg" > </span> </div> <p class="c-work-list-item_description">Le changement de marque de Rugby Canada est le résultat de recherches approfondies visant à mieux comprendre la position du rugby sur le marché canadien. Locomotive a ensuite conçu et développé le site Web pour aider à faire passer la présence numérique de Rugby Canada au niveau supérieur. L'objectif était de faire évoluer la marque et les piliers fondamentaux de ce que le sport signifie pour la communauté actuelle du rugby et les nouveaux fans et athlètes potentiels.</p> <ul class="c-work-list-item_categories"> <li>Digital</li> <li>Expérience</li> </ul> <span class="c-work-list-item_notes"> <span>©2018</span> <span> 1 prix </span> </span> <div class="c-work-list-item_actions"> <a class="c-button -full " data-hover-shuffle="children" href="https://rugby.ca/fr" target="_blank" rel="noopener noreferrer" data-icon="↗" > <span class="c-button_label" data-hover-shuffle-child> Visiter le site </span> </a> </div> </div> </main> </article> <article class="c-work-list_item || c-work-list-item" data-module-work-list-item data-scroll data-scroll-call="inview, WorkListItem"> <header class="c-work-list-item_head" data-hover-shuffle="children"> <span class="c-work-list-item_head-title" data-hover-shuffle-child>Ville de Saint Constant</span> <span class="c-work-list-item_head-summary" data-hover-shuffle-child>Municipalité</span> <span class="c-work-list-item_head-location"><span>Saint Constant, Canada</span></span> <button class="c-work-list-item_head-btn" data-work-list-item="toggler" data-work-list-item-label-open="Ouvrir" data-work-list-item-label-close="Fermer" aria-expanded="false" aria-controls="work-list-item-35"> <span class="u-screen-reader-text">Fermer</span> </button> <div class="c-image c-work-list-item_head-visual " data-work-list-item="preview"> <span class="c-image_inner" style="background-image: url('uploads/projects/STCONSTANT/SaintConstant_01.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/STCONSTANT/SaintConstant_01-300w.png" > </span> </div> </header> <main class="c-work-list-item_content" data-work-list-item="content" aria-label="Ville de Saint Constant preview" id="work-list-item-35"> <div class="c-work-list-item_content-inner" data-work-list-item="content-inner"> <div class="c-work-list-item_gallery" data-module-work-gallery> <div class="c-image c-work-list-item_gallery-item " data-work-list-item="image" data-work-gallery="slide"> <span class="c-image_inner" style="background-image: url('uploads/projects/STCONSTANT/SaintConstant_02-10w.png');"> <img class="c-image_img " alt="" width="1000" height="703" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20703'%3E%3C/svg%3E" data-src="uploads/projects/STCONSTANT/SaintConstant_02-1000w.png" > </span> </div> </div> <div class="c-image c-work-list-item_visual " data-work-list-item="preview-target" aria-hidden="true"> <span class="c-image_inner" style="background-image: url('uploads/projects/STCONSTANT/SaintConstant_01.png');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/STCONSTANT/SaintConstant_01-300w.png" > </span> </div> <p class="c-work-list-item_description">La ville de Saint-Constant voulait révolutionner la recherche en ligne dans le domaine municipal. Locomotive a donc capitalisé sur l'image de marque de la ville de Saint-Constant en créant un portail citoyen hautement accessible et fonctionnel, dont le design est basé sur une simple grille, de la typographie et des couleurs en aplat. L'équipe a également épaulé les communications de la ville dans sa stratégie de contenu.</p> <ul class="c-work-list-item_categories"> <li>Digital</li> </ul> <span class="c-work-list-item_notes"> <span>©2018</span> <span> </span> </span> <div class="c-work-list-item_actions"> <a class="c-button -full " data-hover-shuffle="children" href="https://saint-constant.ca/" target="_blank" rel="noopener noreferrer" data-icon="↗" > <span class="c-button_label" data-hover-shuffle-child> Visiter le site </span> </a> </div> </div> </main> </article> <article class="c-work-list_item || c-work-list-item" data-module-work-list-item data-scroll data-scroll-call="inview, WorkListItem"> <header class="c-work-list-item_head" data-hover-shuffle="children"> <span class="c-work-list-item_head-title" data-hover-shuffle-child>Ville de Val-d'Or</span> <span class="c-work-list-item_head-summary" data-hover-shuffle-child>Municipalité</span> <span class="c-work-list-item_head-location"><span>Val d'Or, Canada</span></span> <button class="c-work-list-item_head-btn" data-work-list-item="toggler" data-work-list-item-label-open="Ouvrir" data-work-list-item-label-close="Fermer" aria-expanded="false" aria-controls="work-list-item-36"> <span class="u-screen-reader-text">Fermer</span> </button> <div class="c-image c-work-list-item_head-visual " data-work-list-item="preview"> <span class="c-image_inner" style="background-image: url('uploads/projects/VAL_DOR/valdor-01.jpg');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/VAL_DOR/valdor-01-300w.jpg" > </span> </div> </header> <main class="c-work-list-item_content" data-work-list-item="content" aria-label="Ville de Val-d'Or preview" id="work-list-item-36"> <div class="c-work-list-item_content-inner" data-work-list-item="content-inner"> <div class="c-work-list-item_gallery" data-module-work-gallery> <div class="c-image c-work-list-item_gallery-item " data-work-list-item="image" data-work-gallery="slide"> <span class="c-image_inner" style="background-image: url('uploads/projects/VAL_DOR/valdor-02-10w.jpg');"> <img class="c-image_img " alt="" width="1000" height="703" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20703'%3E%3C/svg%3E" data-src="uploads/projects/VAL_DOR/valdor-02-1000w.jpg" > </span> </div> </div> <div class="c-image c-work-list-item_visual " data-work-list-item="preview-target" aria-hidden="true"> <span class="c-image_inner" style="background-image: url('uploads/projects/VAL_DOR/valdor-01.jpg');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/VAL_DOR/valdor-01-300w.jpg" > </span> </div> <p class="c-work-list-item_description">Val-d'Or est une ville ayant une culture unique et une économie reposant sur les ressources naturelles et l’industrie des services. Locomotive, fort de sa grande expérience auprès des municipalités, a embauché un photographe local pour créer du contenu exclusif destiné au nouveau portail. Celui-ci étant très complet, il fallait que la gestion d'un large éventail d’outils, d’informations pratiques, d’actualités, d’évènements et d’une carte interactive soit facile pour les administrateurs de la ville de Val-d'Or.</p> <ul class="c-work-list-item_categories"> <li>Digital</li> </ul> <span class="c-work-list-item_notes"> <span>©2016</span> <span> 1 prix </span> </span> <div class="c-work-list-item_actions"> <a class="c-button -full " data-hover-shuffle="children" href="https://ville.valdor.qc.ca" target="_blank" rel="noopener noreferrer" data-icon="↗" > <span class="c-button_label" data-hover-shuffle-child> Visiter le site </span> </a> </div> </div> </main> </article> <article class="c-work-list_item || c-work-list-item" data-module-work-list-item data-scroll data-scroll-call="inview, WorkListItem"> <header class="c-work-list-item_head" data-hover-shuffle="children"> <span class="c-work-list-item_head-title" data-hover-shuffle-child>Volleyball Canada</span> <span class="c-work-list-item_head-summary" data-hover-shuffle-child>Sports</span> <span class="c-work-list-item_head-location"><span>Ottawa, Canada</span></span> <button class="c-work-list-item_head-btn" data-work-list-item="toggler" data-work-list-item-label-open="Ouvrir" data-work-list-item-label-close="Fermer" aria-expanded="false" aria-controls="work-list-item-37"> <span class="u-screen-reader-text">Fermer</span> </button> <div class="c-image c-work-list-item_head-visual " data-work-list-item="preview"> <span class="c-image_inner" style="background-image: url('uploads/projects/VOLLEYBALL/volleyball-01.jpg');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/VOLLEYBALL/volleyball-01-300w.jpg" > </span> </div> </header> <main class="c-work-list-item_content" data-work-list-item="content" aria-label="Volleyball Canada preview" id="work-list-item-37"> <div class="c-work-list-item_content-inner" data-work-list-item="content-inner"> <div class="c-work-list-item_gallery" data-module-work-gallery> <div class="c-image c-work-list-item_gallery-item " data-work-list-item="image" data-work-gallery="slide"> <span class="c-image_inner" style="background-image: url('uploads/projects/VOLLEYBALL/volleyball-02-10w.jpg');"> <img class="c-image_img " alt="" width="1000" height="703" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201000%20703'%3E%3C/svg%3E" data-src="uploads/projects/VOLLEYBALL/volleyball-02-1000w.jpg" > </span> </div> </div> <div class="c-image c-work-list-item_visual " data-work-list-item="preview-target" aria-hidden="true"> <span class="c-image_inner" style="background-image: url('uploads/projects/VOLLEYBALL/volleyball-01.jpg');"> <img class="c-image_img " alt="" width="300" height="189" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20300%20189'%3E%3C/svg%3E" data-src="uploads/projects/VOLLEYBALL/volleyball-01-300w.jpg" > </span> </div> <p class="c-work-list-item_description">Volleyball Canada a mandaté Locomotive pour revoir sa stratégie de contenu et bâtir un nouveau site web capable d’agréger toutes les informations dans une même plateforme : les actualités, les compétitions, les évènements, les profils de joueurs, les statistiques et résultats. Locomotive a donc créé un système de gestion par CMS pour tout le contenu de la nouvelle plateforme, dont les résultats en direct, et une API pour les statistiques. </p> <ul class="c-work-list-item_categories"> <li>Digital</li> </ul> <span class="c-work-list-item_notes"> <span>©2016</span> <span> 1 prix </span> </span> <div class="c-work-list-item_actions"> <a class="c-button -full " data-hover-shuffle="children" href="https://volleyball.ca/fr" target="_blank" rel="noopener noreferrer" data-icon="↗" > <span class="c-button_label" data-hover-shuffle-child> Visiter le site </span> </a> </div> </div> </main> </article> </div> </div> </section> <footer class="c-footer"> <nav class="c-footer_nav"> <ul class="c-footer_menu-list"> <li class="c-footer_menu -main"> <h2 class="c-footer_menu_title">Menu</h2> <ul class="c-footer_menu_list"> <li class="c-footer_menu_item || u-none@to-small"> <a href="fr/projets" class="c-footer_menu_link" data-hover-shuffle>Projets</a> </li> <li class="c-footer_menu_item || u-none@to-small"> <a href="fr/agence" class="c-footer_menu_link" data-hover-shuffle>Agence</a> </li> <li class="c-footer_menu_item || u-none@to-small"> <a href="fr/carrieres" class="c-footer_menu_link" data-hover-shuffle>Carrières</a> </li> <li class="c-footer_menu_item || u-none@to-small"> <a href="fr/contact" class="c-footer_menu_link" data-hover-shuffle>Contact</a> </li> <li class="c-footer_menu_item || u-none@to-small"> <a href="fr/politique-de-confidentialite" class="c-footer_menu_link" data-hover-shuffle>Confidentialité</a> </li> <li class="c-footer_menu_item -langswitcher"> <a href="https://locomotive.ca/en/work" class="c-footer_menu_link" data-load="false" data-hover-shuffle>English</a> </li> </ul> <div class="c-footer_menu_cta"> <button type="button" data-hover-shuffle data-cookie-consent="show-preferences" >Préférences de cookies</button> <button type="button" data-hover-shuffle aria-controls="newsletter-modal" aria-expanded="false" data-module-newsletter-toggler >Infolettre<span aria-hidden="true"> ↓</span></button> </div> </li> <li class="c-footer_menu -social"> <h2 class="c-footer_menu_title">Médias Sociaux</h2> <ul class="c-footer_menu_list"> <li class="c-footer_menu_item"> <a href="https://www.instagram.com/locomotivemtl/" rel="noopener noreferrer" target="_blank" data-icon='↗' class="c-footer_menu_link" data-hover-shuffle > Instagram </a> </li> <li class="c-footer_menu_item"> <a href="https://twitter.com/locomotivemtl" rel="noopener noreferrer" target="_blank" data-icon='↗' class="c-footer_menu_link" data-hover-shuffle > Twitter </a> </li> <li class="c-footer_menu_item"> <a href="https://www.linkedin.com/company/locomotive-mtl" rel="noopener noreferrer" target="_blank" data-icon='↗' class="c-footer_menu_link" data-hover-shuffle > Linkedin </a> </li> <li class="c-footer_menu_item"> <a href="https://www.behance.net/locomotivemtl" rel="noopener noreferrer" target="_blank" data-icon='↗' class="c-footer_menu_link" data-hover-shuffle > Behance </a> </li> <li class="c-footer_menu_item"> <a href="https://github.com/locomotivemtl" rel="noopener noreferrer" target="_blank" data-icon='↗' class="c-footer_menu_link" data-hover-shuffle > Github </a> </li> </ul> </li> <li class="c-footer_menu -external"> <h2 class="c-footer_menu_title">Externe</h2> <ul class="c-footer_menu_list"> <li class="c-footer_menu_item"> <a href="https://store.locomotive.ca/fr" rel="noopener noreferrer" target="_blank" data-icon='↗' class="c-footer_menu_link" data-hover-shuffle> Boutique </a> </li> <li class="c-footer_menu_item"> <a href="https://locomotivemtl.github.io/locomotive-scroll/" rel="noopener noreferrer" target="_blank" data-icon='↗' class="c-footer_menu_link" data-hover-shuffle> Locomotive Scroll </a> </li> <li class="c-footer_menu_item"> <a href="https://charcoal.locomotive.ca/fr" rel="noopener noreferrer" target="_blank" data-icon='↗' class="c-footer_menu_link" data-hover-shuffle> Charcoal CMS </a> </li> <li class="c-footer_menu_item"> <a href="https://explore.locomotive.ca/fr" rel="noopener noreferrer" target="_blank" data-icon='↗' class="c-footer_menu_link" data-hover-shuffle> Voyage annuel </a> </li> </ul> </li> </ul> </nav> <div class="c-footer_coords" data-allow-shuffle> <address><a href="https://goo.gl/maps/gP8aN5aEvZd8Ejau8" rel="noopener noreferrer" target="_blank"><span aria-hidden="true">🟤</span>1211<span aria-hidden="true">🔠</span><span class="u-screen-reader-text"> </span>Jean-Talon Est<span aria-hidden="true">🔚🔞</span><br class="u-none@to-small">Montréal<span class="u-screen-reader-text"> </span><span aria-hidden="true">🛑🚹🚺</span><span class="u-screen-reader-text">(QC)</span>, <span class='u-no-break'>Canada<span aria-hidden="true">🦉</span>H2R 1W1</span></a></address> <a href="tel:+15145245678">Téléphone <span class="u-screen-reader-text">+1 514 524 5678</span><span aria-hidden="true">📞</span></a> <a href="mailto:info@locomotive.ca" data-module-copy-to-clipboard data-confirmation="Copié dans le presse-papier!" data-to-copy="info@locomotive.ca">info<span aria-hidden="true">🔂</span><span class="u-screen-reader-text">@</span>locomotive.ca</a> </div> <div class="c-footer_copyright"> ©2024 </div> <div class="c-newsletter-modal" id="newsletter-modal" data-module-newsletter-modal data-newsletter-modal-success="Une confirmation vous sera envoyée par email. Merci!" data-newsletter-modal-error="Une erreur est survenue." > <div class="c-newsletter-modal_inner"> <div class="o-container"> <div class="o-grid -col-12 -gutters"> <div class="o-grid_item || u-gc-1/6"> <button class="c-newsletter-modal_close" type="button" data-newsletter-modal="close">Fermer</button> </div> <div class="o-grid_item || u-gc-7/13"> Lâche ton email, <br>on t'envoie l'infolettre </div> <div class="o-grid_item"> <form action="/newsletter/subscribe" class="c-newsletter-modal_form" data-newsletter-modal="form"> <input type="email" name="email" class="c-newsletter-modal_input" placeholder="nom@email.com" data-newsletter-modal="input"> <input type="hidden" name="locale" value="fr_CA"> <button class="c-newsletter-modal_button" type="submit"> <span class="c-newsletter-modal_button_label">S'inscrire</span> </button> </form> <div class="c-newsletter-modal_feedback" data-newsletter-modal="feedback"></div> </div> </div> </div> </div> <div class="c-newsletter-modal_background"></div> </div> </footer> </main> </div> <div class="c-video-modal" data-module-video-modal> <button type="button" class="c-video-modal_close || o-text -medium" data-video-modal="close"> Fermer </button> <div class="c-video-modal_content"> <div class="c-video-modal_inner" data-video-modal="inner"></div> </div> </div> </div> <script src="https://locomotive.ca/assets/scripts/vendors.js?v=1723754399977" defer></script> <script src="https://locomotive.ca/assets/scripts/app.js?v=1723754399977" defer></script> </body> </html>

CINXE.COM

Projets | Locomotive