Good Boy Ninja
Tools for Motion Designers
The trick to achieve the South-Park animation style is to divide a number, round it and then multiply it back the same amount.
This behaves like snapping something to a grid. If we divide and multiply by 20, the spacing between the grid cells will be 20 pixels.
Snapping Position (or other 2 dimensional properties)
Snapping Rotation (or other 1 dimensional properties)
Bonus: Creating a snap function that can be applied to both kinds of properties
In this example we created a function that snaps a value to a specific increment just like before.
Additionaly, we can use the power of JavaScript to automatically check if the value given to the function is an array, and if it is to snap each value independently and return the result as an array as well.