Learn creative coding writing simple programs
76. Slowly morphing bezier curves
Bezier curves are built using four points. To animate a bezier curve you can animate one or more of those four points. If you use random() the animation will not be smooth, which is sometimes ok. If you prefer a more smooth animation you can use the noise() function. If one of the parameters of the noise() function changes slowly over time you will get slightly different random numbers each time your draw() function is called. We create such a slow changing value by dividing frameCount by a number, for example 100. In that case you get a number that increases 100 times slower than the original frameCount.
One thing to be careful with is that if you divide two integer numbers you get an integer number. For example 9 / 2 is 4, not 4.5. So if you divide frameCount by 100, you will keep getting 0 as a result, then you will get 1 for the next 100 frames, then 2 for the next 100 frames... This is easily solved by making one of the numbers a float. One way of doing that is adding float() around one of those numbers. For example float(9) / 2, or float(frameCount) / 100. But the easier solution is just to add decimals to one of the numbers. For example 9.0 / 2 or frameCount / 100.0. Note the ".0" at the end of the numbers.
Code editor
background
bezier
draw
float
for
frameCount
height
int
noFill
noise
setup
size
smooth
void
width
Try to stay close to the topic of this episode. Use the Processing forums for help with unrelated Processing projects (or hire me for help ;-)
To indicate that a word in your comment is code, use the `backtick`. Example
Do `float` and `int` smell similar?
To highlight code blocks, surround it with ``` code-fences ``` like this:``` void setup() { size(600, 600); } ```