Best of threejsDecember 2025

  1. 1
    Article
    Avatar of codropsCodrops·17w

    Spain Collection: Evolving a Luxury Website into a Digital Ecosystem

    A detailed case study of redesigning Spain Collection's luxury travel website into a comprehensive digital ecosystem. The project evolved from a single-purpose site into a platform managing 100+ experiences across trips, stays, weddings, and VIP services. The design approach emphasized editorial aesthetics inspired by high-end fashion, implemented through a modular WordPress system with 50+ flexible components. Technical implementation included ACF Flexible Content for content management, GSAP and TaxiJS for animations and transitions, and a custom WebGL/Three.js petal rain effect for the weddings section. The architecture solved complex UX challenges through smart filtering, modal-based navigation, and content correlation across multiple service categories while maintaining visual consistency and scalability.

  2. 2
    Article
    Avatar of codropsCodrops·16w

    Building a Nostalgic 8-bit Universe with Modern Tech: A Vibe Coding Journey

    A developer rebuilt their portfolio with an 8-bit retro aesthetic using a 95% AI-driven workflow governed by strict design constraints. The project implements custom pixel mask transitions using Bayer dithering, a singleton PixelationManager for Canvas optimization, and adaptive WebGL quality scaling to maintain 60 FPS. Key techniques include a .cursorrules "Design Constitution" that prevents AI from hardcoding values, atomic component development in Storybook, GSAP ScrollTrigger orchestration, and performance optimizations like offscreen canvas rendering and intersection observers. The approach demonstrates how to maintain design integrity and code quality while leveraging AI for rapid development.

  3. 3
    Article
    Avatar of 80lv80 LEVEL·16w

    Particle Simulator Controlled by Hand Gestures

    David Katz created a browser-based particle simulation controlled by hand gestures using only a webcam. The project uses MediaPipe for hand tracking and Three.js for rendering 100,000 particles that react to hand movements in real-time. The setup demonstrates how accessible gesture-controlled interactive graphics have become with modern web technologies.