Ripple Effect on a Texture with Three.js

A coding session that deconstructs the ripple effect seen on homunculus.jp.

The post Ripple Effect on a Texture with Three.js appeared first on Codrops.

In this ALL YOUR HTML coding session you will learn how to recreate the interesting ripple effect seen on the homunculus.jp website with Three.js. We’ll have a look at render targets and use a little bit of math.

This coding session was streamed live on November 21, 2021.

Support: https://www.patreon.com/allyourhtml

Setup: https://gist.github.com/akella/a19954…

The post Ripple Effect on a Texture with Three.js appeared first on Codrops.


Print Share Comment Cite Upload Translate
APA
Yuriy Artyukh | Sciencx (2024-03-28T14:23:27+00:00) » Ripple Effect on a Texture with Three.js. Retrieved from https://www.scien.cx/2021/11/22/ripple-effect-on-a-texture-with-three-js/.
MLA
" » Ripple Effect on a Texture with Three.js." Yuriy Artyukh | Sciencx - Monday November 22, 2021, https://www.scien.cx/2021/11/22/ripple-effect-on-a-texture-with-three-js/
HARVARD
Yuriy Artyukh | Sciencx Monday November 22, 2021 » Ripple Effect on a Texture with Three.js., viewed 2024-03-28T14:23:27+00:00,<https://www.scien.cx/2021/11/22/ripple-effect-on-a-texture-with-three-js/>
VANCOUVER
Yuriy Artyukh | Sciencx - » Ripple Effect on a Texture with Three.js. [Internet]. [Accessed 2024-03-28T14:23:27+00:00]. Available from: https://www.scien.cx/2021/11/22/ripple-effect-on-a-texture-with-three-js/
CHICAGO
" » Ripple Effect on a Texture with Three.js." Yuriy Artyukh | Sciencx - Accessed 2024-03-28T14:23:27+00:00. https://www.scien.cx/2021/11/22/ripple-effect-on-a-texture-with-three-js/
IEEE
" » Ripple Effect on a Texture with Three.js." Yuriy Artyukh | Sciencx [Online]. Available: https://www.scien.cx/2021/11/22/ripple-effect-on-a-texture-with-three-js/. [Accessed: 2024-03-28T14:23:27+00:00]
rf:citation
» Ripple Effect on a Texture with Three.js | Yuriy Artyukh | Sciencx | https://www.scien.cx/2021/11/22/ripple-effect-on-a-texture-with-three-js/ | 2024-03-28T14:23:27+00:00
https://github.com/addpipe/simple-recorderjs-demo