If you want to create the popular animation effects, you must understand some physics

[[150479]]

We will map our understanding of the world from childhood to adulthood to the screen world. So starting from the perspective of the principles of things, let's explore the motion curve.

This article does not go into the depths of the laws of physics themselves, but only talks about the application of motion curves. Students who have ever slept in class don’t have to worry.

First, let me quote the encyclopedia "Shenma is Physics": Physics is the study of the most general laws of matter movement and the basic structure of matter. As the leading discipline of natural science, physics studies the most basic forms and laws of motion of all matter, from the universe to elementary particles, and thus becomes the research basis of other natural science disciplines. Its theoretical structure fully utilizes mathematics as its working language and uses experiments as the only criterion for testing the correctness of the theory. It is the most precise natural science discipline today. (I guess you didn't read it carefully, but in short, physics is a very awesome discipline.)

I have always believed that motion design itself is a very important part of human-computer interaction, and we will map our understanding of the world from childhood to adulthood to the screen world. For example, the most common operations such as grabbing, throwing, and moving are basic instincts learned in infancy, so these actions are often instinctively applied to the screen operations we come into contact with when we grow up.

In the previous article, we have mentioned some principles of motion design (portal: UI China), and briefly wrote about how motion design can make users more comfortable. Well, today we will go deeper into this topic, how motion designers can use physical theory to make animation curves closer to the real world, and how to make your animation effects more dazzling like fireworks.

Let's start entering the physical world~~

[[150480]]

Isaac Newton (He was pretty handsome when he was young, but unfortunately...)

1. Newton's first law, also known as the law of inertia, was proposed by Newton in 1687

Any object will remain in uniform linear motion or at rest until an external force forces it to change its state of motion.

What is uniform linear motion?

[[150481]]

You can feel that its movement seems a bit boring, because the world we live in has gravity, air resistance, friction, etc. Let's take a look at the most common external force factor - friction, which is present in most movements in the real world.

1. Friction force F = μ × FN

The force that hinders the relative motion (or relative motion tendency) of objects is called friction.

Friction is a good kid who can move or be still. It has two forms:

A Static friction: When two objects in contact with each other have a tendency to slide relative to each other between their contact surfaces but remain relatively still, they exert resistance on each other to prevent relative sliding. This resistance is called static sliding friction, or static friction for short.

[[150482]]

It happens when the friction is high, and since it is relatively motionless, it keeps moving with the conveyor belt.

B Dynamic friction: When there is relative sliding between two contacting objects, the resistance generated on their contact surface that hinders the sliding of each other is called dynamic sliding friction.

[[150483]]

It can be seen that due to different materials, or factors such as braking, just remember that the rougher the surface of the object and the greater the pressure, the greater the friction, combined with Newton's second law below

You can simulate some motion curves with different feelings.

2. Newton's Second Law F=ma Proposed by Newton in 1687

The magnitude of an object's acceleration is directly proportional to the force acting on it, inversely proportional to the object's mass, and directly proportional to the inverse of the object's mass; the direction of the acceleration is the same as the direction of the force acting on it.

Simply put - the lighter the object or the greater the force it receives, the greater the acceleration:

[[150484]]

3. Newton's Third Law of Motion F=-F' Proposed by Newton in 1687

The action and reaction forces between two interacting objects are always equal in magnitude, opposite in direction, and act on the same straight line.

Common ones include bouncing, hitting, pulling, pushing heavy objects, etc. Anyway, it is everywhere, just don't forget it.

[[150485]]

Since we are talking about Niu San, we must mention one of its most important derivative laws:

1. Law of conservation of momentum m1v1+m2v2=m1v1′+m2v2′

#p#

If a system is not subject to external forces or the sum of the external forces is zero, then the total momentum of the system remains unchanged.

The law of conservation of momentum was originally a corollary of Newton's third law, but it was later discovered that its scope of application is much wider than Newton's law. A simple description is that when two objects with different speeds collide, there will be a "transfer" of speed. Students who play billiards should have a deeper understanding of this.

[[150486]]

4. Archimedean Principle F = γV

An object immersed in a stationary fluid (gas or liquid) is subject to a buoyant force equal to the weight of the fluid displaced by the object, directed vertically upward and through the centroid of the displaced fluid.

So the speed at which an object pops out of the water is proportional to its volume and mass, and the closer it is to the water surface, the faster it pops out. Look at the graph below:

[[150487]]

It can be found that the floating process is somewhat similar to the elastic curve because the direction of the external force keeps changing, which reminds me of Hooke's law (elasticity):

5. Hooke's Law F=-k·x Also known as the law of elasticity, proposed by Hooke in 1678

When a spring undergoes elastic deformation, the elastic force F of the spring is proportional to the elongation (or compression) x of the spring, that is, F = k·x. k is the elastic coefficient of the material, which is determined only by the properties of the material and has nothing to do with other factors. The negative sign indicates that the elastic force generated by the spring is in the opposite direction of its elongation (or compression).

Then, by combining Hooke's law with Newton's second law F=ma, we can derive the elasticity curve. The key factors here are the mass of the object, the elastic modulus, and the elongation.

[[150488]]

*『Production』: The three key parameters that usually describe the elasticity curve are: frequency, excess, and duration.

6. Surface tension

The surface tension is the interaction force between any two adjacent parts of the liquid surface perpendicular to their unit length boundary line. The formation of surface tension is closely related to the special stress state of molecules in the thin layer on the surface of the liquid.

Surface tension is a knowledge in fluid mechanics that is as easy to encounter in motion design as Archimedes' principle. The formula is relatively complicated, so I won't go into it in detail. The application of tension is very wide, and the most common effect we encounter in motion design is usually the fusion effect:

[[150489]]

Summarize

The application of physics basically does not have an ideal state in the world we live in, so while understanding the principles, designers must be happy to observe the world around us. The real world is the best learning case.

Finally, if there are any errors in the explanation of scientific principles in the article, I hope that the top students can point them out~

Appendix 1: The easing function curve at the bottom of the box http://easings.net/zh-cn (If you can't open it, please use the scientific Internet method)

Appendix 2: During the writing process, I also saw an article by Ali U Yidian - The Physical Laws of Motion Effect Design, which focused on Newton's first and second laws. Students who are interested can click over to read it~