Well, this is a doozy. I ended up going flat-out into the animation, so I got distracted from writing down my processes up until that point...but still! After countless hours of learning new things, frame-by-frame animation and LOTS of Actionscripting, I finally have a finished narrative!
Firstly, I wanted to make my animation quite lively with it's movements. Unfortunately I never would have had the time to completely hand-draw every single frame, so that's where Flash's Motion Tweens (or Classic tweens in CS5) come in handy! they basically draw the frames out for you, all you need to do is tell it where you want Point A and Point B to be...then Flash will do the rest!
I did have to hand-draw some of the frames, however. Tweening doesn't always look good. In the below example I animated the worm (Boris) sprinting along the ground with a sack clutched in his tail. I had to take into account all of the extra movements the sack would make due to the force of the running and other small details.
![]() |
| You can see the huge amount of frames on the timeline. |
After I'd completely animated the entire sequence, I needed to piece it all together with buttons and Actionscripting, so things would only happen when the user would tell them to. The most obvious button was the "Go to Specified Scene" button, in the shape of a big green arrow on each block of text. This was relatively easy, all I had to do was assign a "gotoAndPlay" function to the button and specify the name of the scene I wanted the click to take the user to.
Other than this, I has things such as branching choices, like in the Video game section of the Narrative. These required a lot of coding in one single frame and looked a little something like this...:
![]() |
| That's a lot of code! |
Anything that was coded had to be either a Movie Clip or Button symbol. Graphics and non-symbols cannot be coded onto. Luckily, symbols can still be edited after they have been converted, so there's nothing to lose by doing this. With the first Choice scene, I applied several properties to the two buttons to make different things appear on-screen when you hover over them. It doesn't take any more coding, as this is all accomplished with KeyFraming inside the button itself.
![]() |
| the blue highlights on each object are where the user can click the button. |
On the Children's Book choice, I put in a small QTE (Quicktime Event) to save the user from just watching the animation without doing anything. It's quite a short one, but there is minimum penalty for missing it as you get to try it again right from the point at which it appears. It's a small 'Jump' button, and the user must click it in order to get to the next scene.
If the user fails to press the Jump button in time, they will be taken to this screen:
If the user does manage to click it, however, they will be taken to this screen and continue to the end of the animation:
Besides all of this scripting, I thought I would try something even more complicated. I decided to have the title screen of the Narrative be Basil's head, which rotated and had the eyes follow the mouse as the user moved it. This was a VERY complicated task, and I used a lot of different tutorials to get the results I wanted, but it paid off in the end!
So what have I learned in all this? I've learned that Actionscripting is actually quite fun once you know how to do it. Of course, I'm only scratching the surface of it with these small experiments, but this will definitely not be the last time I use it in my work. I've also learned new animation techniques in Flash, and a few tips in sound creation too (though unfortunately I couldn't implement them into this project). I had a lot of fun with this, and I'll soon be taking it one step further and publishing my Narrative onto the Android Smartphone Marketplace! It's all possible with what I've learnt so far, and I can't wait to experiment more!








