• Login
  • Register

Work for a Member organization and need a Member Portal account? Register here with your official email address.

Project

Eye Roller: Tumbling pupils inside eye sockets under gravity

Copyright

Yufeng Zhao

Yufeng Zhao

Groups

A browser-based video mirror that puts a rolling pupil in each one of your eyes. The sockets get painted white, a heavy little pupil drops into each one, and from there it tumbles around under gravity and your head movement.

Here's a quick sketch I made. Eye Roller is a browser video mirror that puts a rolling pupil in each one of your eyes. The sockets get painted white, a heavy little pupil drops into each one, and from there it tumbles around under gravity and your head movement. I had great fun with this and I hope you do too!

Copyright

Yufeng Zhao

Prior Art

I went looking for prior art before I started, and was glad to realize nobody had done quite the same thing.

Googly-eye effects on Snapchat and Instagram have been around forever, but almost none of them simulate physics. Snapchat's official "Googly Eyes" lens, tagged #physics, is the clearest exception, but it glues a 3D pair of plastic doll eyes to your face. Eye Roller is different: it runs in a browser, the socket is your actual eye contour (so the pupil rolls along your eye, not a cartoon circle), and it stays 2D, closer to a plastic googly eye stuck to a thing than a 3D object floating in front.

Copyright

Snapchat

How it works

The webcam feeds MediaPipe Face Landmarker, which returns 478 landmarks per face every frame. Each eye contour gets turned into a static collision polygon inside a Planck.js (Box2D) world, with a circle body, the pupil, sitting inside. A soft spring pulls the pupil toward the socket center while gravity and head acceleration push it around. The polygon updates every frame as your eye opens, closes, and moves.

Copyright

Yufeng Zhao

For Spring Member Event 2026, we have an installation of this project on a vertical TV.

Copyright

Yufeng Zhao

Things you can do with it

Tilt or jerk your head and gravity pools the pupils to the bottom of the socket; head acceleration sloshes them around.

Copyright

Yufeng Zhao

Stand too far from the camera and MediaPipe loses you. A YOLOv11n-face fallback finds you anyway, draws a circle around your head, and prompts you to come closer.

Copyright

Yufeng Zhao

Bring a friend, watch the odometer. Each face gets a lightweight 17-distance geometric signature (eye widths, nose proportions, face height, chin-to-cheek), enough of a hash to tell a small roster apart and keep each person's pupils pinned to them across frame drops. Every pair of pupils has its own odometer too, measuring roll distance in meters (scaled against face width) and totaled per face. Stay long enough and you'll clock a kilometer.

Copyright

Everett Collection

Press c to open a Tweakpane panel with everything exposed: gravity, spring strength, pupil size, blink threshold, dilation, feathering, camera selector. Settings save to local storage.

Copyright

Yufeng Zhao