Как перенести анимацию из After Affect на сайт?

Question

[shipkov]

Салют ребят!

Столкнулся с проблемой когда выполнял заказ для заказчика.
Сделав анимацию для кнопок в After Affect, попросил верстальщика перенести ее на сайт, а он тоже не знает как это делать. Говорит нужен файл js. В After Affect в таком не сохранишь. Пробовал в json формате сохранить через bodymovin, но верстальщик говорит не получается поставить на сайт. Поделитесь кто-нибудь опытом, пожалуйста. Как перенести из After Affect на сайт анимацию? В каком формате сохранять для анимации на сайт?

Comments

[Максим]

я конечно не очень понял , но after affect вроде бы для наложения на видео эффектов .. не понятно .. на какую кнопку вы наложили эффект ?

Answer 1

[Кирилл]

https://github.com/bodymovin/bodymovin как раз для этого и сделан. Почитайте рекомендации, посмотрите что у вас не так, как в примерах. Если все так, то выкладывайте JSON, может быть дело в верстальщике)

Answer 2

[RTW]

Никак, можешь покадрово сохранить каждое состояние кнопки конечно, а так это вообще не веб подход, разве что для прототипирования.

Answer 3

[Ivan Bogachev]

Общие идеи того, что вам с верстальщиком нужно сделать хорошо описаны вот в этой статье. Да-да, если дизайнер все нарисовал нормально, ручками сделать CSS анимацию не так уж и сложно. Хотя (из личного опыта) быстрее и спокойнее делать анимацию по покадровой схеме, нарисованной ручкой на бумаге, чем по рендеру из AE (заказчик может начать придираться, что мол "вот эта кнопочка как-то по другому прыгает").