HOW did you do this?
I'm glad you asked!
- Find two images that somewhat contain the same amount of triangles
- Draw one triangle on top of each picture with Inkscape
- This produces a SVG file with two paths
- Create a HTML page with one SVG and one of the paths
- Add a script which, with anime.js, morphs paths. I.e. morphs one set of paths to another set of paths
- Create a nodejs script which parses the SVG into paths to morph from (goes into the HTML file) and paths to morph to (goes into the js script)
- Duplicate triangles in both images
- Run the animation and make sure these triangles morph as desired
- Repeat until all triangles are drawn
Need to know how to enable it? Go here.