This tutorial will explain how to make a complete "Pong against Computer" game in SwishMax. SwishMax, a major improvement over Swish 2, includes SwishScript (Flash users know it as "ActionScript" which is almost the same.) which will allow us to code this game which wasn't possible in Swish 2.

1) Start SwishMax (obviously, you need to do that step)

2) In the Movie Panel, set the width (600px) and the height (400px) of the movie.



- You also need to put the movie frame rate. The human eye can only see up to 25 frames per second so there's no need to put it higher unless you want your movie to go faster. Using a low frame rate (12 for exemple) will make your movie animations not look "smooth". Using 20 fps is perfect for this project. Also, make sure that your settings are set to "Variable frame rate" or your movie will lag sometimes to be perfectly ajusted with the time. Do not check "Stop at the end of the movie" or the Enterframe script won't work unless a "return to frame 1" script.

3) The next step is to create all the objects needed for our game. The list and description are below this image.



- ball :: A circle with the name "ball" and must be targeted. (Check the Target box)
- left :: A line on the left called "left" and must be targeted.
- right :: A line on the right called "right" and must be targeted.
- top :: A line on the top called "top" and must be targeted.
- bottom :: A line on the bottom called "bottom" and must be targeted.
- user_pal :: A rectangle positionned in the middle (vertically) of "bottom", called "user_pal" and must be targeted.
- top_pal :: A rectangle positionned in the middle (vertically) of "top", called "top_pal" and must be targeted.


4) Open the Script panel of the scene. (Select the Scene in the list then click "Script")

Tip: Set the mode to Expert to write codes.

- We first need to set the variables default values and lock the mouse on the user_pal object.

Copy and paste this code in your Script window:


Explanation: This script set the speed of the ball when it moves, so the ball will moves 10px at the right and 10px at the bottom. To reverse it in the other direction, we only have to use a -1 to set the variable as -10 so it goes in the other direction.

Note: There're many methods to use the speeds and direction for this game, you could use for exemple 3 variables: 2 booleans for the direction and one for the speed.

Then select "user_pal" in the object list and copy paste that code:


Explanation: startDragLocked script means that the user_pal will follow any moves made by your mouse, but we must set restrictions because you can't move the object all over the window but only at the bottom and horizontally. The 80 means the left side limit, 520 means the right side limit and the two 386 means the bottom and top limit which are the same because it can't moves vertically.


- Return to the scene script window. It's now time to set the ball collisions test, moves and other settings.



Explanation: There're 3 parts to this code. First, the Collision Tests will check if the ball hit one of the objects, if yes, then we multiply the speed by -1 so the speed becomes negative and so, goes in the other direction. Now that we know the right direction for the ball, we can make it moves. The second part adds the speed to its current X position. The last part will makes the computer's bar moves. Sure you could make follows the ball but its not quite fun to play the game since you can't win. So there's way to make it "try to catch" the ball. First, we only allow the bar the moves if the ball is in the 2/3 of the vertical plan. Then we check if the bar position is below or higher than the ball position, if its higher, then we move the bar to the right to try to catch it, if its below, then we go in the other direction to catch it.

Note: Be sure to use a speed higher than the ball speed.

5) Your game is now functional. You can test it in your player.



6) We'll now add score functionality. Make 2 texts object, and set them as Dynamic. Use "user_stat" name for the user score and "comp_stat" name for the computer score.




7) Add your scene, "EnterFrame" script, this code:



Explanation: What we want to check is if the ball hit the bottom or top lines, if yes, then subtract 1 from the current player score and moves the ball to 50 px higher or below so it doesn't go under the player bar which could create a bug.

8) When the player wins or loose, it would be cool to have some text animation that tells the player "Winner!" or "Looser!". Let's make a sprite. In this sprite, add 2 texts, one with the text "WINNER!" and one with the text "LOOSER!". Now put some animation in the timeline and add the following stop and start scripts:

[IMAGE COMING SOON]

9) Let's return to the Scene script view to add some codes in the EnterFrame part:



Explanation: If the user or computer text reach 0 then we reset the scores to 10 and we tell the sprite to play the right animation.

10) Done! Your game is now fully complete with some added functionalities.

You can see a working exemple here: Watch It! >>>

---------
Full Scene Code: