Better visualization of isometric layers

Started by
4 comments, last by menyo 8 years, 4 months ago

I'm not sure where to post this but I guess it has all to do with design so I post it here.

I am creating a multilayered isometric map. Each tile has a floor and solid wall that can be removed. First I had a basic template image of the wall and floor and when a wall was removed it was impossible to see the difference at the SE and SW edge. With my new tiles it's a lot better but still not very clear. Are there special techniques for this? I have also made each layer below the current layer darker to create some sort of extra depth.

To improve this I am thinking about creating a outline only on the side where there is a height difference but this requires me to invest a lot of time in art and code and I'm not sure of the results. Another option would be to increase the wall height so they do not line up what good, this only works for X levels though but with the darkening this should not matter. However i do not want to make my walls to high since I want to add ramps that are not too steep.

Tile dimensions:

Width: 64.

Depth: 32.

Wall height: 32.

Floor height 8.

Same goes for my tile selector. It's not easy to see which tiles are actually picked. My selector image is the height of the floor and the wall together. Some sort of building grid would help but that has to go under the floor and walls and thus gets obscured.

I'm sure that with more different tiles things get easier to see but I'm very interested in common techniques used.

Advertisement

By experimenting some more I have gotten better results. I now show the cursor by coloring the tile wall or floor. When there is no floor I currently show a transparent default block but I'm planning to show some form of grid with some form of visual element that goes down until there is a tile with a floor. It's already a lot more user friendly but I am still concerned where there is a change in z level. I like to pronounce that more.

Another option would be to increase the wall height so they do not line up what good

I agree the perfect alignment of the tiles at different levels is a problem. Instead of making the walls higher, did you consider making them lower?

Rollercoaster tycoon 1 & 2 have what you have now, and the result is that a down-slope facing away from the player is completely invisible. Transport Tycoon Deluxe (and OpenTTD) have a reduced height, and down-slopes are still visible.

As for solutions, rollercoaster tycoon has the problem of building mid-air, where you have absolutely no idea (in my experience) how high or low you are. They used height labels at tracks paths and land, so you could figure out height. They also have an underground mode, where tiles were mostly transparent, and like you they have an indicator of the xy position at the floor at all times.

It was probably all that you could do at the time, but I found it very complicated to build things in it. On the other hand, I have seen very big and complicated designs for this program, so it seems other people had less problems.

Some ideas to consider (I haven't tried any of this), maybe it would be nice to cut away things that are in front of the cursor. Another idea I have is to have a kind of rotating laser light. Imagine that at your cursor you have a horizontal rotating laser, and it puts a (eg red) line at all surrounding walls at the same height.

That will fail in mid-air, but maybe add some kind of land measurement pole? Imagine a thiny pole going up from some keypoints at the grid, and the laser highlights its height at the pole, so you can see how much higher you are than the ground below the pole. Obviously, nothing prevents you from adding poles below some floor too.

I've tried to solve similar problem with cursor for my editor.

So far most clean version is to draw final outline (how terrain should look) with solid colored lines.

Green lines shows places where height will be added or not altered, red lines shows places where height will be lowered (material cut). Also there's dashed lines that show difference between new and current terrains - green dash is above current terrain, red dash is below current terrain.

[attachment=29898:brush.png]

The original X-Com solved some of this really well. It had a couple of display modes when looking at the map. The default view had a current height that you could set and the game would render everything at that height and lower. So if you were at level 2, and there was a three story building, it would show you level two of the building and any parts of level 1 that weren't covered up. Also, the cursor had a faded out version of itself that went all the way to the ground to give you a reference for its location. Here's a picture:

http://www.ibiblio.org/GameBytes/issue19/greviews/ufo2.gif

You might also want to check out Gnomoria first-hand or watch some videos on YouTube to see how they did it.

- Eck

Edit: Doh - I see you already stumbled across the x-com cursor trick. Ah well. :)

EckTech Games - Games and Unity Assets I'm working on
Still Flying - My GameDev journal
The Shilwulf Dynasty - Campaign notes for my Rogue Trader RPG

Another option would be to increase the wall height so they do not line up what good

I agree the perfect alignment of the tiles at different levels is a problem. Instead of making the walls higher, did you consider making them lower?

Rollercoaster tycoon 1 & 2 have what you have now, and the result is that a down-slope facing away from the player is completely invisible. Transport Tycoon Deluxe (and OpenTTD) have a reduced height, and down-slopes are still visible.

As for solutions, rollercoaster tycoon has the problem of building mid-air, where you have absolutely no idea (in my experience) how high or low you are. They used height labels at tracks paths and land, so you could figure out height. They also have an underground mode, where tiles were mostly transparent, and like you they have an indicator of the xy position at the floor at all times.

It was probably all that you could do at the time, but I found it very complicated to build things in it. On the other hand, I have seen very big and complicated designs for this program, so it seems other people had less problems.

Some ideas to consider (I haven't tried any of this), maybe it would be nice to cut away things that are in front of the cursor. Another idea I have is to have a kind of rotating laser light. Imagine that at your cursor you have a horizontal rotating laser, and it puts a (eg red) line at all surrounding walls at the same height.

That will fail in mid-air, but maybe add some kind of land measurement pole? Imagine a thiny pole going up from some keypoints at the grid, and the laser highlights its height at the pole, so you can see how much higher you are than the ground below the pole. Obviously, nothing prevents you from adding poles below some floor too.

I do not want to make my walls lower because the height of the wall should represent the same height as a average living room. If I make them lower I have to shrink my character too much.

I have thought about the approach of TTD but I need cliffs (straight down) as well so this would not work anyway. But this is no issue anymore in the current version, I have added complete rotation in 90 degree steps. The tile picking only takes place on a single level, if the player want to select a "cube" of more levels it can go up and down levels while selecting. I do need to make see trough possible for convenience.

The laserlight is great, I have seen this work on several other games where you only work on a single height at a time.

I've tried to solve similar problem with cursor for my editor.

So far most clean version is to draw final outline (how terrain should look) with solid colored lines.

Green lines shows places where height will be added or not altered, red lines shows places where height will be lowered (material cut). Also there's dashed lines that show difference between new and current terrains - green dash is above current terrain, red dash is below current terrain.

attachicon.gifbrush.png

I still find the red lines very confusing. But if I see correctly you game works with a Tile[][] map and each tile (or corner) has a height. My game has a Tile[][][] map and each tile has a floor and a wall. It's really hard to come up with something that works and is user friendly for these types of games. But I should take advantage of the fact that each floor or wall in my game is the same height as any other.

The original X-Com solved some of this really well. It had a couple of display modes when looking at the map. The default view had a current height that you could set and the game would render everything at that height and lower. So if you were at level 2, and there was a three story building, it would show you level two of the building and any parts of level 1 that weren't covered up. Also, the cursor had a faded out version of itself that went all the way to the ground to give you a reference for its location. Here's a picture:

http://www.ibiblio.org/GameBytes/issue19/greviews/ufo2.gif

You might also want to check out Gnomoria first-hand or watch some videos on YouTube to see how they did it.

- Eck

Edit: Doh - I see you already stumbled across the x-com cursor trick. Ah well. smile.png

Love the fact you mention X-com, I used to play that the whole weekend without sleeping :D. My game works basically the same if the player is on level 20 it can only see from level 20 and down. Since most of my game is indoor it's not practical to have a "See all view" since it will obscure everything on the current layer with stuff on the top layer. I do need a see through toggle if there are important item or tiles obscured but I guess this is easily implemented.

----

Anyway, thanks all. I guess this is more of a experimenting thing to get right. I am currently very happy with the isometric engine I have. It only renders whats visible for each of the 4 angles and I currently have a 256 x 256 x 128 map loaded in. However this is eating the brain of my computer (just the map is almost 1gb of memory) so I have to cut that up in chunks eventually.

But then pathfinding is going to be a problem since not all of these chunks are available. So I will be keeping a higher hierarchical weighted graph in memory that creatures outside the player view can use for traveling. Say a enemy spawns on the edge of the map and needs to go to a player unit. It will just spawn on a designated node of the map then it looks up a path on this higher level graph and travels from node to node. If the player does move the camera to the chunk where the creature is at it will check on which tile the creature should be. A bit of a brain breaker for me but my prototype on a simple 2D map is looking good.

In the end this might be another of my too ambitious projects but I'm having a ton of fun with it.

This topic is closed to new replies.

Advertisement