Interference Patterns

Wave Interference: When Sine Waves Collide

Or: Making hypnotic patterns with basic trigonometry

The Beauty of Interference

Wave interference is one of those phenomena that’s simple in concept but mesmerizing in practice. When two waves overlap, they can reinforce each other (constructive interference) or cancel each other out (destructive interference). The result? Those beautiful moiré patterns you see when two chain-link fences overlap, or when you look through two layers of sheer fabric.

In this demo, we create two circular wave patterns emanating from moving center points, then combine them in various ways to produce different visual effects.

The Core Concept

Each wave pattern is essentially a series of concentric circles radiating from a center point. The brightness at any pixel depends on its distance from the center:

float distance = getDistanceToCenter(x, y);
float wave = sin(distance * frequency + time);

The magic happens when you have two center points that move independently:

// Two oscillating centers
int center_x1 = width/2 + sin(time * 0.5) * width/2;
int center_y1 = height/2 + sin(time * -0.2) * height/2;
int center_x2 = width/2 + sin(time * -0.7) * width/2;
int center_y2 = height/2 + sin(time * 0.1) * height/2;

Each center traces its own path across the screen, creating constantly shifting interference patterns.

Seven Ways to Combine Waves

The interesting part is how you combine the two wave values. This demo offers seven different modes:

Mode 0: Add - Simply add the two wave values together. Where both are positive, you get white. Where both are negative, black. Mixed areas create the interference fringes.

Mode 1: If Sum > 0 - Binary threshold on the sum. Creates sharp, high-contrast patterns.

Mode 2: Average - Takes the mean of both waves. Smoother than addition.

Mode 3: Only Pattern 1 - Shows just the first wave source. Useful for understanding what each contributes.

Mode 4: Only Pattern 2 - Shows just the second wave source.

Mode 5: If Either > 0 - OR logic. White if either wave is positive. Creates denser patterns.

Mode 6: Binary OR - Bit manipulation on the sign bits. A fun hack that produces interesting results:

uint32_t sign1 = (*(uint32_t*)&int1) >> 31;
uint32_t sign2 = (*(uint32_t*)&int2) >> 31;
uint8_t color = sign1 | sign2;

The Black and White Aesthetic

Unlike the colorful plasma effect, interference patterns work best in stark black and white. The binary nature emphasizes the wave structure - you can clearly see the constructive and destructive interference zones. It’s like looking at a physics textbook illustration, except it’s moving and hypnotic.

#define PALETTE_SIZE 2
static uint32_t palette[PALETTE_SIZE];

void initPalette() {
    palette[0] = 0xFF000000; // Black (ARGB)
    palette[1] = 0xFFFFFFFF; // White
}

Performance: LUTs Strike Again

Just like with the plasma effect, we use lookup tables for performance:

1. Distance LUT - Pre-calculated distances from every pixel to every possible center position (at 2x resolution for smooth movement)
2. Sine LUT - 4096-entry table for fast sine approximation

The distance LUT is the expensive one - it needs to cover a range larger than the screen since the wave centers can move around:

void initDistanceLUT() {
    int width = getCurrentCanvasWidth() * 2;
    int height = getCurrentCanvasHeight() * 2;

    distanceLUT = (float*)malloc(width * height * sizeof(float));

    for (int y = 0; y < height; y++) {
        for (int x = 0; x < width; x++) {
            distanceLUT[y * width + x] = getDistanceToCenter(x, y, width, height);
        }
    }
}

Try It Yourself!

For a full screen version of the interference effect go here.

Try switching between modes to see how different combination methods produce dramatically different patterns. Mode 1 and Mode 6 give you the sharpest contrast, while Mode 2 is the smoothest.

The Physics Connection

What we’re simulating here is analogous to real wave interference - the same phenomenon that creates:

• Moiré patterns in overlapping grids
• Newton’s rings in optics
• Interference fringes in the famous double-slit experiment
• Beat frequencies in audio

The math is the same whether you’re dealing with light, sound, or pixels on a screen. Two periodic functions, when combined, create these emergent patterns that seem far more complex than their simple origins would suggest.

Conclusion

Interference patterns demonstrate how complexity can emerge from simplicity. Two sine waves, two moving points, and some basic arithmetic - that’s all it takes to create endlessly fascinating visuals. The seven combination modes show that even with the same input waves, the method of combination dramatically affects the output.

Sometimes constraints breed creativity. A two-color palette forces you to think about the fundamental wave structure rather than hiding imperfections behind color gradients. And honestly, there’s something timeless about black and white graphics - they could run on a 1980s computer or a 2025 browser, and they’d look equally striking on both.

Technical Summary:

• Wave sources: 2 independently moving center points
• Combination modes: 7 different methods
• Palette: Binary (black and white)
• Optimizations: Distance LUT (2x resolution), Sine LUT (4096 entries)
• Resolution: Supports multiple aspect ratios (4:3, 16:10, 10:16)