Interactive Demo

Hermite Splines

Drag the points. Pull the handles. Watch the math come alive.

drag points to move • drag handles to shape • double-click to add point
Control Points
Tangent Handles
Velocity Vectors

01 What is a Hermite Spline?

A Hermite spline is a smooth curve defined by control points and tangent vectors. Unlike Bezier curves (which use intermediate control points), Hermite splines let you directly specify the direction and speed at each point.

Between any two control points, the curve is a cubic polynomial - the simplest curve that can match position and direction at both endpoints.

Hermite Basis Functions
P(t) = h₁(t)·P₀ + h₂(t)·T₀ + h₃(t)·P₁ + h₄(t)·T₁

where:
  h₁(t) = 2t³ - 3t² + 1     (start point influence)
  h₂(t) = t³ - 2t² + t      (start tangent influence)
  h₃(t) = -2t³ + 3t²        (end point influence)
  h₄(t) = t³ - t²           (end tangent influence)

  t ∈ [0, 1]
Intuition

The tangent vectors are like "momentum" - they tell the curve which direction to head when leaving a point, and which direction to arrive from. Longer tangents = faster movement through that section.

02 Derivatives: The Velocity Along the Curve

The derivative of the spline at any point tells you the velocity - both direction and speed. This is crucial for animation: it determines how fast an object moves through each part of the curve.

First Derivative (Velocity)
P'(t) = h₁'(t)·P₀ + h₂'(t)·T₀ + h₃'(t)·P₁ + h₄'(t)·T₁

where:
  h₁'(t) = 6t² - 6t
  h₂'(t) = 3t² - 4t + 1
  h₃'(t) = -6t² + 6t
  h₄'(t) = 3t² - 2t

Notice something important: even if you move through t at a constant rate, the speed along the curve varies. Tight curves have high velocity magnitude, straight sections have lower velocity. This is the problem arc-length parameterization solves.

Scrub t: 0.50

03 The Arc-Length Problem

Here's the challenge: we want objects to move at constant speed along the curve. But if we just increment t uniformly, speed varies wildly because the curve isn't uniformly distributed in space.

The solution is arc-length parameterization: instead of asking "where is the curve at t=0.5?", we ask "where is the curve at 50% of its total length?"

To do this, we need to know the arc length. The formula is:

Arc Length Integral
s(t) = ∫₀ᵗ |P'(u)| du

     = ∫₀ᵗ √( (dx/du)² + (dy/du)² ) du

Here's the problem: for cubic polynomials, this integral has no closed-form solution. You're integrating the square root of a quartic polynomial - it produces an elliptic integral, which can't be expressed with elementary functions.

Why No Closed Form?

It's not that we haven't found the formula yet - it's been mathematically proven that no formula exists using standard functions (polynomials, trig, exponentials, logs). This is a fundamental limitation, not a gap in our knowledge.

04 The Approximation Solution

Since we can't compute arc length exactly, we approximate. The most common approach: sample many points along the curve and sum up the straight-line distances between them.

Piecewise Linear Approximation
s ≈ Σᵢ |P(tᵢ₊₁) - P(tᵢ)|

For n samples:
  t₀ = 0, t₁ = 1/n, t₂ = 2/n, ..., tₙ = 1

Total length ≈ sum of all segment lengths

We build a lookup table mapping cumulative arc length to parameter values. Then to find "the point at distance d", we binary search the table and interpolate.

Samples: 10 Error:

More samples = better accuracy, but also more memory and computation. In practice, 50-100 samples per segment is usually enough for smooth animation.

05 See the Difference

Watch the same curve animated two ways: with naive t parameterization (left) vs arc-length parameterization (right). Notice how the left object speeds up on curves and slows on straight sections.

Naive (uniform t)
Arc-Length Parameterized

06 The Original Project

This interactive explainer is based on a C++/OpenGL project I built for CSC 473. The original implements everything above - Hermite splines with Catmull-Rom tangent generation, arc-length parameterization via lookup tables, and quaternion-based orientation to keep objects aligned with the path.

Original C++ Hermite Spline project - car following a 3D path