CINXE.COM
Dr. Dabber | Locomotive
<!doctype html> <html class="has-no-js is-first-loading is-loading" lang="en" data-template="work-single" data-theme="default"> <head> <meta charset="utf-8"> <meta http-equiv="x-ua-compatible" content="ie=edge"> <base href="https://locomotive.ca/"> <title>Dr. Dabber | Locomotive</title> <link rel="canonical" href="https://locomotive.ca/en/work/drdabber"> <meta property="og:url" content="https://locomotive.ca/en/work/drdabber"> <meta property="og:title" content="Dr. Dabber | Locomotive"> <meta property="twitter:title" content="Dr. Dabber | Locomotive"> <meta property="og:site_name" content="Locomotive"> <meta name="description" content="We are Locomotive®. An independent agency with a deep skill set, big ideas, lots of heart and a global reputation."> <meta property="og:description" content="We are Locomotive®. An independent agency with a deep skill set, big ideas, lots of heart and a global reputation."> <meta property="twitter:description" content="We are Locomotive®. An independent agency with a deep skill set, big ideas, lots of heart and a global reputation."> <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"> <!-- Viewport --> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="HandheldFriendly" content="true"> <!-- Appearance --> <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"> <!-- Styles --> <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> <!-- Google tag (gtag.js) --> <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":"en","translations":{"en":{"consentModal":{"title":"We use cookies!","description":"Hi, this website uses essential cookies to ensure its proper operation and tracking cookies to understand how you interact with it. The latter will be set only after consent. {{revisionMessage}} <button class=\"cc__link\" data-cookie-consent=\"show-preferences\">Let me choose</button>","revisionMessage":"<br><br>Our <a href=\"en/privacy-policy?hide-cookie-consent\" target=\"_self\" rel=\"\">privacy policy</a> has changed since your last visit.","footer":"<a href=\"en/privacy-policy?hide-cookie-consent\" target=\"_self\" rel=\"\">privacy policy</a>","acceptAllBtn":"Accept All","acceptNecessaryBtn":"Accept Necessary"},"preferencesModal":{"title":"Cookie preferences","acceptAllBtn":"Accept All","acceptNecessaryBtn":"Accept Necessary","savePreferencesBtn":"Save Preferences","closeIconLabel":"Accept Necessary","sections":[{"description":"We use cookies to personalize content and improve your digital experience. Some cookies are essential in order for the Web site to function correctly and for security purposes. These essential cookies cannot be deactivated.<br><br>You can activate or deactivate your permission for cookies to collect your browsing data at any time. If you deactivate certain cookies, your browsing experience may be affected.<br><br>You can find out more in our <a href=\"en/privacy-policy?hide-cookie-consent\" target=\"_self\" rel=\"\">privacy policy</a>."},{"title":"Strictly necessary cookies<span class=\"pm__badge\">Required</span>","description":"These cookies are set to ensure that our Web site works correctly. They cannot be disabled.","linkedCategory":"necessary","cookieTable":{"headers":{"name":"Name","service":"Service","duration":"Duration","purpose":"Purpose"},"body":[{"name":"PHPSESSID","service":"Locomotive","duration":"Session","purpose":"Used to share functional data across pages of the Web site such as the current language."},{"name":"locomotive.quickpreload","service":"Locomotive","duration":"Session","purpose":"Used to shorten duration of preloading screen on subsequent page navigation."},{"name":"cc_cookie","service":"Locomotive","duration":"6 months","purpose":"Used to remember your cookie consent preferences."},{"name":"_grecaptcha","service":"Google reCAPTCHA","duration":"6 months","purpose":"Used to store the assessment if the visit, interaction, or form submission, is legitimate or malicious."},{"name":"__cf_bm","service":"Cloudflare","duration":"30 minutes","purpose":"Used to store the assessment if the visit is legitimate or malicious."}]}},{"title":"Performance cookies","description":"These cookies are used to analyze site browsing to improve how well it works.","linkedCategory":"analytics","cookieTable":{"headers":{"name":"Name","service":"Service","duration":"Duration","purpose":"Purpose"},"body":[{"name":"_ga","service":"Google Analytics","duration":"2 years","purpose":"Used to distinguish unique users and count page views."},{"name":"_gat","service":"Google Analytics","duration":"1 minute","purpose":"Used to limit the frequency of data collection."},{"name":"_gid","service":"Google Analytics","duration":"1 day","purpose":"Used to distinguish unique users and count page views."}]}}]}}}},"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> Based<br> Based in<br> Based in Montreal<br> Based in Montreal<br> Based in Montreal, Canada<br> Based in Montreal, Canada<br> Based in Montreal, 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="en" 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="en/work" class="c-header-menu_link" data-hover-shuffle>Work</a></li> <li class="c-header-menu_item"><a href="en/agency" class="c-header-menu_link" data-hover-shuffle>Agency</a></li> <li class="c-header-menu_item"><a href="en/careers" class="c-header-menu_link" data-hover-shuffle>Careers</a></li> <li class="c-header-menu_item"> <a target="_blank" rel="noopener noreferrer" href="https://store.locomotive.ca" class="c-header-menu_link" data-hover-shuffle>Store</a> </li> </ul> </nav> <a href="en/contact" class="c-header_cta " data-hover-shuffle>Let's talk</a> <button class="c-header_menu-toggler" data-header="menu-toggler" data-header-open-label="Menu" data-header-close-label="Close" 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="en/work" class="c-menu_nav_link ">Work</a> </li> <li class="c-menu_nav_item"> <a href="en/agency" class="c-menu_nav_link ">Agency</a> </li> <li class="c-menu_nav_item"> <a href="en/careers" class="c-menu_nav_link ">Careers</a> </li> <li class="c-menu_nav_item"> <a href="en/contact" class="c-menu_nav_link ">Let's talk</a> </li> <li class="c-menu_nav_item"> <a class="c-menu_nav_link" target="_blank" rel="noopener noreferrer" href="https://store.locomotive.ca">Store</a> </li> </ul> <div class="c-menu_footer"> <a href="https://locomotive.ca/fr/projets/drdabber" class="c-menu_langswitcher" data-load="false">Français</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> <div class="c-work-single-hero" data-module-work-single-hero> <div class="c-work-single-hero_container || o-container"> <div class="c-work-single-hero_inner"> <div class="c-work-single-hero_grid -top || o-grid -col-4 -gutters"> <div class="c-work-single-hero_content-type"> <span class="o-text -medium">Case Study</span> </div> <div class="c-work-single-hero_context-label"> <div class="u-screen-reader-text">Categories</div> <ul class="o-text -medium"> <li>Branding</li> <li>Digital</li> <li>Experience</li> <li>E-commerce</li> <li>Content</li> </ul> </div> </div> <div class="c-work-single-hero_grid -bottom || o-grid -col-4 -gutters" data-work-single-hero="grid-bottom"> <div class="c-work-single-hero_title || o-padding -huge-top" data-work-single-hero="title"> <h1 class="c-heading -huge || c-work-single-hero_heading">Dr. Dabber</h1> </div> <div class="c-work-single-hero_year"> <span class="o-text -medium">©2022</span> </div> <div class="c-work-single-hero_category"> <span class="o-text -medium"> Leisure <br> Las Vegas, USA </span> </div> </div> </div> </div> <div class="o-container" > <div class="c-work-single-hero_visual"> <div class="c-work-single-hero_grid -visual || o-grid -col-4 -gutters"> <div class="c-work-single-hero_featured-image || o-padding -tiny-top -tiny-bottom"> <div class="c-image -lazy-load" > <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="1804" height="1116" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201804%201116'%3E%3C/svg%3E" data-src="uploads/projects/DABBER/vlcsnap-2021-11-08-16h26m21s557.png" data-scroll data-scroll-offset="15%" data-scroll-call="lazyLoad, Scroll" data-depixelate data-scroll-ignore-fold > </span> </div> <p class="c-work-single-hero_caption || o-text -medium"> <span></span> <span></span> </p> </div> </div> </div> </div> </div> <div class="o-container"> <div class="c-work-single-pitch_wrapper"> <div class="c-work-single-pitch"> <div class="c-work-single-pitch_head"> <span>Website(s)</span> <span><a href="https://experience.drdabber.com/" target="_blank" rel="noopener noreferrer">experience.drdabber.com</a></span> </div> <div class="c-work-single-pitch_content"> <a class="c-work-single-pitch_link" href="https://experience.drdabber.com/" target="_blank" rel="noopener noreferrer">experience.drdabber.com</a><span aria-hidden="true">🦉</span><p class="">rise with us.</p> </div> </div> </div> </div> <div class="c-attachment || u-margin -visual"> <div class="c-image -lazy-load" > <span class="c-image_inner" style="background-image: url('uploads/projects/DABBER/Frame_1465-10w.png');"> <img class="c-image_img " alt="" width="2000" height="1406" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%202000%201406'%3E%3C/svg%3E" data-src="uploads/projects/DABBER/Frame_1465-2000w.png" data-scroll data-scroll-offset="15%" data-scroll-call="lazyLoad, Scroll" > </span> </div> </div> <div class="c-section-overline -no-border || u-margin -huge-bottom -small-top"> <div class="o-container"> <div class="c-section-overline_inner"> <h2 class="c-section-overline_title">About</h2> <div class="o-grid -col-4 -gutters"> <div class="o-grid_item || u-gc-3/5@from-medium || "> <div class="c-wysiwyg || o-text -medium"> Dr. Dabber needed an enhanced digital strategy to showcase and sell its high-end vaporizers. Locomotive created a complete e-commerce site using Shopify, which included the creation of creative content in collaboration with Baillat Studio to promote the brand's flagship products through a unique experience. </div> </div> </div> </div> </div></div> <div class="c-section-overline || u-margin -huge-top -huge-bottom"> <div class="o-container"> <div class="c-section-overline_inner"> <h2 class="c-section-overline_title">Awards (3)</h2> <div class="o-grid -col-4 -gutters"> <div class="o-grid_item || u-gc-3/5@from-medium || u-gc-2/5"> <ul class="c-list -alternative"> <li class="c-list_row"> <div class="c-list_item"> Site of the Day </div> <div class="c-list_item"> Awwwards </div> </li> <li class="c-list_row"> <div class="c-list_item"> Developer award </div> <div class="c-list_item"> Awwwards </div> </li> <li class="c-list_row"> <div class="c-list_item"> FWA of the day </div> <div class="c-list_item"> FWA </div> </li> </ul> </div> </div> </div> </div></div> <div class="c-attachment || u-margin -big-top -big-bottom -visuals-dual"> <div class="o-container"> <div class="o-grid -col-12 -gutters"> <div class="o-grid_item u-gc-1/6@from-small"> <div class="c-video "> <div class="c-image -lazy-load" > <span class="c-image_inner" style="background-image: url('uploads/projects/DABBER/Visual_brand-10w.png');"> <img class="c-image_img " alt="" width="2000" height="1330" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%202000%201330'%3E%3C/svg%3E" data-src="uploads/projects/DABBER/Visual_brand-2000w.png" data-scroll data-scroll-offset="15%" data-scroll-call="lazyLoad, Scroll" data-depixelate > </span> </div> <video class="c-video_media" playsinline muted loop data-module-video-inview poster="uploads/projects/DABBER/Visual_brand-2000w.png" data-scroll data-scroll-repeat data-scroll-call="toggle, VideoInview" > <source src="https://player.vimeo.com/progressive_redirect/playback/782626174/rendition/480p/file.mp4?loc=external&signature=c1e98e09c265d3faea1103413d0f5ded58e186c81706b6a9fb2fe19339fe292e" type="video/mp4"> </video> </div> </div> <div class="o-grid_item u-gc-7/13@from-small"> <div class="c-image -lazy-load" > <span class="c-image_inner" style="background-image: url('uploads/projects/DABBER/Visual_phone-10w.png');"> <img class="c-image_img " alt="" width="2000" height="2839" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%202000%202839'%3E%3C/svg%3E" data-src="uploads/projects/DABBER/Visual_phone-2000w.png" data-scroll data-scroll-offset="15%" data-scroll-call="lazyLoad, Scroll" data-depixelate > </span> </div> </div> </div> </div> </div> <div class="c-attachment || u-margin -big-top -big-bottom -visual"> <div class="o-container"> <div class="o-grid -col-12@from-medium -gutters"> <div class="o-grid_item u-gc-2/12@from-medium"> <div class="c-video "> <div class="o-ratio u-16:9"></div> <video class="c-video_media" playsinline muted loop data-module-video-inview poster="" data-scroll data-scroll-repeat data-scroll-call="toggle, VideoInview" > <source src="https://player.vimeo.com/progressive_redirect/playback/782626192/rendition/1080p/file.mp4?loc=external&signature=e7794708ec50a63f05308e5bce6b37b9c359f6a92ab2f71c91b2067eaabf2560" type="video/mp4"> </video> </div> </div> </div> </div> </div> <div class="c-attachment || u-margin -big-top -big-bottom -visual"> <div class="o-container"> <div class="o-grid -col-12@from-medium -gutters"> <div class="o-grid_item u-gc-2/12@from-medium"> <div class="c-video "> <div class="o-ratio u-16:9"></div> <video class="c-video_media" playsinline muted loop data-module-video-inview poster="" data-scroll data-scroll-repeat data-scroll-call="toggle, VideoInview" > <source src="https://player.vimeo.com/progressive_redirect/playback/782626227/rendition/1080p/file.mp4?loc=external&signature=31448cdaf75ab3b484d9df74c45a0d97518bdd79627e74398f3d7ae20d7ac85d" type="video/mp4"> </video> </div> </div> </div> </div> </div> <div class="c-attachment || u-margin -big-top -big-bottom -visual"> <div class="o-container"> <div class="o-grid -col-12@from-medium -gutters"> <div class="o-grid_item u-gc-2/12@from-medium"> <div class="c-image -lazy-load" > <span class="c-image_inner" style="background-image: url('uploads/projects/DABBER/Screenshot_2022-11-01_at_1.25_3-10w.png');"> <img class="c-image_img " alt="" width="2000" height="1287" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%202000%201287'%3E%3C/svg%3E" data-src="uploads/projects/DABBER/Screenshot_2022-11-01_at_1.25_3-2000w.png" data-scroll data-scroll-offset="15%" data-scroll-call="lazyLoad, Scroll" data-depixelate > </span> </div> </div> </div> </div> </div> <div class="c-attachment || u-margin -big-top -big-bottom -visual"> <div class="c-image -lazy-load" > <span class="c-image_inner" style="background-image: url('uploads/projects/DABBER/Group_1489-10w.png');"> <img class="c-image_img " alt="" width="2000" height="3134" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%202000%203134'%3E%3C/svg%3E" data-src="uploads/projects/DABBER/Group_1489-2000w.png" data-scroll data-scroll-offset="15%" data-scroll-call="lazyLoad, Scroll" > </span> </div> </div> <div class="c-attachment || u-margin -big-top -big-bottom -visual"> <div class="o-container"> <div class="o-grid -col-12@from-medium -gutters"> <div class="o-grid_item u-gc-2/12@from-medium"> <div class="c-video "> <div class="c-image -lazy-load" > <span class="c-image_inner" style="background-image: url('uploads/projects/DABBER/Frame_1467-10w.png');"> <img class="c-image_img " alt="" width="2000" height="1288" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%202000%201288'%3E%3C/svg%3E" data-src="uploads/projects/DABBER/Frame_1467-2000w.png" data-scroll data-scroll-offset="15%" data-scroll-call="lazyLoad, Scroll" data-depixelate > </span> </div> <video class="c-video_media" playsinline muted loop data-module-video-inview poster="uploads/projects/DABBER/Frame_1467-2000w.png" data-scroll data-scroll-repeat data-scroll-call="toggle, VideoInview" > <source src="https://player.vimeo.com/progressive_redirect/playback/782626182/rendition/1080p/file.mp4?loc=external&signature=53c263062cf5d1a2c7ef6aecd761336a6fb816f7c29a0b31467ffd121e820ad1" type="video/mp4"> </video> </div> </div> </div> </div> </div> <div class="c-attachment || u-margin -big-top -big-bottom -gallery"> <div class="o-container || u-no-overflow"> <div class="c-gallery" data-module-gallery data-scroll data-scroll-call="inview, Gallery"> <div class="c-gallery_outer"> <div class="c-gallery_container || swiper" data-gallery="container"> <div class="c-gallery_wrapper || swiper-wrapper"> <div class="c-gallery_slide || swiper-slide"> <div class="c-gallery_slide-inner"> <div class="c-video "> <div class="c-image -lazy-load" > <span class="c-image_inner" style="background-image: url('uploads/AH_PAVE_SHOT_04_DSCF5002_2-10w.png');"> <img class="c-image_img " alt="" width="2000" height="1264" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%202000%201264'%3E%3C/svg%3E" data-src="uploads/AH_PAVE_SHOT_04_DSCF5002_2-2000w.png" data-scroll data-scroll-offset="15%" data-scroll-call="lazyLoad, Scroll" data-depixelate > </span> </div> </div> </div> </div> <div class="c-gallery_slide || swiper-slide"> <div class="c-gallery_slide-inner"> <div class="c-video "> <div class="c-image -lazy-load" > <span class="c-image_inner" style="background-image: url('uploads/vlcsnap-2022-02-16-10h31m40s322-10w.png');"> <img class="c-image_img " alt="" width="2000" height="1264" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%202000%201264'%3E%3C/svg%3E" data-src="uploads/vlcsnap-2022-02-16-10h31m40s322-2000w.png" data-scroll data-scroll-offset="15%" data-scroll-call="lazyLoad, Scroll" data-depixelate > </span> </div> </div> </div> </div> <div class="c-gallery_slide || swiper-slide"> <div class="c-gallery_slide-inner"> <div class="c-video "> <div class="c-image -lazy-load" > <span class="c-image_inner" style="background-image: url('uploads/Group_1463-10w.png');"> <img class="c-image_img " alt="" width="2000" height="1264" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%202000%201264'%3E%3C/svg%3E" data-src="uploads/Group_1463-2000w.png" data-scroll data-scroll-offset="15%" data-scroll-call="lazyLoad, Scroll" data-depixelate > </span> </div> </div> </div> </div> <div class="c-gallery_slide || swiper-slide"> <div class="c-gallery_slide-inner"> <div class="c-video "> <div class="c-image -lazy-load" > <span class="c-image_inner" style="background-image: url('uploads/vlcsnap-2022-02-16-10h33m14s807-10w.png');"> <img class="c-image_img " alt="" width="2000" height="1264" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%202000%201264'%3E%3C/svg%3E" data-src="uploads/vlcsnap-2022-02-16-10h33m14s807-2000w.png" data-scroll data-scroll-offset="15%" data-scroll-call="lazyLoad, Scroll" data-depixelate > </span> </div> </div> </div> </div> </div> </div> </div> <div class="c-gallery_footer"> <span class="c-gallery_label">Image</span> <span class="c-gallery_pagination" data-gallery="pagination"></span> <span class="c-gallery_next"> <button data-gallery="next" aria-label="Next">→</button> </span> </div> </div> </div> </div> <div class="o-container"> <div class="c-website-cta"> <span class="c-website-cta_label">©2022</span> <p class="c-website-cta_content"> Visit<span aria-hidden="true">🦉</span><a href="https://experience.drdabber.com/" target="_blank" rel="noopener noreferrer">experience.drdabber.com</a> </p> </div> </div> <div class="c-section-overline || u-padding -huge-top"> <div class="o-container"> <div class="c-section-overline_inner"> <h2 class="c-section-overline_title">Credits</h2> <div class="o-grid -col-4 -gutters"> <div class="o-grid_item || u-gc-3/5@from-medium || "> <ul class="c-list -no-border-last-child -align-start"> <li class="c-list_row"> <div class="c-list_item"> Creative Director </div> <div class="c-list_item"> Dust Leblanc </div> </li> <li class="c-list_row"> <div class="c-list_item"> UX Designer </div> <div class="c-list_item"> Sacha Haouzi </div> </li> <li class="c-list_row"> <div class="c-list_item"> Art Director </div> <div class="c-list_item"> Bastien Allard </div> </li> <li class="c-list_row"> <div class="c-list_item"> 3D and motion design </div> <div class="c-list_item"> Baillat Studio </div> </li> <li class="c-list_row"> <div class="c-list_item"> WebGL </div> <div class="c-list_item"> Quentin Hocdé </div> </li> <li class="c-list_row"> <div class="c-list_item"> Front-end Developer </div> <div class="c-list_item"> Arnaud Pinot </div> </li> <li class="c-list_row"> <div class="c-list_item"> Front-end Developer </div> <div class="c-list_item"> Deven Caron </div> </li> <li class="c-list_row"> <div class="c-list_item"> Front-end Developer </div> <div class="c-list_item"> Lucas Vallenet </div> </li> <li class="c-list_row"> <div class="c-list_item"> Project Manager </div> <div class="c-list_item"> Louise Philipovitch </div> </li> <li class="c-list_row"> <div class="c-list_item"> Project Manager </div> <div class="c-list_item"> Karine Legault Malette </div> </li> <li class="c-list_row"> <div class="c-list_item"> Account Director </div> <div class="c-list_item"> Jean-François Chainé </div> </li> </ul> </div> </div> </div> </div></div> <article class="c-work-next || u-margin -big-top" data-module-work-next data-scroll data-scroll-module-progress data-scroll-css-progress data-scroll-position="start,end" data-scroll-offset="0,110%" > <div class="c-section-overline c-work-next_overline || "> <div class="o-container"> <div class="c-section-overline_inner"> <h2 class="c-section-overline_title">Next Project</h2> <div class="o-grid -col-4 -gutters"> <div class="o-grid_item || u-gc-3/5@from-medium || "> <div class="c-work-next_cta"> <span class="o-text -medium">Scroll Down↓</span> <span class="c-work-next_progress"></span> </div> </div> </div> </div> </div></div> <div class="c-work-next_container || o-container"> <div class="c-work-next_inner"> <div class="c-work-next_grid -bottom || o-grid -col-4 -gutters"> <div class="c-work-next_title || o-padding -huge-top"> <h1 class="c-heading -huge || c-work-next_heading">Stenger Bike</h1> </div> <div class="c-work-next_year"> <span class="o-text -medium">©2024</span> </div> <div class="c-work-next_category"> <span class="o-text -medium"> E-Commerce <br> Hösbach, Germany </span> </div> </div> <div class="c-work-next_visual"> <div class="c-work-next_grid -visual || o-grid -col-4 -gutters"> <div class="c-work-next_featured-image || o-padding -tiny-top -tiny-bottom" data-work-next="image"> <div class="c-image " > <span class="c-image_inner" style="background-image: url('uploads/projects/Stenger-Bike/Image_Stenger-10w.jpg');"> <img class="c-image_img " alt="" width="903" height="568" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20903%20568'%3E%3C/svg%3E" data-src="uploads/projects/Stenger-Bike/Image_Stenger.jpg" > </span> </div> </div> </div> </div> </div> </div> <a data-work-next="link" class="c-work-next_link" data-scroll href="/en/work/stenger-bike" data-load-transition="work-next">Read more</a> </article> </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"> Close </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>