Matt DesLauriers Profile picture
Jul 2, 2018 11 tweets 5 min read Read on X
A function that produces a scribble.
#generative #code #javascript
So many of my sketches begin with the same function: producing a uniform distribution of values along an array, between [0..1] range. Here's how it looks in JavaScript.

I'm calling it "arcs" (for arc lengths) but perhaps there is a proper name for this sort of thing?
I use this for all sorts of things, like generating an N-sided polygon:
Or distributing N points evenly along a line segment:
Or just making a wavy horizontal line with noise.
Various outputs from the scribble function.
Using a higher dimension noise function (4D) and a walking along the parametric equation of a torus, you can get some interesting dancing motion that loops seamlessly.
Here's another variation using a different random seed.
Code for that...
Drawing out.

(Thanks @slowkow for the idea! Didn't realize how neat it looks while drawing out.)
Drawing out while walking along the torus, and shifting hues.

• • •

Missing some Tweet in this thread? You can try to force a refresh
 

Keep Current with Matt DesLauriers

Matt DesLauriers Profile picture

Stay in touch and get notified when new unrolls are available from this author!

Read all threads

This Thread may be Removed Anytime!

PDF

Twitter may remove this content at anytime! Save it as PDF for later use!

Try unrolling a thread yourself!

how to unroll video
  1. Follow @ThreadReaderApp to mention us!

  2. From a Twitter thread mention us with a keyword "unroll"
@threadreaderapp unroll

Practice here first or read more on our help page!

More from @mattdesl

Aug 19, 2018
Linear interpolation (sometimes called 'lerp' or 'mix') is a really handy function for creative coding, gamedev and generative art.

The function interpolates within the range [start..end] based on a 't' parameter, where 't' is typically within a [0..1] range.

A thread...
For example, divide 'loop time' by 'loop duration' and you get a 't' value between 0..1.

Now you can map this 't' value to a new range, such as `lerp(20, 50, t)` to gradually increase a circle's radius, or `lerp(20, 10, t)` to gradually decrease its line thickness.
Another example: you can use linear interpolation to smoothly animate from one coordinate to another. Define a start point (x1, y1) and end point (x2, y2), then interpolate the 'x' and 'y' dimensions separately to find the computed point in between.
Read 8 tweets

Did Thread Reader help you today?

Support us! We are indie developers!


This site is made by just two indie developers on a laptop doing marketing, support and development! Read more about the story.

Become a Premium Member ($3/month or $30/year) and get exclusive features!

Become Premium

Don't want to be a Premium member but still want to support us?

Make a small donation by buying us coffee ($5) or help with server cost ($10)

Donate via Paypal

Or Donate anonymously using crypto!

Ethereum

0xfe58350B80634f60Fa6Dc149a72b4DFbc17D341E copy

Bitcoin

3ATGMxNzCUFzxpMCHL5sWSt4DVtS8UqXpi copy

Thank you for your support!

Follow Us!

:(