AI (Animation & Illustrator) Help

Out of context: Reply #17

  • Started
  • Last post
  • 19 Responses
  • feel2

    cool, some tips on creating an animated demo for developers:

    1 - don't use filters, most AE filters are not translatable to html, so no blur, motion blur, turbulence stuff, glow, etc

    2 - you have to use only transformations, that are : position, rotation, scale and opacity

    3 - I usually do a "master_scroll" null object at x:0 y:0, so I can parent stuff to it and just scroll it, or even parent other nulls to scroll differently

    4 - you can use masks, but keep in mind that they need to be without any feathering (either layer masks or path masks, layer masks are more like the masks they have in code)

    5 - motion sketch tool for animating a mouse, if you're doing touch, usually people animate a "finger shadow", that is that little grey disc that mimics the finger gesture on your interface

    5.1 - leave the mouse or finger animation to the end, the last thing you'll do, because you can spend time animating your layout, make it play nicely, then throw this composition into a new one and animate your mouse there, so you keep things separated

    6 - (this is more of an all around AE tip) on your key frames, you either F9 it (easy ease) or ctrl+click them (to be linear or continuous), you can achieve almost every animation with these types of keyframes. But if you want that fancy code-like motion, you can alt+double click on a keyframe and enter values.
    the one that looks more code-like, is having 0 speed and 100% influence at your end keyframe, and the start keyframe just with F9

    hope this helps a bit!

    • ah! i can use opacity!!!! fuck that makes it so much easier. how could i not think about it!?i worked with video editing ages ago as well...thanks!oey
    • these are great tips! everybody posting really helpful stuff I just don't have the time to check everything in the moment.oey
    • but I will learn it ;)oey

View thread