Nifty Masking Effect For Your Images!, Swishmax - Beginner Options

[RedDragon]

NIFTY MASKING EFFECT

Click here to see the end result: CLICK

1. Ok first of all open a new movie and add the image you want to use for this effect. Doesn't matter what dimensions, but I edited my movie size so that it aligns with the image So same size and height, align image top left at (0,0), this because I want to use the swf as a header-animation in my css-site.

2. In the Outline, right click on the image and click Convert -> Convert to Sprite

Your Outline should look like this now:



3. Select the bezier tool and draw the following shape:



Color doesn't matter as we'll use this one as a shape later on!

4. When done copy this image and position it further on the image so it's totally covered in the end, like the following image illustrates, again, I only used different colours to show the images, otherwise it would have been a purple screen... In your swi just use the original colour!



5. When done, and the image is covered completely, move the image you will animate on TOP of all the shapes. Just select the image in the outline and click this button:



6. Ok! Now group all the shapes and right click, then go to Grouping -> Group as Sprite. Make sure that within this sprite, the shapes are in logical order. So you might have to reposition them in the outline, depending on the copy-method you used. So in the otuline panel, the first shape should be top left, the 2nd one below, etc. I'll add a screen so you'll know what I mean... (Confusing myself atm)

(etc..)

7. Click the master sprite (the first one you created) and make sure the following settings are set:



8. Do the same for the sprite containing all shapes, and set the following:



9. Ok now we can start animating! Open the sprite with the shapes and select all shapes in the outline. (Just click the top one, hold shift and click the last one) Go to the transform panel and set the anchor point to center. When done set both width and height to 0%. Do this in this order!!!! Your shapes will look like little dots

click for image

10. Now add a move effect for the first shape, 10 frames, and double click the move effect top open a popup window with the effect settings

(My movie frame rate is 30fps btw)



As you can see in the above image I set the xscale to 100%, and x=y. In other words, in this move effect, the shape grows back to 100%!

Now copy this move effect and paste it for the other shapes, every time +1frame



READY!

:: Download ::

[*D*]

Awesome awesome awesome, and something we failed otherwise lol

Thank you soooooooooooo much Rick have been waiting for this

[Eddie_K]

Awesome Rick

Do you have by chance a source file for the tut ?

Thanks

Eddie

[*D*]

Adding to downloads probably tommorrow Eddie

[Eddie_K]

Sweet I'm too lazy to do a tut right now , maybe not lazy but too tired

Thanks

Eddie

[alias.infnit]

No funny I spent ages trying to do this with Photoshop

Mm...must convince someone to buy me Swish

[Zaigham]

Excellent final results !!

I used simple one shape masking in most of my designs, but your tut gave me some nice ideas

Thanks for sharing !

best regards,

Zaigham

[RedDragon]

Thanks for your comments!

And for the lazy ppl, the dload will be added shortly..

No funny I spent ages trying to do this with Photoshop

Mm...must convince someone to buy me Swish

buy swish





(like that? )

[HuS]

WoW

I like this

[krypton]

GREAT ! ! !