How can I create a 2D shattering glass effect?

Question

I'm working on creating a game in Adobe Flash CS6, and the game starts off with an animation where the main character is running and breaks a glass vase.

I don't want a completely accurate shattering glass effect where the vase might fall on the floor and break into multiple pieces, but rather I'm looking for an effect where the glass shatters on impact into a bunch of "glittery particles" that slowly fade away in the air.

Is there any way to achieve this effect using any Adobe or free to use software?

I'm a beginner at animation so assume I know nothing. :D

Thanks!

Answer 1

The hard but best way I would highly recommend you look into the starling framework for your game. This does require heavy actionscript but it is the best way to build a game that will run smooth as glass and also be able to export to iOS/android smoothly.

The easy way Make the vase a movieclip. Add a stop action on frame 1. Then say frame 2-10 is the vase falling animation. And finally frame 11-whatever is the particle animation that you can do by hand if you want. Add a glowy orb that shoots in a direction, then duplicate that orb and animation to multiple layers changing up the direction/end position of each orb on the layer. You would also want to stagger the start and end points of the particle animation so it looks more interesting.

Good Luck.

Answer 2

I know this question is old by now but as others may google and find it I add this answer.

There are a few simple steps you can take in adobe flash to achieve this as you dont want a perfectly realistic simulation. I explain assuming u r a 100% noob:p

1. Make a new MovieClip symbol. Double click it to start Editing.
2. Draw your object or import your image and trace it into a bitmap (Modify > Bitmap > trace Bitmap)
3. Using Line Tool (N) draw couple of solid color lines like u're dividing your shape to pieces.
4. holding shift, select the shapes between lines (as u click them u're selecting each solid color part of it, holding shift u can select all the pieces between your lines coz they're gonna shatter together as ONE piece)
5. After you select the whole piece Right Click it and Create Motion Tween (Flash automatically makes a new layer containing your selection and also adds frames to that layer)
6. Simply move the piece to its last position (Flash automatically considers that frame as a Keyframe)
7. Go back to the frame 1 and repeat the steps 4-6 for each piece you want to shatter.
8. Back to frame 1 and delete the Lines you drew at the step 3.
9. For every motion tween u made change it's Easing Setting to a positive number (Ease Out - actually 100 is good) U can do this by clicking on any frame of each layer and opening the Ease section of Properties panel.

Other steps depend on your taste, play with positions, rotations and Ease setting and u can even cut each piece to others pieces taking the guides above. U can have other layers playing another role too, like if it's a cup of coffee Shatter its solid pieces and in a new layer draw the liquid (frame by frame or just scale it - remember to send that layer to bottom:p ). Changing Alpha can be considered too.

After U save your work know that u can use the same MovieClip in your other projects by importing it. When you import an FLA to flash u'll be asked to choose a symbol inside it. So do not panic making it again.

Good Luck