Best way to layout large 2d level?

What is a good process for developing a relatively large level for a 2d platform game (Mario, Braid, Limbo, etc)?

One could create one giant png file and use something like Physics Editor to define all of the physics bodies for the whole level at once, but I’m not sure mobile devices could even handle that?

You could create the level as one big file, split it up into smaller chunks then introduce them in the game as needed so they appeared seamless. This seems more efficient, but a hassle to manage if the level is sufficiently large. Plus it could be difficult to keep the sections looking seamless if you later had to go back and make changes to the level?

Maybe someone who has worked on a platformer game can break down their process from how they started with the raw images in Photoshop/Sketchbook pro/whatever to how they implemented them in Corona (from a high level overview)?

TIA,
Chris
[import]uid: 146966 topic_id: 34585 reply_id: 334585[/import]

I create my levels (just big .png files) on Pixelmator and then add physics to them with separate platforms using a generic level building algorithm someone posted a while ago. I just overlap the image with rectangles and then change the .isVisible to false.

That way you have one big image with an invisible physical platform environment on top of it.

It seems to work, memory wise and level wise. [import]uid: 147322 topic_id: 34585 reply_id: 137529[/import]

Caleb, what exactly do you use for that “level building algorithm” ? [import]uid: 206803 topic_id: 34585 reply_id: 137535[/import]

Thanks for the reply Caleb. I can visualize how that would work if you had a “flat” ground (where the invisible rectangles could hover on top of them, but I can’t see how that would work if the ground for the game was more dynamic (i.e. sloped hill the character must walk up).

What do you mean by a level building algorithm … is that referring to an “endless running” type game where the ground is randomly generated as you go?

Thanks,
Chris [import]uid: 146966 topic_id: 34585 reply_id: 137540[/import]

Sorry, I should have been more clear.

There was a sample somewhere that had a block of code to position things. You’d move your thing around and it would print the code for that. I made a couple of changes and used it for my levels - the only thing is, I’ve deleted it now, and I can’t find the piece of code.

So I decided to make my own for that - Idit.

Caleb [import]uid: 147322 topic_id: 34585 reply_id: 137762[/import]

I create my levels (just big .png files) on Pixelmator and then add physics to them with separate platforms using a generic level building algorithm someone posted a while ago. I just overlap the image with rectangles and then change the .isVisible to false.

That way you have one big image with an invisible physical platform environment on top of it.

It seems to work, memory wise and level wise. [import]uid: 147322 topic_id: 34585 reply_id: 137529[/import]

Caleb, what exactly do you use for that “level building algorithm” ? [import]uid: 206803 topic_id: 34585 reply_id: 137535[/import]

Thanks for the reply Caleb. I can visualize how that would work if you had a “flat” ground (where the invisible rectangles could hover on top of them, but I can’t see how that would work if the ground for the game was more dynamic (i.e. sloped hill the character must walk up).

What do you mean by a level building algorithm … is that referring to an “endless running” type game where the ground is randomly generated as you go?

Thanks,
Chris [import]uid: 146966 topic_id: 34585 reply_id: 137540[/import]

Sorry, I should have been more clear.

There was a sample somewhere that had a block of code to position things. You’d move your thing around and it would print the code for that. I made a couple of changes and used it for my levels - the only thing is, I’ve deleted it now, and I can’t find the piece of code.

So I decided to make my own for that - Idit.

Caleb [import]uid: 147322 topic_id: 34585 reply_id: 137762[/import]

My current workflow is this:

 

  1. Draw art in Inkscape

  2. Export to PNG and stitch into sprite sheets using a lua script that calls inkscape and ImageMagick command lines

  3. Assign physics using PhysicsEditor

  4. Key in positions of each object in the code in my episode file

 

  1. isn’t all that hard, but keying x and y positions is a far cry from drag and drop, and on some levels I’ll have 20-30 objects to place.  For the first set of episodes, the background image will be the same, so I just need a better way to place targets, obstacles, etc., which can be either static or dynamic, single image or sprite sheet, on a single screen.

 

The Karnac level editor looks interesting, but I’m thinking I have custom itches it may not scratch, and I don’t want to plunk down $100 for something that leaves me short of my goal.    Plus, I’d have to start using SpriteGrabber and TexturePacker, and I’m already quite comfortable with my tool chain.    I also have code on top of the Corona sprite code that assigns special meanings to certain frames (1 is the normal image, 2-n is the animation to play when it’s falling, n+1 to m is the animation to play when it’s smashing, etc.) and I don’t want to rewrite/refactor that stuff.

 

Might be easier to write my own quick and dirty drag/drop tool to place things.     

Decided to write my own.   I now have a drag-n-drop editor that allows me to choose from a palette of my game sprites and drag them around the screen to place.   Can rotate, set body type (static v. dynamic), and duplicate for quick level construction.    Hit the publish button and it spits out a level data .lua file that my game code reads.    I also added a “simulate” button to launch game play with the current level under construction.

Not sure how much use a general purpose editor would have been for me.   Most of the information for each game object lives in a static sprite table (size, num frames, point values, etc.), so this editor is completely proprietary and depends on what I had built to date and pretty much just allows me to place and arrange objects.

Anyway, kind of a fun exercise and really useful.   Sure beats the painstaking cycle of hardcoding object positions/rotations and testing.

My current workflow is this:

 

  1. Draw art in Inkscape

  2. Export to PNG and stitch into sprite sheets using a lua script that calls inkscape and ImageMagick command lines

  3. Assign physics using PhysicsEditor

  4. Key in positions of each object in the code in my episode file

 

  1. isn’t all that hard, but keying x and y positions is a far cry from drag and drop, and on some levels I’ll have 20-30 objects to place.  For the first set of episodes, the background image will be the same, so I just need a better way to place targets, obstacles, etc., which can be either static or dynamic, single image or sprite sheet, on a single screen.

 

The Karnac level editor looks interesting, but I’m thinking I have custom itches it may not scratch, and I don’t want to plunk down $100 for something that leaves me short of my goal.    Plus, I’d have to start using SpriteGrabber and TexturePacker, and I’m already quite comfortable with my tool chain.    I also have code on top of the Corona sprite code that assigns special meanings to certain frames (1 is the normal image, 2-n is the animation to play when it’s falling, n+1 to m is the animation to play when it’s smashing, etc.) and I don’t want to rewrite/refactor that stuff.

 

Might be easier to write my own quick and dirty drag/drop tool to place things.     

Decided to write my own.   I now have a drag-n-drop editor that allows me to choose from a palette of my game sprites and drag them around the screen to place.   Can rotate, set body type (static v. dynamic), and duplicate for quick level construction.    Hit the publish button and it spits out a level data .lua file that my game code reads.    I also added a “simulate” button to launch game play with the current level under construction.

Not sure how much use a general purpose editor would have been for me.   Most of the information for each game object lives in a static sprite table (size, num frames, point values, etc.), so this editor is completely proprietary and depends on what I had built to date and pretty much just allows me to place and arrange objects.

Anyway, kind of a fun exercise and really useful.   Sure beats the painstaking cycle of hardcoding object positions/rotations and testing.

@davemikesell I have been doing the same thing in HTML and Javascript.

Javascript loads (or has hardcoded) a JSON schema of the game objects’ properties, allowing dynamic generation of form inputs to change the values therein.

The biggest hurdle has been dealing with executable code in the levels themselves - this makes loading and saving to and from web browser difficult or impossible - so I had to develop a markup language to tell my game code what functions to call and with what arguments, after having met which conditions, etc. and that was no fun. I wonder if there is a better way.

I have draggable objects as well - some bugs with transforming coordinates between browserspace and gamespace coords though, especially in parallax-scrolled items, but in the editor one can drag to place, rotate, or scale the items.

Layer controls coming along.

You could also try Level Director (http://www.retrofitproductions.com/level-director) which is a drag and drop level designer to work on windows.

I’ve been using it for about a year now and couldn’t be without it, you simply add your assets or import them from texturepacker (also supports physicseditor) and add them to your layers, export it, done.

It supports parallax scrolling, complex multi-body physics with a built-in editor, animation editor and even a collision editor.

I have also found the support from the developer to be amazing with regular updates, and responses and fixes within a day!

@davemikesell I have been doing the same thing in HTML and Javascript.

Javascript loads (or has hardcoded) a JSON schema of the game objects’ properties, allowing dynamic generation of form inputs to change the values therein.

The biggest hurdle has been dealing with executable code in the levels themselves - this makes loading and saving to and from web browser difficult or impossible - so I had to develop a markup language to tell my game code what functions to call and with what arguments, after having met which conditions, etc. and that was no fun. I wonder if there is a better way.

I have draggable objects as well - some bugs with transforming coordinates between browserspace and gamespace coords though, especially in parallax-scrolled items, but in the editor one can drag to place, rotate, or scale the items.

Layer controls coming along.

You could also try Level Director (http://www.retrofitproductions.com/level-director) which is a drag and drop level designer to work on windows.

I’ve been using it for about a year now and couldn’t be without it, you simply add your assets or import them from texturepacker (also supports physicseditor) and add them to your layers, export it, done.

It supports parallax scrolling, complex multi-body physics with a built-in editor, animation editor and even a collision editor.

I have also found the support from the developer to be amazing with regular updates, and responses and fixes within a day!