← All projects
Interactive Demo

Pachebell's Cannon

An interactive technology demonstration where bouncing balls play notes from Pachelbel's Canon — music through physics.

Our role
Design & Engineering
Stack
HTML5 CanvasWeb Audio APIJavaScriptPhysics
Try the Demo

Inspired by MoMath

This project was inspired by an exhibit at the Museum of Mathematics (MoMath) that beautifully demonstrated the connection between physics and Pachelbel's famous note sequence. We've recreated and expanded on this concept to create an interactive web experience.

About the Demo

Pachebell's Cannon is an interactive technology demonstration where players create lines on a canvas to guide bouncing balls. Each time a ball bounces, it plays a note from Pachelbel's Canon in D, creating a unique musical and visual experience.

This project showcases how mathematical concepts, physics simulations, and musical composition can come together to create something both educational and entertaining.

Pachebell's Cannon Demo Screenshot

Interactive Features

Draw Interactive Lines

Create lines on the canvas that serve as bouncing surfaces for the physics simulation.

Musical Physics

Each ball bounce triggers a note from Pachelbel's Canon, creating music through physics.

Free to Play

Available online for free — no downloads or installations required.

Educational Value

Demonstrates concepts in physics, mathematics, and music theory through interactive play.

Cross-Platform

Works on all modern web browsers across desktop, tablet, and mobile devices.

Open-Ended Exploration

Experiment with different line configurations to create unique musical patterns.

How It Works

  1. 1Use your mouse or finger to draw lines on the canvas
  2. 2Release balls that will bounce off your created lines
  3. 3Each bounce triggers a note from Pachelbel's Canon in D
  4. 4Experiment with different line configurations to create unique musical patterns
  5. 5Experience the beautiful intersection of physics, mathematics, and music!

What You'll Learn

Physics: Momentum, collision, and trajectory
Mathematics: Angles, geometry, and patterns
Music Theory: Musical sequences and harmony
Programming: Real-time physics simulation
Art: Visual-audio synaesthesia
Creativity: Experimental composition

About Pachelbel's Canon

Pachelbel's Canon in D is one of the most famous pieces of Baroque music, composed by Johann Pachelbel around 1680. The piece is known for its mathematical structure and repetitive harmonic progression that creates a mesmerizing musical experience.

This demo uses the canonical note sequence to demonstrate how mathematical patterns in music can be visualized and experienced through interactive physics simulation.

Experience Music Through Physics

Discover the beautiful connection between mathematics, physics, and music.

Try Pachebell's Cannon

Have a project like this one?

We'd be glad to talk through your goals, your constraints, and whether we're the right team for the work.