How do I generate js files from After Effects?

(Eden) #1

how do I convert an After Effects project to usable in hype or HTML5 sources?


(Pete) #2

Using bodymovin plug in for AE you can export json file one that you can use with Hype.

(Eden) #3

Hi petester,

Thanks for the quick response…
I’m using with after effect cs6 I do not think it supports this version.
I tried without success.

Do you know anything else?

(Pete) #4

If that’s the case Download CC on trial basis

here’s an example by @MarkHunte

(Eden) #5

Thank you very much!
I will try and get back to you.

(Alex Steele) #7

I’m very excited by this prospect. I’m going to try this because I’m wondering how this works with adobe character animator files inside of after effects.

(Pete) #8

sure thing, take a look at how to load bodymovin json animation file in the example below.

See updated project (705.6 KB)

from the thread below.

(Alex Steele) #9

Wonderful!!! I was able to get this to work with very little effort. So much potential here :slight_smile:

(Loves Hype) #10

I like BodyMovin/Lotti as it’s “pay what you want” and you get nice benefits if your an AE Animator. Also there are many compositions out there ready to be used/converted. Given you load them from a ressources that converted them already … otherwise you will need to own and run After Effects (nice software I like working with). Please be aware that this animation technic comes at a cost of performance and more important download size.

Plugins in minimized form (light=svg,js, normal=svg, canvas, js) run from 150kb to 250kb. To that you have to add the size of the JSON, that heavily depends on your animation complexity. In case of this example the JSON consumes 2,8 Mb. This works on iOS apps (compression, preinstalled) and in intranet settings but use with care in webpages.

Happy animating.

(Eden) #11

I purchased the new version CC and it works for me, BUT when I export the file it come out black, regardless of color