Best of CodropsOctober 2024

  1. 1
    Article
    Avatar of codropsCodrops·2y

    Staggered (3D) Grid Animations with Scroll-Triggered Effects

    An exploration into staggered grid animations incorporating 3D perspective effects, filters, and typography. The demo includes a unique cylinder-like 3D effect in a two-columned grid layout, utilizing GSAP's SplitText plugin. The repo contains a trial version for experimentation.

  2. 2
    Article
    Avatar of codropsCodrops·2y

    Inspirational Websites Roundup: Webflow Special #6

    This roundup highlights a selection of inspiring Webflow websites, showcasing the creativity and technical brilliance of various studios, agencies, and freelancers. Featured entities include DivBlockers, Sonar Music, OFF+BRAND, NAGARA, and many more, each demonstrating unique approaches in design, music, production, branding, and technology.

  3. 3
    Article
    Avatar of codropsCodrops·1y

    Getting Started with Piecesjs: Building Native Web Components with a Lightweight Framework

    Piecesjs is a lightweight front-end framework designed for creating modular and high-performance web components. It allows dynamic importing of only the necessary JavaScript and CSS, optimizing performance. Each component, called a 'Piece,' operates independently with encapsulated styles and interactions. The framework supports various CMS platforms and can be seamlessly integrated into complex workflows. Key features include dynamic importation, scoped event management, and efficient global CSS handling.

  4. 4
    Article
    Avatar of codropsCodrops·1y

    Creating a 3D Hand Controller Using a Webcam with MediaPipe and Three.js

    Learn how to control elements in a 3D scene using your hands, a webcam, and a web browser. The tutorial leverages MediaPipe for hand tracking and Three.js for rendering the 3D environment. It includes step-by-step instructions on setting up the hand detection, creating a WebGL scene, and managing gestures for interactive controls in a browser-based 3D space.

  5. 5
    Article
    Avatar of codropsCodrops·1y

    UI Interactions & Animations Roundup #47

    A curated collection of standout UI interactions and animations, featuring contributions from various designers and studios. Highlights include innovative website interactions, motion design, ecommerce hero sections, investment apps, marketing agency landing pages, and unique 404 pages.

  6. 6
    Article
    Avatar of codropsCodrops·1y

    Simplifying Backend Tasks for Frontend Developers with Manifest, a One-File Solution

    Manifest is an open-source tool designed to simplify backend tasks for frontend developers by using a single YAML file to create a complete backend. It includes features like a non-technical admin panel, a functional REST API, and an abstracted database for easy management. Built for simplicity and inclusivity, Manifest aims to bridge the gap between frontend and backend development, making it accessible even for those with minimal backend expertise.