Open OmarShehata opened 3 years ago
Just to note this down here, the above demo was created entirely in the browser console. Here's a gist with the code: https://gist.github.com/OmarShehata/895e42474c5604439888426cb57dab75
catData
in the fox article:var catData = `COPY_PASTE_ALL_THE_CAT_COEFFICIENTS`;// from the cat article
<div class="ace-editor ace_editor ace-monokai ace_dark">
) such that $0
referred to this elementOther notes for building a standalone prototype that does this lerp:
decodedImage
comes from jpegjs
, a 3rd party jpeg encoder/decoder this article is usingAnd of course it'd be really cool to be able to drag and drop any 2 images to morph them like that
Inspired by this tweet: https://twitter.com/JobvdZwan/status/1400477315738574856
I think it would be cool to put together a standalone demo that lets you pick two images and have a slider to go back and forth.
I put together a little experiment exploring this idea, that replaces the coefficients of one image with another, one by one, starting with the highest frequency, over time:
https://user-images.githubusercontent.com/1711126/120941941-8a9f9980-c6f3-11eb-920c-8d6e665c73c3.mp4
It's not fast enough to be realtime, but I think that's only because the article is doing a lot of work every time the coefficients change, and maybe that can be optimized a bit.