https://www.youngju.dev/blog 천천히 올바르게. AI Researcher & DevOps Engineer Youngju's tech blog. GPU/CUDA, LLM, MLOps, Kubernetes AI workloads, distributed training, and data engineering. ko fjvbn2003@gmail.com (Youngju Kim) fjvbn2003@gmail.com (Youngju Kim) Sat, 16 May 2026 00:00:00 GMT https://www.youngju.dev/blog/culture/2026-05-16-web-animation-tools-2026-rive-lottie-spline-motion-gsap-mit-anime-js-theatre-deep-dive.en https://www.youngju.dev/blog/culture/2026-05-16-web-animation-tools-2026-rive-lottie-spline-motion-gsap-mit-anime-js-theatre-deep-dive.en The full stack of web animation tools in 2026 in one place — GSAP 3.13 with every plugin now MIT-free after Webflow acquired GreenSock in November 2024, Motion (the rebranded Framer Motion from October 2024) supporting React/Vue/Vanilla, Rive with state machines and runtimes for every platform, Airbnbs Lottie with the new smaller dotLottie format, Spline for in-browser 3D, the timeline editor Theatre.js, the modular rewrite Anime.js 4, Three.js plus React Three Fiber and Lenis for smooth scroll, AutoAnimates zero-config transitions, Mo.js / Popmotion / Tween.js, and the native Web Animations API plus CSS scroll-driven animations — together with the After Effects to Lottie / Rive Editor / Spline Editor design-to-code pipelines and case studies from Toss, Kakao, pixiv, and CyberAgent. Sat, 16 May 2026 00:00:00 GMT fjvbn2003@gmail.com (Youngju Kim) web-animationrivelottiesplinemotionframer-motiongsapanime-jstheatre-jsthree-jsr3flenisautoanimateweb-animations-apiwebflow2026deep-diveenglish https://www.youngju.dev/blog/culture/2026-05-16-web-animation-tools-2026-rive-lottie-spline-motion-gsap-mit-anime-js-theatre-deep-dive.ja https://www.youngju.dev/blog/culture/2026-05-16-web-animation-tools-2026-rive-lottie-spline-motion-gsap-mit-anime-js-theatre-deep-dive.ja 2026 年の Web アニメーションツール一式を一気に整理 — 2024 年 11 月に Webflow が GreenSock を買収し全プラグインが MIT 無料化された GSAP 3.13、2024 年 10 月に Framer チームが Motion へリブランドし React/Vue/Vanilla を等しく支援する Motion (旧 Framer Motion)、ステートマシンとマルチプラットフォームランタイムを持つ Rive、dotLottie 形式でさらに小さくなった Airbnb の Lottie、ブラウザ 3D の Spline、After Effects 風タイムラインエディタ Theatre.js、モジュール式へ刷新された Anime.js 4、Three.js + R3F と Lenis のスムーススクロール、AutoAnimate のゼロコンフィグ遷移、Mo.js / Popmotion / Tween.js、そしてネイティブの Web Animations API + CSS scroll-driven animations までを網羅。After Effects → Lottie / Rive Editor / Spline Editor のデザイン → コードパイプラインと、Toss・Kakao・pixiv・CyberAgent といった韓国/日本のデザインシステム事例も一気にまとめます。 Sat, 16 May 2026 00:00:00 GMT fjvbn2003@gmail.com (Youngju Kim) web-animationrivelottiesplinemotionframer-motiongsapanime-jstheatre-jsthree-jsr3flenisautoanimateweb-animations-apiwebflow2026deep-dive日本語 https://www.youngju.dev/blog/culture/2026-05-16-web-animation-tools-2026-rive-lottie-spline-motion-gsap-mit-anime-js-theatre-deep-dive https://www.youngju.dev/blog/culture/2026-05-16-web-animation-tools-2026-rive-lottie-spline-motion-gsap-mit-anime-js-theatre-deep-dive 2026년 웹 애니메이션 도구 풀스택을 한 번에 — 2024년 11월 Webflow 가 인수하면서 모든 플러그인이 MIT 로 무료화된 GSAP 3.13, Framer 팀이 2024년 10월 리브랜드한 Motion (구 Framer Motion), 상태 머신과 런타임을 제공하는 Rive, dotLottie 포맷으로 더 작아진 Airbnb 의 Lottie, 브라우저 3D 의 Spline, 시네마 4D 스타일 타임라인 에디터 Theatre.js, 모듈식으로 재작성된 Anime.js 4, Three.js + R3F 와 Lenis 의 스무스 스크롤, AutoAnimate 의 제로 컨피그 트랜지션, Mo.js / Popmotion / Tween.js, 그리고 네이티브 Web Animations API + CSS scroll-driven 까지 — After Effects → Lottie / Rive Editor / Spline Editor 의 디자인 → 코드 파이프라인과 토스, 카카오, pixiv, CyberAgent 디자인 시스템 사례까지 한 번에 정리합니다. Sat, 16 May 2026 00:00:00 GMT fjvbn2003@gmail.com (Youngju Kim) web-animationrivelottiesplinemotionframer-motiongsapanime-jstheatre-jsthree-jsr3flenisautoanimateweb-animations-apiwebflow2026deep-dive