Description
Author Notes
Visit the interactive site here: https://www.jasondavies.com/animated-bezier/
These animations illustrate how a parametric Bézier curve is constructed. The parameter t ranges from 0 to 1. In the simplest case, a first-order Bézier curve, the curve is a straight line between the control points.
For a second-order (quadratic) Bézier curve, first we find two intermediate points that are t along the lines between the three control points. Then we perform the same interpolation step again and find another point that is t along the line between those two intermediate points. Plotting this last point yields a quadratic Bézier curve. The same steps can be repeated for higher orders.
Inspired by a similar animation on Wikipedia. Thanks to Mike Bostock for the suggestion, and for citing me in his D3 paper!
Want to know more about Bézier curves? I highly recommend Mike Kamermans’ interactive online book, A Primer on Bézier Curves.
Submit
If you would like to submit a piece for inclusion in our INSPIRATION category please submit it to us here or tag #aescripts on Instagram.
Comments