{"id":268,"date":"2025-05-13T13:37:24","date_gmt":"2025-05-13T13:37:24","guid":{"rendered":"https:\/\/deanwedgbury.ca\/?post_type=portfolio&#038;p=268"},"modified":"2026-04-07T16:02:38","modified_gmt":"2026-04-07T16:02:38","slug":"about-us-product-sheet","status":"publish","type":"portfolio","link":"https:\/\/kimberlyvan.com\/?portfolio=about-us-product-sheet","title":{"rendered":"Instagram &amp; Content Creation"},"content":{"rendered":"\n<p style=\"font-size:clamp(14px, 0.875rem + ((1vw - 3.2px) * 0.404), 18px);\">This is where I step away from the corporate grids and into my own creative playground. From setting up the shots and filming the raw footage to the editing sessions and sound design, I handle every single step. I\u2019m obsessed with the &#8220;rhythm&#8221; of a video, making sure the music hits perfectly on the beat and the transitions feel like magic. This is where I experiment with new motion techniques and storytelling styles to see what actually stops the scroll.<\/p>\n\n\n\n<h6 class=\"wp-block-heading has-text-align-center has-custom-primary-dark-blue-color has-text-color has-link-color wp-elements-fa29b1ae72feda79c889bd7cc51f2536\" style=\"border-style:none;border-width:0px;border-radius:0px;margin-right:0;margin-left:0;padding-top:0;padding-bottom:0;font-size:14px;font-style:normal;font-weight:500\"><strong>2025 SNOWBOARDING TRANSITION<\/strong><\/h6>\n\n\n\n<figure class=\"wp-block-video\"><video height=\"1280\" style=\"aspect-ratio: 720 \/ 1280;\" width=\"720\" controls poster=\"https:\/\/kimberlyvan.com\/wp-content\/uploads\/2025\/05\/My-Instagram-Reel-.png\" src=\"https:\/\/kimberlyvan.com\/wp-content\/uploads\/2025\/05\/Snowboarding-Transition.mp4\"><\/video><\/figure>\n\n\n\n<h6 class=\"wp-block-heading has-text-align-center has-custom-primary-dark-blue-color has-text-color has-link-color wp-elements-fa29b1ae72feda79c889bd7cc51f2536\" style=\"border-style:none;border-width:0px;border-radius:0px;margin-right:0;margin-left:0;padding-top:0;padding-bottom:0;font-size:14px;font-style:normal;font-weight:500\"><strong>2025 SNOWBOARDING TRANSITION<\/strong><\/h6>\n\n\n\n<figure class=\"wp-block-video\"><video height=\"1280\" style=\"aspect-ratio: 720 \/ 1280;\" width=\"720\" controls poster=\"https:\/\/kimberlyvan.com\/wp-content\/uploads\/2025\/05\/My-Instagram-Reel2.png\" src=\"https:\/\/kimberlyvan.com\/wp-content\/uploads\/2025\/05\/2024-Wrap.mp4\"><\/video><\/figure>\n\n\n\n<script>\n  \/\/ Inject sweep immediately before page renders\n  (function() {\n    var sweep = document.createElement('div');\n    sweep.id = 'kimSweep';\n    sweep.className = 'kim-sweep';\n    sweep.style.transform = 'scaleX(1)';\n    sweep.style.transformOrigin = 'right';\n    document.documentElement.appendChild(sweep);\n\n    window.addEventListener('load', function() {\n      setTimeout(function() {\n        sweep.classList.add('kim-sweep-out');\n      }, 50);\n    });\n  })();\n<\/script>\n\n<style>\n  \/* =============================================\n     DECORATIVE BACKGROUND WORD\n     ============================================= *\/\n  .kim-bg-word {\n    position: relative;\n    overflow: visible;\n  }\n  .kim-bg-word::before {\n    content: attr(data-word);\n    position: absolute;\n    top: 50%;\n    left: 50%;\n    transform: translate(-50%, -50%);\n    font-family: 'Playfair Display', serif;\n    font-size: clamp(80px, 18vw, 220px);\n    font-weight: 900;\n    color: transparent;\n    -webkit-text-stroke: 1.5px rgba(78, 171, 219, 0.12);\n    white-space: nowrap;\n    pointer-events: none;\n    z-index: 0;\n    letter-spacing: 0.05em;\n    opacity: 0.9;\n  }\n  .kim-bg-word > * {\n    position: relative;\n    z-index: 1;\n  }\n\n  \/* =============================================\n     SCROLL ANIMATE \u2014 LEFT \/ RIGHT\n     ============================================= *\/\n  .kim-from-left,\n  .kim-from-right {\n    opacity: 0;\n    transition: opacity 0.75s ease, transform 0.75s ease;\n  }\n  .kim-from-left  { transform: translateX(-50px); }\n  .kim-from-right { transform: translateX(50px);  }\n  .kim-from-left.kim-in,\n  .kim-from-right.kim-in {\n    opacity: 1;\n    transform: translateX(0);\n  }\n\n  \/* =============================================\n     NEXT PROJECT BUTTON\n     ============================================= *\/\n  .kim-next-wrap {\n    display: flex;\n    justify-content: center;\n    padding: 50px 24px 80px;\n  }\n  .kim-next-btn {\n    display: inline-flex;\n    align-items: center;\n    gap: 14px;\n    padding: 18px 36px;\n    background: #0e0e0e;\n    color: #ffffff;\n    font-family: 'DM Sans', sans-serif;\n    font-size: 15px;\n    font-weight: 500;\n    letter-spacing: 0.06em;\n    text-transform: uppercase;\n    text-decoration: none;\n    border-radius: 4px;\n    position: relative;\n    overflow: hidden;\n    transition: color 0.3s ease, transform 0.2s ease;\n  }\n  .kim-next-btn::before {\n    content: '';\n    position: absolute;\n    inset: 0;\n    background: #4eabdb;\n    transform: translateX(-100%);\n    transition: transform 0.35s ease;\n    z-index: 0;\n  }\n  .kim-next-btn:hover::before { transform: translateX(0); }\n  .kim-next-btn:hover { transform: translateY(-2px); }\n  .kim-next-btn span,\n  .kim-next-btn svg {\n    position: relative;\n    z-index: 1;\n  }\n  .kim-next-btn svg {\n    transition: transform 0.3s ease, color 0.3s ease;\n    color: #ffffff !important;\n    stroke: #ffffff !important;\n  }\n  .kim-next-btn:hover svg {\n    transform: translateX(4px);\n    color: #ffffff !important;\n    stroke: #ffffff !important;\n  }\n\n  .kim-next-label {\n    display: block;\n    text-align: left;\n    font-family: 'DM Sans', sans-serif;\n    font-size: 11px;\n    letter-spacing: 0.12em;\n    text-transform: uppercase;\n    color: #ccc;\n    margin-bottom: 6px;\n    font-weight: 400;\n    position: relative;\n    z-index: 1;\n    transition: color 0.3s ease;\n  }\n  .kim-next-btn:hover .kim-next-label {\n    color: #ffffff;\n  }\n  .kim-next-title {\n    display: block;\n    font-size: 15px;\n    font-weight: 600;\n    position: relative;\n    z-index: 1;\n    color: #ffffff;\n  }\n\n  \/* Mobile button fix *\/\n  @media (max-width: 600px) {\n    .kim-next-btn {\n      max-width: 85vw;\n      white-space: normal;\n      line-height: 1.4;\n    }\n    .kim-next-title {\n      font-size: 13px;\n    }\n    .kim-next-label {\n      font-size: 10px;\n      margin-bottom: 4px;\n    }\n  }\n<\/style>\n\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Playfair+Display:wght@900&#038;family=DM+Sans:wght@400;500;600&#038;display=swap\" rel=\"stylesheet\">\n\n<div class=\"kim-next-wrap\">\n  <a href=\"#\" class=\"kim-next-btn\" id=\"kim-next-project-btn\">\n    <span>\n      <span class=\"kim-next-label\">Next Random Project<\/span>\n      <span class=\"kim-next-title\" id=\"kim-next-title\">Loading&#8230;<\/span>\n    <\/span>\n    <svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path d=\"M5 12h14M12 5l7 7-7 7\"\/>\n    <\/svg>\n  <\/a>\n<\/div>\n\n<script>\n(function() {\n\n  \/\/ =============================================\n  \/\/ DECORATIVE BACKGROUND WORD\n  \/\/ \u2014 grabs the page's <h1> and uses first word\n  \/\/ =============================================\n  function initBgWord() {\n    const heading = document.querySelector('.entry-title, h1.wp-block-heading, h1');\n    if (!heading) return;\n    const word = heading.textContent.trim().split(\/\\s+\/)[0].toUpperCase();\n    const target = heading.closest('.wp-block-group') || heading.parentElement;\n    if (target) {\n      target.classList.add('kim-bg-word');\n      target.setAttribute('data-word', word);\n    }\n  }\n\n  \/\/ =============================================\n  \/\/ COLUMN SCROLL ANIMATIONS\n  \/\/ \u2014 left column = slide from left, right = right\n  \/\/ =============================================\n  function initColumnAnimations() {\n    const columns = document.querySelectorAll('.wp-block-column');\n    columns.forEach((col, i) => {\n      const isLeft = i % 2 === 0;\n      col.classList.add(isLeft ? 'kim-from-left' : 'kim-from-right');\n    });\n\n    const obs = new IntersectionObserver((entries) => {\n      entries.forEach(entry => {\n        if (entry.isIntersecting) {\n          entry.target.classList.add('kim-in');\n          obs.unobserve(entry.target);\n        }\n      });\n    }, { threshold: 0.1, rootMargin: '0px 0px -60px 0px' });\n\n    document.querySelectorAll('.kim-from-left, .kim-from-right').forEach(el => obs.observe(el));\n  }\n\n  \/\/ =============================================\n  \/\/ NEXT PROJECT \u2014 random pick from portfolio\n  \/\/ =============================================\n  const allProjects = [\n    { slug: 'new-booth-design',            title: 'Booth Design' },\n    { slug: 'restaurant-assets',           title: 'Restaurant Assets' },\n    { slug: 'wellness-infographic',        title: 'Wellness Infographic' },\n    { slug: 'video',                       title: 'Video Design' },\n    { slug: 'about-us-product-sheet-2',    title: 'About Us Product Sheet' },\n    { slug: 'discover-canada-product-sheet', title: 'Event Posters' },\n    { slug: 'about-us-product-sheet',      title: 'Discover Canada<br>Product Sheet' },\n    { slug: 'brand-support-assets',        title: 'Brand Support Assets' },\n    { slug: 'illustrations',               title: 'Illustration' },\n    { slug: 'photography',                 title: 'Photography' },\n    { slug: 'my-brand',                    title: 'Brand' },\n  ];\n\n  function initNextProject() {\n    const btn = document.getElementById('kim-next-project-btn');\n    const titleEl = document.getElementById('kim-next-title');\n    if (!btn || !titleEl) return;\n\n    \/\/ Figure out current slug from URL\n    const params = new URLSearchParams(window.location.search);\n    const currentSlug = params.get('portfolio') || '';\n\n    \/\/ Pick a random project that isn't the current one\n    const others = allProjects.filter(p => p.slug !== currentSlug);\n    const next = others[Math.floor(Math.random() * others.length)];\n\n    titleEl.innerHTML = next.title;\n    btn.href = `https:\/\/kimberlyvan.com\/?portfolio=${next.slug}`;\n    btn.addEventListener('click', function(e) {\n      e.preventDefault();\n      const url = btn.href;\n      if (window.kimNavigateTo) {\n        window.kimNavigateTo(url);\n      } else {\n        \/\/ Fallback if hero block not on this page \u2014 do local sweep\n        const sweep = document.getElementById('kimSweep');\n        if (sweep) {\n          sweep.classList.remove('kim-sweep-out');\n          sweep.classList.add('kim-sweep-in');\n          setTimeout(function() { window.location.href = url; }, 450);\n        } else {\n          window.location.href = url;\n        }\n      }\n    });\n  }\n\n  \/\/ =============================================\n  \/\/ INIT\n  \/\/ =============================================\n  \/\/ =============================================\n  \/\/ INJECT CURSOR + SWEEP INTO BODY\n  \/\/ =============================================\n  document.addEventListener('DOMContentLoaded', function() {\n    \/\/ Cursor \u2014 only create if not already present\n    if (!document.getElementById('kimDot')) {\n      const newDot  = document.createElement('div');\n      const newRing = document.createElement('div');\n      newDot.id  = 'kimDot';\n      newRing.id = 'kimRing';\n      newDot.className  = 'kim-cursor-dot';\n      newRing.className = 'kim-cursor-ring';\n      document.body.appendChild(newDot);\n      document.body.appendChild(newRing);\n\n      let ringX = 0, ringY = 0, mouseX = 0, mouseY = 0;\n\n      document.addEventListener('mousemove', function(e) {\n        mouseX = e.clientX;\n        mouseY = e.clientY;\n        newDot.style.left = mouseX + 'px';\n        newDot.style.top  = mouseY + 'px';\n      });\n\n      function animateRing() {\n        ringX += (mouseX - ringX) * 0.12;\n        ringY += (mouseY - ringY) * 0.12;\n        newRing.style.left = ringX + 'px';\n        newRing.style.top  = ringY + 'px';\n        requestAnimationFrame(animateRing);\n      }\n      animateRing();\n\n      document.addEventListener('mouseover', function(e) {\n        if (e.target.closest('a, button, .kim-next-btn')) {\n          newDot.classList.add('kim-cursor-hover');\n          newRing.classList.add('kim-cursor-hover');\n        }\n      });\n      document.addEventListener('mouseout', function(e) {\n        if (e.target.closest('a, button, .kim-next-btn')) {\n          newDot.classList.remove('kim-cursor-hover');\n          newRing.classList.remove('kim-cursor-hover');\n        }\n      });\n      document.addEventListener('mouseleave', function() {\n        newDot.style.opacity = '0';\n        newRing.style.opacity = '0';\n      });\n      document.addEventListener('mouseenter', function() {\n        newDot.style.opacity = '1';\n        newRing.style.opacity = '1';\n      });\n    }\n  });\n\n  document.addEventListener('DOMContentLoaded', function() {\n    initBgWord();\n    initColumnAnimations();\n    initNextProject();\n  });\n\n})();\n<\/script>\n","protected":false},"excerpt":{"rendered":"<p>This is where I step away from the corporate grids and into my own creative playground. From setting up the shots and filming the raw footage to the editing sessions and sound design, I handle every single step. I\u2019m obsessed with the &#8220;rhythm&#8221; of a video, making sure the music hits perfectly on the beat [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":2035,"menu_order":5,"comment_status":"closed","ping_status":"closed","template":"single-jetpack-portfolio","format":"standard","meta":{"inline_featured_image":false,"_vp_format_video_url":"","_vp_image_focal_point":[],"footnotes":""},"portfolio_category":[37],"portfolio_tag":[],"class_list":["post-268","portfolio","type-portfolio","status-publish","format-standard","has-post-thumbnail","hentry","portfolio_category-video"],"_links":{"self":[{"href":"https:\/\/kimberlyvan.com\/index.php?rest_route=\/wp\/v2\/portfolio\/268","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/kimberlyvan.com\/index.php?rest_route=\/wp\/v2\/portfolio"}],"about":[{"href":"https:\/\/kimberlyvan.com\/index.php?rest_route=\/wp\/v2\/types\/portfolio"}],"author":[{"embeddable":true,"href":"https:\/\/kimberlyvan.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/kimberlyvan.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=268"}],"version-history":[{"count":4,"href":"https:\/\/kimberlyvan.com\/index.php?rest_route=\/wp\/v2\/portfolio\/268\/revisions"}],"predecessor-version":[{"id":2043,"href":"https:\/\/kimberlyvan.com\/index.php?rest_route=\/wp\/v2\/portfolio\/268\/revisions\/2043"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/kimberlyvan.com\/index.php?rest_route=\/wp\/v2\/media\/2035"}],"wp:attachment":[{"href":"https:\/\/kimberlyvan.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=268"}],"wp:term":[{"taxonomy":"portfolio_category","embeddable":true,"href":"https:\/\/kimberlyvan.com\/index.php?rest_route=%2Fwp%2Fv2%2Fportfolio_category&post=268"},{"taxonomy":"portfolio_tag","embeddable":true,"href":"https:\/\/kimberlyvan.com\/index.php?rest_route=%2Fwp%2Fv2%2Fportfolio_tag&post=268"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}