UI & Webflow Exploration | Diagonal scroll

Project description

Exploring the idea of creating a content piece scrolling diagonally across a page section. More sections were added to flesh out the concept and add to the experiment. Making the outcome more detailed and interesting. - Came in a simple hero with a grid that reacts to the (custom) cursor - Then "it could be a great time to finally try to implement this awesome demo from codrops and retrofit it to Webflow" https://tympanus.net/codrops/2024/06/19/hover-animations-for-terminal-like-typography/ - Then using GSAP to practice some simple SVG transformations, line-by-line reveal of the copy, and navigation menu following the diagonal section on scroll. - I used AI where it makes sense for me: generating content. Claude AI gave me 30 placeholder case studies and copy in one prompt, while images are sourced from Lummi.ai to avoid generating anything new when assets already exist. - Design and build in Webflow is by me, using, learning and repurposing from the resources above. I had lots of fun with this one, and certainly do not recommend making a diagonal scroll on a real project for usability and responsiveness reasons. It'd be a nightmare 😂