3D Animate on Scroll

Etug Website

Decorative image for the redesign of the Etug website. Website design and concept of spinning glass logo by Nicole Singular. 3D graphic and code to make it work by Steph.

The concept is entirely decorative but the concept of animating on webpage scroll can be expanded to long scrolling educational content to catch the eye.

The project also showcases glass like texture in 3D when animated.

Things to consider:

• Animate on scroll can be a bit costly for load times when it utilizes photos or 3D graphics.
  • With photos, the tool requires the website to load hundreds of images which can create large file sizes and might be laggy on slower computers.
  • With flat 2D graphics such as what can be found on the Out in the Open website, the tool only has to load the transformations which makes for smaller file sizes.

How it works

Scroll past the image and the spin will match your scroll speed.