from Hacker News

Show HN: Visualizing the math that powers 3D character animation

by diegomacario on 6/13/22, 12:37 PM with 53 comments

Hi everyone! I'm the author of this project. I wrote it because I think that the math that makes characters move in games and movies is incredibly beautiful, and I wanted to give others a glimpse into it.

It's crazy to think that quaternions, an abstract mathematical tool discovered by William Rowan Hamilton in 1843, would be so perfectly suited to solve hard problems in the world of 3D character animation more than a hundred years later. The story of how he discovered quaternions is also beautiful. Here's an excerpt from Wikipedia:

"Hamilton was looking for ways of extending complex numbers (which can be viewed as points on a 2-dimensional Argand diagram) to higher spatial dimensions. In working with four dimensions, rather than three, he created quaternion algebra. According to Hamilton, on 16 October he was out walking along the Royal Canal in Dublin with his wife when the solution in the form of the equation

i2 = j2 = k2 = ijk = −1

occurred to him; Hamilton then carved this equation using his penknife into the side of the nearby Broom Bridge (which Hamilton called Brougham Bridge)."

There's a plaque that commemorates that moment on Broom Bridge now.

If you have any questions about this project, I would love to answer them, but I recommend reading the README first, which should explain everything:

https://github.com/diegomacario/Animation-Magic/blob/main/RE...

Thank you!

  • by GuB-42 on 6/13/22, 6:16 PM

    On the subject of quaternions, here is an article that pops up on HN from time to time.

    https://marctenbosch.com/quaternions/

    It is called "Let's remove Quaternions from every 3D Engine". The author suggests replacing quaternions with rotors and geometric algebra. In 3D, the formulas are essentially the same, but framed differently. It makes some "surprising" properties more intuitive and is extensible to any number of dimensions. The last part is especially relevant to the author as he is developing "Miegakure", a 4D game (i.e. the game world has 4 spatial dimensions).

  • by aaaaaaaaaaab on 6/13/22, 8:16 PM

    Nice work, but displaying the time evolution of individual quaternion components is about as intuitive of a visualization as displaying the time evolution of an individual pixel to visualize video compression...

  • by Const-me on 6/13/22, 10:39 PM

    Cool project!

    AFAIK many games are using 3x4 bone matrices instead of 4x4. These matrices don't need projection component anyway i.e. 3x4 is enough.

    This saves some bandwidth updating the constant buffer with them, also takes slightly less math instructions in the vertex shader.

  • by proc0 on 6/13/22, 6:48 PM

    Really cool, thank you. This is the standard way of animating in most engines, right? I'm wondering if there are other techniques that save on sampling the data. Bones form a hierarchy and when the spine bone moves it affects the movement of all the other limbs, but I'm not sure if that's more or less expensive.

  • by saeranv on 6/13/22, 10:02 PM

    I'm a little confused about why the curves are "sampled" to update the joint transformations: ``` So if we are rendering 60 frames per second, we are basically doing the following 60 times a second:

    Sample all the curves you see on the graphs to get the orientation of each joint... ```

    When the curves are "sampled", does that mean in a 60 fps animation, there are 60 timestep values t={t1, t2, ... t60} sampled from a uniform distributions, and evaluated at x(t), y(t), z(t), and w(t), and then those values are stepped through sequentially? If that is the case, why not just set t={1/60, 2/60, ... 1}?

    Or does "sampling" here just mean function is evaluated at an appropriate t value, and not refering to statistical sampling?

  • by dwrodri on 6/13/22, 6:13 PM

    It's a gorgeous visualization, but it appears the UI is bugging out for me on Brave and Safari in MacOS. The layout has no issue, but I can't select any of the dropdowns.

  • by xaedes on 6/13/22, 6:27 PM

    Seeing glfw mentioned in your readme, I wanted to know how your (web) build process looks like. Gotta say I love this CMakeLists.txt It is so clean and simple!

  • by samstave on 6/13/22, 6:44 PM

    I AM IN LOVE WITH THIS DATA:

    But hear me out as to why:

    Surely - the amount of spatial kinematic maths that has been built around how we 'perceive' natural movement within a scene by object has been immense...

    ---

    I have an idea. (this is just off the cuff and what caused me to have goose-bumps immediately when I saw this):

    Actually -- I am going to email you... rather than post publicly.

    May you please update your profile with an email... or post a way to contact you here

  • by suyash on 6/13/22, 6:22 PM

    I don't see any math, only visualization, where is the mathematical concepts and equations explained again?

  • by barrysteve on 6/13/22, 8:54 PM

    I love this site, the animations have so much character!