XXX4Fans
3blue1brown from patreon
3blue1brown

patreon


Quaternions and spatial rotation (beta)

Hey everyone,

Alright, three things for you in this post!  The video above is a sort of preamble into the main event.  That main event is a collaborative project done with Ben Eater, and it will be a kind of interactive video, where you can pause and play with the visuals at any point.  All web dev for this is thanks to Ben.

Right now, for the private/beta release, the interactive and the walk-through video are separate pieces:

- A video of me doing a lesson about how quaternions act as rotation using the applet.

- The applet itself.

Ultimately we'll meld both of these together for something awesome, but first I want to get feedback from all of you about the lesson and the applet.  That way we don't have to redo any of the work associated with linking them together.

You'll notice in the lesson that I mention having a separate walkthrough for those who want a refresher on stereographic projection.  I have yet to record that, but for the moment, if you are feeling rusty from the last video, it might be worth a second viewing.

-Grant

Quaternions and spatial rotation (beta)

Comments

In some of the re-recordings and expansions I'm doing, hopefully this point will be more clear.

3blue1brown

Glad you like it!

3blue1brown

Because we have chosen projection onto the ijk space, only the ijk sphere stays in place, while the other 3 get warpped into the planes (ij, ik, jk) we see in 3d.

The applet is so cool!!! It's really rad to be able to see which unit spheres to turn on and TURN ON ALL OF THEM AND COMPREHEND THAT THEY ARE PERPENDICULAR IN 4D SPACE wow

I see, thanks for your reaction! Does it mean that all four unit spheres (1ij, 1ik, 1jk and ijk) are intersections between the hypersphere and the 3D space?

The 4d unit hypersphere gets projected to fill up the entire 3d space. The 3d unit sphere is where the hypersphere intersects the 3d space (i.e. "equator" of the hypersphere.

I really, really like the animations you have made on quaternions. As an Aerospace Engineering student at TU Delft, it's really helpful to have such an intuitive visualization tool at hand. However, one thing in the 4D case that isn't completely clear to me, is whether only the points on the projected spheres and circles represent points on the unit hypersphere, or whether all points in the 3D projection space do. Maybe it would be helpful if the answer to this gets emphasized as much as the fact that only the projections morph and stretch and not the actual shapes does already. This is definitely a minor thing though. Thank you very much for your great contribution to my engineering skills. I will definitely recommend your videos and the applet to all my fellow students and teachers at TU Delft!

Let's talk about merch! I think a quaternion shirt/ poster would be amazing! Simply having the image of each version when it has the next dimension is shown on it would look awesome

Hmm, when you say angular distance what exactly do you mean? The angular distance traveled by any given point on the rotating 3d object?

3blue1brown

Is it safe to state that using quaternions to interpolate between any two arbitrary orientations is always the shortest angular distance, and hence the reason it is prefered to other methods? My gut tells me it is so, but I have no proof.

The interactive tool gives great intuition into quaternion transformations. Took a while to realize that manipulation involves the current and prior factor manipulated. Would be nice to explore 3 or 4 factors changing as one is changed.

Reginald Carey

It's probably already be said, but it would be nice to have the ability to manually input values for the coefficients, instead of having to drag them.

It's a nice touch to have the adjustments automatically stop at 0.71

Poker Chen

Hitting "Reload" in the browser should do that (at least my Chrome browser has a reload (circular arrow) in the upper left right next to the URL field)

Gregor Shapiro

Nicely done. The application gives a great intuition about quaternion transformations. Your concise videos bring context and structure to the topic and the visualization tool. I hope one day, all complex topics are available via automated interactive voice / video tools to which this is a precursor.

Reginald Carey

Would you mind taking a look again? My hypothesis is that your computer/browser/etc. doesn't support WebGL. With any luck, you'll now see an error page explaining the situation. If not, I have some more head-scratching to do.

Ben Eater

I accidentally selected (highlighted) some of the control text and it took a few clicks to unhighlight, and it broke the immersion. Here is the information you you (Ben) to fix that: <a href="https://stackoverflow.com/questions/826782/how-to-disable-text-selection-highlighting/4407335" rel="nofollow noopener" target="_blank">https://stackoverflow.com/questions/826782</a>

Max Goldstein

Wow, I can't believe my wild wish on the previous video would become fulfilled so quickly! Great work, I'm very happy to be contributing to this in my small way! - The app is beautiful and can hardly be faulted on the desktop. On a touch device (my Android phone, using Chrome), I get the problem that the dashed circles and spheres (including the shaded areas on the planes in the 3D view) just won't show. Also controlling the numbers by dragging is a bit flaky: I can change them by dragging my finger, but when I let go they often (but not always) reset to the value before the drag. On some occasions after that they are "stuck" for a while before dragging works again - not sure what either causes or resets that. - 0ne thing I noticed while playing with the rotations from -1 to 1 for one value in one of the quaternions is that it's constrained to a 180° rotation. I reckon it's only by applying both q and inv-q multiplications one can cover a full rotation. That could deserve calling out. - To further encourage the viewers to play around with the app afterwards, maybe give some exercises in the description that helps them discover more relations? - Maybe it's already in your plans, but I suggest also uploading the interactive part as an ordinary video on YT as backup for viewers that can't or won't head over to the app. There will always be devices where the app won't work properly.

Martin S

The keyboard support seems inconsistent. I can use the arrow keys to change the perspective of the image, and I can tab to some of the controls in order to change them (the "p=" row, the "link" icon, and the angle toggle), but I can't seem to change the 1, i, j, or k values with the keyboard. It would be great if this were accessible without a mouse, and hopefully that is something that could be added in the future. Still, it's pretty amazing as-is!

David Henderson

A bit of a minor suggestion, but I think the user who starts by randomly fiddling around with all the buttons would appreciate a "reset" button. I also missed the ability to change values with the mouse wheel.

The Hopf fibration is indeed lovely. Have you seen this video? <a href="https://www.youtube.com/watch?v=AKotMPGFJYk" rel="nofollow noopener" target="_blank">https://www.youtube.com/watch?v=AKotMPGFJYk</a>

3blue1brown

Ok dude. This is awesome. I'm so happy you're doing this. I also want to see, within the next 5 years, the 3Blue1Brown Virtual/Augmented Reality / Artificial Intelligence Technical School implemented in every major city. This project just got me really excited. Further comment: I DEMAND A HOPF FIBRATION / INVARIANT VIDEO. DEMAND I say. And you already have half your tools in place for it, so no excuses, young man.

Jacob Mirra

Hmmm, yes, more labels in the 3d view would be helpful.

3blue1brown

Good to know, thanks. I'll pass that along to Eater.

3blue1brown

Great, thanks for the note, we'll look at it.

3blue1brown

I don't see any spheres or circles in my applet despite enabling everything. I'm using Chrome on Windows 10.

The reason for halving the angle becomes apparent quickly after seeing what left and right multiplication does in the applet. Thanks Grant and Ben. =] Some minor suggestions: - enable user to change the font size (sometimes I find it hard to distinguish the labels f(i) and f(j)) - a button to reset the stage - enable user to input/fix a point q, and then animate the processes of left-multiplying with q and right-multiplying with q*

Same in chrome Android

q^-1 = 1/|q|^2 * conj(q) just like in the complex numbers (or real for that matter) Edit: this follows from |q|^2 = q * conj(q)

I would love to have the 3D tab have options to show i and j points just like the 4D tab. It would enable us to make more of a link as we go up dimensions. It may also be useful to have a dial-based control to set the rotations, rather than a linear slider (especially to avoid hitting an arbitrary stop point at 0 and 360). Finally, the x, y and z axis labels in 4D confused me more than anything else. It's not defined what x, y, z actually mean and what they have to do with 1, i, j, k.

Some usability suggestions for the applet: * Allow double click editing of the numbers (or double tap editing for touch screens) * Allow the use of the scroll wheel while hovering over the number to change the numbers. I watched the video and it was clear that the click drag is fine for getting a feel of the output but for precision it is not ideal (e.g. such as when Grant was trying to set the angle to 45 degrees). Allowing direct input plus a scroll wheel adjustment would go a long way here

I just stumbled over Ben's channel and breadboard computer videos a few weeks ago, watched all of them and thought: "Man, this guy is like the 3blue1brown of electronics, how did I not find this ealier?" Needless to say, this collaboration makes me very happy. The applet appears to work as intended on my end, even on iOS. :)

Andreas Schuderer

In angle mode on the 3D screen, I'm getting some text wrapping sometimes, i.e. the box for the text isn't quite wide enough

Steve Chantry-Taylor

App works well in Firefox on Fedora, FYI

Steve Chantry-Taylor

On Windows Chrome in 4D mode nothing but the points are visibly plotted.

cinder_block

Wall-eyed would be nice as well.

cinder_block

How about a cross-eyed 3D view of 4D as an option in the app?!

Steve Chantry-Taylor

It should work fine on a Mac (I used one for development!) What model/year mac and what browser are you using? Also—a bit of a long shot—but if you try resizing your browser window, does that change anything? Thanks for testing it out!

Ben Eater

For the applet, I would suggest a toggle that allows the vector part of the quaternion (axis of rotation) to be the same for q1 and q2, as well as letting the angle go to the negative for the second one. This makes visualizing rotations easier. Also is the quaternion q^-1 analogous to the complex conjugate for complex numbers where we let each imaginary part go to its negative?

This is so damn cool. I played around with the applet in 2D, 3D, and 4D, and couldn't get it to glitch out or anything of the sort. A nit-picks though: I'm not sure if it's meant to run on Mac (it gives a blank white page on mine), but if it isn't then that might be worth mentioning earlier (sorry if you do mention it in the 'tutorial' vid, I haven't had a chance to watch that all the way through yet). Otherwise it works quite smoothly; the snapping at common angles is quite helpful and the interface simply works. Funnily enough I was recently given stereographic projections as part of a homework set in my GR class, so your work and my interests couldn't have lined up better. Thank you for this delight.

Only the rightmost pi creature is blinking (<a href="https://i.imgur.com/ax6YTWW.png)." rel="nofollow noopener" target="_blank">https://i.imgur.com/ax6YTWW.png).</a> I'm afraid the other two are frozen in stupor. Send help.

Brikir

Hi Grant! I just tried the applet and it looks and feels amazing, it really suits the styling of the rest of your videos. I hope there's an easy way for you to expand you maths animation library to also let you create these applets in the future. Also, I ran the applet on an Android phone in landscape and it worked a treat. However it might be good to put a note in the description that says to modify the parameters, you tap on them and then drag. Aside from that, flawless.

Zac Harrold


Related Creators