2d side scroller slope physics and collisions

Question

In old 2d games such as double dragon, streets of rage etc. where the player could move “up and down” on the y-axis to give an illusion of depth (as opposed to something like Mario) how were slopes and stairs handled along different points on the y-axis to give the appearance of still moving in a straight line?

For instance in the above picture would you set collision masks where the green lines are? Then imagine the characters are the red and blue lines respectively, how would you handle them in effect being moved “down” by gravity when in fact there isn’t really any gravity? For the top line I assumed when it hit the green line, rather then stopping or bouncing back on the x-axis you’d just nudge them down and continue the x movement?

I understand how this could be completed in 3D but I’m perplexed how this would’ve been achieved in purely 2d environments. Or maybe I’m imagining slopes/stairs in these old games...

I’m working in SpriteKit, so any ideas specific to that would be great but just understanding how this was accomplished theoretically in the first instance would be great.

Thanks

edit - after some thinking I don't think my 'collision' theory would work going down the slope for the blue line as it wouldn't be colliding unless it came off it's "straight" path, and also the problem would be reversed when going 'up' the slope.

so for instance in the above image where the characters are moving up the slope the other way I'm curious how this would have been handled? My thoughts now are, would the darker grey area with the "1" on it, actually be an entire entity itself or a collision mask? You'd then work out based on the characters "Y entry" point on to it (either at the top or the bottom) and based on their direction, where their 'Y' point should then be?

Answer 1

It's really no different than sloped 2d case

Consider the following picure.

In this instance, to move over the ramp you would just move using the slope of the ramp. Easy right? y = mx+b kind of stuff.

Now look at this picture.

Notice anything different? Actually notice what really isn't different? The only thing we changed is that we extended this ramp out, but straight in one dimension.

So lets think about this, would anything change about how you moved if you started walking from the top right corner on end of the road to the top left corner of the other from the first picture to the second?

No, it's as if there wasn't an "extension into 3D" at all, you move the character by the same slope and same amounts as you would have in the first picture.

But what about if you moved down a bit?

Notice how the slope you have to move and by how much you have to move by while on the ramp does not change, and the x position where you encounter the ramp doesn't change either. So what does change? The only thing that changes is your Y position, everything else is the same.

Notice that this is the exact same scenario as the first case except the Y has changed.

Now how might one implement such a feature? There's a bunch of ways, but one way might be to assign a slope value to each tile, or something along those lines. On most tiles, your slope would be 1 x over 1 y, or 1, so your character will just move horizontally, but when it slopes, it might be 1/2, so when your character moves, x moves + 1/2 and Y moves 1/(1/2) or 2 units. If you aren't supposed to move in an area (ie to an area which may be below the ram) you could just block movement to those areas via what ever collision you have in your game.

I have no clue if you are using tiles or are just rendering objects or something else. If rendering objects you can just assign the slope to the object. You can use collision checks with the bottom of your character and the sloped object to figure out the slope you should be using.