Best of Codrops — July 2024

1. 1
   Article

   Codrops·2y

   UI Interactions & Animations Roundup #45

   This post showcases a collection of recent UI interactions and animations, featuring diverse designs such as e-commerce concepts, AI assistant avatars, restaurant branding, and more. Highlighted works include contributions from artists like Serhii Polyvanyi, Gleb Kuznetsov, and Linur, offering inspiration across various design projects.

   78

   2
2. 2
   Article

   Codrops·2y

   Inspirational Websites Roundup #62

   A round-up of inspiring website designs from the past few weeks, offering fresh ideas and inspiration for designers. Meco is highlighted as a tool for distraction-free newsletter reading.

   47

   2
3. 3
   Article

   Codrops·2y

   How to Create Distortion and Grain Effects on Scroll with Shaders in Three.js

   Learn how to create interesting distortion and grain effects on scroll using shaders in Three.js. This tutorial covers setting up media and meshes, syncing HTML images with WebGL, and creating the shaders for the desired visual effects. Detailed code snippets and explanations are provided for setting up the camera, geometry, and the render loop. The tutorial also delves into creating the deformation and noise effects to enhance the scrolling experience.

   25
4. 4
   Article

   Codrops·2y

   Origami: 12 Free Animated 3D Objects

   Explore 12 free animated 3D objects created with React Three Fiber and GSAP. These objects come with three different material variations and are ready to be integrated into your projects to add dynamic flair to your website.

   19