Creative Communities of the World Forums

The peer to peer support community for media production professionals.

Activity Forums Adobe After Effects Flipping Paper in Flash

  • Flipping Paper in Flash

    Posted by Skynarc on November 5, 2007 at 6:07 pm

    Hi,

    I have searched HIGH and LOW to find out how on earth they do that paper flipping effect on many of the Template Monster sites for Flash sites. I eventually have been told through the forums that it’s been done through AE.

    Now, after much fiddling and playing, I managed to get my first one right but now I am stuck on a my next project with a more specific effects I am trying to get right.

    Basically, I need to start with a rectangle shape which has been skewed and then it needs to flip like paper and eventually end up in a normal rectangle shape, but much larger.

    Unlike Flash though, I am not using vectors, so I cannot just set the start shape, then a keyframe to the end shape and tell it to tween.

    I can put it into a mask, but it seems it cannot animate the mask, it animates the object BEHIND the mask which is not what I want.

    Any help would be appreciated.
    Here’s an example:
    https://www.goforgold.org.za/proof.html

    The cube’s right side needs to unfold into a big rectangular area which will be used for the sites’ content area.

    Many thanks,
    Sky

    Thanks,
    Sky

    Skynarc replied 18 years, 10 months ago 2 Members · 7 Replies
  • 7 Replies
  • Mike Clasby

    November 5, 2007 at 8:12 pm

    Can you just start with a solid the size of the final large rectangular shape, create a large rectangular Mask (Rectangular Mask Tool) the size of the layer, set a Mask Shape keyframe (click the Mask Shape Stopwatch, we’re still at the end of the morph), then at the beginning, change the mask shape by moving the vertices, changing that first mask shape to the smaller cube wall? It doesn’t really morph in a 3D sense by with your vector look it will appear so. This should render out as a small file since, Export>Macromedia SWF (Ignore, don’t pasteurize) is vector. I get a 37kb swf for a 5 sec morph on a 640×420 final.

    To really unfold 3D shapes Zaxwerks makes a 3D Warp plugin, but that would be raster results and I dunno how it plays with other layers.

    Does the first suggestion work for you?

  • Skynarc

    November 6, 2007 at 6:34 am

    Hi YikesMikes :O)

    I think I am at the point you are describing already.
    What I am then trying to do is apply the effect to the mask to make it do all sorts of tricks but it seems to apply the affect to the solid BEHIND the mask and I don’t know how to change that? Can a person not apply effects to masks alone?

    Thanks again for your reply…

  • Mike Clasby

    November 6, 2007 at 5:18 pm

    I guess my first question would be , what kind of effects are you trying to apply to a mask?

    Masks are on a layer, a solid in your case, but yes effects can be applied to a mask alone, some of them, like Stroke. The last Stroke parameter, Paint Style, set to On Original Image, puts the Stroke on the Solid, but “On Transparent removes the layer it’s on (any type of layer, and leaves the Mask with a stroke on it.

    Scribble, Fill Type:Centered Edge, and Composite: On Transparent, acts similarly, well a scribble in the shape of the mask.

    Audio Spectrum and Audio Waveform are on the Mask, if, Path:Mask, is selected and won’t show the layer unless”Composite On Original” is selected.

    Radio Wave, if Mask:Mask>Mask 1 , is chosen and the mask is closed, works.

    I just found this in the Help files, AE 6.5:

    Applying effects to a mask

    ——————————————————————————–

    You can apply the following standard After Effects effects to a mask shape: Path Text, Audio Waveform, Audio Spectrum, Stroke, Fill (closed paths only), and Smear (closed paths only). You can apply the following After Effects Professional edition effects to a mask shape: Reshape (closed paths only), Vegas, and the Inner Outer Key (closed paths only). The Professional edition-only effect Particle Playground can also use a mask shape to define effect boundaries.

    So what are you trying to do, there are usually work arounds.

  • Skynarc

    November 7, 2007 at 1:09 pm

    Thanks Mike,

    I will try this tonight.

    I eventually figured out that I can use a solid, apply a transformation effect and then skew my rectangle at the end keyframe. From there, I was able to apply any effects to the solid I wanted.

    I then exported it to Flash and with a lot of tweaking, managed to convert it all to vector and bring down the file size dramatically.

    What I would like to know though is if it is possible to export my animation with much better quality so that I don’t have to tweak so much in Flash?

    Flash needs to draw all the nodes in the animation which pushes up the file size.

    Here’s what I have managed so far…

    https://www.goforgold.org.za/proof.html

  • Skynarc

    November 26, 2007 at 6:29 am

    Hi Mike,

    Take a look at these two examples:

    https://www.sixfoot.co.za/stuff/aftereffects/blocks.swf
    https://www.sixfoot.co.za/stuff/aftereffects/paperflip.swf

    As you can see, specifically the blocks example, their blocks come out extremely crisp.

    I’ve managed to get it working to a degree using solids in AE but then I need to export the images as a PNG sequence to import into Flash which I then break up to create vector shapes which leaves many jagged lines.

    I played with AE again this weekend and figured out that I can put a mask over a solid and animate that and when I export it for Flash, it beautifully exports the vector files so I don’t need to do much thereafter.

    But, the animate was very basic, moving the vector from one side of my composition to another. I’d still like to know how I can apply AE effects to mask to get a clean crisp output like the examples I gave above.

    I’ve uploaded two AE files to show you what I’ve done. One with a solid and the other, the simple mask animation:

    https://www.sixfoot.co.za/stuff/aftereffects/g4g_vector.aep
    https://www.sixfoot.co.za/stuff/aftereffects/g4g_solid.aep

    There must be a way to animate a mask if these guys are getting their output so crisp and clean, unless of course they are spending many hours back in Flash polishing the work up.

  • Skynarc

    November 26, 2007 at 7:13 am

    Here is where I’ve applied it:
    https://www.goforgold.org.za/flash.html

  • Skynarc

    November 27, 2007 at 8:45 am

We use anonymous cookies to give you the best experience we can.
Our Privacy policy | GDPR Policy