                            
                            
          <!DOCTYPE html>
<html lang="en" class="is-home-view">
<head>
    <!-- Google Tag Manager (différé après load — moins de concurrence LCP / TBT) -->
    <script>
    window.dataLayer = window.dataLayer || [];
    window.dataLayer.push({'gtm.start': new Date().getTime(), event: 'gtm.js'});
    (function (w, d, s, l, i) {
      function inject() {
        var f = d.getElementsByTagName(s)[0],
          j = d.createElement(s),
          dl = l != 'dataLayer' ? '&l=' + l : '';
        j.async = true;
        j.src = 'https://www.googletagmanager.com/gtm.js?id=' + i + dl;
        f.parentNode.insertBefore(j, f);
      }
      function arm() {
        if (w.requestIdleCallback) {
          w.requestIdleCallback(inject, { timeout: 4000 });
        } else {
          w.setTimeout(inject, 1);
        }
      }
      if (d.readyState === 'complete') arm();
      else w.addEventListener('load', arm);
    })(window, document, 'script', 'dataLayer', 'GTM-MKJP5MZM');
    </script>
    <!-- End Google Tag Manager -->
            <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
                                        <style id="cursor-native-hide-critical">
          html.cursor-pending,html.cursor-pending *,html.has-custom-cursor,html.has-custom-cursor *,.has-custom-cursor,.has-custom-cursor *{cursor:url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7") 0 0,none!important}
        </style>
        <script>
        (function () {
          /* Avant le 1er paint (pas dans le body) : sinon is-intro cache le
             logo une frame — clignotement About → accueil, surtout mobile. */
          try {
            if (sessionStorage.getItem('portfolio-skip-landing-intro') === '1') {
              document.documentElement.classList.add('landing-skip-intro');
            }
            if (sessionStorage.getItem('portfolio-roue-enter-from-about') === '1') {
              document.documentElement.classList.add('roue-enter-from-about');
            }
            if (sessionStorage.getItem('portfolio-archives-enter') === '1') {
              document.documentElement.classList.add('archives-enter');
            }
          } catch (errSkip) {}
          /*
           * Accueil : Espace/Esc pendant le showreel = skip (jamais reload).
           * Garde window capture dès le head — avant defer, avant focus lien.
           */
          (function armHomeSpaceGuard() {
            var html = document.documentElement;
            if (!html.classList.contains('is-home-view')) return;

            function isSpaceKey(e) {
              return (
                e.key === ' ' ||
                e.key === 'Spacebar' ||
                e.code === 'Space' ||
                e.keyCode === 32
              );
            }

            function introIsOn() {
              try {
                return !!(
                  document.querySelector &&
                  document.querySelector(
                    '.landing-roulette.is-intro [data-landing-intro]:not([hidden])'
                  )
                );
              } catch (errIntro) {
                return false;
              }
            }

            function requestSkip(fromSpace) {
              try {
                if (
                  window.portfolioIntro &&
                  typeof window.portfolioIntro.skip === 'function'
                ) {
                  window.portfolioIntro.skip({ fromSpace: !!fromSpace });
                  return true;
                }
              } catch (errSkipApi) {
                /* ignore */
              }
              if (fromSpace) window.__portfolioPendingHomeSpace = true;
              else window.__portfolioPendingHomeEsc = true;
              return false;
            }

            function onKey(e) {
              if (!e || e.isComposing) return;
              if (e.metaKey || e.ctrlKey || e.altKey) return;
              var space = isSpaceKey(e);
              if (!space && e.key !== 'Escape') return;

              var duringIntro = introIsOn() || !window.portfolioHomeKeysReady;
              if (!duringIntro) return;

              /* Bloque scroll / activation lien / reload natif. */
              e.preventDefault();
              if (typeof e.stopImmediatePropagation === 'function') {
                e.stopImmediatePropagation();
              } else {
                e.stopPropagation();
              }
              if (e.type === 'keyup' || e.type === 'keypress') return;
              requestSkip(space);
            }

            window.addEventListener('keydown', onKey, true);
            window.addEventListener('keyup', onKey, true);
            window.addEventListener('keypress', onKey, true);
            window.portfolioReleaseHomeKeys = function () {
              window.portfolioHomeKeysReady = true;
            };
          })();
          window.portfolioCursorConfig = {
            enabled: true,
            fx: true
          };
          window.portfolioCursorSrc = "\/user\/themes\/yanis\u002Dportfolio\/js\/cursor.min.js";
          /* Masque le curseur natif ASAP (nav, swap DOM, 1er paint). */
          window.portfolioArmNativeCursorHide = function () {
            try {
              var cfg = window.portfolioCursorConfig;
              if (!cfg || cfg.enabled === false) return;
              var html = document.documentElement;
              if (html.classList.contains('is-ipad-safari')) return;
              html.classList.add('cursor-pending', 'has-custom-cursor');
              if (document.body) document.body.classList.add('has-custom-cursor');
            } catch (errArmNative) {}
          };
          /*
           * iPadOS 13+ se fait passer pour un Mac (hover:hover + pointer:fine).
           * maxTouchPoints > 1 + Macintosh = iPad, même avec UA desktop.
           * iPad : pas d’immersif (barre Safari complète, contenu dessous).
           * Hover trackpad : pointerType mouse (doigt = tactile).
           * Curseur canvas désactivé sur iPad (perf) — hover CSS natif à la place.
           */
          (function markSafariImmersive() {
            var html = document.documentElement;
            var nav = window.navigator || {};
            var ua = nav.userAgent || '';
            var platform = nav.platform || '';
            var maxTouch = nav.maxTouchPoints || 0;
            var iphone = /iPhone|iPod/.test(ua);
            var ipad =
              /iPad/.test(ua) ||
              ((platform === 'MacIntel' || /Macintosh/.test(ua)) && maxTouch > 1);
            if (ipad) html.classList.add('is-ipad-safari');
            else if (iphone) html.classList.add('is-safari-immersive');
            /*
             * iPad + trackpad / souris : le pointeur primaire reste coarse,
             * donc (hover:hover) et (pointer:fine) mentent. On arme le hover
             * uniquement sur un vrai pointerType mouse (doigt = off).
             */
            (function watchFinePointer() {
              if (iphone) return;
              var lastTouchAt = 0;
              var TOUCH_LOCK_MS = 800;
              function setFine(on) {
                if (!!on === html.classList.contains('has-fine-pointer')) return;
                html.classList.toggle('has-fine-pointer', !!on);
                var cursorOn =
                  window.portfolioCursorConfig &&
                  window.portfolioCursorConfig.enabled !== false;
                if (on && cursorOn && !ipad) {
                  window.portfolioArmNativeCursorHide();
                } else {
                  html.classList.remove('cursor-pending', 'has-custom-cursor');
                }
                try {
                  window.dispatchEvent(
                    new CustomEvent('portfolio:fine-pointer', { detail: { on: !!on } })
                  );
                } catch (errFine) {}
              }
              function onPtr(e) {
                var t = e && e.pointerType;
                if (t === 'touch') {
                  lastTouchAt = Date.now();
                  setFine(false);
                  return;
                }
                if (t === 'mouse') {
                  if (Date.now() - lastTouchAt < TOUCH_LOCK_MS) return;
                  setFine(true);
                }
              }
              document.addEventListener('pointerover', onPtr, true);
              document.addEventListener('pointermove', onPtr, true);
              document.addEventListener('pointerdown', onPtr, true);
              if (!ipad) {
                try {
                  if (window.matchMedia('(hover: hover) and (pointer: fine)').matches) {
                    setFine(true);
                  }
                } catch (errArm) {}
              }
            })();
            window.portfolioCanHover = function () {
              try {
                if (html.classList.contains('has-fine-pointer')) return true;
                if (html.classList.contains('is-ipad-safari')) return false;
                if (html.classList.contains('is-safari-immersive')) return false;
                return window.matchMedia('(hover: hover) and (pointer: fine)').matches;
              } catch (errHover) {
                return false;
              }
            };
            window.portfolioNeedsSafariPin = function () {
              try {
                if (html.classList.contains('is-player-view')) return false;
                if (html.classList.contains('is-player-overlay')) return false;
                if (html.classList.contains('is-player-open')) return false;
                if (html.classList.contains('is-safari-immersive')) return true;
                if (nav.standalone === true) return true;
                if (window.matchMedia('(display-mode: standalone)').matches) {
                  return true;
                }
                return window.matchMedia(
                  '(max-width: 760px), ((hover: none) and (pointer: coarse))'
                ).matches;
              } catch (errPin) {
                return true;
              }
            };
            /*
             * Raccourcis clavier : hints à côté des boutons (html.has-keyboard).
             * Tactile seul → pas de hint ; 1er keydown arme ; desktop dès le load.
             */
            (function watchKeyboard() {
              var touchPrimary = false;
              try {
                touchPrimary = window.matchMedia(
                  '(hover: none) and (pointer: coarse)'
                ).matches;
              } catch (errCoarse) {}

              function setKeyboard(on) {
                if (!!on === html.classList.contains('has-keyboard')) return;
                html.classList.toggle('has-keyboard', !!on);
                try {
                  window.dispatchEvent(
                    new CustomEvent('portfolio:keyboard', { detail: { on: !!on } })
                  );
                } catch (errKb) {}
              }

              window.portfolioHasKeyboard = function () {
                return html.classList.contains('has-keyboard');
              };

              if (!iphone && !ipad && !touchPrimary) {
                setKeyboard(true);
              }

              document.addEventListener(
                'keydown',
                function (e) {
                  if (!e || e.isComposing) return;
                  setKeyboard(true);
                },
                true
              );
            })();
          })();
          try {
            if (
              window.portfolioCursorConfig.enabled &&
              !document.documentElement.classList.contains('is-ipad-safari') &&
              window.matchMedia('(hover: hover) and (pointer: fine)').matches
            ) {
              window.portfolioArmNativeCursorHide();
            }
          } catch (e) {}
          /*
           * TikTok mobile portrait : toujours afficher le 9:16 entier, collé haut.
           * Ne pas comparer innerHeight : le chrome Safari le réduit selon son état
           * et faisait basculer certains iPhone vers un cover centré / rogné.
           * iPad : plus large que 9:16 — letterbox 100vw recadre ; cadre contenu.
           */
          function isProjectLetterbox() {
            try {
              if (document.documentElement.classList.contains('is-player-view')) {
                return false;
              }
              if (document.documentElement.classList.contains('is-ipad-safari')) {
                return false;
              }
            } catch (eLb) {}
            return window.matchMedia(
              '(hover: none) and (pointer: coarse) and (orientation: portrait)'
            ).matches;
          }
          window.portfolioIsProjectLetterbox = isProjectLetterbox;
          function syncLetterbox() {
            try {
              document.documentElement.classList.toggle(
                'is-projet-letterbox',
                isProjectLetterbox()
              );
            } catch (e2) {}
          }
          /* Multi-vignettes : largeur 9:16 en px entiers dès le 1er paint
             (évite liseré / chevauchement 1 px avant roulette.js). */
          function syncSlideWidth() {
            try {
              var html = document.documentElement;
              var ipad = html.classList.contains('is-ipad-safari');
              if (isProjectLetterbox()) {
                if (!ipad) html.style.removeProperty('--projet-slide-width');
                return;
              }
              if (
                !ipad &&
                window.matchMedia('(max-aspect-ratio: 9/16)').matches
              ) {
                html.style.removeProperty('--projet-slide-width');
                return;
              }
              var W = window.innerWidth;
              var H = Math.max(1, window.innerHeight);
              var w = Math.floor(Math.min(W, (H * 9) / 16));
              if (w < 1) return;
              html.style.setProperty('--projet-slide-width', w + 'px');
              if (ipad) {
                html.style.setProperty(
                  '--projet-media-frame-height',
                  w * (16 / 9) + 'px'
                );
              }
            } catch (eSlide) {}
          }
          function syncProjetGeometry() {
            syncLetterbox();
            syncSlideWidth();
          }
          syncProjetGeometry();
          window.addEventListener('resize', syncProjetGeometry);
          window.addEventListener('orientationchange', syncProjetGeometry);
          window.addEventListener('portfolio:playerclose', syncProjetGeometry);
          window.addEventListener('portfolio:playeropen', syncProjetGeometry);
        })();
        </script>

        
                                        <title>
                            Yanis Lafkiri - art director
                    </title>

                                    <meta name="generator" content="GravCMS">
                                                                                            <meta name="keywords" content="directeur&#x20;artistique,&#x20;freelance,&#x20;design,&#x20;branding,&#x20;portfolio">
                                
        
<link rel="canonical" href="https&#x3A;&#x2F;&#x2F;yanislafkiri.ch&#x2F;en">
<meta property="og:url" content="https&#x3A;&#x2F;&#x2F;yanislafkiri.ch&#x2F;en">
<meta property="og:type" content="website">
<meta property="og:site_name" content="Yanis&#x20;Lafkiri">
<meta property="og:title" content="Yanis&#x20;Lafkiri&#x20;-&#x20;art&#x20;director">
<meta property="og:locale" content="en_US">
<meta property="og:locale:alternate" content="fr_FR">
<link rel="alternate" hreflang="fr" href="https&#x3A;&#x2F;&#x2F;yanislafkiri.ch&#x2F;en&#x2F;projets">
<link rel="alternate" hreflang="en" href="https&#x3A;&#x2F;&#x2F;yanislafkiri.ch&#x2F;en&#x2F;en&#x2F;">
<link rel="alternate" hreflang="x-default" href="https&#x3A;&#x2F;&#x2F;yanislafkiri.ch&#x2F;en&#x2F;projets">
<meta name="description" content="I&#x20;build&#x20;images&#x20;and&#x20;stories&#x20;for&#x20;creators.&#x20;Projects&#x20;that&#x20;are&#x20;not&#x20;only&#x20;beautiful,&#x20;but&#x20;have&#x20;something&#x20;to&#x20;tell.">
<meta property="og:description" content="I&#x20;build&#x20;images&#x20;and&#x20;stories&#x20;for&#x20;creators.&#x20;Projects&#x20;that&#x20;are&#x20;not&#x20;only&#x20;beautiful,&#x20;but&#x20;have&#x20;something&#x20;to&#x20;tell.">
<meta name="twitter:description" content="I&#x20;build&#x20;images&#x20;and&#x20;stories&#x20;for&#x20;creators.&#x20;Projects&#x20;that&#x20;are&#x20;not&#x20;only&#x20;beautiful,&#x20;but&#x20;have&#x20;something&#x20;to&#x20;tell.">
<meta property="og:image" content="https://yanislafkiri.ch/en/user/pages/01.projets/open-graph-6.webp">
<meta property="og:image:secure_url" content="https://yanislafkiri.ch/en/user/pages/01.projets/open-graph-6.webp">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">
<meta property="og:image:type" content="image/webp">
<meta property="og:image:alt" content="Yanis&#x20;Lafkiri&#x20;-&#x20;art&#x20;director">
<meta name="twitter:image" content="https://yanislafkiri.ch/en/user/pages/01.projets/open-graph-6.webp">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="Yanis&#x20;Lafkiri&#x20;-&#x20;art&#x20;director">
<meta name="theme-color" content="#6B051D">
<meta name="msapplication-TileColor" content="#6B051D">
<meta name="msapplication-TileImage" content="https://yanislafkiri.ch/en/user/themes/yanis-portfolio/images/apple-touch-icon.png">
<meta name="apple-mobile-web-app-title" content="Yanis&#x20;Lafkiri">
<link rel="icon" href="https://yanislafkiri.ch/en/user/themes/yanis-portfolio/images/favicon.svg" type="image/svg+xml">
<link rel="icon" href="https://yanislafkiri.ch/en/user/themes/yanis-portfolio/images/favicon-32.png" type="image/png" sizes="32x32">
<link rel="shortcut icon" href="https://yanislafkiri.ch/en/user/themes/yanis-portfolio/images/favicon.ico">
<link rel="apple-touch-icon" href="https://yanislafkiri.ch/en/user/themes/yanis-portfolio/images/apple-touch-icon.png">
<link rel="apple-touch-icon" href="https://yanislafkiri.ch/en/user/themes/yanis-portfolio/images/apple-touch-icon.png" sizes="152x152">
<link rel="apple-touch-icon" href="https://yanislafkiri.ch/en/user/themes/yanis-portfolio/images/apple-touch-icon.png" sizes="167x167">
<link rel="apple-touch-icon" href="https://yanislafkiri.ch/en/user/themes/yanis-portfolio/images/apple-touch-icon.png" sizes="180x180">
<link rel="apple-touch-icon-precomposed" href="https://yanislafkiri.ch/en/user/themes/yanis-portfolio/images/apple-touch-icon.png">
<link rel="icon" href="https://yanislafkiri.ch/en/user/themes/yanis-portfolio/images/icon-192.png" type="image/png" sizes="192x192">
<link rel="manifest" href="https://yanislafkiri.ch/en/user/themes/yanis-portfolio/images/site.webmanifest">


<script type="application/ld+json">{"@context":"https:\/\/schema.org","@graph":[{"@type":"Person","@id":"https:\/\/yanislafkiri.ch\/en\/#person","name":"Yanis Lafkiri","url":"https:\/\/yanislafkiri.ch\/en\/","email":"Yanis.lafkiri@iCloud.com","jobTitle":"Art director","description":"Freelance art director: visual identity, photo, video and creative experiences.","sameAs":["https:\/\/www.linkedin.com\/in\/yanis-lafkiri\/","https:\/\/www.instagram.com\/yanis.lafkiri\/","https:\/\/www.behance.net\/yanis-lafkiri"]},{"@type":"WebSite","@id":"https:\/\/yanislafkiri.ch\/en\/#website","name":"Yanis Lafkiri","url":"https:\/\/yanislafkiri.ch\/en\/","inLanguage":"en-US","publisher":{"@id":"https:\/\/yanislafkiri.ch\/en\/#person"},"author":{"@id":"https:\/\/yanislafkiri.ch\/en\/#person"}},{"@type":"FAQPage","@id":"https:\/\/yanislafkiri.ch\/en#faq","mainEntity":[{"@type":"Question","name":"Qui est Yanis Lafkiri ?","acceptedAnswer":{"@type":"Answer","text":"Yanis Lafkiri est directeur artistique freelance. Il con\u00e7oit des identit\u00e9s visuelles, des s\u00e9ries photo, des films et des exp\u00e9riences cr\u00e9atives pour marques, artistes et personnalit\u00e9s."}},{"@type":"Question","name":"Quels types de projets retrouve-t-on sur ce portfolio ?","acceptedAnswer":{"@type":"Answer","text":"Le site pr\u00e9sente des projets de direction artistique : branding, design \u00e9ditorial, photo, vid\u00e9o, motion et contenus pour les r\u00e9seaux sociaux, avec une s\u00e9lection d\u2019archives et une page Vision."}},{"@type":"Question","name":"Comment contacter Yanis Lafkiri ?","acceptedAnswer":{"@type":"Answer","text":"Via le menu Contact du site (message, e-mail, CV) ou sur LinkedIn, Instagram et Behance."}}]}]}</script>
        <link rel="preload" href="/user/themes/yanis-portfolio/fonts/roboto-400.woff2" as="font" type="font/woff2" crossorigin>
        <link rel="preload" href="/user/themes/yanis-portfolio/fonts/roboto-700.woff2" as="font" type="font/woff2" crossorigin>
        <link rel="preload" href="/user/themes/yanis-portfolio/fonts/roboto-900.woff2" as="font" type="font/woff2" crossorigin>

                                                                                                                                                                                                                                
              <link rel="preload" as="image" href="&#x2F;user&#x2F;pages&#x2F;01.projets&#x2F;logo&#x20;w.svg" fetchpriority="high">
                                                        <link rel="preload" as="image" href="&#x2F;images&#x2F;8&#x2F;f&#x2F;4&#x2F;2&#x2F;f&#x2F;8f42f1b4d5e88b3e1ee8222879473ce31d73f8d2-webpblank-night--01.webp" fetchpriority="high">
    
                                                                                                                                                                                                        
                    <link href="/assets/01bab2194ff4f82180286111efed40cd.css?g-0927e938" type="text/css" rel="stylesheet">
<style>
:root {
    --gh-alert-note-border-color: #316dca;
    --gh-alert-note-title-color: #316dca;
    --gh-alert-tip-border-color: #347d39;
    --gh-alert-tip-title-color: #347d39;
    --gh-alert-important-border-color: #8256d0;
    --gh-alert-important-title-color: #8256d0;
    --gh-alert-warning-border-color: #c69026;
    --gh-alert-warning-title-color: #c69026;
    --gh-alert-caution-border-color: #c93c37;
    --gh-alert-caution-title-color: #c93c37;
}
</style>

                        <style>
              html.is-ipad-safari .projet-viewer__caption {
                --safari-media-bleed-bottom: 0px;
                --projet-caption-lift: 0px;
                --projet-caption-bottom: 0px;
                bottom: 0 !important;
                padding-bottom: var(--projet-caption-pad, var(--chrome-inset-left, 1rem));
                height: var(--projet-caption-box-h);
              }
              html.is-ipad-safari .projet-viewer__caption.is-expanded {
                height: auto;
                max-height: calc(
                  100% - var(--chrome-inset-top, 0px) - var(--space-md)
                );
                z-index: 8;
              }
            </style>
            <style id="theme-vars">
:root {
  --color-bg: #000000;  --color-text: #f5f5f5;  --color-text-muted: #888888;  --color-accent: #A600F4;        --font-size-base: 16px;
    --font-weight-body: 400;  --font-weight-heading: 700;  --font-weight-display: 900;}
</style>
            
                        <script>
            (function () {
              try {
                var htmlPin = document.documentElement;
                /* Archives / About : pas de runway TikTok — sinon 1er passage = scroll vertical. */
                if (
                  htmlPin.classList.contains('is-archives-view') ||
                  htmlPin.classList.contains('is-about-view')
                ) {
                  return;
                }
                if (typeof window.portfolioNeedsSafariPin === 'function') {
                  if (!window.portfolioNeedsSafariPin()) return;
                } else if (!window.matchMedia('(max-width: 760px), ((hover: none) and (pointer: coarse))').matches) {
                  return;
                }
                var pin = function () {
                  var main = document.querySelector('.site-main');
                  var offset = 0;
                  if (main) offset = parseFloat(getComputedStyle(main).marginTop) || 0;
                  if (!(offset > 0)) {
                    var probe = document.createElement('div');
                    probe.style.cssText = 'position:absolute;visibility:hidden;height:var(--safari-scroll-offset);width:0;pointer-events:none';
                    (document.body || document.documentElement).appendChild(probe);
                    offset = probe.getBoundingClientRect().height || 0;
                    probe.remove();
                  }
                  if (offset > 0 && window.scrollY < offset - 0.5) {
                    try { window.scrollTo({ top: offset, left: 0, behavior: 'instant' }); }
                    catch (e) { window.scrollTo(0, offset); }
                  }
                };
                pin();
                document.addEventListener('DOMContentLoaded', pin);
                window.addEventListener('load', pin);
              } catch (e) {}
            })();
            </script>
            </head>

<body class="is-home template-home cursor-blend-solid">
    <!-- Google Tag Manager (noscript) -->
    <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-MKJP5MZM"
    height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
    <!-- End Google Tag Manager (noscript) -->
    <a class="skip-link"
       href="#main-content"
       data-cursor="none"
       data-skip-link>Aller au contenu</a>
    <script>
    (function () {
      /* Skip-link : jamais de nav pleine page ; pendant l’intro → skip showreel. */
      var link = document.querySelector('[data-skip-link]');
      if (!link) return;

      function activate(e) {
        if (e) {
          e.preventDefault();
          if (e.stopImmediatePropagation) e.stopImmediatePropagation();
          else e.stopPropagation();
        }
        if (
          window.portfolioIntro &&
          typeof window.portfolioIntro.skip === 'function' &&
          document.querySelector('.landing-roulette.is-intro')
        ) {
          window.portfolioIntro.skip({ fromSpace: false });
          return;
        }
        var intro = document.querySelector(
          '.landing-roulette.is-intro [data-landing-intro]'
        );
        if (intro && !intro.hidden) {
          try {
            intro.dispatchEvent(
              new PointerEvent('pointerup', {
                bubbles: true,
                cancelable: true,
                button: 0,
              })
            );
          } catch (errPtr) {
            /* ignore */
          }
          return;
        }
        var main = document.getElementById('main-content');
        if (main) {
          try {
            main.setAttribute('tabindex', '-1');
            main.focus({ preventScroll: true });
          } catch (errMain) {
            try {
              main.focus();
            } catch (errMain2) {}
          }
        }
      }

      link.addEventListener('click', activate, true);
      link.addEventListener(
        'keydown',
        function (e) {
          if (!e) return;
          if (
            e.key === ' ' ||
            e.key === 'Spacebar' ||
            e.code === 'Space' ||
            e.key === 'Enter'
          ) {
            activate(e);
          }
        },
        true
      );
    })();
    </script>
        <script>
    (function () {
      try {
        if (typeof window.portfolioNeedsSafariPin === 'function') {
          if (!window.portfolioNeedsSafariPin()) return;
        } else if (!window.matchMedia('(max-width: 760px), ((hover: none) and (pointer: coarse))').matches) {
          return;
        }
        var body = document.body;
        if (!body) return;
        if (body.classList.contains('is-player-view')) return;
        if (body.classList.contains('is-player-overlay')) return;
        if (body.classList.contains('is-player-open')) return;
        if (!body.classList.contains('template-projet') && !body.classList.contains('is-home')) return;
        var probe = document.createElement('div');
        probe.setAttribute('aria-hidden', 'true');
        probe.style.cssText =
          'position:absolute;left:0;top:0;width:0;height:var(--safari-scroll-offset, var(--safari-media-bleed-top));' +
          'visibility:hidden;pointer-events:none;margin:0;padding:0;border:0';
        body.appendChild(probe);
        var offset = probe.getBoundingClientRect().height || 0;
        probe.remove();
        if (offset > 0.5) {
          try { window.scrollTo({ top: offset, left: 0, behavior: 'instant' }); }
          catch (e) { window.scrollTo(0, offset); }
        }
      } catch (e) {}
    })();
    </script>

    <main id="main-content" class="site-main" role="main">
            <section class="landing-roulette is-intro"
             aria-label="Sélection de projets"
             data-landing-has-intro>
        <h1 class="u-sr-only">Yanis Lafkiri - art director</h1>
                                                          <article class="u-sr-only" data-aeo-copy>
  <h2>À propos de Yanis Lafkiri</h2>
  <p>
    Yanis Lafkiri est directeur artistique freelance. Son portfolio regroupe des projets
    d’identité visuelle, de design éditorial, de photographie, de vidéo et de motion design.
    Chaque projet est pensé comme une expérience complète : concept, direction, image et récit.
  </p>
  <p>
    Le site présente une sélection de travaux récents — dont Blank Night, article,
    Marouane Supercar, Starburster et What’s on her mind ? — ainsi qu’une page Vision
    et des Archives. L’approche mêle exigence esthétique et intention narrative :
    une image, une typographie ou une séquence vidéo doivent porter un sens, pas seulement un effet.
  </p>
  <p>
    Formé à une pratique pluridisciplinaire, Yanis collabore avec des marques, des artistes
    et des personnalités. Il peut intervenir sur la direction artistique globale, la conception
    graphique, la photographie, le tournage, le montage, l’étalonnage ou la scénographie,
    selon les besoins du projet. Le portfolio montre autant des commandes freelance que des
    pièces fictives destinées à explorer une idée jusqu’au bout.
  </p>
  <p>
    Pour suivre le travail ou collaborer :
    <a href="https://www.linkedin.com/in/yanis-lafkiri/">LinkedIn</a>,
    <a href="https://www.behance.net/yanis-lafkiri">Behance</a>
    et
    <a href="https://www.instagram.com/yanis.lafkiri/">Instagram</a>.
    Références et inspirations liées aux projets :
    <a href="https://en.wikipedia.org/wiki/Fontaines_D.C.">Fontaines D.C.</a>,
    <a href="https://en.wikipedia.org/wiki/Takashi_Murakami">Takashi Murakami</a>,
    <a href="https://en.wikipedia.org/wiki/Todd_Hido">Todd Hido</a>.
  </p>

    <h2>Projets mis en avant</h2>
  <ul>
          <li>
        <a href="/en/blank-night">blank night</a>
                  — After midnight the city falls asleep and Blank Night lights up. A refuge for thinkers, writers and night owls, where ideas don’t wait for morning.
              </li>
          <li>
        <a href="/en/article">article</a>
                  — One book, one artist. This issue of Article opens a chronological frieze into Takashi Murakami’s world, for those who already know it, and those discovering it.
              </li>
          <li>
        <a href="/en/marouane-s">Marouane Supercar</a>
                  — Behind the smile, Marouane turns every supercar into a story. Photos, videos, sketches: hop in if you want to see what’s really going on.
              </li>
          <li>
        <a href="/en/starbuster">starbuster</a>
                  — Will Josh hold it together? In this lyric video, collage and animation follow his day as unease builds. What happens next?
              </li>
          <li>
        <a href="/en/wohm">What&#039;s on her mind ?</a>
                  — Lost in thought… or just lost? In the light of a quiet room, a woman looks elsewhere. Those moments when silence says more than words.
              </li>
      </ul>
  
  
  <h2>Questions fréquentes</h2>
  <h3>Qui est Yanis Lafkiri ?</h3>
  <p>
    Directeur artistique freelance. Il conçoit des identités, des séries photo, des films
    et des expériences créatives pour marques, artistes et personnalités.
  </p>
  <h3>Quels types de projets retrouve-t-on sur ce portfolio ?</h3>
  <p>
    Branding, design éditorial, photo, vidéo, motion et contenus réseaux sociaux,
    avec une sélection d’archives et une page Vision. Les projets sont présentés en format
    vertical 9:16, avec titres et légendes pour chaque vignette.
  </p>
  <h3>Comment contacter Yanis Lafkiri ?</h3>
  <p>
    Via le menu Contact du site (message, e-mail, CV) ou sur
    <a href="https://www.linkedin.com/in/yanis-lafkiri/">LinkedIn</a>,
    <a href="https://www.instagram.com/yanis.lafkiri/">Instagram</a>
    et
    <a href="https://www.behance.net/yanis-lafkiri">Behance</a>.
  </p>
</article>

                <script>
        (function () {
          try {
            if (sessionStorage.getItem('portfolio-roue-enter-from-about') === '1') {
              document.documentElement.classList.add('roue-enter-from-about');
            }
            if (sessionStorage.getItem('portfolio-skip-landing-intro') === '1') {
              document.documentElement.classList.add('landing-skip-intro');
            }
          } catch (e) { /* ignore */ }
        })();
        </script>

        
<header class="landing-roulette__chrome">
            <div class="landing-roulette__logo">
            <img class="landing-roulette__logo-img"
                 src="&#x2F;user&#x2F;pages&#x2F;01.projets&#x2F;logo&#x20;w.svg"
                 alt="Yanis&#x20;Lafkiri"
                 width="160"
                 height="48"
                 decoding="sync"
                 fetchpriority="high">
        </div>
    
    <nav class="landing-roulette__nav" aria-label="Navigation" data-nav-current="projets">
        <ul class="landing-roulette__nav-list">
                            <li class="landing-roulette__nav-item landing-roulette__nav-item--contact"
                    data-contact-menu>
                    <span class="landing-roulette__contact-sizer" aria-hidden="true">
                        <span class="landing-roulette__contact-toggle-label">contact</span>
                    </span>
                    <div class="landing-roulette__contact-bubble">
                        <button type="button"
                                class="landing-roulette__contact-toggle"
                                data-contact-toggle
                                data-cursor="none"
                                aria-expanded="false"
                                aria-controls="landing-contact-panel"
                                id="landing-contact-toggle">
                            <span class="landing-roulette__contact-toggle-label">contact</span>
                        </button>
                        <div class="landing-roulette__contact-grow"
                             id="landing-contact-panel"
                             data-contact-panel
                             role="menu"
                             aria-labelledby="landing-contact-toggle"
                             aria-hidden="true"
                             inert>
                            <div class="landing-roulette__contact-track">
                            <ul class="landing-roulette__contact-list">
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            <li class="landing-roulette__contact-item" role="none">
                                            <a href="sms&#x3A;&#x2B;41774722270"
                                               class="landing-roulette__contact-link"
                                               data-cursor="none"
                                               role="menuitem"
                                                                                              ><span class="control-ink">
  <span class="control-ink__rest">message</span>
  <span class="control-ink__on-white" aria-hidden="true">message</span>
</span>
</a>
                                        </li>
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                <li class="landing-roulette__contact-item" role="none">
                                            <a href="mailto&#x3A;Yanis.lafkiri&#x40;iCloud.com"
                                               class="landing-roulette__contact-link"
                                               data-cursor="none"
                                               role="menuitem"
                                                                                              ><span class="control-ink">
  <span class="control-ink__rest">email</span>
  <span class="control-ink__on-white" aria-hidden="true">email</span>
</span>
</a>
                                        </li>
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                        <li class="landing-roulette__contact-item" role="none">
                                            <a href="https&#x3A;&#x2F;&#x2F;www.linkedin.com&#x2F;in&#x2F;yanis-lafkiri&#x2F;"
                                               class="landing-roulette__contact-link"
                                               data-cursor="none"
                                               role="menuitem"
                                                                                              target="_blank" rel="noopener noreferrer"><span class="control-ink">
  <span class="control-ink__rest">linkedIn</span>
  <span class="control-ink__on-white" aria-hidden="true">linkedIn</span>
</span>
</a>
                                        </li>
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                <li class="landing-roulette__contact-item" role="none">
                                            <a href="https&#x3A;&#x2F;&#x2F;www.instagram.com&#x2F;yanis.lafkiri&#x2F;"
                                               class="landing-roulette__contact-link"
                                               data-cursor="none"
                                               role="menuitem"
                                                                                              target="_blank" rel="noopener noreferrer"><span class="control-ink">
  <span class="control-ink__rest">instagram</span>
  <span class="control-ink__on-white" aria-hidden="true">instagram</span>
</span>
</a>
                                        </li>
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                <li class="landing-roulette__contact-item" role="none">
                                            <a href="https&#x3A;&#x2F;&#x2F;www.behance.net&#x2F;yanis-lafkiri"
                                               class="landing-roulette__contact-link"
                                               data-cursor="none"
                                               role="menuitem"
                                                                                              target="_blank" rel="noopener noreferrer"><span class="control-ink">
  <span class="control-ink__rest">behance</span>
  <span class="control-ink__on-white" aria-hidden="true">behance</span>
</span>
</a>
                                        </li>
                                                                                                </ul>
                            </div>
                        </div>
                    </div>
                </li>
            
                                                <li class="landing-roulette__nav-item landing-roulette__nav-item--swap"
                        data-nav-id="archives">
                                                                                                                              <a href="&#x2F;en&#x2F;archives"
                               class="landing-roulette__nav-link cursor-target"
                               data-cursor="fill"
                               data-cursor-hover
                               data-kbd-action="page-archives"                               data-nav-page="archives"
                               data-skip-landing-intro><span class="control-ink">
  <span class="control-ink__rest">archives</span>
  <span class="control-ink__on-white" aria-hidden="true">archives</span>
</span>
</a>
                                            </li>
                                                                <li class="landing-roulette__nav-item landing-roulette__nav-item--swap"
                        data-nav-id="about">
                                                                                                                              <a href="&#x2F;en&#x2F;a-propos"
                               class="landing-roulette__nav-link cursor-target"
                               data-cursor="fill"
                               data-cursor-hover
                               data-kbd-action="page-vision"                               data-nav-page="about"
                               data-skip-landing-intro><span class="control-ink">
  <span class="control-ink__rest">vision</span>
  <span class="control-ink__on-white" aria-hidden="true">vision</span>
</span>
</a>
                                            </li>
                                                                <li class="landing-roulette__nav-item landing-roulette__nav-item--swap"
                        data-nav-id="projets">
                                                                                                                              <span class="landing-roulette__nav-link is-current"
                                  data-kbd-action="page-projets"                                  data-cursor="none"
                                  aria-current="page"><span class="control-ink">
  <span class="control-ink__rest">projets</span>
  <span class="control-ink__on-white" aria-hidden="true">projets</span>
</span>
</span>
                                            </li>
                                    </ul>
    </nav>
</header>


<script type="application/json" id="site-nav-urls">{"projets":"\/en","about":"\/en\/a-propos","archives":"\/en\/archives","translate":"\/projets"}</script>

        <div class="landing-roulette__layout">
                        <div class="landing-roulette__wheel-clip">
            <div class="landing-roulette__wheel"
                 data-roulette
                 data-project-count="5">
                <div class="landing-roulette__drum" data-roulette-drum></div>

                            </div>
            </div>

                            <button type="button"
                        class="landing-roulette__spin cursor-target"
                        data-roulette-spin
                        data-kbd-action="select"
                        data-cursor="fill"
                        data-cursor-hover
                        aria-label="Sélectionner un projet"
                        hidden>
                    <span class="landing-roulette__spin-label">
                        <span class="control-ink" aria-hidden="true">
  <span class="control-ink__rest">select</span>
  <span class="control-ink__on-white" aria-hidden="true">select</span>
</span>

                    </span>
                    <span class="landing-roulette__spin-reset" aria-hidden="true">
                        <span class="control-ink" aria-hidden="true">
  <span class="control-ink__rest">reset</span>
  <span class="control-ink__on-white" aria-hidden="true">reset</span>
</span>

                    </span>
                </button>
                    </div>

                    <div class="landing-intro"
                 data-landing-intro
                 role="dialog"
                 aria-modal="true"
                 aria-label="Introduction">
                                <div class="landing-intro__strip" data-landing-intro-strip></div>
            </div>
        
        <script type="application/json" id="roulette-projects">[{"title":"blank night","url":"\/en\/blank-night","img":"\/images\/8\/f\/4\/2\/f\/8f42f1b4d5e88b3e1ee8222879473ce31d73f8d2-webpblank-night--01.webp","type":"image","poster":"","accent":"#4E7DB8","texte":"#000000","btn":"#FFFFFF","page":"#4E7DB8","hasInfo":true,"captionTitle":"Blank Night?","caption":"A night caf\u00e9 open from 11pm to 6am: a refuge for minds that wake after dark: thinkers, writers, night owls. A place for quiet conversations, slow drinks, and ideas that don\u2019t wait for morning.","captionActions":[],"peeks":[{"img":"\/images\/4\/1\/b\/9\/9\/41b991ff23219e22a0df3b9f97e1cc5c1a583893-webpblank-night--03.webp","captionTitle":"01 - Building the logo","caption":"Blank Night\u2019s logo sits on a circular grid that underlines the weasel\u2019s fluid, natural grace. The approach brings balance and softness, echoing the caf\u00e9\u2019s quiet elegance.","captionActions":[],"texte":"#000000"},{"img":"\/images\/3\/1\/b\/e\/0\/31be02776754f68e33521b3f223b9e82590a9fc5-webpblank-night--04.webp","captionTitle":"02 - Identity","caption":"Blank Night has a world of its own: subtle, thoughtful, restrained. A signature motif of stars and lunar shapes carries the caf\u00e9\u2019s nocturnal soul across objects, rugs and print. At the heart: a little weasel. Clever, elusive, nocturnal by nature.","captionActions":[],"texte":"#000000"},{"img":"\/images\/f\/a\/6\/a\/7\/fa6a73ff131e75ea3f0cf4083d5b60eb83453f07-webpblank-night--14.webp","captionTitle":"","caption":"","captionActions":[],"texte":"#000000"},{"img":"\/images\/9\/c\/f\/6\/d\/9cf6d8f508d706b8d54c21f8d3731664df3e34aa-webpblank-night--05.webp","captionTitle":"03 - The menu","caption":"At Blank Night, the menu follows your state of wakefulness. Light sleep, deep sleep, dream phase or full awareness: a drink for each. Almost all have a touch of coffee: here, the night always starts with a sip.","captionActions":[],"texte":"#000000"}]},{"title":"article","url":"\/en\/article","img":"\/images\/e\/0\/8\/b\/f\/e08bfba874cd0be879ff04b3a0b22e3510784389-webparticle-01.webp","type":"image","poster":"","accent":"#F9E5C1","texte":"#263e0f","btn":"","page":"#F9E5C1","hasInfo":true,"captionTitle":"Article?","caption":"A collection of contemporary art history books, unnumbered. Each edition focuses on a single artist, both retrospective and pedagogical. This one is dedicated to [Takashi Murakami](https:\/\/en.wikipedia.org\/wiki\/Takashi_Murakami), his colorful world and groundbreaking influence.","captionActions":[],"peeks":[{"img":"\/images\/9\/e\/e\/4\/9\/9ee498a239b236f994dd111e97238c7d072a186a-webparticle-02.webp","captionTitle":"01 - Audience","caption":"The collection speaks to art-history enthusiasts and newcomers alike. Footnotes and explanations make the content accessible to everyone.","captionActions":[],"texte":"#002e7a"},{"img":"\/images\/5\/e\/4\/d\/6\/5e4d69669e3b5ab2f67ffb6030d30625a3bb68e4-webparticle-03.webp","captionTitle":"","caption":"","captionActions":[],"texte":"#000000"},{"img":"\/images\/1\/3\/b\/0\/1\/13b019f7302691467714fb963be64d754bb2cc68-webparticle-05.webp","captionTitle":"02 - Book structure","caption":"Art-icle skips classic pagination: a chronological frieze guides the reader through chapters structured around the artist\u2019s life.","captionActions":[],"texte":"#ed719e"},{"img":"\/images\/5\/8\/f\/5\/a\/58f5a85ad23e3f0baf046afe8587cfd1c4335977-webparticle-06.webp","captionTitle":"","caption":"","captionActions":[],"texte":"#000000"}]},{"title":"Marouane Supercar","url":"\/en\/marouane-s","img":"\/images\/f\/c\/7\/f\/0\/fc7f03a1938a2c7d6ea443b187af2fc179484a39-webpmarouane-s-1.webp","type":"image","poster":"","accent":"#000000","texte":"#FFFFFF","btn":"#DEFFFA","page":"#000000","hasInfo":true,"captionTitle":"","caption":"","captionActions":[],"peeks":[{"img":"\/images\/4\/6\/2\/5\/6\/4625627fd318b31064dcb2940a1440e25be1197b-webpmarouane-s-2.webp","captionTitle":"Marouane Supercar?","caption":"Swiss car influencer Marouane is funny, approachable and passionate about cars. I shape his identity to put his personality front and center, with photos and videos for his socials, adapted to events and seasons.","captionActions":[],"texte":"#FFFFFF"},{"img":"\/images\/5\/3\/6\/c\/4\/536c4f3c9da078e40326dd48d3887ba1a5568dec-webpmarouane-s-3.webp","captionTitle":"01 - Photo & video","caption":"Every piece of content captures his warm personality in photos and in TikToks I also shoot. Together we invent sketches around cars, mixing true and fake anecdotes, to playfully roast a vehicle.","captionActions":[],"texte":"#FFFFFF"},{"img":"\/images\/0\/1\/c\/2\/3\/01c23d08e7ea2ef6ecdd6c2ab380284fdf139ebf-tiktokmarouane-s-2.webp","captionTitle":"","caption":"","captionActions":[],"texte":"#FFFFFF"},{"img":"\/images\/3\/c\/a\/0\/9\/3ca090751c1c665402c5e99995302c5e319e1f0a-webpmarouane-s-8.webp","captionTitle":"","caption":"","captionActions":[],"texte":"#FFFFFF"}]},{"title":"starbuster","url":"\/en\/starbuster","img":"\/images\/7\/8\/2\/f\/2\/782f238c1d076f84554f311dae944f8d27ccb90f-0webp.webp","type":"image","poster":"","accent":"#000000","texte":"#FFDE00","btn":"","page":"","hasInfo":true,"captionTitle":"","caption":"","captionActions":[],"peeks":[{"img":"\/images\/b\/3\/3\/2\/0\/b332081e21c1ac06cb7c7326d53c79cd1d61431c-1.webp","captionTitle":"Starburster?","caption":"From [Fontaines D.C.](https:\/\/en.wikipedia.org\/wiki\/Fontaines_D.C.)\u2019s fourth album, it draws on a panic attack experienced by singer Grian Chatten in a London Underground station. That raw moment becomes the starting point of the lyric video imagined for the track.","captionActions":[],"texte":"#FFDE00"},{"img":"\/images\/d\/8\/1\/8\/4\/d8184d8ea816e896b66a9d939796518eaaa76ba1-2.webp","captionTitle":"","caption":"","captionActions":[],"texte":"#FFDE00"},{"img":"\/images\/d\/c\/6\/6\/c\/dc66c6e5b106da3d30f07c6aa68a7a35ce2828a4-3.webp","captionTitle":"01 - Concept","caption":"The story follows Josh, a young man quietly overwhelmed by anxiety: private, yet universal. His day mirrors those fragile moments everyone goes through. Three connected pieces explore this inner world while leaving room for interpretation.","captionActions":[],"texte":"#FFDE00"},{"img":"\/images\/9\/a\/e\/7\/c\/9ae7c3e6da084356cb23dbd1da8de5caf7a9d066-4.webp","captionTitle":"02 - Music video","caption":"For two minutes we follow Josh through a day of growing unease. Anxiety intensifies, translated into mixed media (collage and animation). When the music softens, the tension breaks: overwhelmed, he loses control.","captionActions":[],"texte":"#FFDE00"}]},{"title":"What's on her mind ?","url":"\/en\/wohm","img":"\/images\/c\/c\/5\/6\/d\/cc56d6a47f2afef45130c3f8178b31107422012b-webpwohm.webp","type":"image","poster":"","accent":"#000000","texte":"#CC0000","btn":"","page":"","hasInfo":true,"captionTitle":"","caption":"","captionActions":[],"peeks":[{"img":"\/images\/0\/f\/b\/9\/d\/0fb9d8099089f53a28916d82f6983e3e85000c14-webpwohm2.webp","captionTitle":"What's on Her Mind ?","caption":"Lost in thought\u2026 or just lost? Inspired by [Todd Hido](https:\/\/en.wikipedia.org\/wiki\/Todd_Hido)\u2019s portraits, this series explores quiet moments when light says more than words. Between sensuality and uncertainty, the same melancholy from a silent room to an open sky.","captionActions":[],"texte":"#CC0000"},{"img":"\/images\/b\/6\/1\/e\/b\/b61eb5507d80904f97d7add4f2f8eaff9cdf56db-webpwohm3.webp","captionTitle":"","caption":"\n\n\n\nWhat is her story? What does this soft light hide? These empty rooms? And that wide outdoors: what is she really looking for?","captionActions":[],"texte":"#CC0000"},{"img":"\/images\/1\/c\/0\/f\/e\/1c0fe3366b09076254485bb83629879039fff573-webpwohm4.webp","captionTitle":"","caption":"","captionActions":[],"texte":"#CC0000"},{"img":"\/images\/c\/d\/c\/2\/0\/cdc20e2edc0b9726781e2448e5a58e3999381051-webpwohm5.webp","captionTitle":"","caption":"","captionActions":[],"texte":"#CC0000"}]}]</script>
        <script type="application/json" id="roulette-sfx">{"press":"","release":"","tick":""}</script>
                <script>
        (function () {
          try {
            if (window.portfolioCloseOverlay && typeof window.portfolioCloseOverlay.mountFromSession === 'function') {
              window.portfolioCloseOverlay.mountFromSession();
              return;
            }
            if (sessionStorage.getItem('portfolio-skip-landing-intro') === '1') {
              document.documentElement.classList.add('landing-skip-intro');
            }
          } catch (e) {}
        })();
        </script>
    </section>
    </main>

    <footer class="site-footer">
    <div class="site-footer__inner">
        <p class="site-footer__copy reveal">
            &copy; 2026 Yanis Lafkiri
        </p>

                    <p class="site-footer__tagline reveal">
                Directeur artistique freelance — portfolio de projets créatifs.
            </p>
            </div>
</footer>

    <script src="/user/themes/yanis-portfolio/js/keyboard-labels.min.js?6aa85ab1" defer></script>
<script src="/user/themes/yanis-portfolio/js/close-overlay.min.js?6aa85ab1" defer></script>
<script src="/user/themes/yanis-portfolio/js/scroll.min.js?6aa85ab1" defer></script>
<script src="/user/themes/yanis-portfolio/js/pointer-input.min.js?6aa85ab1" defer></script>
<script src="/user/themes/yanis-portfolio/js/touch-liquid.min.js?6aa85ab1" defer></script>
<script src="/user/themes/yanis-portfolio/js/buzzer-splash.min.js?6aa85ab1" defer></script>
<script src="/user/themes/yanis-portfolio/js/safari-chrome.min.js?6aa85ab1" defer></script>
<script src="/user/themes/yanis-portfolio/js/nav-contact.min.js?6aa85ab1" defer></script>
<script src="/user/themes/yanis-portfolio/js/soft-nav.min.js?6aa85ab1" defer></script>
<script src="/user/themes/yanis-portfolio/js/page-transition.min.js?6aa85ab1" defer></script>
<script src="/user/themes/yanis-portfolio/js/sfx.min.js?6aa85ab1" defer></script>
<script src="/user/themes/yanis-portfolio/js/caption-actions.min.js?6aa85ab1" defer></script>
<script src="/user/themes/yanis-portfolio/js/inline-video.min.js?6aa85ab1" defer></script>
<script src="/user/themes/yanis-portfolio/js/roulette.min.js?6aa85ab1" defer></script>
<script src="/user/themes/yanis-portfolio/js/projet-nav-hint.min.js?6aa85ab1" defer></script>
<script src="/user/themes/yanis-portfolio/js/archives.min.js?6aa85ab1" defer></script>
<script src="/user/themes/yanis-portfolio/js/projet-viewer.min.js?6aa85ab1" defer></script>
<script src="/user/themes/yanis-portfolio/js/compare.min.js?6aa85ab1" defer></script>
<script src="/user/themes/yanis-portfolio/js/onoff.min.js?6aa85ab1" defer></script>
<script src="/user/themes/yanis-portfolio/js/intro.min.js?6aa85ab1" defer></script>
<script src="/user/themes/yanis-portfolio/js/player.min.js?6aa85ab1" defer></script>
<script src="/user/themes/yanis-portfolio/js/main.min.js?6aa85ab1" defer></script>


        <script>
    (function () {
      try {
        if (window.portfolioSafariChrome) window.portfolioSafariChrome.pin();
      } catch (e) {}
    })();
    </script>

        </body>
</html>