Effective talk: Visual Guide to Quaternions Part 1
Year of Talk: 2023
Writers note: As quaternions can be hard to understand at times I've added some intro explanations for a more basic understanding in case someone might lack or have forgotten what they had learned in math class.
I am also going to warn any readers that trying to visualize this may feel a bit weird so it's a good idea to take breaks before your brain starts hurting. Not fully recommended if you get easily dizzy.
Intro definitions:
Position: For this context, a position is meant to represent a specific point in either a 2D or 3D point. This is usually demonstrated with 2 or 3 variables denoting whether it is 2D or 3D respectively.
2D position: A 2D position is a point or object that resides in a position on a grid containing a height (Up/Down) and length (Left/Right). This is normally represented with 2 variables X and Y for height and length respectively. Something like the screen you see/read this blog on is a 2d space where each pixel (position) has an X and a Y that helps determine what should appear there.
3D position: A 3D position has a similar dynamic to a 2D position but contains an extra variable representing the length (Forward/Backwards). It is normally defined using the variable Z. It helps determine what objects are in front or the back and how close one might be to them. A representation can be seen in the image below.
Though the variables of X, Y, and Z may change depending on the software but are still meant to represent the 3D position.
Quaternions: A 3D position that contains an extra 4th variable that defines the rotation of the object. It is normally defined with the letter W and will be used for the rest of this blog.
Duel Quaternions: A broader quaternion encompasses 3D translation of an object as well as Rotation AND Translation. This will be explained more deeply in a future blog.
Quaternions in depth:
When discussing a quaternion they tend to contain a certain line that represents a 180-degree rotation. As well as an Identity that does 0-degree rotation.
Quaternion lines (180 degrees):
When you have a vector with the following values {x = 0, y = 1, z = 0, w = 0} will cause the object to turn 180 degrees on the y-axis. As seen in the images below.
Base → Y quaternion
Meanwhile having a Quaternion with the following values {x = 0, y = 0, z = 1, w = 0} will cause the object to turn 180 degrees on the z-axis. As seen in the images below.
Base → Z quaternion
Finally, a quaternion with the following values {x = 1, y = 0, z = 0, w = 0} will cause the object to rotate on the x-axis. As seen in the images below.
Base → X quaternion
It works almost as if there is a poll that goes through the current variable in question and rotates the object around that poll. I've found that using a physical object also helps visualize how they move.
When doing Quaternion “multiplication” it implies that you are compositing various rotations together to get a final rotation. So if you have an object do first a 180-degree quaternion on the Y axis and then do it with a 180-quaternion rotation on the X axis. You end up doing the same movement that doing a 180 quaternion rotation on the Z axis gives. Essentially when transitioning between the Y quaternion and X quaternion you have multiplied both quaternions which give you the same transition as a Z quaternion. As seen in the images below.
Base → Y quaternion → X quaternion
Base → Z quaternion
Meanwhile, when doing quaternion addition you're instead just grabbing the average rotation being done to the object. As an example, when adding both the Y and Z quaternions for the following values {X = 0, Y = 1, Z = 1, W = 0}. I wasn't able to properly show off the same effect in Blender. But it seems to do either a 45 or 90-degree movement towards each variable equally. You can see the visual explanation in the YouTube video between minutes 6:00 and 6:45.
A big factor to consider during quaternion addition is the fact that the average final rotation is weighted based on the parts being added. So adding one part of the X quaternion and 2 parts Y quaternion gives you a 3 part quaternion leaning towards the Y quaternion. A numerical example is the following: {X = 1; Y = 0; Z = 0; W = 0}+{X = 0; Y = 1; Z = 0; W = 0} + {X = 0; Y = 1; Z = 0; W = 0}={X = 1; Y = 2; Z = 0; W = 0}{X = 0, Y = 1, Z = 0, W = 0} = {X = 1, Y = 2, Z = 0, W = 0}.
Whenever adding two quaternions with the same rotational effect they dont double the effect and can be normalized to a single value. An example is turning 2 Y rotation quaternions into just a single Y rotation quaternion. As seen here:
{X = 0; Y = 1; Z = 0; W = 0} + {X = 0; Y = 1; Z = 0, W = 0} =Normalize({X = 0; Y = 2; Z = 0; W = 0}) → {X =0; Y=1; Z=0; W = 0}
Identity Quaternion:
Unlike the previous type of quaternions, these give 0 degrees of rotation. This means that the object won't be affected through rotation. It is usually represented with the W variable as seen in the following equation.
{X = 0; Y = 0; Z = 0; W = 1}
Base → W (Identity) Quaternion
The principal way that an identity quaternion is used is by doing 90-degree movements toward a specific quaternion. An example when adding some Z Quaternion and an equal Identity Quaternion the resulting quaternion causes the object to move 90 degrees on the Z quaternion axis.
{X = 0; Y = 0; Z = 1; W = 0}+{X = 0; Y = 0; Z = 0; W = 1}
={X = 0; Y = 0; Z = 1; W = 1}
Another way of understanding this is the fact that as addition is just averaging multiple quaternions together then getting the average of 180 degrees and 0 degrees is 90 degrees as seen in the example above.
Something to consider is when applying a 0 quaternion on a model it will cause it to collapse. As a reference, it is the same as having a 0 matrix.
Linear interpolation (LERP):
For context, LERP is a mathematical equation that helps the user define how an object will transition from point A to point B over time. In quaternions, this means that an object will be able to transition between two different rotations over time.
Because I am principally working in photos and text I recommend you watch the GDC talk between minutes 11:18 and 16:20. The presenter has two live examples of a model having their quaternion being lerped over time.
An important factor in lerping quaternions is the fact that it does so clockwise or counterclockwise. So you can flip the direction that the quaternions rotate towards by multiplying by -1.
For example the following two quaternions {X = 0; Y = 0; Z = 0; W = 1}
And {X = 0; Y = 0; Z = 0; W = -1} will have the same effect where the model will rotate to the same angle. But the difference is while the first quaternion moves the model by 0 Degrees the secondary quaternion has the model rotate by 360 degrees. Essentially returning the same outcome but by two different methods. This means that doing an addition of a quaternion and the second quaternion leads to an average degree of 270.
Quaternion axis/angle:
Whenever you want to transition between the typical angle rotation to quaternion values you need to calculate it using the following equations.
quat.x = sin(angle/2) * axis.x;
quat.y = sin(angle/2) * axis.y;
quat.z = sin(angle/2) * axis.z;
quat.w = cos(angle/2);
An example of when you might do this is in Unity and you need to affect a certain object's angle/rotation (This being the rotation values you find in the inspector of any object) and pass them through a quaternion method.
A footnote on why we need the angle to be divided by 2 is that when a quaternion does 2 rotations in the same direction (Rotating 180 twice and adding up to 360) it causes the W variable to become -1. This means that the quaternion needs to rotate another two times for a final rotation of 720 degrees. Dividing the angle by two allows the angle to be normalized to a 360-degree circle.
The image above is a plot representation of how the different quaternion rotations would affect the rotation of an object as they increase or decrease over time.
This can be extended to the fact that if you multiply a quaternion like the 90-degree quaternion by -1. Leaving you with an object that does a 180-degree rotation. It means that the quaternion now looks as follows {X = 0; Y = 0; Z = -1; W = -1}. Which is 270 degrees counterclockwise or -270 degrees in the clockwise direction.
Quaternion Division:
Similar to quaternion multiplication, when dividing two quaternions B/A you need to first rotate the object by the inverse of A and then rotate by quaternion B. An example given during the presentation is to do it through vector translation. So if you are in city c and have the distance/vectors for 2 other cities (a,b) where you want to find the vector from city a to b. You would need to first reverse A (-1 * A = -A) where A is the vector from your current city c to city a which is then added to the vector from city c to city b. This leaves you with the equation for vector C as follows: -A + B = C.
If you get that idea and realize what you are doing is having the world rotate around a line so that someone can get from A to B.
Comments