I often found myself working with quaternions and unable to really understand them. What rotation is (0.7, 0, 0.7, 0) really? And what happens if w is increased? So I created a website to do just that: Visualizing quaternions and converting them to euler angles (and back).

You can enter your own values in the text fields or drag the sliders on the right. I plan to also include a calculator (chaining multiple rotations, calculating rotation matrices, …) as well as an explanation for quaternions that uses the visualization from the first page for explaining (so that you can play around with it, change values and see how the axis of rotation reacts to it). What do you think about that?

This is my first website, so be sure to tell me about any issues that arise! It should work on mobile as well (uses WebGL), but please tell me if it doesn’t.

Oh man, I never thought about you all here finding this!
My reddit name is /u/Ponzel, I’m the creator of the site.

Man, this place looks a lot different from when I last visited it about one and half years ago. Congrats on the change! (Maybe some of you remember me - I suspect not, but hey, you never know )

Anyways, it’s nice to see you all here doing well and I’m so happy that you found this site and think it’s good. If you have any questions, ask away.

To be clear, I didn’t mean to detract from the coolness.

I think sometimes people spend too much time trying to understand what’s inside a quaternion and then fail to learn even how to use them properly. Best to know how to employ them well, first, and swing back to possible understanding in your leisure time.

It seems very unlikely that a person will ever look at a quaternion’s values and go “Oh! I know where my rotation has gone wrong!” Matrixes, yes. Quaternions, no.

Yes, quaternion is different then angle+axis, but it is very similar as well. Quaternion’s x,y,z is the axis you rotate around. An axis can be represented by any vector, not only normalized one, and that is the case here.

eg if you make a quaternion

q.fromAngleAxis(angle=0.35f, new Vector3f(1, 1, 1));

Yes, that’s right. I think of quaternions the same way The_Leo described it.
I always imagine it like that: Take an object which is not rotated. Now you can put an axis through its center of mass, the axis points to any random direction. Now rotate the object around this random axis of rotation by a value in [0…TWO_PI]. Simplest way to look at it.
The thing with those imaginary numbers is a good hint too. It’s mainly for the people who are inside math and like proofs and math concepts and such.

The first three values of a quaternion are the scaled axis but it’s probably best not to analyze them much more than that. The idea of the “imaginary numbers” is important because that’s what’s used to project it onto the 4 dimension unit sphere.

And too many people read both of your descriptions and think “angle axis”… and then try to do stuff with those values… like manipulate them directly. You cannot. Once you make a quaternion the values are all directly intertwined and changing any of them on its own no longer makes any sense. Like, you want to change ‘w’ and now the quaternion is invalid because the rotation was also part of x,y,z.

Yes, but you can renormalize a vector… and a vector of non-unit length is still a vector.

If you change the ‘w’ of a quaternion without the other components you are in a no-mans land. It is no longer a quaternion and you can no longer get back to where you were to figure out the proper valid quaternion.

To me, if one wants to understand what a quaternion represents then the best, least ambiguous way, is to turn it into a 3x3 rotation matrix. Then each column is an axis vector and you can trivially visualize what that means just by looking at it.

Okay, that’s interesting. And you are sure that there is no “renormalization” for quaternions out there?

Anyways, I mostly use ‘fromAngleAxis’ and ‘mult’ and sometimes ‘inverse’. That’s all I need from those little monsters. Ehm no, I forgot ‘slerp’ (another great advantage of 'em). But never directly manipulated quaternion values - except from my ancient math lib I made with Qt and C++ - that was the last time I went so deep into the rabbit hole, and it was mainly copying formulas from the web and from the lectures.

You can renormalize it but then it won’r represent just a tweak to rotation… it’s a completely different quaternion.

I love them. They are unambiguous in a sea of ambiguous representations. And basically still the fastest way to concatenate rotations, multiply positions, etc… Matrixes are nice but they will go out of whack after lots of rotations. Quaternions don’t really do this. At worst you’d have to renormalize.

Yepp, remember the old days when I had to do these “corrections on matrices” myself. I still like matrices though, because I almost immediately can see scale, position and rotation when looking at them. But the mathematical beauty of quaternion beats that of course.