Demonstartes how animated project can be driven by page scrolling logic and how to change project parameters from Javascript
Project includes, keyframe and procedural animations, bloom and global parameters,
Distort reveal
Demonstartes distortion effect for landing page. Image starts unaltered, but becomes distorted as user scrolls down
Shiny Button
Hovering a HTML element activates bloom and other color effects. Demo is combination of editor and code based animation. Demonstrates how to change scene values, like bloom brightness via javascript code.
Demo interaction is optimized for desktop browsers but should run on mobile
Perspective parallax
Uses distort effect to fake 3D parallax perspective. Effect requires suitable image and a black and white depth map. Depth map can be generated using online AI tools, or be rendered from a 3D software.