I love reading art tutorials here, and I love writing, and I’d really like to write some art tutorial myself. There’s just one problem: I can’t actually draw anything and don’t have any useful art skills at the moment. So instead, here’s a tutorial on how to draw a Bézier curve by hand. Bézier curves are the standard curve for vector drawing computer apps, and with this simple method, you can also use the for hand-drawn stuff. Note: There is no reason why you would ever want to do this.
First, draw four points and number them 1-4 (or ABCD if you prefer). For best results, the points should be different from each other and shouldn’t be in a straight line, but the process will work either way.
Four points are nice: The first and last points will be the start and end of the curve, and points two and three end up working out as „handles“ that determine the shape. Note that this „handle“ thing is just how it works out; mathematically, all points are equal.
Draw straight lines between each pair of points. It’s probably okay to eyeball this. I personally used the line smoothing in Procreate because I’m that bad at drawing a long straight line, but don’t worry about it too much.
Fun fact: The Bézier curve was invented in the 1960s for the specific purpose of drawing french cars of the era on computers, for the first Computer Aided Design systems. Extra fun fact: This exact thing literally happened twice.
For each of the lines, find and mark the midpoint. You can use circle and straight edge, or a Geodreieck (which is apparently something the english speaking world does not have!?), but again, eyeballing it is probably good enough.
The curve was first invented by Paul de Casteljau, who was working for Citroën. His company treated the results as a company secret. Shortly afterwards, Pierre Bézier invented the same curve again, working for Renault, because he didn’t know about de Casteljau’s work. Renault allowed him to publish his results, and so it’s his name that’s associated with the curve.
Connect the three midpoints with straight lines again, in order. The 1,2-Midpoint with the 2,3-one, the 2,3-midpoint with the 3,4 one.
While I told you to draw four points earlier, the method will work for any non-negative number. However, the results for 0, 1 and 2 points are boring (nothing, a point and a straight line respectively), and for more than four points it gets annoying to predict what each point will do to the curve. There are some cases where three points are used, some font formats I think, but four is the sweet spot that gained universal adoption.
Find the two midpoints of the two new lines again, and connect them, again. Then find the midpoint of that. This point is the midpoint of the overall curve.
All drawing software will logically separate the points of a four-point Bézier curve for you: The first and last are the endpoints of the curve; points 2 and 3 are “handles” that help you manipulate the shape of the curve. That is a useful way of thinking about it. However, from a mathematical point of view, that’s kind of just a coincidence; all points are treated the same when it comes to drawing.
Now change color or open a new layer or whatever. We just divided the problem and the curve in two. The points 1, 1-2, 1-2-3 and the curve midpoint are now exactly half of the original curve. Do the same procedure to them to get the 1/4 point of the curve. Then do the same procedure to the curve midpoint, and the midpoints 2-3-4, 3-4 and 4. (You can get a friend to help you here and do this at the same time)
The method I’m doing here is a recursive version of de Casteljau’s algorithm (see, he wasn’t entirely forgotten). If you write down the coordinates and do the maths, then drawing a Bézier curve is just a lot of stupid multiplying, adding, and sometimes even subtracting. Using this algorithm is putting these additions and multiplications in an order that makes geometric sense and that you can actually draw. This is absolutely something I stole from Wikipedia by the way.
You now have four new Bézier curves. Do the same procedure to them again.
The great thing about de Casteljau’s algorithm, especially when you apply it like I do, is that it’s basically just finding averages or midpoints, a lot. If you’re off by a few millimetres, which you will be seeing how I’m telling you to eyeball everything, that doesn’t really hurt a lot. The curve may be off by a bit, but it won’t create wide swings or sharp corners or parts that don’t match. It literally all averages out in the end.
If you’ve been following along, you now have eight Bézier curves and are incredibly annoyed at me and some french computer scientists. How long do you have to keep this up? That largely depends on when you think it’s finished. The algorithm doesn’t have any kind of limit, you can keep going and produce more and more detailed points for as long as you want. For a computer, you’d obviously want to stop once the points are closer together than one pixel, or maybe some quality criteria. For example it makes sense to stop when the points are fairly close to being a straight line, but keep going in very curved sections. If you are drawing by hand, the simple criteria is to keep going until it looks good enough to you, then draw the final curve through the points as smoothly as you can. Or, better yet, don’t draw a Bézier curve by hand, that’s just stupid.
A random detail that I find particularly hilarious is that the Solid Modeling Association awarded Paul de Casteljau their highest price in 2012… the Bézier Award. For what it’s worth, Pierre Bézier himself agreed that it was a shame that Paul de Casteljau never got the recognition he deserved.
And that is literally all there is to it. Drawing a Bézier curve doesn’t require any creativity beyond placing the points, but placing the points gives you a lot of freedom and precise control. It takes a lot of steps to draw it, but the steps are all themselves incredibly simple with no higher mathematics. That makes it perfect for computers. You can form a good approximation of basically every curve out there with a relatively low number of Bézier curves one after another. And the whole concept can be extended to Bézier surfaces in 3D. It’s incredibly useful, and it became the default way to draw curves on computers for very good reasons.
There’s absolutely no reason to ever draw one of these curves by hand. I just think it’s neat that you can. And now you all know how.