Tuning a Game Character's Jump

A platformer's jump arc can start as one simple curve, a unit hop. Shifting it moves where the jump peaks, stretching it vertically makes it higher, and stretching it horizontally makes it longer. Designers tune a jump by transforming one base curve.

How it works

Transformations of graphs, and symmetry

In one sentence

For a function $f$ , the graph of $y = A\,f\!\left(\frac{x - h}{w}\right) + k$ is the graph of $f$ stretched vertically by $A$ (reflected if $A < 0$ ), stretched horizontally by $w$ , then shifted right by $h$ and up by $k$ . If $f$ is even ( $f(-x) = f(x)$ ), the transformed graph is symmetric about the line $x = h$ .

General formula

y = {\htmlData{sym=0}{A}}\,{\htmlData{sym=1}{f}}\!\left(\frac{x - {\htmlData{sym=2}{h}}}{\htmlData{sym=3}{{w}}}\right) + {\htmlData{sym=4}{k}}, \qquad {\htmlData{sym=1}{f}}(x) = 1 - x^2

Changes inside the function act on x, horizontally, and feel backwards: x − h moves the graph right. Changes outside act on y, vertically.

What the symbols mean

$A$
Vertical stretch
Multiplies every height: the jump's peak height.
$f$
Base arc
The unit hop 1 − x², from −1 to 1 with height 1.
$h$
Horizontal shift
Moves the arc right; the peak sits at x = h.
$w$
Horizontal stretch
Half the jump's length.
$k$
Vertical shift
Lifts the whole arc: the height of the ground it starts from.

Start from the base curve $f(x) = 1 - x^2$ : a unit hop from $x = -1$ to $x = 1$ with height 1.
Multiplying by $A$ stretches it vertically (height $A$ ), replacing $x$ by $x/w$ stretches it horizontally (length $2w$ ), replacing $x$ by $x - h$ shifts it right by $h$ , and adding $k$ lifts it by $k$ .
Changes inside $f$ , as in $f\left(\frac{x - h}{w}\right)$ , act on the input and move the graph horizontally; changes outside, $A\,f(\cdot) + k$ , act on the output and move it vertically.
Every transformed arc stays symmetric about its vertical line x = h, because f is even: the rise and the fall mirror each other. (Many games deliberately break this with stronger gravity on the way down.)

Learn the math

TransformationsAlgebra · Lesson 31, Common Graphs SymmetryAlgebra · Lesson 32, Common Graphs