-
-
Notifications
You must be signed in to change notification settings - Fork 1.2k
Description
A clear and concise description of what the feature is
Hi, take a look at M3 Expressive's motion physics system.
It's a design pattern for animating objects in UI. Main parts are stiffness and damping take a look at the image below
I've come to realize that we can adapt stiffness and damping from M3 Expressive to React Spring. I'm facing some obstacles with adapting damping though.
I see that tension is good as stiffness value from m3 expressive, but friction needs some factor like this
`
const mass = 1;
const stiffness = 1800;
const damping = 0.6;
const tension = stiffness;
const friction = 2 * damping * Math.sqrt(stiffness * mass);
`
I'm not sure that i'm doing right with the formula, what do u think?
https://codesandbox.io/p/sandbox/staging-snow-sqlvdx?file=%2FApp.js%3A15%2C31
Why should this feature be included?
M3 Expressive is a great standard for spring animations. It makes UI alive and fluid
Please provide an example for how this would work
https://codesandbox.io/p/sandbox/staging-snow-sqlvdx?file=%2FApp.js%3A15%2C31