Анимационный дизайн сайта

Я сделал интерактивный лендинг, где прокрутка управляет всей сценой с банками: Банки вращаются, приближаются и по очереди выходят на передний план. Затем собираются в орбиту и общую композицию. Главная — чёрная. Анимацию растянул примерно вдвое, чтобы каждый вариант можно было рассмотреть. Фон плавно меняется под цвет текущей банки, а у чёрной возвращается молочный. Добавил крупную типографику, адаптацию для телефона и вращение банки перетаскиванием. Использованные технологии: Three.js и WebGL — объёмные модели банок, освещение, металлические детали и повороты в пространстве. Твои изображения использованы как текстуры упаковки. JavaScript + requestAnimationFrame — плавная анимация, привязанная к положению скролла. HTML и CSS — вёрстка, закрепление сцены, фон и адаптивность. Oswald и Manrope — шрифты. esbuild — сборка JavaScript. Сам эффект называется 3D scrollytelling, или scroll-driven 3D animation — трёхмерная анимация, управляемая прокруткой. Закрепление экрана называется sticky/pinned scene, а привязка движения к скроллу — scrubbing: прокруткой ты буквально перематываешь анимацию вперёд и назад.