Create a Flash game like Cirplosion

August 22, 2008 by Emanuele Feronato
Filed Under Actionscript 2, Flash, Game design • 7 Comments 

Do you remember Cirplosion?

Cirplosion

It was quite successful some time ago, and now it's time to create a game like it.

In this tutorial we'll design the main engine. When you are going to design a game, or to write whatever script, try to explain yourself what you are about to do.

Let me try to explain with simple words what the does the script do:

* There are some blue orbs running everywhere with a linear motion
* You control a red orb moving it with the mouse
* If you click and hold mouse button, your orb start growing
* While growing, you can't touch stage border or other orbs, or you will return small
* When you release mouse button you are ready to explode
* Pressing again mouse button will make you explode and kill all orbs you are touching
* Orbs close to explosion will move faster from now on

That's about 75% of the original game... of course you will need to polish it and add new features.

You have only two objects: player and enemy. It's up to you to guess their role in the game

Here it is the script:

PLAIN TEXT
ACTIONSCRIPT:
  1. Mouse.hide();
  2. // the rate you circle grows when you keep mouse button pressed
  3. // the higher the value, the fastest the growth
  4. grow_rate = 2;
  5. // number of enemies on stage
  6. enemies = 15;
  7. // enemy speed...
  8. enemy_speed = 3;
  9. // this is the speed to add to enemy's speed when he comes close to an explosion...
  10. speed_add = 3;
  11. // ... how close? addspeed_range determines it.
  12. addspeed_range = 50;
  13. // enemy creation
  14. for (x=1; x<=enemies; x++) {
  15.     enemy = _root.attachMovie("enemy", "enemy_"+_x, _root.getNextHighestDepth(), {_x:Math.random()*450+25, _y:Math.random()*450+25});
  16.     // angle of movement... 6.28318531 = 2*Math.PI (just faster)
  17.     enemy.angle = Math.random()*6.28318531;
  18.     // the enemy starts with no additional speed
  19.     enemy.addspeed = 0;
  20.     enemy.onEnterFrame = function() {
  21.         // updating enemy position
  22.         this._x += (enemy_speed+this.addspeed)*Math.cos(this.angle);
  23.         this._y += (enemy_speed+this.addspeed)*Math.sin(this.angle);
  24.         // checking if the enemy left the stage in order to make them appear on the other side
  25.         if (this._x>500) {
  26.             this._x -= 500;
  27.         }
  28.         if (this._y>500) {
  29.             this._y -= 500;
  30.         }
  31.         if (this._x<0) {
  32.             this._x += 500;
  33.         }
  34.         if (this._y<0) {
  35.             this._y += 500;
  36.         }
  37.         // calculating the distance between the enemy and the player  
  38.         x_dist = this._x-player._x;
  39.         y_dist = this._y-player._y;
  40.         distance = x_dist*x_dist+y_dist*y_dist;
  41.         // if the enemy is touching the player...
  42.         if (distance<(this._width/2+player._width/2)*(this._width/2+player._width/2)) {
  43.             // if the player is growing then reset the player
  44.             // later he will lose a life
  45.             if (can_grow) {
  46.                 reset_player();
  47.             }
  48.             // if the player is exploding, then remove the enemy  
  49.             if (explode) {
  50.                 this.removeMovieClip();
  51.             }
  52.         }
  53.         else {// if the enemy is not touching the player but it's close enough to receive speed from the explosion...
  54.             if (distance<(this._width/2+player._width/2+addspeed_range)*(this._width/2+player._width/2+addspeed_range) and explode) {
  55.                 // inverting enemy direction
  56.                 // later it will be adjusted according to angle between the player and the enemy
  57.                 this.angle -= 3.14159265;
  58.                 // adding extra speed
  59.                 this.addspeed = speed_add;
  60.             }
  61.         }
  62.     };
  63. }
  64. // attaching the player on stage
  65. _root.attachMovie("player","player",_root.getNextHighestDepth());
  66. _root.onEnterFrame = function() {
  67.     // updating player position
  68.     player._x = _xmouse;
  69.     player._y = _ymouse;
  70.     // if the player is growing...
  71.     if (can_grow) {
  72.         // scale up the player
  73.         player._width += grow_rate;
  74.         player._height += grow_rate;
  75.         // if the player touches the edges of the scene then reset it
  76.         if (player._x-player._width/2<0) {
  77.             reset_player();
  78.         }
  79.         if (player._x+player._width/2>500) {
  80.             reset_player();
  81.         }
  82.         if (player._y-player._width/2<0) {
  83.             reset_player();
  84.         }
  85.         if (player._y+player._width/2>500) {
  86.             reset_player();
  87.         }
  88.     }
  89.     // if the player explodes, then reset it
  90.     if (explode) {
  91.         reset_player();
  92.     }
  93. };
  94. // when the player presses the mouse...
  95. _root.onMouseDown = function() {
  96.     // if the player has not grown, then make it grow
  97.     if (!has_grown) {
  98.         can_grow = true;
  99.     }
  100.     else {// if the player has already grown, make it explode
  101.         explode = true;
  102.     }
  103. };
  104. // when the player releases the mouse...
  105. _root.onMouseUp = function() {
  106.     // if he was growing...
  107.     if (can_grow) {
  108.         // the player has grown, now it's ready to explode
  109.         has_grown = true;
  110.         can_grow = false;
  111.         player._alpha = 50;
  112.     }
  113. };
  114. // simple function to reset player stats
  115. function reset_player() {
  116.     player._alpha = 100;
  117.     player._width = 10;
  118.     player._height = 10;
  119.     explode = false;
  120.     has_grown = false;
  121.     can_grow = false;
  122. }

And this is the result... play this quick Cirplosion version!

Now it's time to add some new features and polish the game.

How will you do it? Download the source code, send me an example and get featured in the blog!

Rate this post: 1 Star2 Stars3 Stars4 Stars5 Stars (9 votes, average: 4.78 out of 5)
Loading ... Loading ...
If you found this post useful, please consider a small donation.
» Flash Templates provided by Template Monster are pre-made web design products developed using Flash technology.
They can be easily customized to meet the unique requirements of your project.

7 Responses to “Create a Flash game like Cirplosion”

  1. Cool on August 22nd, 2008 11:04 pm

    Cool always wanted to make a game like this

  2. Kesh on August 23rd, 2008 8:08 am

    great idea.

  3. Kesh on August 23rd, 2008 8:10 am

    I am going to make the levels and i will submit it :)

  4. JDog053 on August 23rd, 2008 11:54 am

    Looking good. My first major game is nearly completed too !

  5. Jai on August 29th, 2008 8:21 am

    it’s kind of like filler, in how it expands and the ball collisions.

Leave a Reply




Trackbacks

  1. Flash Tutorials | AS3, AS2 Flash game tutorials roundup part 2 | Lemlinh.com on August 24th, 2008 12:00 am

    [...] Read more [...]

  2. Create a Flash game like Cirplosion - AS3 version : Emanuele Feronato on August 28th, 2008 12:17 am

    [...] days ago I published Create a Flash game like Cirplosion using AS2, now it’s time to do it using [...]

Posts