## Intro

Quaternions have been always a tough subject to understand for those without a deep mathematical background. They’re built on top of imaginary numbers, and let’s be honest, imaginary numbers aren’t the easiest things to understand. So to make my life a little bit easier, I always try to get a geometrical interpretation of those hard mathematical concepts that often slip my mind. So this is my attempt at doing exactly that, get a geometrical interpretation of what a quaternion does when it is used to rotate a point in 3D space.

## Basics

So, first of all, what’s a quaternion? I’m not going to explain anything fancy about them, just the basic concepts we will need for our geometrical journey. A quaternion is composed of four elements ** q = ⟨q_{x}, q_{y}, q_{z}, q_{w}⟩**. Here we can identify two parts, the vector or imaginary part, let’s call it

**, and the scalar or real part**

*q*_{v}= ⟨**q**⟩_{x}, q_{y}, q_{z}**. When we’re using quaternions to rotate things, they should be normalized quaternions, and in that case, we have the following data encoded in them:**

*q*_{w}- q
_{v}= ⟨q_{x}, q_{y}, q_{z}⟩ = v̂ · sin(α/2)_{(a)} - q
_{w}= cos(α/2)_{(b)}

where** v̂** is the normalized axis vector we’re going to rotate around, and

**α**is the angle of the rotation itself. Here we have an important point: a quaternion “represents” an axis and an angle of rotation, so we want to visualize how exactly those elements are applied to rotate a vector in terms of geometry (vectors, points, angles, etc).

## The Problem

Imagine that you have your point ** p**, and you want to rotate it around an axis vector

**an angle of**

*v̂***degrees. Then you can transform that point using quaternions in at least three ways:**

*α*- The canonical method says that you should use something called Hamilton multiplication
. That implies the use of the conjugate and applying two times the multiplication. We can forget about it because it’s not going to help us in our path to a geometrical interpretation.*q·p·q′* - You can use a matrix that represents the rotation encoded by a quaternion. As before, nothing helpful for our purpose.
- In video game programming, we usually use a simplified form that let us transform a vector by the axis/angle rotation encoded in a quaternion, the Fabien Giesen simplification (thank you Mr. Giesen for your fantastic work). This expression was developed to get a more performant operation because it involves fewer adds/multiplications than the Hamilton canonical product. And this form is going to be our door to achieving our goal of understanding the quaternion in geometrical terms. Here is this beauty:

q·p = p + 2 * (q_{v} x (q_{v} x p)) + 2* q_{w} * (q_{v} x p) _{(c)}

It’s still not clear what is going on here, but we can start to see geometrical elements that are going to be the key to our interpretation. We can say a couple of things by looking at the components of the expression: we have the sum of our point and two perpendicular vectors. We know that they are vectors because they are the result of two or more cross-product multiplied by some scalars (** 2** and

**which if you remember is**

*q*,_{w}**from (b) ). And it’s clear that they are perpendicular if you take:**

*cos(α/2)*t = (q_{v} x p)** ** _{(d)}

applying to (c):

q·p = p + 2 * (q_{v} x t) + 2 * q_{w} * t (e)

so we have two vectors:

2 * q_{w }* t _{(f)}

2 * (q_{v} x t) _{(g)}

Forgetting about the scalar parts (* 2 * q _{w}* in (f) and

*2*in (g)), we can see that in (g) we have a cross product of

**and**

*q*_{v}*, and the result of a cross product is always a vector perpendicular to both initial vectors. So (g) is some vector perpendicular to (f). A point and two perpendicular vectors, is that good? Yes, that’s exactly what we’re looking for. Let’s think about what a 3d rotation should look like.*

**t**## Axis/angle rotation in 3D

When we want to rotate a point **p** around a ** v̂** axis and an angle α we get:

b = v x p _{ (h)}

a = b x v _{(i)}

when **p** rotates around** v̂ **, we can visualize a circumference with its center in

**s**(the projection of

**on**

*p***). This circumference lies on a plane with normal**

*v***. And we can think on two**

*v***perpendicular**axes

**and**

*a***, which creates the basis for a 2D space on the plane previously mentioned. This is a derivation of the Rodrigues rotation formula. We can calculate**

*b***and**

*b =***x p***v̂***. Again, two perpendicular vectors. Does any of this ring a bell? We’re getting close. So we can reduce our 3D rotation to a simple well-known 2D rotation like this:**

*a = b x v̂*Where ** p’ **is simply

**. When we give**

*a * cos(α) + b * sin(α)***α t**he values in the range [0..2

*π*] we get this:

This is nice but it would be nicer if we could express the rotation in terms of our initial point **p**, using that point as the origin of this reference system instead of the center of the circumference **s.** That can be done easily with this transformation: ** p’ = p + (1 – cos(α)) (-a) + b * sin(α).** Now we use the vector

**with the opposite direction (**

*a***now is calculated as**

**instead of**

*b x v̂*

*v̂*

*x***) and**

*b***that instead of going from 1 to -1 when**

*(1 – cos(α))***α**goes from 0 to

*π*, goes from 0 to 2. And that’s exactly what we need to get the same circumference but expressed from the point of reference

*.*

**p**With this new idea, we can express our initial 3d rotation like:

p’ = p + (1 – cos(α)) (v̂ x (v̂ x p)) + sin(α)(v̂ x p) _{(j)}

Wow, this looks super familiar, doesn’t it? We have the Giesen form of the vector/quaternion transformation and an expression that comes directly from the geometrical interpretation. If we can prove that both are the same, we will reach our goal. Let’s do it:

p + 2 * (q_{v} x (q_{v} x p)) + 2 * q_{w} * (q_{v} x p) =

p + (1 – cos(α)) (v x (v x p)) + sin(α)(v x p)

is this equality true?

Let’s analyze each of the components of the sum:

- p = p
- 2 * (q
_{v}x (q_{v}x p)) = (1 – cos(α)) (v x (v x p)) - 2 * q
_{w}* (q_{v}x p) = sin(α)(v x p)

The first one is easy, so let’s go with the second one:

**2 * (q _{v} x (q_{v} x p)) **

we can use **q _{v} = sin(α/2) * v̂** and we get:

**2 * (sin(α/2) * v̂) x ((sin(α/2) * v̂) x p) **

now we can group **sin(α/2)**:

**2 * sin(α/2) ^{2} * (v̂ x (v̂ x p)) **

and finally using **2 * sin(α/2) ^{ 2} = 1 – cos(α)**, we reach our goal:

**(1 – cos(α)) (v̂ x (v̂ x p))**

Only one more left, let’s dig into the third one:

**2 * q _{w} * (q_{v} x p) **

we can expand qw using **q _{w} = cos( α/2)**:

**2 * cos( α/2) * (q _{v }x p) **

again, using **q _{v }= sin( α/2) * v̂**:

**2 * cos( ****α/2) * sin(α/2) *(v̂ x p) =**

and finally, we can apply the double-angle identity** 2 * cos( α/2) * sin(α/2) = sin(α)**, which gives us our goal:

**sin(α) *(v̂ x p)**

So indeed we have proven that* p + 2 * (q_{v} x (q_{v} x p)) + 2 * q_{w} * (q_{v} x p) = p + (1 – cos(α)) (v x (v x p)) + sin(α)(v x p)*, and then from now on, we can understand how the components of the Giesen form of the vector/quaternion transformation correspond to the initial point

**p**, and two perpendicular axes multiplied by the corresponding magnitudes (1-cos(

**α**) and sin(

**α**)) to perform exactly the axis/angle rotation that we theorically know that it performs.

**q.p = p + 2 * (q _{v} x (q_{v} x p)) + 2 * q_{w} * (q_{v} x p)**

That’s the end of our journey, and I hope that all of this makes sense to you and helps you a little bit in order to better understand our previously feared and now beloved quaternions. Remembering the above diagram will give you the power from now on to understand what exactly a quaternion is doing in a geometrical/visual way.

Thanks to: Jose Moreno and Juan José Lledó for their suggestions to improve this post.

## One response to “Quaternions: a geometrical interpretation.”

[…] статье представлена визуальная интерпретация математики кватернионов, […]

LikeLike