New tile based platform engine – part 1

September 14, 2008 • Actionscript 2, Flash, Game design by Emanuele Feronato • 23 Comments

I am about to develop a tile based platform engine that (in my opinion) will allow to create a lot of different games just changing some parameters.

At the moment it only allows to move horizontally but everything is planned, from rooms to jumps, ladders and ropes.

My goal is making the developer only focus on level design.

The most interesting thing is I am developing both AS2 and AS3 versions of the engine.

The other platform engine I created some time ago is discontinued. This will be better.

In this first part, we have four tile types:

Ground: the normal ground, with a normal acceleration and friction

Ice: a slippery tire, with reduced acceleration and friction

Left and right treadmills: these tiles will increase/decrease your speed according to their arrow

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89

tile_size = 20;
ground_acceleration = 1;
ground_friction = 0.8;
ice_acceleration = 0.15;
ice_friction = 0.95;
treadmill_speed = 2;
max_speed = 3;
xspeed = 0;
level = new Array();
level[0] = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0];
level[1] = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0];
level[2] = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0];
level[3] = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0];
level[4] = [1, 1, 1, 1, 1, 1, 1, 2, 2, 2, 2, 2, 1, 3, 3, 3, 3, 1, 1, 4, 4, 4, 4, 1, 1];
player = [1, 3];
function create_level(l) {
	_root.createEmptyMovieClip("level_container", 1);
	level_height = l.length;
	level_width = l[0].length;
	for (y=0; y<level_height; y++) {
		for (x=0; x<level_width; x++) {
			if (l[y][x] != 0) {
				t = level_container.attachMovie("tile", "t"+y+"_"+x, _root.level_container.getNextHighestDepth(), {_x:x*tile_size, _y:y*tile_size});
				t.gotoAndStop(l[y][x]);
			}
		}
	}
	x_pos = player[0]*tile_size;
	y_pos = player[1]*tile_size;
	level_container.attachMovie("hero", "hero", _root.level_container.getNextHighestDepth(), {_x:x_pos, _y:y_pos});
}
create_level(level);
_root.onEnterFrame = function() {
	ground_under_feet();
	walking = false;
	if (Key.isDown(Key.LEFT)) {
		xspeed -= speed;
		walking = true;
	}
	if (Key.isDown(Key.RIGHT)) {
		xspeed += speed;
		walking = true;
	}
	if (!walking) {
		xspeed *= friction;
		if (Math.abs(xspeed)<0.5) {
			xspeed = 0;
		}
	}
	if (xspeed>max_speed) {
		xspeed = max_speed;
	}
	if (xspeed<-max_speed) {
		xspeed = -max_speed;
	}
	xspeed += bonus_speed;
	x_pos += xspeed;
	level_container.hero._x = x_pos;
	xspeed -= bonus_speed;
};
function ground_under_feet() {
	bonus_speed = 0;
	y_feet = Math.floor(y_pos/tile_size)+1;
	x_feet = Math.floor((x_pos+tile_size/2)/tile_size);
	switch (level[y_feet][x_feet]) {
	case 1 :
		over = "ground";
		speed = ground_acceleration;
		friction = ground_friction;
		break;
	case 2 :
		over = "ice";
		speed = ice_acceleration;
		friction = ice_friction;
		break;
	case 3 :
		over = "treadmill";
		speed = ground_acceleration;
		friction = ground_friction;
		bonus_speed = -treadmill_speed;
		break;
	case 4 :
		over = "treadmill";
		speed = ground_acceleration;
		friction = ground_friction;
		bonus_speed = treadmill_speed;
		break;
	}
}

Move the player with arrows keys, more information to come during next days…

Download the source code and enjoy…

Rate this post: 1 Star2 Stars3 Stars4 Stars5 Stars (20 votes, average: 4.65 out of 5)
Loading ... Loading ...
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.
Be my fan on Facebook and follow me on Twitter! Exclusive content for my Facebook fans and Twitter followers

This post has 23 comments

  1. HanClinto

    on September 15, 2008 at 6:10 pm

    Fantastic stuff, thanks so much!

  2. Josh of Cubicle Ninjas

    on September 15, 2008 at 7:08 pm

    You’re awesome. Looking forward to seeing this engine come to life. :)

  3. Anthrax

    on September 15, 2008 at 7:13 pm

    Can’t you show how to make a sprite? I’ve already done it, but that would be beneficial to others.

    Also, you need to show how to make a scrolling background. I’ve also tried that, but it sucks.

    Awesome tutorials!

  4. Jack Hopkins

    on September 15, 2008 at 9:03 pm

    Nice! Will you be rewriting this in AS3?

  5. Nutter666

    on September 15, 2008 at 9:10 pm

    Jack – Yeah he said he’s doing it in AS2 & AS3… Nice one Emanuele…. you create a platform engine….just after ive made my own..and you make it better =/… just kidding can’t wait to see how this turns out

  6. Greg

    on September 16, 2008 at 1:32 am

    He says he will in the description.

  7. Koi Games

    on September 16, 2008 at 1:56 am

    yeah, I’d love the code on as 3.0.

    I think it’s time to create as 3.0 emanuele. People are already testing as 4.0…

  8. RipeX

    on September 16, 2008 at 6:05 pm

    Very nice! :D

  9. Anthrax

    on September 17, 2008 at 1:25 am

    Don’t forget to make him jump!!

    Wouldn’t a matrix be better than an array of arrays? It would be all one variable, and it would make a level editor easier to design, in my opinion.

    Keep up the good work!

  10. LanoG

    on September 17, 2008 at 7:29 am

    A very useful code. Perhaps I can suggest other things to add as a tile such as non-moving item, trap, teleport, enemy etc.

    One more suggestion is, in AS3.0, it is easier to create game level in different class, so that we can easyly edit tiles code.

  11. Jerry

    on September 17, 2008 at 4:18 pm

    I agree with Anthrax that a matirx would be better the a list of arrays and make level building easier.

  12. New tile based platform engine - part 2 : Emanuele Feronato

    on September 17, 2008 at 4:39 pm

    [...] the same thing as the one published in part 1, I just added walls and [...]

  13. Gregory Athons

    on September 18, 2008 at 12:23 pm

    THIS is by far my favorite tutorial on your site. I am very ready to read the next couple parts for this tutorials. Thank you very much

  14. New tile based platform engine - theory behind the player : Emanuele Feronato

    on September 20, 2008 at 5:45 pm

    [...] player of my tile based plaftorm engine, and answer to some questions readers made commenting steps 1 to [...]

  15. Nathan

    on September 20, 2008 at 6:03 pm

    Koi Games-Please don’t discontinue your as2 stuff emanuele! There are a few of us still stuck in the dark ages(Flash 8)

  16. Javier Lázaro

    on September 26, 2008 at 5:36 pm

    Thanks for all this series. I want to make a tile based game, and this will be very helpful.

  17. fraser

    on October 4, 2008 at 10:56 am

    im confused are we meant to make the tiles as seperate movieclips or in the one movieclip like the older platform engine

  18. labs.VETTIGHEID » Blog Archive » AS3 Platform Engine

    on October 15, 2008 at 10:45 am

    [...] I came on a very interesting blog about game design in actionscript. Emanuele had some really good tutorials about making a platform game in AS2. And in about 3 hours I had my own AS3 port of his engine and [...]

  19. Tile based game: Level Editor

    on December 26, 2008 at 8:08 pm

    [...] time ago Emanuele Feronato post a series of tutorials about creating an Platform Tile Based Game, this inspire me and I decide to contribute his cause [...]

  20. Level Editor

    on December 30, 2008 at 5:58 pm

    [...] you follow Emanuele Feronato may be you remember the Platform Tile Engine series, well I create a level editor he publish on his [...]

  21. G84 Level Editor — Group 84 Blog

    on January 16, 2009 at 1:36 am

    [...] time ago Emanuele Feronato post a series of tutorials about making a Platform Tile based Game. This tutorials inspired me and I decide contribute his cause with a Level Editor. More info in his [...]

  22. ArowanaW

    on August 25, 2009 at 3:50 pm

    I’m still confused about a few lines of code, to be honest..
    Can you explain to me, what does (level[y_feet][x_feet]) do?
    And what’s the over variable for?

  23. 1120: Access of undefined property - Flashforum

    on September 2, 2009 at 10:36 pm

    [...] [...]

< >