# Lesson 5: Multiplying quaternions: two turns become one

Source: https://quaternion.steppeschool.com/quaternion-multiplication/ (part of "Quaternions, Visually" by Steppeschool, free)

Multiplying two quaternions gives one quaternion that does both turns. This is the most useful thing about them. But the order matters, and we see exactly why.

## 5.1 The rules for i, j and k

We multiply quaternions like normal brackets, term by term. We only need to know what happens when two imaginary units meet. In the table, take the row first and then the column: row i, column j gives i·j = k. To remember the signs, go around the circle i → j → k: in the direction of the arrows the result is positive, against the arrows it is negative.

- × | 1 | i | j | k

- 1 | 1 | i | j | k

- i | i | −1 | k | −j

- j | j | −k | −1 | i

- k | k | j | −i | −1

Notice that $i\,j = k$ but $j\,i = -k$. Swapping the order flips the sign. That’s the first hint that order matters.

## 5.2 The product, written for code

We write the quaternion product with the sign ⊗, so that nobody confuses it with a normal multiplication.

**A simple case first.** We multiply like normal brackets and use the table when two units meet:

$$(2 + 3i)(4 + 5j) = 8 + 10j + 12i + 15\,ij = 8 + 12i + 10j + 15k$$

**Two turns about the same axis.** Take a turn of α about z, then a turn of β about z. With a = α/2 and b = β/2:

$$[\cos b,\ 0,\ 0,\ \sin b] \otimes [\cos a,\ 0,\ 0,\ \sin a] = [\cos(a+b),\ 0,\ 0,\ \sin(a+b)]$$

Multiply out (cos b + k sin b)(cos a + k sin a) with k² = −1, then use cos a cos b − sin a sin b = cos(a+b) and sin a cos b + cos a sin b = sin(a+b). The angles add, exactly like the complex numbers in lesson 3.

> **Interactive visual: Two turns about the same axis.** **Try it:** two turns about z, one after the other. The green outline is the object after the first turn. The product of the two quaternions is always the quaternion of the sum of the angles.

**The general case.** Doing the same with all four parts of $p$ and $q$ gives 16 small products. Collecting them by 1, i, j, k gives four lines. We write them once in code and never think about i, j, k again:

$$\begin{aligned}
w &= p_w q_w - p_x q_x - p_y q_y - p_z q_z\\
x &= p_w q_x + p_x q_w + p_y q_z - p_z q_y\\
y &= p_w q_y - p_x q_z + p_y q_w + p_z q_x\\
z &= p_w q_z + p_x q_y - p_y q_x + p_z q_w
\end{aligned}$$

There is a shorter way to write the same thing. Write each quaternion as a number and a vector, $p = [p_w, \mathbf p]$. We need two operations on vectors. The dot product $\mathbf p\cdot\mathbf q = p_x q_x + p_y q_y + p_z q_z$ is a number. The cross product $\mathbf p\times\mathbf q$ is a vector perpendicular to both. It is zero when the two are parallel, and it changes sign when we swap them.

$$p \otimes q = \big[\ p_w q_w - \mathbf p\cdot\mathbf q,\ \ \ p_w\mathbf q + q_w\mathbf p + \mathbf p\times\mathbf q\ \big]$$

The cross product p × q changes sign when we swap p and q. That is where the order comes from.

## 5.3 Order matters, and you can see it

The meaning: $q_B \otimes q_A$ means "turn by A first, then by B", both about the world axes. Read it from right to left, like f(g(x)) in math, where g acts first. We see the reason in lesson 6: the vector sits in the middle, $q_B \otimes (q_A \otimes v \otimes q_A^*) \otimes q_B^*$, and the quaternion closest to it acts first.

> **Interactive visual: Two different axes: order matters.** **Try it:** keep A = x and B = z, and press **Play both**. Left: a turn about x, then a turn about z. Right: z first, then x. The objects end up in different orientations, and the numbers in the panel differ. You can also drag the Progress slider to go through the two turns slowly. Then set A and B to the same axis: now the order does not matter.

Let’s check the left one by hand. $q_A = [0.707, 0.707, 0, 0]$ and $q_B = [0.707, 0, 0, 0.707]$. Put them into the four lines, with $q_B$ as p and $q_A$ as q. The w line gives 0.707 × 0.707 − 0 − 0 − 0 = 0.5. The y line gives 0 − 0 + 0 + 0.707 × 0.707 = 0.5. The x and z lines also give 0.5. So $q_B \otimes q_A = [0.5, 0.5, 0.5, 0.5]$. From lesson 4 we know this one: 120° about the diagonal. Two 90° turns became one 120° turn, about an axis that is neither x nor z.

## 5.4 Undoing a turn: the conjugate

To turn back, we flip the axis and keep the angle. For a quaternion, that means flipping the sign of x, y and z. We call it the conjugate $q^*$:

$$q^* = [\,w,\ -x,\ -y,\ -z\,] \qquad q \otimes q^* = [\,1,\ 0,\ 0,\ 0\,]$$

For a unit quaternion the conjugate is also the inverse: the turn, then the opposite turn, is no turn.

> **Interactive visual: The conjugate undoes a turn.** **Try it:** press 1, then 2. The conjugate has the same angle about the opposite axis, so it brings the object back exactly.

**Remember:**
- p ⊗ q is generally not equal to q ⊗ p.

- q_B ⊗ q_A: first A, then B (world axes). Read right to left.

- The opposite turn of q is q* = [w, −x, −y, −z].

## ✓ Check yourself

**Q: What is $k \cdot i$? And $i \cdot k$?**

k·i = j (with the arrows). i·k = −j (against the arrows).

**Q: Two turns about the same axis, 30° and 50°. Does the order matter?**

No. Both give 80° about that axis. The cross product of two parallel vectors is zero, so the order makes no difference.

## Sources and further reading

- J. Solà, "Quaternion kinematics for the error-state Kalman filter", 2017 <https://arxiv.org/abs/1711.02508>: section 1.2: the product in both forms used here
- J. B. Kuipers, "Quaternions and Rotation Sequences", Princeton University Press, 1999 <https://press.princeton.edu/node/24018>: chapter 5, quaternion algebra. The book mostly turns the frame, not the vector, so q and q* swap places