Alan 👾

shape-creator-tutorial. Create and control 3D shapes using hand gestures in real-time. Built with mediapipe computer vision and threejs

3d-model-playground. Control 3D models using hand gestures and voice commands in real-time. Threejs / mediapipe computer vision

ascii. Turn videos into ASCII pixel art using js and html canvas

threejs-handtracking-101. A threejs / WebGL / MediaPipe-powered interactive demo that allows you to control a 3D sphere using hand gestures.

arpeggiator. Hand-controlled arpeggiator, drum machine, and audio reactive visualizer. Built with mediapipe computer vision, threejs, tonejs

particular-drift. Turn images into flowing particle animations. Built with js, webgl / glsl, and html5 canvas

liquid-shape-distortions. Create psychedelic animations in real-time in the browser. Webgl shader using liquid motion, distortion, shadows, and light.

liquid-logo. A free, open-source tool for creating animated logos with a liquid metal aesthetic. Create logo animations in real-time in the browser.

stark-shapes. Animate shapes with hand gestures. Web tool built with threejs and mediapipe hand-tracking

video-to-pixel-art. Turn videos into pixel art in real-time using javascript, webgl, and html canvas

shimmer. Turn photos into oscillating wave animations, using javascript / HTML5 canvas

iron-interface. An interactive 3D particle visualization controlled through hand gestures and voice. Built with threejs, mediapipe computer vision, web speech API

spritesheet-to-gif. A free web tool that converts spritesheets into animated GIFs.

collidingScopes.github.io. Turn photos into kaleidoscope animations using JS / HTML, directly in the browser

3D-editor. Edit 3D shapes with natural hand gestures. Demo powered by threejs / WebGL / MediaPipe.

fruit-ninja. Play fruit ninja by waving your hand! Free open source web game

forcefield. Turn photos into forcefield particle animations in real-time. js + canvas, open source

the-force. Control a 3D particle animation in real-time using hand gestures. Demo powered by threejs / WebGL / MediaPipe.

red-panda-vibes. 3D red panda exploration game -- open source web game built with three.js

tetris. JavaScript

scanlines. Turn images into synthwave / cyberpunk animations! An open source tool that creates animations from static images using particle waves and edge detection. Runs in real-time in the browser.

manual-brick-breaker. Play brick breaker in-browser using hand-tracking (javascript + mediapipe)

faultyTypewriter. Create text animations and poster art using JS / HTML canvas

curious-contours. Generate contour terrain landscapes in real-time in the browser. Built with Javascript / HTML canvas

text-cube. 3D text cube with real-time controls, built with threejs

liquify. An open source generative art project using a "liquify" effect that pushes and swirls colours on a canvas. The effect is created directly in the browser, using an HTML5 canvas element.

keep-ups. A football keep-ups game in the browser, using webcam motion tracking and 3D physics. Threejs, MediaPipe, and vanilla js

video-to-ansi. JavaScript

nagai. Generating an animated painting in the style of Hiroshi Nagai, using javascript / HTML canvas

livinggrid. JavaScript

ripple. JavaScript

horizon. TypeScript

receipts. JavaScript

reaction-diffusion. JavaScript

acrobatic-arcade. HTML

edgyAnimation. JavaScript

collidingScopes. Config files for my GitHub profile.

shape-research. JavaScript

trexcam. JavaScript

lavalamp. JavaScript

birds-eye. JavaScript