// LAB — Моушен-лаборатория
Сначала чертёж — потом кадр.
Восемь сцен: четыре живут по общему часовому циклу и зациклены кадр-в-кадр — первый кадр равен последнему, пятая отвечает на курсор и скролл, шестая — отдельный кинематографичный дубль «Ядро» на своей странице. Ни одной видеозаписи, ни одной библиотеки — только canvas 2D и дисциплина пауз.
Луп 10–14с · Реактивное поле · 0 библиотек · 0 видеофайлов
T+00.0S / 12S · CIN.01
// CIN.01 — Сборка
Узлы собираются, ядро дышит, структура растворяется
Эталонная сцена лаборатории: в правой трети кадра из тьмы собирается вайрфрейм-структура — параллелепипеды на тонких рёбрах, по которым бегут точки данных. Одно ядро пульсирует тёплым — единственный тёплый источник кадра. На пике камера делает медленный dolly-in, затем конфигурация растворяется и начинает собираться заново.
// CIN.02 — Разрез
Деталь читается сканирующей плоскостью
Изометрическая сборка проявляется вертикальным лучом: слева от плоскости — призрак, справа — проявленный контур со штриховкой и размерами. Луч оставляет за собой обмер, в конце проставляется штамп допуска. Способ показать «сначала проверяем — потом собираем» без единого слова.
// CIN.03 — Ток
Пакеты едут по трассам, узлы принимают
Плата из восьми узлов: маршруты с фасками 45°, по ним от источника к стокам едут пакеты с двухточечными хвостами — фирменный приём сцены «Шкала доводки». Узел вспыхивает в момент приёма, источник подсвечен тёплым. Плата не гаснет никогда: луп считывается по пакетам, а не по растворению.
// CIN.04 — Дыхание
Почти пустота, в которой видно движение
Проверка дисциплины: горизонт, дышащее поле точек и один тёплый маяк, который пересекает кадр за 14 секунд — и гаснет по краям так же мягко, как загорается. Самая тихая сцена лаборатории: сколько движения можно оставить, когда нечего доказывать.
// CIN.05 — Среда
Поле отвечает курсору, скроллу и времени
Не луп, а экосистема: узлы, трассы и пыль связаны между собой. Курсор — зонд: заряжает узлы, те отправляют импульсы соседям; скролл добавляет энергии; без указателя зонд летит сам. То же поле можно поселить на любую страницу фоновым слоем — автономный демо-файл →
// 06 — Ремесло
Как это устроено
Canvas 2D и ноль библиотек: все сцены, включая реактивное поле, — один скрипт, который весит меньше одной фотографии-обложки
Каждое движение — функция времени T от 0 до 1: первый кадр равен последнему математически, без склейки и подгонки
Сцена вне вьюпорта спит, скрытая вкладка — стоит, reduced-motion получает статичный кадр. Движение не тратит ничего, пока его не видно
Сцена переезжает на любую страницу как canvas и пара строк JS — с палитрой и подписями вашего проекта. Обсудить задачу →
// Разбор задачи
Нужна такая же сцена — на своей странице?
Покажем сцену на вашем материале: палитра, узлы, подписи. Или обсудим задачу посерьёзнее — от аудита до запуска