How to make a "torch" effect

In this tutorial I'm explaining the most basic way of doing it.

What's on stage?

Only 2 layers, the mask and the masked.



In layer 1, the masked one, I have an image and in layer 2, the mask, a MovieClip instanced as "torch".

The actionScript there is:

startDrag("torch", true);
Mouse.hide();

And that's all. With startDrag we tell the movie to drag our MovieClip with the mouse and then we hide our mouse.

Here you can see it in action

Flash "Find the differences" game creation tutorial - Part 2

Here comes the second part. Today I don't have time enough to write it all, so I'm going to split it in two parts: Part 2a and part 2b.

This first part will consist only in the game and the source code and the next will be the explanation.



Download the source code if you want, but don't worry,I will explain it soon.

Flash "Find the differences" game creation tutorial - Part 1

Hi, in this tutorial we'll see how to make a flash
game similar to 5 Differences. Of course, in Flash
things can be done in lots of different ways, so we'll
cover only one of them, maybe not the best, but
it will work.


Lets see what I have in my flash document:

There are 6 layers:

- Image 1: A drawing
- Image 2: The same drawing, but with some changes
- Contour: Some black lines, to make it look better
- Button/s: In this layer I drew an invisible button
over the differences, instanced as "Df1_btn"
- Text: A dynamic text field instanced as "congrat"
- Actions: The actions layer.


In the actions layer I introduced this code:

Df1_btn.onRelease = function() {
_root.congrat.text = "Well done! You found the difference!"
};

And that's it. Lets see what do we get:

Oh, that's really primitive... when you place your mouse over the difference, it turns into a little hand. We need to solve this problem. Lets think...

If you can't see the cursor, then you won't see the
little hand... Great!
But... wait a moment... then you won't know where
your mouse is and you won't be able to play. We'll
have to make our own custom cursor.

This is very easy, don't worry. All you have to do
is to create a movie clip and link it as cursor




How do I do that!!??

Firstly, create a new MovieClip [in the image, rounded
in green] and draw an arrow.Once you have it created,
don't forget to open it's properties panel and tick
"Export for ActionScript" and give it the identifier
"cursor".

And now, the ActionScript

The only ActionScript I have is in the layer actions, in
the first frame. This is what I wrote:

Mouse.hide();
attachMovie("cursor", "cursor", 1);
cursor.onEnterFrame = function() {
this._x = _xmouse;
this._y = _ymouse;
};
Df1_btn.onRelease = function() {
_root.congrat.text = "Well done! You found the difference!"
};

And that's all.


This is the final result. Of course, it's not
finished, but the rest will have to wait for
Part 2.

Coming soon... flash tutorials!

I'm glad to announce that in a few days, we'll be publishing
our first flash tutorial. Please be patient while we prepare it.
We're also going to change the blog's look. It's a lot of
work, but I think that it'll be ready for Wednesday.

Thanks for reading ;)