> Source URL: /demos/tsp-demo/tsp.demo
---
title: "Teaspoon Programming: Wave Texture Builder"
---

[@wave-builder]: ./tsp.tags.md

# Wave Texture Builder

This demo illustrates **Task-Specific Programming (TSP)** — an approach to making programming more accessible by stripping it down to the essentials of a specific domain. Instead of learning a general-purpose language, students work directly with the mathematics.

The idea comes from Mark Guzdial's research on [teaspoon languages](https://computinged.wordpress.com/2019/10/04/computing-education-research-issues-in-task-specific-programming-precalculus-tsp-part-5-of-5/) for precalculus, where the **math is the notional machine** — students reason entirely in terms of wave functions, not programming constructs.

---

## How It Works

Each color channel (Red, Green, Blue) is controlled by a single wave function:

$$
Y = A \cdot \sin(F \cdot (x - P)) + O
$$

| Parameter         | Meaning          | Effect                         |
| ----------------- | ---------------- | ------------------------------ |
| **A** (Amplitude) | Wave height      | Controls color intensity range |
| **F** (Frequency) | Number of cycles | More cycles = finer stripes    |
| **P** (Phase)     | Horizontal shift | Slides the wave left/right     |
| **O** (Offset)    | Vertical shift   | Sets the base color level      |

Adjust the sliders below and watch three **linked representations** update together: the equation, the wave plot, and the texture.

---

<wave-builder />

---

## Linked Representations

The key insight from TSP research is that **multiple linked representations** help learners connect abstract math to concrete visual output:

1. **The equation** shows the symbolic form — pure math
2. **The wave plot** shows the function graphically — how Y varies with x
3. **The texture** shows the result — what happens when you map wave values to pixel colors

When you move a slider, all three update simultaneously. This tight feedback loop lets students build intuition about how wave parameters affect visual patterns — and that intuition transfers to understanding precalculus concepts like amplitude, frequency, and phase.

Try the presets to see how different parameter combinations create different patterns, then experiment with the sliders to create your own.


---

## Backlinks

The following sources link to this document:

- [Teaspoon Programming](/index.path.llm.md)
