This project explores post-processing in a 3D scene, allowing users to dynamically adjust the intensity of an animated, drunken wave effect applied over top of a simple scene. It was created with Three.js and React Three Fiber.
It features a ball and cube on a green plane. In the upper-right corner is a GUI that allows users to adjust two parameters that affect the "drunk" view distortion: frequency and amplitude.
The project also displays a performance monitor for profiling different performance indicators, such as FPS, memory usage, and GPU load.
The work was undertaken as one of many steps in acquiring my Three.js certification through Three.js Journey.
A running demo of the project can be viewed at https://dvdjrnx.github.io/post-processing
- Clone the repository.
- Install the required dependencies by running
npm install.
To start the project, run the following command:
npm run dev