The Beauty of Bézier Curves (2021) [video](youtube.com)
youtube.com
The Beauty of Bézier Curves (2021) [video]
https://www.youtube.com/watch?v=aVwxzDHniEw
18 comments
Freya is a treasure. I didn’t understand the GPU until I watched her videos. I mean, I still don’t really, but I have a slightly better understanding and a general mental model lol.
Its actually easier to understand if you have worked with bare metal embedded devices in clusters. Because this is what they actually are.
Beautiful video. The intro alone explains more in one minute than most full videos ever do.
One thing that was not addressed was why Pierre Bezier promoted his eponymous curves in the first place. Their first application was in the development of the body of the Citroen car. Just Google classic Citroen car to clearly see the use to which these curves were put.
One thing that was not addressed was why Pierre Bezier promoted his eponymous curves in the first place. Their first application was in the development of the body of the Citroen car. Just Google classic Citroen car to clearly see the use to which these curves were put.
Pierre Bézier worked at Renault where he developed CAD software using piecewise polynomial curves in the 1960s. Paul de Casteljau independently (starting in 1959) worked on the same subject at Citroën, but didn’t publish until later. De Casteljau’s control scheme is actually what we use today, not Bézier’s.
We should probably call these De Castlejau curves or De Castlejau–Bézier curves if we want to give fair attribution. He does get his name on the De Castlejau algorithm (lerp, lerp, lerp, ...) for evaluating such curves.
We should probably call these De Castlejau curves or De Castlejau–Bézier curves if we want to give fair attribution. He does get his name on the De Castlejau algorithm (lerp, lerp, lerp, ...) for evaluating such curves.
> Pierre Bézier worked at Renault where he developed CAD software using piecewise polynomial curves in the 1960s.
For a short demo of the UNISURF system (in french): https://www.youtube.com/watch?v=c0_a6r2JaWQ
For a short demo of the UNISURF system (in french): https://www.youtube.com/watch?v=c0_a6r2JaWQ
Thanks for the clarification/correction. Gonna have to adjust my teaching material now :)
I spent a couple days around the new year fiddling with my "hyperbezier" idea, which is a project to make a curve family better suited to creative graphics (including font design) than Béziers. I have been interested in this a long time; my thesis was also motivated by this goal. I now have two drafts, neither of which is quite right; they have complementary strengths and weaknesses. In grappling with the difficulty of this project, and other work I've done over the years, I have come to appreciate both the beauty and the downsides of Béziers. I haven't had a chance to write down my latest thoughts, so will hijack this thread.
The greatest strength of a cubic Bézier is it ability to accurately model a huge variety of curve shapes, while still having a parameter space that can be successfully navigated by humans. Higher degree Béziers, as well as other curve families with a bunch of tunable knobs, fail that latter test. I have recently come to the conclusion that the ideal number of parameters for a curve family used for interactive design is 4 (using the counting scheme proposed by my thesis), whether the underlying curve is a Bézier, some form of spiral, or something else. A 4-parameter curve family that is not otherwise broken will have O(n^6) scaling, meaning that a subdivision in half will allow it to fit a more or less arbitrary source curve 64 times more accurately. Subdividing by 3 makes it 729 times more accurate, and 4 gives 4096. Thus, you can draw any curve you can imagine with a very small number of cubic Bézier segments.
A 2 parameter curve family by contrast has only O(n^4) scaling. A quadratic Bézier has other limitations, specifically that it cannot represent an inflection, thus an inflection point must be represented as the join of two convex curves and thus a curvature discontinuity. (Euler spirals are a 2 parameter curve that can represent inflections but have other limitations)
It's not just the scaling, Béziers are also capable of representing varying degrees of tension, a property not shared by Euler spirals and related curves. I use the word "tension" to refer to curves that have regions of high relative curvature, as you would observe in a thin flexible strip (elastica) under tension. A Bézier can represent arbitrarily high tension, all the way up to a cusp of infinite curvature (at which point it becomes a semicubical parabola).
Other strengths include being closed under subdivision and affine transformation.
The math for Béziers is simple in some ways (evaluating the position and derivative are nearly trivial) but tricky in others. Arc length is tractable but not trivial (as explained in the segment of the video starting at 14:14). Offset curves are quite difficult, as is the general problem of curve fitting. Computing intersection between Bézier curves is also hard. However, the beauty and flexibility of the curve family makes the solution to these problems worthwhile.
Now for the criticism. People find Bézier curves hard to learn, and amateurs find it difficult to make smooth curves (particularly shapes like "S" in a font). I have recent mathematical insight that sheds light on both these intuitive observations.
The "lumpiness" stems from the tendency of Béziers to have curvature extrema near but not at the endpoint. Curvature extrema are very perceptually relevant, so not having them at endpoints is a problem. A really good way to quantify this property mathematically is to compute an optimum curve fit to, say, a sine wave[1]. It doesn't subdivide at the peaks and troughs, but rather at points near those curvature extrema.
Another mathematical property that suggests there's something weird going on with the parameter space is the presence of "triplets," sets of three Bézier curves that have very different control points but visually identical shapes. Mathematically, this is captured by the fact that solving for Bézier parameters for given endpoint tangents, area, and x-moment is a quartic equation. (The fourth solution matches these quantities but has a loop so is a very different curve). This in turn implies the likelihood of finding a local minimum, perhaps missing a better global solution - both for automated curve fitting processes and human designers tweaking curves to make them more visually appealing.
In sum, after many years with both Bézier curves and alternatives, I wholeheartedly agree with Freya's conclusion (at 19:13): Bézier curves are sometimes a little messy, but with the simplicity of their construction and the flexibility of their uses, I think they're beautiful, despite their flaws.
[1]: https://xi.zulipchat.com/#narrow/stream/260979-kurbo/topic/F...
The greatest strength of a cubic Bézier is it ability to accurately model a huge variety of curve shapes, while still having a parameter space that can be successfully navigated by humans. Higher degree Béziers, as well as other curve families with a bunch of tunable knobs, fail that latter test. I have recently come to the conclusion that the ideal number of parameters for a curve family used for interactive design is 4 (using the counting scheme proposed by my thesis), whether the underlying curve is a Bézier, some form of spiral, or something else. A 4-parameter curve family that is not otherwise broken will have O(n^6) scaling, meaning that a subdivision in half will allow it to fit a more or less arbitrary source curve 64 times more accurately. Subdividing by 3 makes it 729 times more accurate, and 4 gives 4096. Thus, you can draw any curve you can imagine with a very small number of cubic Bézier segments.
A 2 parameter curve family by contrast has only O(n^4) scaling. A quadratic Bézier has other limitations, specifically that it cannot represent an inflection, thus an inflection point must be represented as the join of two convex curves and thus a curvature discontinuity. (Euler spirals are a 2 parameter curve that can represent inflections but have other limitations)
It's not just the scaling, Béziers are also capable of representing varying degrees of tension, a property not shared by Euler spirals and related curves. I use the word "tension" to refer to curves that have regions of high relative curvature, as you would observe in a thin flexible strip (elastica) under tension. A Bézier can represent arbitrarily high tension, all the way up to a cusp of infinite curvature (at which point it becomes a semicubical parabola).
Other strengths include being closed under subdivision and affine transformation.
The math for Béziers is simple in some ways (evaluating the position and derivative are nearly trivial) but tricky in others. Arc length is tractable but not trivial (as explained in the segment of the video starting at 14:14). Offset curves are quite difficult, as is the general problem of curve fitting. Computing intersection between Bézier curves is also hard. However, the beauty and flexibility of the curve family makes the solution to these problems worthwhile.
Now for the criticism. People find Bézier curves hard to learn, and amateurs find it difficult to make smooth curves (particularly shapes like "S" in a font). I have recent mathematical insight that sheds light on both these intuitive observations.
The "lumpiness" stems from the tendency of Béziers to have curvature extrema near but not at the endpoint. Curvature extrema are very perceptually relevant, so not having them at endpoints is a problem. A really good way to quantify this property mathematically is to compute an optimum curve fit to, say, a sine wave[1]. It doesn't subdivide at the peaks and troughs, but rather at points near those curvature extrema.
Another mathematical property that suggests there's something weird going on with the parameter space is the presence of "triplets," sets of three Bézier curves that have very different control points but visually identical shapes. Mathematically, this is captured by the fact that solving for Bézier parameters for given endpoint tangents, area, and x-moment is a quartic equation. (The fourth solution matches these quantities but has a loop so is a very different curve). This in turn implies the likelihood of finding a local minimum, perhaps missing a better global solution - both for automated curve fitting processes and human designers tweaking curves to make them more visually appealing.
In sum, after many years with both Bézier curves and alternatives, I wholeheartedly agree with Freya's conclusion (at 19:13): Bézier curves are sometimes a little messy, but with the simplicity of their construction and the flexibility of their uses, I think they're beautiful, despite their flaws.
[1]: https://xi.zulipchat.com/#narrow/stream/260979-kurbo/topic/F...
Bézier curves have always been awkward to use, like a too low-level language for a human to use (like machine code). The UI's I've seen nevertheless expose it and call it a day, instead of exposing a better interface, and compiling the requested curve to Bézier.
Obviously you know a lot more than I do, so allow me to question: I wonder why the ideal (desired) behavior/esthetics wasn't defined first. Then one would work from there towards an implementation. Now, it feels like CS found some sharp stone and decided to use it to cut off some meat, without reflecting on what the tool actually should look like, and eventually getting to the conception of a knife.
To summarize, why are computer graphics so hung up on Bézier to begin with? Are there no other methods? Was there ever a quest for the algorithmically simplest method which yields aesthetically pleasing results, and work from there?
Obviously you know a lot more than I do, so allow me to question: I wonder why the ideal (desired) behavior/esthetics wasn't defined first. Then one would work from there towards an implementation. Now, it feels like CS found some sharp stone and decided to use it to cut off some meat, without reflecting on what the tool actually should look like, and eventually getting to the conception of a knife.
To summarize, why are computer graphics so hung up on Bézier to begin with? Are there no other methods? Was there ever a quest for the algorithmically simplest method which yields aesthetically pleasing results, and work from there?
[deleted]
It's a super good question. I would say two things here.
First, defining the ideal aesthetics is a really hard problem. When you start listing the various properties of curves (basically chapter 2 of my thesis), you find that there are relentless tradeoffs. Case in point: Cem Yuksel's C2 spline (cited elsethread) lists off a bunch of desirable properties, including local support, but then fails to be closed under subdivision. Turns out you can't have both. For the application it was designed for (taking a sequence of points from a hair simulation and defining geometry that can be rendered, preserving the continuity of the specular highlights), it's great, but I wouldn't want to design a font in it.
Another set of tradeoffs: the conclusion of my thesis is that the Euler spiral is the ideal interpolating spline for making smooth curves. So why isn't it more widely used? Two problems: first, you don't always want optimum smoothness, sometimes you want curves with high tension. Second, when you "push" the curve too far, the math doesn't converge to a unique solution, and the curve jumps around, which is really not a great user experience.
[It turns out that these two issues are related: I believe, but haven't yet firmly established, that by increasing the tension when deviation goes up, you can get a unique solution that's also continuous with respect to the input parameters. My prototype is promising but the solver is not 100% robust when pushed hard. It's a difficult problem.]
The second half of this is that Béziers occupy a really sweet spot in this tradeoff space: they're not as smooth as Euler spirals for making interpolating splines, but they're not that far off either. And they can represent high tension, inflection points, and it's easy to draw approximate superellipses, which is an extremely important family of shapes for font design and other tasks. The fact that the math is simple means you can do all the other computational geometry that's needed.
I am on that quest to define a better curve family, but it's pretty far from the top of my priority list right now, so I expect progress to be slow. It's more of a life goal than something I'm actively working on now. The reason this popping up now is that I used a few days during my vacation to revisit it.
First, defining the ideal aesthetics is a really hard problem. When you start listing the various properties of curves (basically chapter 2 of my thesis), you find that there are relentless tradeoffs. Case in point: Cem Yuksel's C2 spline (cited elsethread) lists off a bunch of desirable properties, including local support, but then fails to be closed under subdivision. Turns out you can't have both. For the application it was designed for (taking a sequence of points from a hair simulation and defining geometry that can be rendered, preserving the continuity of the specular highlights), it's great, but I wouldn't want to design a font in it.
Another set of tradeoffs: the conclusion of my thesis is that the Euler spiral is the ideal interpolating spline for making smooth curves. So why isn't it more widely used? Two problems: first, you don't always want optimum smoothness, sometimes you want curves with high tension. Second, when you "push" the curve too far, the math doesn't converge to a unique solution, and the curve jumps around, which is really not a great user experience.
[It turns out that these two issues are related: I believe, but haven't yet firmly established, that by increasing the tension when deviation goes up, you can get a unique solution that's also continuous with respect to the input parameters. My prototype is promising but the solver is not 100% robust when pushed hard. It's a difficult problem.]
The second half of this is that Béziers occupy a really sweet spot in this tradeoff space: they're not as smooth as Euler spirals for making interpolating splines, but they're not that far off either. And they can represent high tension, inflection points, and it's easy to draw approximate superellipses, which is an extremely important family of shapes for font design and other tasks. The fact that the math is simple means you can do all the other computational geometry that's needed.
I am on that quest to define a better curve family, but it's pretty far from the top of my priority list right now, so I expect progress to be slow. It's more of a life goal than something I'm actively working on now. The reason this popping up now is that I used a few days during my vacation to revisit it.
The general problem with starting with desired result and working towards the implementation is that there is no guarantee you will find solution.
Not all desired results are feasible or possible even.
Not all desired results are feasible or possible even.
I'm not sure if you're familiar with Cem Yuksel's excellent work in the area.
https://www.youtube.com/watch?v=pK4zy5OKbHs
https://www.youtube.com/watch?v=pK4zy5OKbHs
I am. It is relevant to the topic, and I cite it in the (now two year old) outline for the blog post I intend to write on the topic[1].
I'll point out that Yuksel's spline is not closed under subdivision, which is a pretty big flaw. To be fair, the current version of hyperbezier also has that flaw, but I now believe it can be fixed.
[1]: https://github.com/raphlinus/raphlinus.github.io/issues/40
I'll point out that Yuksel's spline is not closed under subdivision, which is a pretty big flaw. To be fair, the current version of hyperbezier also has that flaw, but I now believe it can be fixed.
[1]: https://github.com/raphlinus/raphlinus.github.io/issues/40
I first saw this video a few weeks ago when I was researching Cormorant, the beautiful serif font it uses.
https://fontsinuse.com/uses/44320/the-beauty-of-bezier-curve...
https://fontsinuse.com/uses/44320/the-beauty-of-bezier-curve...
[deleted]
The Continuity of Splines [video] - https://news.ycombinator.com/item?id=34014308 - Dec 2022 (41 comments)
The Beauty of Bezier Curves [video] - https://news.ycombinator.com/item?id=28349680 - Aug 2021 (2 comments)
The Beauty of Bézier Curves - https://news.ycombinator.com/item?id=28237166 - Aug 2021 (2 comments)