Lottie

Lottie playground. The player loads from a deferred CDN script; site.js guards on window.lottie, so the page degrades to the static fallbacks below if it’s unreachable. The animations are plain JSON in assets/lottie/, hand-authored for this lab — swap either file for any .json exported from LottieFiles and it just works. Hand-authoring instead? Two gotchas: every shape group must end with a tr transform item or lottie-web silently renders nothing, and layer phase offsets need explicit keyframes — a negative st start time won’t shift them.

var anim = lottie.loadAnimation({
  container: document.querySelector('[data-lottie]'),
  renderer: 'svg', // crisp at any size; 'canvas' is faster for heavy scenes
  loop: false,
  autoplay: false,
  path: '/assets/lottie/check.json'
});
replayButton.addEventListener('click', function () {
  anim.goToAndPlay(0, true);
});