Sliders & animation

Intermediate tutorial · 7 minute read

Sliders turn a static plot into a tiny interactive simulation. They are the single best way to understand a function — instead of guessing what each constant does, you watch.

Creating a slider

Type a variable definition on its own line:

a = 1

DesmosGraph automatically recognises that a is a free parameter and shows a slider with a default range of −10 to 10. Now you can use a anywhere in your other expressions:

y = a*x^2

Drag the slider and the parabola changes width and direction in real time.

Customising the range

Each slider has small min and max input boxes on either side. Change them to focus on the range you care about. For phase variables a typical choice is 0 to ; for amplitudes maybe −5 to 5.

Multiple sliders together

Combine sliders for more powerful exploration:

y = a*sin(b*x + c) + d
a = 1
b = 1
c = 0
d = 0

Now you have full control over amplitude (a), frequency (b), phase shift (c) and vertical shift (d) — the four classic transformations of a sinusoid.

Animation

Click the small triangle next to a slider's label. The parameter sweeps back and forth between min and max automatically. This is invaluable for:

Click the icon again to pause.

Lesson ideas for teachers

Quadratic transformations

y = a*(x - h)^2 + k
a = 1
h = 0
k = 0

Ask students to predict the effect of each slider before they touch it. Then verify.

Linear regression intuition

y = m*x + b
m = 1
b = 0

Plot a few sample points (you can add point coordinates as (2, 5)-style entries via implicit pairs in future updates) and let students adjust the line to fit visually.

The unit circle and trig

x^2 + y^2 = 1
y = sin(t)
t = 0

Animate t and discuss why sin(t) is the y-coordinate of the unit-circle point at angle t.

Smart use of sliders

Ready to dive deeper? Browse examples or read about our latest articles.