Project 6 (Flash) – Week 2 (Day 1) – Working on the Project

This post will be about the work I did on the day itself and the days following afterwards, until the completion of the project.

So first of all, here’s the storyboard that I worked on before completing the flash:

Storyboard (page 1)

Storyboard (page 2)

Basically, I planned to have an intro that would show someone asking about our band. Then, the word introducing would move around for dramatic effect.After, a couple of words would flash across the screen. A clip from the music video would show, introducing me, and then another introducing Gordon. A few more lines about the band, and then the logo would show up, followed by a line urging the viewer to buy the song. Estimated time was around a minute and a half. Now, I’ll go on to talk about how I went about creating the flash animation. I have a total of five scenes.

The very first thing I did was to look for a couple of tutorials. I watched a ton of videos on this site: http://tv.adobe.com/show/learn-flash-professional-cs4/

Scenes:

  • Introducing – This was the first scene I thought up (although it’s actually the second scene). Basically, it’s the word “Introducing…” moving across the screen in random directions (refer to the storyboard, box 3). I planned to have it go on for at least 10 seconds, and to add a blur effect when it moved.

Initial Idea for the Introducing scene

I converted it into a symbol (Shortcut F8), created a motion tween (learned last week. right click on the timeline after converting to a symbol), made several keyframes and then dragged it across the screen randomly in the different keyframes.

If it’s not obvious, there’s only so long you can move a symbol around the screen before it starts looking really stupid and repetitive. So I came up with a better idea.

I made several keyframes, in the beginning, very spaced out, but with each keyframe, I made the spacings closer to each other. Then, in each keyframe, I dragged the word introducing to another spot (no motion tween). I decided to add in a booming sound (gotten from soundbible.com, a free sound effect site) for effect.

I watched this video (and the video that was on the Adobe flash tutorial site, refer to very first link, near the top) to help me out with  adding in the sound: http://www.youtube.com/watch?v=MtN2vilf0mE

Introducing Final

This was a painstakingly slow process, and I had to repeatedly do the same thing all over again. To vary it, I tried rotating it at certain bits. This method worked a lot better than my initial idea, as it would not get boring too fast, and would not look so repetitive and unprofessional. Still, it took at least half an hour to 45 minutes, as I did have some problems with adjusting the length at the start (constantly had to expand the length of time/add more frames in the timeline).

After tinkering around a bit (and watching the flash tutorial videos), I managed to figure out that I could use the blur effect on the word to make it disappear at the end.

Introducing Blur

Then I added in a swoosh-sound effect (from soundbible.com) to top it all off.

  • Intro – This was the second scene I thought of (but it’s actually the first scene). In my storyboard, I planned to make people (images) talk, but I later realized that I would have to make the mouths of the people move, and that was a bit hard (and it would look extremely unprofessional, and I forgot that I would need to record a voice, which was just too time-consuming. Also, I didn’t want to use a speech bubble). So I came up with a different idea (although not exactly better). I would make a sort of narration, where there are words across the screen, and pictures would appear.

First, I added in a picture of the band, tweaked it into a motion tween and made the picture move into the screen. Then, I typed in the words: Do you know who they are?(in a separate layer), added in a motion tween, and rotated it. After doing this, I decided that it was a bit too boring, so I decided to try a shape tween. I had experimented before, but so far, was unable to pull of a complete successful shape tween. I browsed around for half an hour, and finally found 2 really good sites:

http://flashexplained.com/animation/learn-flash-cs4-animation-shape-tween/

http://www.republicofcode.com/tutorials/flash/morphing_bc/

They really helped me. So the first thing I did was (by following the instructions in the website) to convert the picture into a bitmap (go to: Modify–>Bitmap–>Trace Bitmap)

Tracing Bitmap

The quality of the picture was really bad, so I had to try and change all the settings (see above). After over 30 different combinations, I realized that pretty much nothing I did would improve the quality, and it was still basically the same as before.

After this, I created a circle in the same layer, and placed it on a keyframe. Then, I moved the picture into a frame about 3 seconds after, and then added a shape tween.

Shape Tween in the Picture

To remedy the bad quality of the picture, I created a new layer, added in another picture and created a motion tween for it. Then, in the same layer of the do you know who they are, I made another keyframe that would have the line: “Here’s a clearer picture” appear when the second picture would appear.

The clearer Picture

Then I just added in a few more frames and placed the words “if not, then…”

  • The videos – This was basically the part where the video would appear showing me and then Gordon. I already cropped the clips from the music video beforehand. I had a lot of problems placing my video in. After watching a few tutorials, I found out that I had to convert my video to a FLV file or some other file. I downloaded format factory, but even after converting it, it still wouldn’t import into the flash.

Eventually, (from watching the flash tutorial videos, first link provided), I had to launch the adobe media encoder (I had no idea what this was). After converting it, I had to embed it into the timeline, because for some reason it wouldn’t work otherwise.

AME

Selecting the Video

Then, I encountered another problem. I planned to have the band song play at this time, which meant that I would have to mute the video. When I was editing the video, I muted the volume, but for some reason, when I played it in flash, it would have sound. I even deselected the option to include the audio.

Trying to Mute the video

After fiddling with it for so long (in total, I probably edited this scene for almost two hours), I decided to scrap playing the song and muting the video, as I did not have enough time to fix this problem. I made a symbol with my name Justin (as the video was about me), and made a motion tween and set it to move to the center of the screen, and then I applied a few effects (e.g. color shadow)

After this, I made a new scene, and replicated pretty much everything except for the video (changed to feature Gordon) and the symbol with the name (changed to his name, Gordon), and the symbol effects.

  • Final Scene – Refer to the storyboard, boxes 7 and onward (Scene 5). Basically, I added a few other motion tweens and words to flash across the screen, and then I made the words G&J appear, and then a get it on iTunes now line flash. I thought that was too boring, so I changed it a bit. I changed the words G&J, and drew a new logo.

The Logo

I used 2 circles, and 1 line to make this. I used the tutorial from the flash website, about object drawing.

Object Drawing

Basically, I used different shapes to cut into the circles, and I used the free transform tool to finish it off. I then pressed Ctrl + G to group them together.

Then, in the created a rectangle in a frame, and then a few frames later, placed the G&J drawing in, and then deleted the rectangle in that frame. I then added in a shape tween (right clicking the timeline, pretty much the same as a motion tween.

The new Shape Tween

Then I just put in a get it on iTunes now to end the flash.

Improvements:

I ended up cutting out a lot of bits to my flash due to not being able to do it/running out of time. I also found out that the total time of the Flash project is only a minute long. If given more time, I would have liked to experiment more with the Actionscript 3.0 (programming), as I have heard that this has a lot of potential. Also, I would like to add in people talking and moving around the screen (using things like the bone tool). I would also try to add in audio (people talking) with the use of voice-over. I would want to actually create something that has a story (much like a movie).

Advertisements

About jaoj2

Sha Tin College 10S
This entry was posted in Project 6 - Flash, Projects, What I Did Today. Bookmark the permalink.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s