Pseudo-Springs

Click the buttons and experience the weirdness.
This text is displayed if your browser does not support HTML5 Canvas.
Spring Physics is a technique that is used in computer games and scientific simulations. Some games use springs as the very basis of the game itself, such as Sodaplay, Zingball, and Gravity Tetris, just to name a few.

Deconstructing Springs
The moving image you see at left is a contraption constructed from pseudo-springs, which refers to line segments whose endpoints "disagree" as to the length of the line segment. A simulated linear spring can be described as two particles (the endpoints) which both experience a force that pushes or pulls them so that they approach a specific distance to each other. The strength of that force is the "k constant", from Hooke's law. Friction constants can be used to dampen velocities and make the springs more or less wobbly.

Okay, They're Actually Not Springs
This technique kind of breaks the laws of physics. In fact, it's not really spring physics. It is more like a particle system with attractions and repulsions between pairs of particles, and these particles want to be at arbitrary distances to each other. Both particles have the same mass. When they disagree, one particle will "chase", and the other particle will "flee". Now, in the case of these contraptions, there are many such disagreements going on! Each particle has exactly TWO other particles with which to disagree. The net effect is a synergistic motion among the entire collection of particles. And, depending on which particles are affecting each other, and the distances they are trying to establish, the results can be quite interesting. Each example here can be thought of as a unique dynamical system.


About this Visualization
Hit the RANDOM button a bunch of times to check out the varieties of contraptions. Several parameters are randomized, such as number of particles, air friction, distances, forces, and graphical attributes. In most cases, particles show up as white dots. Sometimes the dots are bigger and sometimes they are smaller. In some cases, the spring segments are shown.

The blue areas are created by coloring-in all the triangles determined by each particle and the two other particles that it is interacting with. The graphics rendering takes advantage of an alpha channel of the color - this means that a color can be shown with translucency. This is used to create the motion blur effect in some of these examples. The graphics uses html5 Canvas, which runs directly in the browser. The software is written in JavaScript.

Created by Jeffrey Ventrella, in collaboration with Eddie Elliott