В Lottie Web отсутствует полноценная трёхмерная система координат, несмотря на наличие параметров, которые визуально напоминают работу с глубиной. Вся модель исполнения анимации основана на плоском представлении сцен, где каждый слой фактически проецируется на двумерную поверхность рендерера (SVG или Canvas). Z-координата в классическом 3D-смысле не существует как вычисляемая ось с перспективной трансформацией и глубиной сцены.
After Effects позволяет использовать 3D-слои, камеру и освещение, однако при экспорте в Lottie большая часть этих данных теряет физический смысл и преобразуется в набор 2D-трансформаций. В результате Z-значения перестают быть пространственной координатой и превращаются в инструмент сортировки и псевдопозиционирования.
Основная функция Z-значения в Lottie Web заключается в определении порядка отрисовки элементов. При отсутствии полноценного 3D-движка система использует упрощённый алгоритм painter’s model, где каждый слой отрисовывается в соответствии с порядком наложения.
Z-index в рамках Lottie не формирует реальную глубину сцены. Он влияет исключительно на очередность композитинга. При этом порядок может изменяться в зависимости от:
Внутренне это приводит к тому, что визуально более «дальний» объект может перекрывать «ближний», если он расположен выше в стековом порядке.
При экспорте 3D-слоёв из After Effects в Lottie происходит деградация данных. Геометрическая информация о Z-оси не сохраняет пространственного смысла. Вместо этого применяются следующие преобразования:
Таким образом, сцена становится проекцией без перспективной модели. Это означает, что даже если исходная композиция содержала сложную 3D-сцену, итоговый JSON описывает только плоскую структуру трансформаций.
Камера в After Effects является ключевым элементом 3D-сцены, однако в Lottie Web она не имеет полноценного аналога. При экспорте поведение камеры сводится к статическим трансформациям композиции.
Любые эффекты:
теряют динамическую природу. Вместо этого применяется предварительно рассчитанное смещение слоёв в 2D-пространстве.
В результате отсутствует возможность интерактивного изменения перспективы во время выполнения анимации, поскольку движок Lottie не содержит матричного преобразования сцены с поддержкой перспективной проекции.
Внутри Lottie Web вся геометрия описывается через матрицы трансформаций 2D-вида:
Z-значение, если присутствует, не участвует в вычислении перспективной матрицы. Оно может использоваться только на этапе интерпретации слоя как дополнительный параметр для сортировки или упрощённой интерполяции.
Отсутствие 4x4 матриц трансформации исключает возможность корректного представления перспективного деления пространства. Это фундаментальное ограничение архитектуры рендерера, ориентированного на SVG/Canvas.
Одним из наиболее заметных эффектов отсутствия Z-пространства является нестабильность перекрытия элементов. В сложных композициях порядок отрисовки может изменяться в зависимости от сочетания факторов:
В таких условиях Z-координата перестаёт быть надёжным индикатором визуальной глубины. Даже корректно заданная структура в After Effects может давать неожиданный результат после экспорта.
Для имитации глубины в Lottie Web применяются обходные методы, основанные на 2D-трансформациях. Наиболее распространённые подходы:
Эти методы не формируют настоящего Z-пространства, а лишь создают визуальную иллюзию глубины. При этом все вычисления остаются в двумерной плоскости.
Поведение Z-пространства также зависит от выбранного рендерера.
SVG-рендерер:
Canvas-рендерер:
В обоих случаях отсутствует аппаратная поддержка depth buffer, что исключает возможность скрытого удаления (z-buffering) и корректной 3D-окклюзии.
При увеличении количества слоёв ограничения Z-пространства становятся критичными. Типичные проблемы:
Особенно выражено это в сценах с большим количеством пересекающихся масок и прекомпозиций, где порядок рендера становится зависимым от внутренних оптимизаций движка.
Интерполяция значений Z в Lottie не приводит к изменению перспективы. Даже если значение Z анимируется, оно не вызывает перерасчёт перспективной проекции. Вместо этого:
Это исключает возможность плавного «погружения» объектов в сцену с изменением их геометрии.
Архитектура Lottie Web ориентирована на детерминированный воспроизводимый рендеринг в браузере без использования 3D-ускорения сцены. Основные причины отсутствия полноценного Z-пространства:
Введение полноценного 3D-движка разрушило бы совместимость с экспортом After Effects и увеличило бы сложность воспроизведения JSON-анимаций.
Отсутствие Z-пространства приводит к тому, что любые попытки построения трёхмерной логики должны реализовываться на уровне авторинга:
В runtime отсутствует возможность динамического перерасчёта сцены как 3D-системы, что делает все эффекты глубины статичными по своей природе, несмотря на наличие анимации.