mercredi 15 juillet 2009

Flash final: let your eye’s rock and roll!

As a last item in this short intro in FLASH scripting i asked a cat to let her eye’s roll a bit in a FLASH script…

And other nice simple things. We increase the complexity of the script in this folder.

http://www.contrechoc.com/flash/flashRotation.zip

as special features connections of FLASH with other media will be shown, such as:

  • FLASH wii remote connection
  • FLASH rfid connection
  • FLASH PS2 connection
  • FLASH arduino connection….

showing one of the possible next stages of working with FLASH, the communication with the outside world!


Where to go on?
First of all, when familiar with these possibilitities, you could learn to script more structured, in classes. That is quite a jump!
Then you can program top down, that is you can make a scheme of what to do, like

startup
game
highscore
finish

then detailing top down like:

game:
level1
score
level2
score
level3

level:
let shooter come in
let items to be shot fall down
when shooter is killed
new life
when 5 lives are up
loose
when items are shot
next level

then game is a class
gamelevels are a class
shooter is a class
items is a class
score is a class
etcetera

This way you can handle bigger structures like games.
Have fun! Make nice things!

Zooming Drawing and Rippling in FLASH

Today we will study a simple way to get animation from mouse click and movement on Stage.

Three examples: a drawing example, a zooming example and a special effect, the water ripples, this last is using an external script.

the example movies can be found here:

http://www.contrechoc.com/flash/flashZoom.zip

as usual we will practice the examples!

flash scripting: total Command! (On our way to e-paper!)

We will go back to one of the first examples, loading images, sounds on keyboard input.

We now know order and chaos principles so we can do much more with the scripts we started with in the first lesson.

Then we also add a video, starting and stopping it on keyboard input. We can even add a few filters to the video. (The only thing which does not seem to work is slow motion.)

We will add our chaos and order images also under a keystroke.

We are in total command! (Nearly so :-)

http://www.contrechoc.com/flash/imageSoundVideo.zip

PS now we understand the basic script used for e-paper workshops, you could get the keystrokes for the flash movie from an external keyboard, or something that simulates the keyboard, see these blogs for mind boggling possibilities!

e-paper DIY:

http://blog.wdka.nl/crosslab-diy/2009/04/03/presentations-close-reading-projectweek/

or the category interactive paper on this blog….

as always: have fun!

Order and Chaos scripts

The first lessons were really hard work, getting used to the terminology, all the windows, the scripting language...
This time we study the order of the world and the chaos of art. We will try to find a solution in between.
Start with your own background (big) and have a small image with a transparent background (.png) ready.
Discover the possibility of the so called “for-loop” for making order in the two direction: horizontal and vertical:
in a loop we can repeat things:
see the download: in the first movie we load one banana:
loadImage("banana.png", 100, 100);

in the second movie we load three banana's:
loadImage("banana.png", 100, 100);
loadImage("banana.png", 130, 100);
loadImage("banana.png", 160, 100);

but what about 25? Do we have to type all 25 banana's?

No!

We can do this more effecient:
we use a counter, just a variable counting from 0 to 25!
and we use this counter also to change the coordinates, in this case the x: 30 + counter*40
for (var counter = 0 ; counter < counter ="counter" j =" 1" j =" j" i =" 1" i =" i" style="text-align: center;">


Now we introduce a bit of disorder, using a random function:

for (var j = 1 ; j < j =" j" i =" 1" i =" i" style="text-align: center;">


We used the Math.random() to get a random number between 0 and 1 and have to multiply this to get between say 0 and 25 by 25...

We get this image....

We get a mixture of order and chaos, and we can send the screenshots to Boijmans.
Follow the sequence of order and chaos in these free flash movies, made especially for YOU!
http://www.contrechoc.com/flash/flash-orderAndChaos.zip
try making a function which can read another image, so you can alternate the order of two images! (We did that in class :-))
try varying the scale of the image, to get bigger and smaller images (We did that in class!)
So here are some static results: when you see it happen on screen, or when you repeat the key stroke on your keyboard every time a new unexpected configuration is made by your flash movie.


this is a random grocery shop from Rabia
this is criticizing commercial religions from Nieke
this is font fun from Giulia


Flash piano’s (lesson 2)

Of course the students were on holiday last time so we repeat the piano lesson...

These files are the examples for this second lesson on flash.

The examples expand on interactivity and introduce the timer.

the images are in the library, movieclips contain images and are already on “the Stage”

we use only one frame of the timeline

very important: we use only one script

movieclips in the script have different names although the come from the same image…

this is the difference between an “object” ( the movieclip) and different “instances” of this object, say you have a stamp and make different prints of this. These prints are on the stage and are used as buttons. So the prints on the stage, all from one MovieClip, have different names.
(But changing the image in the movieClip will change all the prints (instances) of the movieClip.)

the sounds are used streaming from a folder outside the flash movie, the last movie showes a different way of loading a sound.

you make your own piano, and later add a timer to keep the rhythm going, in the end you add a bar to change the speed of the rhythm.

sourcefiles can be found here: http://www.contrechoc.com/flash/pianoFlash

sounds are in the folder called sounds, you can change these, as long as the new sounds are in the mp3 format.

Special Ascension Day FLASH DIY Piano dinsd

Of course Ascension Day was a holiday in Rotterdam. But teachers think they have to seduce there students to work anyway, therefore this piano in FLASH!

Dear Flash lovers :-)

Because of the holidays a special small flash movie in two versions.

It is a working piano movie (myOwnPiano) with three keys, for you to make more keys, copy pasting the movieclips, adding other key names in the property window, and adding the eventlisteners in the script.

Don’t forget to add (your own) mp3 sounds in the sounds folder! Better short sounds!

Then to get it more lively the second example (myOwnPiano1) has some animation on the first key (”geluid1"″), for you to expand this to the other keys.

In the scripts there are comments explaining what to do, also on “the stage” some hints are given….

have fun, and see you next week,

The piano movies can be found here:http://www.contrechoc.com/flash/flash voorbeeld piano.zip

FLASH scripting starter 1

This is a course of seven afternoons introducing art students to FLASH, scripting, i gave at the WDKA.nl in Rotterdam.

This blog gives mainly examples, which are explained and have to be modified by the students during class.

Of course, teaching how to script to students which have no technical background starts at the beginning and this is a course avoiding all OO programming or use of classes and/or packages.

The goal is to steer around movieclips, learn about eventlisteners from the mouse and the keyboard, load external sounds and images, do a few transformations, rescaling etc. In the end i show the Ripple example and do a atan2 function to get the rotation from the mouse.

One student started immediately programming the wii remote, making anaglyphs of his digital photo's and using the Colortransform of FLASH. He was one or more levels up. This also happens at an art school!


So we start with zero knowledge. All the relevant windows of FLASH are demonstrated.

The first lesson is demonstrating, showing the things we will learn. This lesson proved to be very difficult, later on we went slower and the students practiced the scripts more themselves, using there own ideas and imagery.

The first example movies can be found here:http://www.contrechoc.com/flash/flash-basics.zip

(CS3 examples made in Flash CS3 also working in Flash CS4)

the basics:

a framelabel example, good for alternative presentations

a sound loading example

an image loading example

the scripts are small, and can be copied and pasted into other scripts, (be careful though!)

a sound folder and a banana are joining the party.

a great site for FLASH examples (tutorials, also photoshop things) is http://www.smashingmagazine.com/2007/10/30/65-excellent-flash-designs/

Sounds: FLASH handles only .mp3 ,free sounds can be found at: http://www.freesound.org/

images/cartoons can be found everywhere, google images with the keyword “cartoon” and “rabbit” for instance, also this kind of site can be found easily: http://www.barrysclipart.com/barrysclipart.com/index.php

FLASH games? There are about three trillion to be found, but this is a great site: http://www.flash-game.net/