Learn how to use Adobe Flash with all the free tutorials. Game Making, Animating, Cartoon Design, Web Design and much more...
How to make a maze game
Making a maze game
Insert two additional layers, so you are left with 3 layers. Name layer 1 maze, layer 2 cursor and layer 3 actions.
Right click on the first frame in the actions layer and select actions, add the following actions:
stop();
Mouse.hide();
cursor.onMouseMove = function() {
this._x=_xmouse, this._y=_ymouse;
};
These actions have been explained in previous tutorials.
In the first frame of the cursor layer, using the oval tool, draw out a small circle on the stage. Now convert the circle into a movie clip, call it cursor. Also give it an instance name of cursor.
Now on the first frame of the maze layer, select line tool and set the stroke height to 10.75 or higher. Now draw out your maze(this is what the cursor will have to be guided through so make sure the cursor is smaller enough to fit in your maze).
Convert the maze you just made into a button. Now right click on the maze, select actions, and add these actions to it:
on (rollOver) {
gotoAndStop(2);
}
This means that if the cursor rolls over the maze it will move on the 2nd frame.
Now at the end of the maze where you want the finish to be draw our something that represents the end of the maze. Eg. You may want to put a trophy or a gold medal or something like that.
Convert it into a button and add the following actions to it:
on (rollOver) {
gotoAndStop(3);
}
These actions are the same as before only with a different frame number to go to.
Now insert a new keyframe at frame 2(this is the frame that the game will go to if the cursor rolls over the maze). Now delete everything on the stage, and using the brush tool, write something like YOU LOSE. Now insert another keyframe at frame 3 in the maze layer. Delete the YOU LOSE text and replace it with something like GREAT WORK.
That’s it, you just made a maze game, you may want to insert keyframe at frames 2 and 3 of the cursor layer so the cursor is still active.
Now that you know how to create a maze game, add more levels, with the knowledge you have learnt throughout these tutorials you will be able to add button to restart and buttons to go to the next level etc.
How to make a quiz game
Making a Quiz Game
Start by inserting an additional 2 layers, so you will be left with 3 layers.
Name the bottom layer title, the middle Q’s and A’s and the top layer Actions.
Select modify from the menu option located at the top of the screen, then select document and change the colour to black(I am using black for this example, you use what ever you want).
Insert a keyframe at frame 2 on every layer.
Right click on the first frame of the action layer and select actions, now on the first line type in:
stop();
score = 0;
Now right click on the second frame of the action layer and select actions, on the first line type in:
percent = score/1*100+%;
(IMPORTANT NOTE: THERE MUST BE QUOTATION MARKS AROUND THE PERCENT SYMBOL.
The only reason I have not added the quotation marks is because this is a html document, and if I place the quotation marks around the % you will only see “”.
This is telling flash that the percent = whatever the score is(for this example I only have 1 question, so the score will be 1) divided by 100.(which is 100%). The +% means to add a % symbol at the end of the result.
On the first frame of the title layer, draw out a text box(static text) and type in the name of the quiz. For this example I will be using learnflash8pro.blogspot.com.
Now on the second frame of the title layer, draw out another text box(static text) and type in You Scored.
On the first frame of the Q’s and A’s layer, write out the question and the answers.
My question was Is learnflash8pro.blogspot.com the best site ever?
My answers were Yes and No.
I recommend that you place each of these underneath each other.
Eg. Is learnflash8pro.blogspot.com the best site ever?
Yes
No
Convert the answers in to 2 separate buttons. Right click on the correct answer and select action(of course the correct answer for me would be yes).
Add these actions to the correct answers:
on (release){
gotoAndStop(2);
score+=1;
}
This means that when the mouse is released the score will go up by one and go to the next frame.
Add these actions to the incorrect answer:
on (release){
gotoAndStop(2);
}
This means that when the mouse is released go to frame two. As this is the wrong answer we don’t want the score to go up.
Now on the 2nd keyframe of the Q’s and A’s layer, using the text tool(static text) draw out 3 text boxes, each underneath each other.
In the top text box type in: # of Questions:1
In the middle text box type in: # of Correct Questions:
Now in the bottom text box type in: Percentage:
Now using the text tool again, this time dynamic text, draw out a text box next to the # of Correct Questions text box, give it a var name of score.
Now using the text tool(still dynamic text) draw out a text box next to Percentage, and give this text box a var name of percent.
Congratulations, you have made your first quiz.
Now that you have the idea, create a quiz with a few questions, and obviously you will have to make minor changes to the Actionscript.
Start by inserting an additional 2 layers, so you will be left with 3 layers.
Name the bottom layer title, the middle Q’s and A’s and the top layer Actions.
Select modify from the menu option located at the top of the screen, then select document and change the colour to black(I am using black for this example, you use what ever you want).
Insert a keyframe at frame 2 on every layer.
Right click on the first frame of the action layer and select actions, now on the first line type in:
stop();
score = 0;
Now right click on the second frame of the action layer and select actions, on the first line type in:
percent = score/1*100+%;
(IMPORTANT NOTE: THERE MUST BE QUOTATION MARKS AROUND THE PERCENT SYMBOL.
The only reason I have not added the quotation marks is because this is a html document, and if I place the quotation marks around the % you will only see “”.
This is telling flash that the percent = whatever the score is(for this example I only have 1 question, so the score will be 1) divided by 100.(which is 100%). The +% means to add a % symbol at the end of the result.
On the first frame of the title layer, draw out a text box(static text) and type in the name of the quiz. For this example I will be using learnflash8pro.blogspot.com.
Now on the second frame of the title layer, draw out another text box(static text) and type in You Scored.
On the first frame of the Q’s and A’s layer, write out the question and the answers.
My question was Is learnflash8pro.blogspot.com the best site ever?
My answers were Yes and No.
I recommend that you place each of these underneath each other.
Eg. Is learnflash8pro.blogspot.com the best site ever?
Yes
No
Convert the answers in to 2 separate buttons. Right click on the correct answer and select action(of course the correct answer for me would be yes).
Add these actions to the correct answers:
on (release){
gotoAndStop(2);
score+=1;
}
This means that when the mouse is released the score will go up by one and go to the next frame.
Add these actions to the incorrect answer:
on (release){
gotoAndStop(2);
}
This means that when the mouse is released go to frame two. As this is the wrong answer we don’t want the score to go up.
Now on the 2nd keyframe of the Q’s and A’s layer, using the text tool(static text) draw out 3 text boxes, each underneath each other.
In the top text box type in: # of Questions:1
In the middle text box type in: # of Correct Questions:
Now in the bottom text box type in: Percentage:
Now using the text tool again, this time dynamic text, draw out a text box next to the # of Correct Questions text box, give it a var name of score.
Now using the text tool(still dynamic text) draw out a text box next to Percentage, and give this text box a var name of percent.
Congratulations, you have made your first quiz.
Now that you have the idea, create a quiz with a few questions, and obviously you will have to make minor changes to the Actionscript.
Improve your flash skills
Tips on Improving your skill
Drawing- Spend 15 minutes everyday on drawing some basic pictures. When you are getting good at drawing basic pictures, try something a little harder. Look through a magazine for some cartoon pictures. Have a look at the way these pictures have been drawn, try draw them using flash; don’t worry if the end result looks stupid, that’s the whole point of this exercise, to improve. Everyday try and draw this picture again, this will help you greatly.
Judging Colour- This is an important skill. Say for example you are looking through pictures of cars or something like that. You might see a yellow one that you like. Take a close look at the colour, figure out what shade of yellow it is, because chances are, it isn’t just the standard yellow you find in the colour panel. In the colour panel go into custom colours(when you for example click on the oval tool, open up the fill colour, up the top of the box next to the box with the red line through it, there is a circle filled with different colours. Here you can get the exact colour you need.
Each colour has a number, when you click on the fill colour tool, hold the cursor over a colour, in the box located at the top of the colour panel, there will be a list of numbers. For example, black is #000000. So remember to have a look through custom colours often, as the ones that display when you click on stroke colour or fill colour, are only basic colours.
Judging Scale- This is really easy(for most of us). Let’s say you want to draw a picture of a person holding a five dollar note; you don’t want the five dollar note to be as big as the person’s whole arm. This would be a pretty obvious mistake, but you would be surprised how many people make this mistake.
Solution: grab a five dollar note, and have a look haw big it is compared to your hand or arm. Although this was a simple example, this mistake can sometimes be easy to make, that being said, it is also easy to avoid.
Drawing a Person- One of the most common things seen in a flash movie is a person, so it doesn’t hurt to know how to draw one.
Have a look in the mirror, take in the details, have dark are your eyes, how large are they, what do your ears look like from the front and the side, what does you nose look like, take notes like these.
A common mistake when someone draws a person is the eye position. When you had a look in the mirror I bet you didn’t notice this, but you eyes are actually in the very centre of our face. It looks like they area bit above centre.
Practice drawing out each thing individually, have a look at your nose, now try drawing it out, and so on.
Don’t worry to much about the detail, this is not that important, a cartoon drawing does not need to made complicated, it needs to be kept fun. Take “South Park” for example, for those of you who know what this is, look how simple the characters are, but yet, we can still identify their characteristics easily, so just remember don’t be too fussy with the detail.
Experiment With Colour- As I just said, don’t worry about the detail too much.
This may sound like I am contradicting what I just said before in the advice about colour, but when designing you own simple designs, make the colours fun. Say for example when you draw a person don’t worry too much about getting the colour perfect, you may even want to make the person blue, be creative, a key thing in flash, creativity.
Drawing- Spend 15 minutes everyday on drawing some basic pictures. When you are getting good at drawing basic pictures, try something a little harder. Look through a magazine for some cartoon pictures. Have a look at the way these pictures have been drawn, try draw them using flash; don’t worry if the end result looks stupid, that’s the whole point of this exercise, to improve. Everyday try and draw this picture again, this will help you greatly.
Judging Colour- This is an important skill. Say for example you are looking through pictures of cars or something like that. You might see a yellow one that you like. Take a close look at the colour, figure out what shade of yellow it is, because chances are, it isn’t just the standard yellow you find in the colour panel. In the colour panel go into custom colours(when you for example click on the oval tool, open up the fill colour, up the top of the box next to the box with the red line through it, there is a circle filled with different colours. Here you can get the exact colour you need.
Each colour has a number, when you click on the fill colour tool, hold the cursor over a colour, in the box located at the top of the colour panel, there will be a list of numbers. For example, black is #000000. So remember to have a look through custom colours often, as the ones that display when you click on stroke colour or fill colour, are only basic colours.
Judging Scale- This is really easy(for most of us). Let’s say you want to draw a picture of a person holding a five dollar note; you don’t want the five dollar note to be as big as the person’s whole arm. This would be a pretty obvious mistake, but you would be surprised how many people make this mistake.
Solution: grab a five dollar note, and have a look haw big it is compared to your hand or arm. Although this was a simple example, this mistake can sometimes be easy to make, that being said, it is also easy to avoid.
Drawing a Person- One of the most common things seen in a flash movie is a person, so it doesn’t hurt to know how to draw one.
Have a look in the mirror, take in the details, have dark are your eyes, how large are they, what do your ears look like from the front and the side, what does you nose look like, take notes like these.
A common mistake when someone draws a person is the eye position. When you had a look in the mirror I bet you didn’t notice this, but you eyes are actually in the very centre of our face. It looks like they area bit above centre.
Practice drawing out each thing individually, have a look at your nose, now try drawing it out, and so on.
Don’t worry to much about the detail, this is not that important, a cartoon drawing does not need to made complicated, it needs to be kept fun. Take “South Park” for example, for those of you who know what this is, look how simple the characters are, but yet, we can still identify their characteristics easily, so just remember don’t be too fussy with the detail.
Experiment With Colour- As I just said, don’t worry about the detail too much.
This may sound like I am contradicting what I just said before in the advice about colour, but when designing you own simple designs, make the colours fun. Say for example when you draw a person don’t worry too much about getting the colour perfect, you may even want to make the person blue, be creative, a key thing in flash, creativity.
Subscribe to:
Posts (Atom)