Forms of Interactivity

[Rob Saunders]

Guys,

This discussion thread is your place to make requests for learning about the types of interaction that you would like to use in your projects.

So far my shortlist is:
1. Controlling the timeline
2. Animating rollovers for buttons
3. Controlling the playback of videos
4. Scrolling around large canvases

But I know you will want some more... so please speak up!

-RoB-

[Richard Lam]

Hi Rob,

I was thinking about the idea of simulating randomisation for a few decision points within the webcomic. You mentioned rolling dice as an example. Rather than having the user select which numbers they want to appear (which defeats the purpose of rolling dice), I was interested in something along the lines of:

- user click-holds the dice and shakes the cursor to shake the dice
- this initiates numbers to continually count rapidly from 2-12 until
- user releases the mouse button which releases the dice and the count stops at a number

I guess the same thing can be applied to slot machines and lotteries, etc, where numbers just count rapidly until the user clicks to stop it. Maybe there's a much simpler way to go about this or some code to make this all too easy??

I don't know if this whole randomisation concept is really simple or really complex, but it's a secondary interactive component that I might want to include just to mix things up a bit.

[Rob Saunders]

Richard Lam said:

I don't know if this whole randomisation concept is really simple or really complex, but it's a secondary interactive component that I might want to include just to mix things up a bit.

Great idea! Randomisation is something that is much easier to do with a little bit of code. I'll add that to my list of things to cover.

[Wendy]

Zooming! On large canvases. Perhaps the swf can respond to different mouse clicks (eg. right click for zoom, left click for something else).

I was gonna say what you said in 4, scrolling around large canvases. But I'm thinking about different ways of doing this. Right now I have two in mind: one is clicking on arrows on the borders of the animation, the other is automatically "panning" when the mouse is close to the border of the animation. I'm more interested in the latter though.

[Guy Steiner]

Hi Rob,
I was just wondering how to create a spherical panorama, one like http://www.papervision3d.org/demos/panorama/ and http://flashpanoramas.com/blog/2007/05/23/add-some-life-to-panoramas/ Do they work the same way as the one we've been doing in class?

There appears to be a lot of programs to buy which help you make it but I don't know if this is necessary, or perhaps the university already has something which can do it?
Thanks.

[Rob Saunders]

Guy,

If you want to create a panorama that scrolls from side-to-side (and up and down a little bit), you can use the same basic techniques we've been covering in class. The trick is to recognise that by stitching together the same image horizontally, you can create the illusion of a seamless horizontal panorama, as if you were viewing the inside of a cylinder. The reason you need two copies of the same image is so that you can switch from one image to the other when you recognise that the viewer has completed a full circle. I know that's a little hard to imagine and I'll be happy to draw one of my famously bad diagrams on the whiteboard to try to explain what I mean.

If you're looking to create a full 3D environment, I'm afraid that's beyond the scope of what we can cover in class, but it's worth noting Papervision3D is a free to download library and that it includes the source code for the first demo you linked to...

-RoB-

Guy Steiner said:

Hi Rob,
I was just wondering how to create a spherical panorama, one like http://www.papervision3d.org/demos/panorama/ and http://flashpanoramas.com/blog/2007/05/23/add-some-life-to-panoramas/ Do they work the same way as the one we've been doing in class?

There appears to be a lot of programs to buy which help you make it but I don't know if this is necessary, or perhaps the university already has something which can do it?
Thanks.

[Wendy]

Hi Rob! I'm wondering if you're still gonna be available to help us... Haha.

Anyway here's my problem: looping movie clips. I want a movie clip to only start when I click on a button, so I've made a blank frame in the beginning of movie clip with the action stop(); But then I want the movie clip to loop until I click on another button.

I know a movie clip automatically loops itself, but because of the stop(); at the beginning, it doesn't do so.

Help meeee!

[Rob Saunders]

Wendy said:

Hi Rob! I'm wondering if you're still gonna be available to help us... Haha.

Anyway here's my problem: looping movie clips. I want a movie clip to only start when I click on a button, so I've made a blank frame in the beginning of movie clip with the action stop(); But then I want the movie clip to loop until I click on another button.

I know a movie clip automatically loops itself, but because of the stop(); at the beginning, it doesn't do so.

Help meeee!

Don't worry, I'm still here...

Instead of placing stop(); in the first frame of the Movie Clip symbol's timeline, try putting something like myMovie.stop(); (replace "MyMovie" with whatever the instance name is of your movie clip) in the first frame of the root movie's timeline, i.e., where we usually put the functions to handle mouse movements etc.

What this does is to say that the instance called "myMovie" should stop playing, but it only says that it should do it once for the whole Flash movie, rather than every time the movie clip returns to the first frame in its timeline. This is actually how the "Dancer.fla" example works, so try checking that one out...

BTW: In the above, I'm assuming that the movie clip is already on the stage at the beginning of the movie. If this isn't the case, place myMovie.stop(); in whatever frame the movie instance first appears on the stage.

[Guy Steiner]

Hi Rob,
I've been looking through the dancer files actions and can't figure out what the "dancer1.dancing", I mean I can see that the 'dancer1' is an instance name but where does the '.dancing' come in?

What I am trying to do is to have a series of movieclip buttons (each appearing like a line in a floorplan) though the plan is rotating. When a particular line is clicked it will continue rotating until it reaches the top and is horizontal and then an animation of a section will come up, should I use the gotoAndPlay action for this?

Here are my actions atm (only for one of the buttons): They animate on roll over, how can I control this more like the dancers, like start and stop on a mouse click?

stop();
var vertical:MovieClip;
vertical.onRollOver = function():Void{
this.gotoAndPlay("over");
play();
}

vertical.onRollOut = function():Void {
this.gotoAndPlay("out");
};

vertical.onPress = function():Void {
this.gotoAndPlay("reveal");
};
vertical.onRelease = function():Void {
this.gotoAndPlay("hide");
}

Anyway, that's enough for now.
Sorry that I've written this much.
r u at uni anytime this week? perhaps its easier that way.
Either way, Thanks.
Guy.

[Rob Saunders]

Guy Steiner said:

Hi Rob,
I've been looking through the dancer files actions and can't figure out what the "dancer1.dancing", I mean I can see that the 'dancer1' is an instance name but where does the '.dancing' come in?

The quick answer is that dancer1.dancing refers to a variable (or "flag") that I added to the dancer1 movie clip. I did this the first time I set the value for dancer1.dancing before any of the functions. This is something that Actionscript 2.0 allows you to do that Actionscript 3.0 doesn't, it's very powerful (and quick) to do but it can also be difficult to understand when you're looking through someone else's code.

I'm using the dancer1.dancing flag to keep track of when the dancer is dancing. That was I can easily switch between "dancing" and "not dancing" modes when the mouse is clicked. Notice that these flags DO NOT control whether the movie clip is animating, they are just used to keep track of whether they are or not. Have a look inside the dancer1.onPress function. First, it checks to see whether the dancer is dancing or not, if it is then it stops the animation and sets the value of dancing to false, if not, then it plays the animation and sets the value of dancing to true. That's all there is to switching between two states using a mouse click...

Hope that helps,

-RoB-

[Wendy]

Yay! Thank goodness you're still here :P Thanks for solving the other problem.

I'm not sure if this is too complicated:

I have a starting scene of stick figures walking around the screen. You click on a stick figure and a "screen" drops down from the top to show something else. I want the "screen" to have a degree of transparency so the stick figures can still be seen walking around the stage in the background, but at the same time I want them to be rendered unclickable/inactive as long as the "screen" is there.

Is this hard to do? I tried some googling and I didn't get much. Probably not searching up the right keywords. All I got was something called "levels" which I don't really understand.

[Wendy]

Another question! How exactly do I make buttons function (click --> something happens/plays)? Buttons as in button symbols. onPress doesn't work (I assume that's only for movie clips?)

[Vinata Ciputra]

Hey. My button symbols works with onPress. Make sure you put down the instance name, and put in the code in the actions - frame.
If you want to put in the code inside the symbol itself, the code i'm using is on(release).

example:

on(release){
gotoAndPlay(1);
}

Wendy said:

Another question! How exactly do I make buttons function (click --> something happens/plays)? Buttons as in button symbols. onPress doesn't work (I assume that's only for movie clips?)