Implementing curved paths for objects in 2D platformers

Started by
14 comments, last by JoeJ 1 year, 11 months ago

I have code to convert a series of points (a trajectory) into a Bézier curve. The key thing is that my code takes an arbitrary number of points, rather than, say, 4 points.

Thanks for the idea, but I'm not really sure how that would help… I can already create a Bezier curve. The question is more about how to replicate the motion of the boss in the video - how to make it follow a certain path and how to control the speed.

Advertisement

If you have a curve that takes a parameter t, and outputs a position, you can do this.

Boss has three variables:

  • current curve
  • current t value (used to read some position on the curve)
  • current target position

Each frame:

  • if the target position is closer than the boss will move in one frame at decided boss velocity, increase t by some small value, and read out a new target position from the spline. If it's still not far enough, keep increasing t until you get one that's far enough, or run to the end of the spline.
  • move the boss towards the target position with the designated velocity

Once you're at the end of the spline, pick some new path for the boss, reset t and start over.

enum Bool { True, False, FileNotFound };

Himura78 said:
In the video, at around 1 minute, the boss seems to follow an elliptical or maybe a capsule sort of shape… how would this be done with arcs?

It looks like the cross section of a capsule, which we can compose from line and arc segments:

Such arc segments were often used, e.g. in Super Mario games, in combination with tiles. Having a 90 degree arc tile, and 3 variants rotated in 90 degree steps, so you could form a perfect circle or connect them with straight lines while still working with traditional tiles:

There probably is no more need for tiled restrictions today. But for retro games, maybe useful to be authentic.

taby said:
Will this code help?

I fail to imagine how it works, but likely it has the same problem of velocity depending on tangent length.
If we have a spline with differing tangent lengths:

… we get longer segments (so faster speed) near long tangents, but short and slow nearby short tangents.
That's often what we want, e.g. we get higher tessellation where the curve has more detail.

But if we want to move a sprite or camera along the curve with constant velocity, we have the mentioned problem.

Yes but how many control points does your Bézier curve consist of?

Yay Mario.

taby said:
Yes but how many control points does your Bézier curve consist of?

I have never seen any tool exposing bezier curves with another number than 4.
That's intuitive to the artist. The curve touches the knots, and the handles define the tangent precisely. Modifying a knot and its handles does not affect other knots.
If we add a 5th control point, the curve neither passes through, nor can we visualize it's affect on tangent. The effect also is subtle, so the loss on more confusing amount of control points is higher then the win of having more control on the curve.
Thus, for manual design work, anybody probably prefers just 4 points, but adding one more knot where needed.

It's also a bit restricted to 2D artwork. For smooth parametric surfaces in 3D, bezier patches (as exposed by OpenGL) are not good enough. We need something like NURBS, which is much more complex both to author and to program.
But if we just want paths / curves in 3D space, no smooth surface, those simple curve types are fine.

The only exception to 4 control points i know is Quake 3, which used patches made from curves of only 3 control points. ('quadratic bezier curve', afaik)
That's a very interesting curve for us, because it has an analytical solution to finding the closest point on the curve, and i guess also to calculate its length.
But it's more difficult and restricted to do manual design with that, because one control point and its handles are no longer independent form neighboring control points. A tool could work like this:

We draw the squares (which become handles or internal control points of a curve segment), and the tool calculates the knots (circles) to be between them.
This works, but dragging a square affects 3 curve segments, so we likely end up nudging points a lot to compensate for unwanted side effects of a change. Also, modelling sharp corners would have no intuitive solution here.

Drawing bezier curves requires some practice, and all my artist colleagues at work failed to do this efficiently, with a minimum set of points, which is needed to get a smooth result.
Personally i had an advantage just because i'm a geek, and was willing to observe how they might work in a mathematical sense. E.g., i have figured out a curve only is really smooth if both handles on a knot are on the same line and have the same length.
But it still took years of practice to get a good intuition on where to place the next point, so it really is important we give artists the most intuitive solution if manual artwork is involved. That's clearly 4 points.

This topic is closed to new replies.

Advertisement