Fake perspective (Y sorting) - how to handle elevation

Post reply
0 favourites
  • 5 posts
From the Asset Store
Easy Isometric
$19.99 USD
EasyIsometric behavior helps creating an “isometric” perspective with 2D assets.
ForConstruct's avatar
ForConstruct

  • Hey guys. I've been wrestling with a tricky problem and am wondering if anybody's got any bright ideas.

    I'm working on a 3/4 perspective top-down game (eg. like A Link To The Past, or Stardew Valley) where the perspective is faked by sorting objects by Y value (a pretty standard technique to allow the player to walk in front of / behind trees, rocks, coins, etc as necessary).

    This is working well, but now I'd like to add elevated platforms... and I'm getting confused.

    I know a lot of old 2D games would completely fake the effect with art (eg the "elevated" parts wouldn't really be elevated, they would just be drawn to look that way):

    The reason why I don't want to do that is that in those games, the back wall of the cliff would be a hard barrier that you couldn't walk behind, which kind of breaks the visual effect imho.

    Ideally, I'd want the player to be occluded behind the cliff when standing behind it, but also to be able to stand on top of it - and to have all other game objects correctly Y-sorted at the same time.

    Here's a (very quick and scribbly) image to illustrate what I mean (objects drawn in red would be subject to Y-sorting):

    I considered making the cliff with its 'elevated' ground a separate layer above the normal ground layer, and moving the player object between layers based on invisible triggers when they enter or exit the ramp. Then each layer would have correctly Y-sorted objects at each level of elevation.

    Except that wouldn't work for Y-sorted objects on the ground plane that would need to occlude the elevated ground (such as the foreground tree in the illustration above).

    Another option might be to do everything on the same layer, but treat the cliff itself (or at least the back wall) as something that itself needs to be Y-sorted. I don't think this would work as Y-sorting is based on the y-sorted object's origin point, so anything "on top" of the cliff (such as the coins illustrated above) would be liable to get sorted behind the cliff since the y-value would technically be lower than that of the cliff base. And so on.

    I really have no idea what the best way of doing this is and would be extremely grateful to anybody who has any ideas?

    Many thanks...!

  • Generally speaking, you can get the effect you want by making the origin of every sprite at it's base, or lowest point.

    This will not work for complex shapes though, which will require stitching together multiple simple shapes.

    Elevation adds another headache, where you won't be able to use automatic z sorting by y position at all. The simplest case being that the player can have the possibility of being either on top of the cliff or behind it at the exact same single x/y coordinate.

    That said, there is a reason those 2d tilemaps based games are designed the way they are, in that it's probably not worth the extra complexity and buginess for something that might not be actually desirable for the user in terms of gameplay, even though the developer might think it's cool (to have the player character or other objects be occluded by terrain).

    The best way to do implement this imho is to actually learn and work with 2d artwork inside a 3d framework/engine instead of trying to simulate too much 3d in a 2d engine. You're just going to run into more and more technical issues to get frustrated with and stuck and waste time trying to find solutions that may or may not exist to begin with instead of actually working on making the rest of your game.

  • Thanks for taking the time to reply - I appreciate it. However, I must admit I was hoping for answers other than "it's a headache" (yes I know that 😛) and "you shouldn't bother trying to do this in 2D in Construct" (seems a bit defeatist?).

    Is there really no good way of doing this? I find that unlikely. It seems like it would be some combination of clever logic, y-sorting and layer manipulation. I just can't seem to think of the perfect mix. 🤔

    Thanks for trying anyway.

  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads

  • Perhaps eleanorjmorel could provide some direction? They have a wonderful demonstration of it made in construct here: strawberrypunch.com

  • If you keep track of the z position of the object you may be able to sort with something like this:

    Sprite: set sorting to sprite.y-sprite.z+1000*sprite.z

    Z sort sprite by variable sorting

    That’s what you’d call absolute sorting. By subtracting the z it sorts them as if everything was on the ground. The 1000 gives more weight to the z so it’s drawn above.

    You may need to tweak the equation. I forget is z sorting is low to high or vise versa.

    This method works well when the objects are all the same z height and z position is on one of those levels. I don’t think it works great when transitioning z position.

    Another option is relative sorting.

    Here’s a recent topic with some ideas:

    construct.net/en/forum/construct-3/how-do-i-8/proper-gridless-isometry-161391

Post reply
  • 5 posts
Return to board index
Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)