SteevePommier
Theme
Menu background
Background pattern
Reveal
Reveal size 10
Density 50
Colour
Menu position
Analytics

Photo — Ballons collision

Round portholes tumble around a walled box under a gravity that keeps changing direction, each one opening onto its own fixed full-frame photograph.

2dinteractivephysics

A crowd of discs rolls and piles inside invisible walls, every pair joined by a hairline. Each disc is not a picture pasted on a ball but a porthole: through it shows a photograph pinned to the frame, so a travelling disc scans across its image like a hole moving over a wall. Dragging across the canvas mints fresh portholes at the pointer.

Matter.js owns the discs — collisions, stacking, momentum — while the sketch only draws. Gravity is remapped every frame from a sine/cosine pair, so “down” sweeps around the compass and the pile keeps sliding into a new corner. The porthole is a mask: the ball's photo is laid full-frame into a buffer and a white circle at the body's position decides which part shows.