Prototype of a Flash game like Biggification

Posted by Emanuele Feronato on 01/9/08 in Flash, Game design

Do you know a game called Biggification?

It's the perfect example of an one-day game that made a great success, scoring a 3.78 on Newgrounds and being reviewed by 151 people with an average score of 8.3

Biggification

The aim of the game is very simple, as shoud be any one-day game: collect expanding orbs by hitting them with your orb before they hit another orb and end the game. Collecting same color orbs consecutively give you a multiplier.

That's all.

Well, I created a prototype of this game in 64 rows

PLAIN TEXT
ACTIONSCRIPT:
  1. Mouse.hide();
  2. delay_in_frames = 5;
  3. frames_passed = 0;
  4. game_over = false;
  5. balls_array = new Array();
  6. _root.onEnterFrame = function() {
  7.     if (!game_over) {
  8.         can_place = true;
  9.         frames_passed++;
  10.         if (frames_passed == delay_in_frames) {
  11.             frames_passed = 0;
  12.             x_pos = Math.floor(Math.random()*400)+50;
  13.             y_pos = Math.floor(Math.random()*300)+50;
  14.             for (x in balls_array) {
  15.                 dist_x = x_pos-_root[balls_array[x]]._x;
  16.                 dist_y = y_pos-_root[balls_array[x]]._y;
  17.                 distance = Math.sqrt(dist_x*dist_x+dist_y*dist_y);
  18.                 if (distance-_root[balls_array[x]]._width<50) {
  19.                     can_place = false;
  20.                 }
  21.             }
  22.             if (can_place) {
  23.                 balls_array.push("ball_"+_root.getNextHighestDepth());
  24.                 ball = _root.attachMovie("ball", "ball_"+_root.getNextHighestDepth(), _root.getNextHighestDepth(), {_x:x_pos, _y:y_pos, _width:1, _height:1});
  25.                 ball.gotoAndStop(Math.floor(Math.random()*3)+1);
  26.                 ball.onEnterFrame = function() {
  27.                     if (!game_over) {
  28.                         this._width += 0.25;
  29.                         this._height = this._width;
  30.                         dist_x = this._x-_root.my_ball._x;
  31.                         dist_y = this._y-_root.my_ball._y;
  32.                         distance = Math.sqrt(dist_x*dist_x+dist_y*dist_y);
  33.                         if (distance<(this._width+my_ball._width)/2) {
  34.                             my_ball.gotoAndStop(this._currentframe);
  35.                             remove = this.getDepth();
  36.                         }
  37.                         for (x in balls_array) {
  38.                             if (_root[balls_array[x]].getDepth() == remove) {
  39.                                 _root[balls_array[x]].removeMovieClip();
  40.                                 balls_array.splice(x, 1);
  41.                             }
  42.                             if (this.getDepth()>_root[balls_array[x]].getDepth()) {
  43.                                 dist_x = this._x-_root[balls_array[x]]._x;
  44.                                 dist_y = this._y-_root[balls_array[x]]._y;
  45.                                 distance = Math.sqrt(dist_x*dist_x+dist_y*dist_y);
  46.                                 if (distance-(_root[balls_array[x]]._width+this._width)/2<0) {
  47.                                     game_over = true;
  48.                                 }
  49.                             }
  50.                         }
  51.                     }
  52.                 };
  53.             }
  54.         }
  55.     }
  56. };
  57. _root.attachMovie("ball", "my_ball", _root.getNextHighestDepth(), {_width:25, _height:25});
  58. my_ball.gotoAndStop(1);
  59. my_ball.onEnterFrame = function() {
  60.     if (!game_over) {
  61.         this._x = _root._xmouse;
  62.         this._y = _root._ymouse;
  63.     }
  64. };

Line 1: Hiding the mouse

Line 2: Defining the interval, in frames, between the creation of a ball and the next one

Line 3: Counting frames passed from the creation of the last ball

Line 4: Defining a variable to check if it's game over or not

Line 5: Creating the array that will store all balls in game

Line 6: Function to be executed at every frame

Line 7: If it's not game over...

Line 8: The core variable of the game. The game is playable because every new ball is placed at a distance from existing balls that allows the player to run and chatch it. So I am going to create a variable that will state if I can place a new ball in the random position I will create or not.

Line 9: Incrementing the number of frames passed since the creation of the last ball

Line 10: Checking if it's time to create a new ball

Line 11: Resetting the frame counter

Lines 12-13: Generating a random x and y position

Line 14: Scanning the array of the balls. For more information about this concept, refer to Managing multiple collision detection with Flash

Lines 15-17: Calculating the distance from the x-th ball and the ball that's about to be created

Line 18: If the distance between the balls is less than 50 (a number decided by me, changing it will affect gameplay)...

Line 19: ... then the new ball cannot be placed... a new one will be created in the next frame, in another position

Line 22: If the ball can be placed...

Line 23: Pushing the new ball in the balls array

Line 24: Creating the ball

Line 25: Stopping the ball timeline to a frame that ranges from 1 to 3. Every frame contains a color

Line 26: Functions that the ball will execute at every frame

Line 27: If it's not game over...

Line 28: Increase ball width by 0.25

Line 29: Set the height to the same value of the width

BUG?: In Flash Professional 8.0 if you change this._height = this._width; with this._height += 0.25;, you will notice a strange behavior

Lines 30-32: Calculating the distance from the ball and the and the one controlled by the player

Line 33: If the distance is less than the sum of both balls radius...

Line 34: Stop the timeline of the ball controlled by the player to the same frame of the ball just touched. In this way, the ball controlled by the player will have the same color as the ball just touched

Line 35: Setting a variable called remove to the ball's depth. Why am I doing this instead of simply removing the ball? I have to remove the ball and splice the array with all the balls in game, or the array will continue growing and making the game slower. In this way, I am marking the ball and I will remove its movieclip and its reference in the array next time I will scan the array

Line 37: Scanning the array of balls

Lines 39-41: As explained at line 35, if the ball's depth is the one to be removed, then remove the ball movieclip and splice the array with all balls in game.

Lines 42-49: Checking collisions between a ball and the remaining ones in the same way as explained at Managing multiple collision detection with Flash. If there is a collision, then set the game_over flag to true

Line 57: Attaching the movieclip of the ball controlled by the player

Line 58: Stopping the ball's timeline to the 1st frame (1st color)

Lines 59-64: If it's not game over, make the ball follow the mouse

And that's all. The game does not include score, but it's a quite good replica of Biggification

When it's game over, you can't move anything and you must reload the page.

Now I am going to change some gameplay parameters, add a couple of powerups and another one-day game will be ready to hit the masses. Download the source code and do the same

If you liked this post buy me a beer (or two)

» 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.

del.icio.us tag this | permalink | trackback url

17 Comment(s)

  1. Ed | Jan 9, 2008 | Reply

    I’d make lots of games in one day but I can’t think of any good ideas like this. :(

  2. David | Jan 9, 2008 | Reply

    amazing!

    i wish i could do stuff like that. could you do a tutorial on functions (if you already have, then i apologise), because i still get confused by them

  3. Frederik J | Jan 9, 2008 | Reply

    Good tutorial!

    Ed:
    Yeah, when you make games its about creativity, :( Some people is not born with it, inclusive me. But just keep trying!

  4. RJ | Jan 9, 2008 | Reply

    Hi, Emanuele, I think your
    Flash Game Creation Tutorial Part 5.3
    is not working. Could you check it, please?

    Thanks

  5. Scott | Jan 9, 2008 | Reply

    I’m flattered that someone would take the time to dissect my game like this.

    I’ve been thinking about rewriting it in AS3, and then maybe add some new gameplay concepts.

  6. Marukomu | Jan 9, 2008 | Reply

    Now this is pretty cool! I was reading this site at work because I love the tutorials. It gives me something to work on. I began showing some of my cubicle mates and low and behold the game of the day was done by one of me mates. Now that was unexpected coolness!

    PS. He was shocked to see his game being recreated.

  7. junior | Jan 10, 2008 | Reply

    just thought id brag about just getting the high score on that game. Thanks for the link emanuele

  8. junior | Jan 10, 2008 | Reply

    ok, now ive been destroyed. :(

  9. shiv | Jan 10, 2008 | Reply

    I dont know why, but its not working.

  10. Alejandro | Jan 10, 2008 | Reply

    Great tutorial, as always. I’ve tested your code, and is working really fine.

    Congrats

  11. Gabriel | Jan 11, 2008 | Reply

    Nice tutorial. Are you going to do a game like this?

    And… I’m doing a game based on your Security tutorial. I’m creating some new things. And I did something wrong and i don’t know what.

    This is some of the “hero” AS.

    [CODE]

    if (_root.wall.computer1.hitTest(_x, _y, true)){
    if (Key.isDown(Key.SPACE)) {
    _root.cam2.gotoAndStop(145);
    }
    }

    [/CODE]

    Whit this, the player should press play near the computer1, and the cam2 should go to frame 145, so he can go further…

    But it doesn’t work… Whats wrong?

    Thanks for reading this.

  12. Monkios | Jan 11, 2008 | Reply

    I didn’t really look into it but if you let one or two sphere grow while “killing” the others, eventually, no new ones will begin to appear on the screen.

    I’m guessing they are always for the preceeding one to get popped before being placed on the game board.

  13. Monkios | Jan 11, 2008 | Reply

    Good code by the way.

    I don’t know if I’m the only one but sometimes the site kills my browser and I get an alarm that I got a virus.

  14. shiv | Jan 12, 2008 | Reply

    fine i got it working!

  15. Ed | Jan 12, 2008 | Reply

    Monkios I got a trogan aswell :(

  16. RJ | Jan 12, 2008 | Reply

    Well, Emanule I’ve seen something in Newgrounds by you:
    http://www.newgrounds.com/portal/view/419882

    Glomb!

    Highscores work very very well.

  17. bob | Feb 18, 2008 | Reply

    WOW i played the actual game bigification its simple but strangly addictive i couldnt stop playing

    P.S: please can you post a tutorial about ho to make a game like stick rpg

1 Trackback(s)

  1. Jan 23, 2008: Glomb - The first Flash game to use MochiAds Leaderboards : Emanuele Feronato - italian geek and PROgrammer

Post a Comment