Shiffman, Chapter 3

Oscillation

Angles, trigonometry, pendulums, and springs — the mathematics of things that swing back and forth.

Prerequisites: Chapters 1-2 (Vectors, Forces).
10
Chapters
3
Simulations
10
Quizzes

Chapter 0: Why Oscillation?

Chapters 1 and 2 gave us vectors and forces — objects that move in straight lines and curves. But so much of the natural world moves in cycles: a pendulum swings, a heartbeat pulses, a buoy bobs on waves, a planet orbits a star.

To simulate these patterns, we need trigonometry — the math of triangles, angles, and periodic functions. Don't panic: we only need a handful of trig concepts, and they'll unlock an enormous range of motion patterns.

What we'll learn: Angles and radians, sine and cosine, angular velocity and acceleration, how a pendulum works as a force problem, and how springs pull objects back to rest. All of it builds on the vector/force framework from Chapters 1-2.
Linear motion (Ch 1-2)Angular motion (Ch 3)
location, velocity, accelerationangle, angular velocity, angular acceleration
Position in x,y spaceRotation around a point
Forces push/pull in a directionTorque rotates around a pivot
Which mathematical toolkit do we need for periodic, cyclic motion?

Chapter 1: Angles & Radians

You probably think of angles in degrees: a full circle is 360, a right angle is 90. But computers (and mathematicians) prefer radians.

One radian is the angle where the arc length equals the radius. A full circle is 2π radians (about 6.28). Half a circle is π (about 3.14).

radians = degrees × π / 180
DegreesRadiansMeaning
00No rotation
90π/2 ≈ 1.57Quarter turn
180π ≈ 3.14Half turn
3602π ≈ 6.28Full circle
Why radians? Because the trig functions (sin, cos, tan) expect radians. Every programming language and graphics API uses radians internally. Get comfortable with π/2 meaning "a right angle" and 2π meaning "full circle."
How many radians is 180 degrees?

Chapter 2: Angular Motion

Remember the motion algorithm from Chapter 1?

velocity = velocity + acceleration
location = location + velocity

The exact same pattern applies to rotation:

angular velocity = angular velocity + angular acceleration
angle = angle + angular velocity

It's simpler, actually, because angle is a single number (a scalar), not a vector. One variable for the angle, one for angular velocity, one for angular acceleration.

pseudocode
angle = 0
aVelocity = 0
aAcceleration = 0.001

each frame:
  aVelocity = aVelocity + aAcceleration
  angle = angle + aVelocity
Connecting to forces: A quick and dirty way to get interesting angular motion is to base angular acceleration on the horizontal component of the object's linear acceleration. If it's being pushed right, it spins clockwise. Pushed left, counterclockwise. It's not physically accurate (real rotation requires torque), but it looks convincing.
The angular motion algorithm is analogous to linear motion. What replaces 'location' in the angular version?

Chapter 3: Trigonometry

Time for SOHCAHTOA — the mnemonic for the three basic trig functions applied to a right triangle:

FunctionMnemonicFormula
sineSOHopposite / hypotenuse
cosineCAHadjacent / hypotenuse
tangentTOAopposite / adjacent

Think of a vector as the hypotenuse of a right triangle. Its x-component is the adjacent side, its y-component is the opposite side, and the angle is measured from the positive x-axis.

The two directions: If you know the angle and want x,y components: x = r * cos(θ) and y = r * sin(θ) (polar to Cartesian). If you know x,y and want the angle: θ = atan2(y, x) (Cartesian to polar). These two conversions are everywhere in graphics.
x = r × cos(θ)
y = r × sin(θ)
θ = atan2(y, x)

The atan2 function is better than plain atan because it handles all four quadrants correctly. Always use atan2.

To convert a vector (x, y) to an angle, which function do you use?

Chapter 4: Sine Waves

The sine function produces a smooth wave that oscillates between −1 and +1. If you plot sin(θ) as θ goes from 0 to 2π, you get one complete cycle: up, back to zero, down, back to zero.

y = A × sin(θ)

Where A is the amplitude (how tall the wave is). The period is how much θ changes before the wave repeats (2π by default). The frequency is how many cycles occur per unit.

PropertyControlsFormula
AmplitudeHeight of waveA in A × sin(θ)
PeriodLength of one cycle2π / frequency
FrequencyHow fast it oscillates2π / period
Why sine waves matter: Sine waves are the building blocks of oscillation. A bobbing buoy, a pulsing glow, an easing animation, a sound wave — they're all sine waves (or sums of them). Fourier showed that any periodic signal can be decomposed into sine waves.
pseudocode
angle = 0
each frame:
  y = amplitude * sin(angle)
  angle = angle + 0.05   # angular velocity
What is the range of the sin() function?

Chapter 5: Oscillation

Simple harmonic motion is what you get when an object is pulled back toward a center point by a force proportional to its displacement. Think of a weight hanging from a spring — the farther you pull it from rest, the harder the spring pulls it back.

We can describe the position of an oscillating object entirely with sine:

x = amplitude × sin(2π × t / period)

Or, equivalently, by tracking an angle that increments each frame:

pseudocode
angle = 0
aVelocity = 0.05
amplitude = 100

each frame:
  x = amplitude * sin(angle)
  angle = angle + aVelocity
No forces needed! For simple oscillation, we can skip the force model entirely and just compute position directly from sine. This is useful for decorative motion — pulsing buttons, bobbing text, wave patterns. For physics-driven oscillation (pendulums, springs), we'll still use forces.

To oscillate in 2D, use sine for one axis and cosine for the other. That traces a circle (or an ellipse if the amplitudes differ).

x = Ax × cos(θ)
y = Ay × sin(θ)
In simple harmonic motion, what happens as the object moves farther from the center?

Chapter 6: The Pendulum

A pendulum is one of the most beautiful examples of oscillation driven by forces. A ball hangs from a rod attached to a pivot. Gravity pulls it down, but the rod constrains it to swing in an arc.

The key insight is that only the tangential component of gravity matters. The component along the rod is cancelled by the rod's tension. What remains is:

angular acceleration = −(g / L) × sin(θ)

Where g is gravitational acceleration, L is the pendulum's length, and θ is the current angle from vertical.

Why sin(θ)? The force of gravity points straight down, but only the component perpendicular to the rod (tangential) accelerates the pendulum. That component is gravity × sin(θ). When θ is small, sin(θ) ≈ θ, which is why small oscillations are nearly perfect sine waves.
pseudocode
angle = PI/4       # start at 45 degrees
aVelocity = 0
damping = 0.995    # slight energy loss
gravity = 0.4
length = 200

each frame:
  aAcceleration = -(gravity / length) * sin(angle)
  aVelocity = aVelocity + aAcceleration
  aVelocity = aVelocity * damping
  angle = angle + aVelocity

  # Convert angle to position
  bobX = length * sin(angle)
  bobY = length * cos(angle)

The damping factor (multiplying angular velocity by 0.995) simulates air resistance. Without it, the pendulum would swing forever. With it, the swings gradually shrink until the pendulum hangs still.

What produces the restoring force in a pendulum?

Chapter 7: Springs

A spring is another classic oscillating system. Hooke's Law describes the force exerted by a spring:

F = −k × x

Where k is the spring constant (stiffness) and x is the displacement from the spring's rest length. The negative sign means the force always pulls back toward equilibrium.

PropertyEffect
Higher k (stiffer spring)Stronger restoring force, faster oscillation
Lower k (softer spring)Weaker restoring force, slower oscillation
Larger displacementStronger force (proportional)

In code, implementing a spring between an anchor point and a bob:

pseudocode
dir = bob.location - anchor      # vector from anchor to bob
currentLen = dir.mag()
stretch = currentLen - restLength # displacement
dir.normalize()
springForce = dir * (-k * stretch)
bob.applyForce(springForce)
Spring vs pendulum: Both exhibit oscillation. A pendulum uses gravity's tangential component. A spring uses Hooke's law (F = -kx). Both produce simple harmonic motion for small displacements. Springs are especially useful for soft, stretchy connections — think cloth simulation, soft-body physics, or rubber-band UI effects.
In Hooke's Law (F = -kx), what does the negative sign mean?

Chapter 8: Pendulum Simulation

Here's a full pendulum simulation using the angular acceleration formula from Chapter 6. Drag the bob to release it from a new angle. Watch how gravity and the constraint of the rod produce smooth oscillation that gradually dampens.

Interactive Pendulum

Drag the bob to set a starting angle, then release. The pendulum swings under gravity with slight damping. Watch the amplitude shrink over time.

angle = 0.00
What to notice: The pendulum moves fastest at the bottom (where all potential energy has become kinetic) and slowest at the extremes (where it momentarily stops before reversing). The damping causes each swing to be slightly shorter than the last. Without damping, it would swing forever.
Where is a pendulum moving fastest?

Chapter 9: Summary

This chapter gave us the tools to handle rotation, periodic motion, and oscillation.

ConceptKey FormulaUse Case
Radiansdegrees × π/180All rotation in code
Angular motionangle += aVel; aVel += aAccSpinning objects
Polar-to-Cartesianx = r cos(θ), y = r sin(θ)Circular motion, waves
atan2θ = atan2(y, x)Pointing in direction of movement
Sine wavey = A sin(θ)Oscillation, easing, waves
PendulumaAcc = -(g/L)sin(θ)Swinging objects
Spring (Hooke's)F = -kxElastic connections
The big picture: Linear motion (vectors + forces) handles things flying and falling. Angular motion handles things spinning and swinging. Together, they give us a complete toolkit for 2D physics simulation. Next up: managing hundreds of objects at once with particle systems.

What we covered:

• Radians and degrees
• Angular velocity & acceleration
• SOHCAHTOA and atan2
• Sine waves (amplitude, period, frequency)
• Simple harmonic motion
• Pendulums (force-driven oscillation)
• Springs (Hooke's law)

What comes next:

Chapter 4: Particle Systems. One ball is fun. Thousands of balls is spectacular. We'll learn to manage large collections of short-lived objects — sparks, smoke, fireworks — using emitters, lifespans, and dynamic arrays.

A pendulum with a longer rod oscillates _____ than one with a shorter rod.