block by bricof 3ce0a03e5eb4a8591f852e815b5c1e86

Unfurling UI Animation

Full Screen

This unfurling UI is used in the human computation section of the Stitch Fix Algorithms Tour. The svg drawing was made by Liz Cruz.

The script takes the drawn paths as starting points, and maps between their given x,y values to different x,y values as a function of time. Note that to make the animation look okay, it is best to avoid long distances between points in your path definitions - in the given svg paths, you will notice long sequences of Lx,y elements that all sit on the same straight line, which in normal static conditions would be best repaced with a single Lx,y element.

index.html