Creating a distortion effect

Jeffy_Abraham · August 5, 2020, 1:34pm

I am actually new to three.js and have only worked on basic stuff .
Is there anyway to create background distortion effect like this website https://hajimewatanabe.jp/portfolio/

Mugen87 · August 5, 2020, 5:28pm

I suggest you analyze the implementation of the Website with a tool like Spector.js. It allows you do study the implementation of the shaders.

I have done this right now and found out that the code of one fragment shader contains a comment to a codepen that demonstrates the distortion effect:

Topic		Replies	Views
Image / Video Distortion Effect Questions post-processing , video-texture	3	3757	December 10, 2019
Image distortion animation Questions animation	1	216	June 17, 2024
Shader to bend textures Questions textures , materials , shaders	0	485	April 21, 2020
Time warp scan effect Questions textures , shaders , webgl-renderer	2	1008	May 2, 2023
how to achieve an effect similar to that of CristalLand? Questions textures , materials , geometry , shaders , animation	1	427	September 20, 2023

Creating a distortion effect

Related topics