To use tiles or pre rendered images for game graphics

Started by
16 comments, last by Ravyne 8 years, 2 months ago

Ok this is kind of an odd request for advice but I had great success in using this community last time I needed some help so here I am again. I'm working on my platformer style game for my indie company and I'm at the point now where I'm trying to figure out how I want to handle the actual levels for the game. I'm really getting hung up on this and have no other programmers to talk this through so I'm hoping to talk this out with you lovely people. So the game is going to use parallax scrolling to give depth to the actual level, it is going to be a side scroller and the player controls the main character in the game. In the level there will be buildings the player can go in and out of as well as points on each level that will allow the player to move between other levels for that specific map. Its a city street grid if you are wondering. The thing that I'm running into is trying to figure out what the best way to display the the levels, do I use tiles to build each layer of the level and scroll those or do I use pre rendered images scrolled on top of each other.

I know that this is ultimately my decision and I should be the one to make it but I am hoping to get people's thoughts on the topic, to talk it through online and this will hopefully help me make a final decision.

Thanks in advance for any and all thoughts on the topic and if you need more info from me please ask and I will be glad to add more info.

Darcmagik

Of all the things I've lost I miss my mind the most.

Advertisement

The thing that I'm running into is trying to figure out what the best way to display the the levels, do I use tiles to build each layer of the level and scroll those or do I use pre rendered images scrolled on top of each other.

Why not both?

Tiles, repeated backdrops, and freely placed images over those backdrops and tiles.

This is why I love this community I get quick and quality responses. So lets explore this idea of how I would do it that way then my levels will consist of a backdrop layer we will call it layer 0 that will be like a distant city skyline, layer 1 will be a cloud layer, this layer will scroll on its own without the player movement. Layer 2 is the actual buildings of the level that layer will move at the same speed as the player if that makes sense with layer 0 and 1 moving at different speeds to give the parallax scrolling effect I'm looking for. The player and other stuff will get rendered on top of layer 2. I guess yeah that would probably work I could use tiles for Layer 2 which would allow me to use various tile values as trigger points to distinguish what spots are doors to buildings. Hmm.... I will have to explore this and try it.

Darcmagik

Of all the things I've lost I miss my mind the most.

In my own game - which is a 2D overhead RPG - I have multiple different layer types, and each layer type can go into any position.

However, you might not need that flexibility/complexity. Instead, I'd start with something like this and tweak it as I go:


//Pseudocode:
struct World
{
     Array<Layer> layers;
};
 
struct Layer
{
     Backdrop backdrop; //Drawn first.
     Tilemap tilemap; //Drawn second. Can collide with.
     Array<Decal> decals; //Draw third.
 
     Array<Entity> activeEntities;

     //This controls player-movement-related scrolling. i.e. you multiply this against the player's position to get the layer's scroll position.
     //For example, you may want a layer FIXED to the viewpoint with NO scrolling no matter how much the player moves. Like sun rays.
     Vector2f parallax;
};

//What I call a large repeating image that scrolls, and can be UNDER (i.e. background) or OVER (i.e. foreground) a player
struct Backdrop
{
     ImageID appearance;

     //This is the scrolling that occurs automatically, without the player moving. Things like clouds or mist.
     Vector2f scrollSpeed;
};

//What I call a freely-placed, freely-rotated, freely-scaled image
struct Decal
{
     Position position;
     float scale;
     float rotation;
     ImageID appearance;
};
 
struct Tile
{
     Shape collisionShape;
     ImageID appearance;
};
 
struct Tilemap
{
      Grid<Tile> tiles; //Note: Breakable/interactive tiles are entities pretending to be tiles, as are invisible triggers, movable doors, and so on.
};

[Edit:] Forgot to include the Backdrop definition.

I just might have to use that in my project I like that idea for this usage.

Thank you.

Darcmagik

Of all the things I've lost I miss my mind the most.

From your description, it seems only your "layer 2", the buildings that the player interacts with, has a good reason to be an actual tile map (subdivided into a grid, with specific tile edges having a role in the game as triggers or impassable walls); the decorative graphics in the background could use tile-based assets (buildings with a regular structure in particular), but they can, just as easily, contain independent and independently moving sprites (e.g. many separate clouds, each with its own velocity and animation, rather than a rigid cloud layer; or moving cars and people among the fixed background buildings).

Omae Wa Mou Shindeiru

In my own game - which is a 2D overhead RPG - I have multiple different layer types, and each layer type can go into any position.

However, you might not need that flexibility/complexity. Instead, I'd start with something like this and tweak it as I go:


//Pseudocode:
struct World
{
     Array<Layer> layers;
};
 
struct Layer
{
     Backdrop backdrop; //Drawn first.
     Tilemap tilemap; //Drawn second. Can collide with.
     Array<Decal> decals; //Draw third.
 
     Array<Entity> activeEntities;

     //This controls player-movement-related scrolling. i.e. you multiply this against the player's position to get the layer's scroll position.
     //For example, you may want a layer FIXED to the viewpoint with NO scrolling no matter how much the player moves. Like sun rays.
     Vector2f parallax;
};

//What I call a large repeating image that scrolls, and can be UNDER (i.e. background) or OVER (i.e. foreground) a player
struct Backdrop
{
     ImageID appearance;

     //This is the scrolling that occurs automatically, without the player moving. Things like clouds or mist.
     Vector2f scrollSpeed;
};

//What I call a freely-placed, freely-rotated, freely-scaled image
struct Decal
{
     Position position;
     float scale;
     float rotation;
     ImageID appearance;
};
 
struct Tile
{
     Shape collisionShape;
     ImageID appearance;
};
 
struct Tilemap
{
      Grid<Tile> tiles; //Note: Breakable/interactive tiles are entities pretending to be tiles, as are invisible triggers, movable doors, and so on.
};

[Edit:] Forgot to include the Backdrop definition.

Why use structs and not a class?

What will you make?

In my own game - which is a 2D overhead RPG - I have multiple different layer types, and each layer type can go into any position.

However, you might not need that flexibility/complexity. Instead, I'd start with something like this and tweak it as I go:


//Pseudocode:
struct World
{
     Array<Layer> layers;
};
 
struct Layer
{
     Backdrop backdrop; //Drawn first.
     Tilemap tilemap; //Drawn second. Can collide with.
     Array<Decal> decals; //Draw third.
 
     Array<Entity> activeEntities;

     //This controls player-movement-related scrolling. i.e. you multiply this against the player's position to get the layer's scroll position.
     //For example, you may want a layer FIXED to the viewpoint with NO scrolling no matter how much the player moves. Like sun rays.
     Vector2f parallax;
};

//What I call a large repeating image that scrolls, and can be UNDER (i.e. background) or OVER (i.e. foreground) a player
struct Backdrop
{
     ImageID appearance;

     //This is the scrolling that occurs automatically, without the player moving. Things like clouds or mist.
     Vector2f scrollSpeed;
};

//What I call a freely-placed, freely-rotated, freely-scaled image
struct Decal
{
     Position position;
     float scale;
     float rotation;
     ImageID appearance;
};
 
struct Tile
{
     Shape collisionShape;
     ImageID appearance;
};
 
struct Tilemap
{
      Grid<Tile> tiles; //Note: Breakable/interactive tiles are entities pretending to be tiles, as are invisible triggers, movable doors, and so on.
};

[Edit:] Forgot to include the Backdrop definition.

Why use structs and not a class?

These seems to be just data structures - so structs are the best way to define those. No need for classes which is great ;-)

Why use structs and not a class?

Since classes and structs (in C++) are basically identical (except whether they are private or public by default), it seems to be pretty common to use structs for bundles of data, and classes when you're bundling logic with data.

In actual code, I'd make World a class, and probably Layer and Entity as well. But the others, being (mostly) static blocks of data, I'd probably leave as structs.

But mostly I was just giving a pseudo-code example of how he can layout the data, so I didn't put much thought into it. smile.png

Why use structs and not a class?

Since classes and structs (in C++) are basically identical (except whether they are private or public by default), it seems to be pretty common to use structs for bundles of data, and classes when you're bundling logic with data.

In actual code, I'd make World a class, and probably Layer and Entity as well. But the others, being (mostly) static blocks of data, I'd probably leave as structs.

But mostly I was just giving a pseudo-code example of how he can layout the data, so I didn't put much thought into it. smile.png

I never got the point of structs. I mean, it's literally just like a class, except it can't do anything (by which I mean have methods, as far as I'm aware). What's the point of that? What can it be used for?

What will you make?

This topic is closed to new replies.

Advertisement