For this week, I thought I would show some steps for a simple animation that I did for American Greetings. The animated piece was used for their online ecards so we kept the color to a minimum and the overall look very simple to keep the loading time down. The first step is that I was sent a script to work from. After reviewing the script, I did a storyboard where I broke down the story into visual segments with notes on transitions.
Once the storyboard was approved, I brought the storyboard into Illustrator. Most people will draw directly in Flash but I find the drawing tools a bit clumsy. The latest version of Flash is much nicer so I will have to try it out. I used the storyboard as a template so I drew on top of it multiple layers so I can break down the movable parts into individual pieces.
Once the characters and support elements were completed, I imported them into Flash where they were organized into folders according to the character. I then began building the animation from the first scene. Since this was going to be used on the web and in emails, I kept the frame rate at 12 fps for faster loading times. Each movement and character was placed on its own timeline. This allows for easier editing. Some movements were their own smaller animations that were then placed on the timeline. This keeps the complexity down and allows looping of movements like blinking of the eyes. Flash can be a bit wonky so as I get major elements animated, I saved the file in steps. There have been a few times that Flash will just shut down or not open a file so it is good to have a previous version as a backup.
Once the client was happy with the animation, I sent them the final Flash file so they could drop it into their template and add their back end programming (ActionScript) so it would interact with their website and ecard downloads. This is the final file.
I hope to have some new Painter samples for next month. Check in next week for Debbie's blog contribution.
Email us or send us a Facebook message if you would like us to send you our very first Pixel Shavings postcard.
I hope the typos and grammatical errors were limited. I had to publish the post so I could test the video and forgot to proof the text before doing so.
ReplyDeleteThey were very limited.
ReplyDeleteVery cool Russ! Thanks for posting that! It's so cool to see the process and how it all comes together.
ReplyDeleteYou are welcome Sheri.
ReplyDelete