Montreal

Alan ๐Ÿ‘พ

Elite
@collidingScopes

Hi! I'm Alan and I tinker with computer vision, gaming, and animation projects

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

255

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

224

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

182

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

173

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

157

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

150

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

107

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

89

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.

83

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

49

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

44

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

38

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

35

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

28

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

12

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

11

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

11

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

10

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

10

tetris. JavaScript

6

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.

5

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

5

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

5

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

4

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.

3

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

3

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

3

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

2

video-to-ansi. JavaScript

2

livinggrid. JavaScript

1

ripple. JavaScript

1

horizon. TypeScript

1

reaction-diffusion. JavaScript

1

acrobatic-arcade. HTML

1

edgyAnimation. JavaScript

1

collidingScopes. Config files for my GitHub profile.

1

shape-research. JavaScript

1

lavalamp. JavaScript

1

birds-eye. JavaScript

1
39
Apply