Subject: DMA - Digital media- 2014
Class 09 - More Animation & Video in Flash
Review last week's class notes to see the tutorial on Tweening - Class 8 notes
Once you have some familiarity with tweening MovieClips and shapes in Flash, we can try an exercise where we animate a mask to show parts of a video over another video.
Create an animated mask for video MovieClip layers
This exercise will demonstrate how to create some tweened animations and then use those in a MovieClip in a layer that can become a mask for a video MovieClip on another layer.
We can use two video loops and show different parts of the videos with masks that move...
1. Convert your videos to the FLV (Flash Video) format so that it can be imported to Flash and saved in the Library. Video can be linked externally, but when creating a file like this with multiple instances, masking etc, it's best to use an internal video symbol.
2. Create a new ActionScript 3 Flash file and import video files to Flash using the Import Video option in the File menu. When importing you need to choose the following options:
3. By default, both MovieClips containing video will be placed on the same layer in the Main Timeline. We need to separate these clips and put them on to different layers in the Main Timeline. you can do this by simply cutting one video MovieClip, creating a new layer, and pasting the video MovieClip on the new layer. Make sure your top video MovieClip is the one you want to apply the mask to - when complete, the masked areas will then show the second video MovieClip underneath.
4. Now we need to create some tweens inside movieclips in the Library. As with last week, we will develop all the components we need in MovieClips in the Library, then bring them to the Stage when they are complete. Create a MovieClip in the Library called "Tween1". With that MovieClip open, create a shape of some kind that will be the starting point of your tween. If you want to morph the shape, then you will need to use a Shape Tween (so don't convert the shape to a MovieClip), but if you just want to move the shape around and animate on a curve or line, you'll need to Convert to Symbol so your shape becomes a MovieClip inside a MovieClip - then you can use a Motion Tween or Classic Tween (refer to last week's notes for details on tweening).
5. Experiment with some tweening in your Tween1 MovieClip. Remember to create keyframes where you want to change your tweened objects (unless you're using a Motion Tween), and remember you can only tween one object per layer.
6. Create 2 more new MovieClips in the Library titled "Tween2" and "Tween3". repeat steps 4 & 5 so that you will end up with 3 tweened MovieClips in the Library.
7. Now create a fourth MovieClip in the Library called "MasterTween". This MovieClip will contain our other three tweens. Place each of the three tween MovieClips on a separate layer. We now have a single MovieClip with three layered tweens nested inside it. We will use this MasterTween MovieClip on the Main Timeline as a Mask.
8. Create a third layer in your Main Timeline which is above the other two layers. Place the MasterTween on this new layer and Control-Click on the layer to turn it into a Mask.
9. If you test the movie (Command-Enter to generate a SWF file) you should be able to see your videos playing with the top video masked in places, showing the bottom video underneath. That's it!
10. You may need to tweak your layers and tweens to get the right effect. You might also want to change the length of video or animations to create more randomness and variation in the output. You can also use blends between the two video layers to create some interesting effects - just remember to experiment with all of the MovieClip Properties in the Properties Panel.
Adding Sound to your Flash File
You can import an MP3 audio file into Flash and it will become an audio symbol in the Library (File -> Import to Library).
Once in the Library, you can use the audio file on the timeline where a keyframe exists - without needing to write any code.
To add sound to the main timeline, a movieclip timeline, or inside a button timeline on the OVER or DOWN states follow these instructions:
1. Click on the KEYFRAME on the timeline where you want the sound to start playing - e.g. you can just put a sound on the first frame of the main timeline to have a background soundtrack.
2. the Properties Panel will show properties for the keyframe including a SOUND section. You can choose the sound you want to control from the drop-down list in that panel. Once chosen, then also choose a Sync event: Start or Stop are the most logical. Choose Start to start playing your sound at the beginning of the flash file loading. Set the Repeat to LOOP if you want it to play endlessly, or choose a number of loops.
3. You can also make a button symbol that will allow you to start or stop the sound without code. In the button states, make sure you have keyframes in all 4 states. If you want to stop the sound by rolling over or clicking the button, then on the OVER or DOWN keyframe, choose the same sound from the drop-down list, but set the Sync to STOP.
4. If you want to click another button to restart the sound, then make a second button symbol, select the same sound from the drop-down list and put a sound START Sync even for the sound in the OVER or DOWN states keyframe. Remember to reset the repeat to LOOP again also.
5. Test your Flash file to see if the sound is properly playing and stopping by hitting CTRL-ENTER.
6. Experiment with using different sounds if you can - you can often find free MP3s online that are copyright free.
Grab this Beastie Boys MP3 if you need it: Off The Grid (not copyright free, but we're just experimenting here)
View the Flash sample file with sound control: sountTest1.swf
Read the Assessment Task (2) brief to see what the requirements are - basically you can create any project you want that combines video and Flash. we can discuss your ideas and see what's feasible in the short timeframe.
Homework / Readings
Prepare your video footage to be used in your assessment task if you haven't already. Experiment with Flash if you can.
Flash related content
some very cools things made with Flash, or using Flash content: