"The Happy Carabao"

"Learning to use Adobe Flash to bring animated life into my Carabao"

 

Back to Ted's Web Grafitti or back to www.tedvisaya.com
Jump to Actionscript

Above is my 1st attempt at using Flash with the 'Bones' feature. I found it very cumbersome and difficult to use but determined to make it work right. I used Illustrator and Photoshop to create the artwork and was learning these programs at the same time as Flash.

Above is my 2nd attempt at the Carabao Flash animation with the 'Bones' feature and I still found it difficult to use. As I began to improve on my Illustrator and Photoshop skills I still remained frustrated with Flash.

Above is my 3rd attempt at trying to get the animation to work correctly I finally abandoned the 'Bones' feature completely. I was so frustrated with it that I wanted to delete it from the Flash program entirely. Instead I decided to create cartoon stills. I took the cut up carabao cow and rearranged the legs to simulate walking. Put the individual stills into keyframes on separate layers of the Timeline and ran the animation together,
tweeking and adjusting
keyframes to get it
right. Finally success!

In the animation below there are individual Carabao stills I created with Illustrator and Photoshop. I inserted these stills into individual keyframes on a single layer in the Timeline. Above this layer is another layer named the Actions layer with the individual Actionscript code for each keyframe.

Do a mouse-click inside the animation then press the spacebar to move the carabao from frame to frame. Hold the spacebar down and watch him run.

Beginning Actionscript Programming

To the right is the Actionscript program code created to interface with the Flash animation above. The other animations on this page do not have any Actionscript code so are not User Interface (UI) capable and will continue to loop and play.
To make an animation UI capable there needs to be an event listener at the top. 'stage.addEventListener' In the ( ) next to the EventListener you need to enter what the EventListener is going to listen for, in this case it'll be a 'KeyboardEvent'. The rest of the code are just commands telling the EventListener what to do everytime the spacebar is pressed. That's basically it in a nutshell. Actionscript is simply a program code for developers to program interactivity within the Adobe Flash platform. It's similar to Javascript.

stop(); stage.addEventListener(KeyboardEvent.KEY_DOWN,advance); function advance(event:KeyboardEvent) { var key=event.keyCode; switch(key){ case Keyboard.SPACE: play(); break; case Keyboard.RIGHT: play(); break; case Keyboard.LEFT: if(currentFrame==1) { stop(); } if(currentFrame==2) { gotoAndStop(1); } if(currentFrame==3) { gotoAndStop(2); } if(currentFrame==4) { gotoAndStop(3); } if(currentFrame==5) { gotoAndStop(4); } if(currentFrame==6) { gotoAndStop(5); } if(currentFrame==7) { gotoAndStop(6); } if(currentFrame==8) { gotoAndStop(7); } if(currentFrame==9) { gotoAndStop(8); } if(currentFrame==10) { gotoAndStop(9); } if(currentFrame==11) { gotoAndStop(10); } if(currentFrame==12) { gotoAndStop(11); } if(currentFrame==13) { gotoAndStop(12); } if(currentFrame==14) { gotoAndStop(13); } if(currentFrame==15) { gotoAndStop(14); } if(currentFrame==16) { gotoAndStop(15); } break; } }

Teaching Myself Actionscript

I found a couple links that are useful during my learning curve. Wikipedia: Actionscript to get a definition and history of Actionscript. Adobe Actionscript Technology Center to stay up to date on the latest Actionscript developments and to study and extract code samples to develop my personal UI Actionscript animations.
I think I'll start with the Adobe Actionscript Cookbook and enter into the realm of UI Design.

 

ted visaya ted visaya ted visaya ted visaya ted visaya ted visaya ted visaya ted visaya ted visaya ted visaya ted visaya ted visaya ted visaya ted visaya ted visaya ted visaya ted visaya ted visaya carabao carabao carabao carabao carabao carabao carabao carabao carabao carabao carabao carabao carabao carabao carabao carabao carabao carabao carabao carabao carabao carabao carabao carabao carabao carabao carabao carabao carabao carabao carabao carabao carabao carabao carabao carabao carabao carabao carabao carabao carabao carabao