3D-вращение во флеше

Сейчас я работаю в том числе над созданием 3D-анимации логотипа ЖБИП:

Наивно полагал, что в новом флеше (CS5) есть инструменты для создания полноценного 3D. Но это не так. По-прежнему сначала нужно создавать трёхмерную модель, например, в 3D-максе, потом сохранять несколько ключевых кадров и отрисовывать их заново во флеше. В этом тоже есть свои преимущества: меньше нагрузка на процессор плюс полный контроль над каждым кадром (будет именно так, как мы нарисуем, а не «как свет ляжет»).

Так как объект очень простой (парочка многогранников), я даже не настраивал свет и тени, а просто сделал 10 принтскринов из макса. «Квадратно-симметричный» домик достаточно повернуть на 90 градусов, после чего процесс повторяется.

На скринах домик постепенно поворачивается

Теперь вставляем скрины во флеш и обводим каждый многоугольник (в отдельных слоях). Между многоугольниками в разных кадрах создаём Shape Tween (анимацию формы объекта). Вот таймлайн, где синим цветом помечены ключевые кадры (обведённые из 3D-макса):

Таймлайн с Shape Tween между ключевыми кадрами

А красным цветом помечены дополнительные промежуточные кадры, которые тоже пришлось делать вручную. Дело в том, что автоматический Shape Tween иногда безбожно глючит:

Неправильная работа Shape Tween

Поэтому критические участки надо исправлять покадровой прорисовкой:

Исправление глюков Shape Tween путём добавки кадров

Логотип состоит из повторяющихся частей, и это экономит время работы:

Части крыши состоят из копий одного и того же мувиклипа

Как видно, в этом случае нарушается перспектива. Но в финальной версии — на движущемся маленьком домике — это незаметно.

Так как грани объектов стыкуются по прямой линии, в некоторых кадрах вылезли глюки: щели на стыках слоёв.

Щели на стыках многоугольников

Причём эти глюки были заметны, даже если уменьшить итоговую флешку в 4 раза. Вероятно, флеш-плеер рендерит ролик сразу в нужном размере, а не уменьшает каждый кадр в реальном времени от 100%-й версии (и анизотропная фильтрация не происходит).

Вот такой способ помог в моём случае:

Смотрите также

Комментарии