02. Gravity Simulation - Making bouncing balls

We all have thrown balls at the wall and seen how they bounce back after impact. When we drop a ball it bounces back. But why does it happen? This is because of gravity. Gravity is a force that acts on any object on earth and on any other celestial body. It attracts everything towards itself. But can we create this on a computer, and see a similar result on our screen? Absolutely we can! We just need to know how it works and how to make it happen on the computer. In this blog, we'll see how to do it. As usual, I will be using Processing to create this example.

First, let's see the math behind gravity. Gravity is just another force. A force is an influence that can change the motion of an object. Think of a car. The harder we push (or apply force) the sooner it will start to move. Higher the mass, the higher the force needed to move that object. Gravity is like an invisible hand, dragging everything towards the earth. Force is defined by the following equation,

Force = Mass x Acceleration

What we see from here is that a force can apply an acceleration on an object. This is why a ball slowly starts to accelerate towards the ground when we let go, even though we didn't give it any acceleration. Let's take the screen as a viewpoint from our own eyes. In other words, the bottom of the screen is the ground. So in order to simulate gravity, we need to simulate a force acting towards the bottom of the screen. In order to simulate a force, we need to apply an acceleration on any object we have in this virtual world.

Let's start from the basics. Gravity only applies in the Y direction, so we need not define it as a coordinate. On the other hand, it's universal to the whole simulation, so we'll define it as a global parameter. Then, let's make a ball on the screen. A ball has certain properties and behaviours associated with them. So in the programming world, the best way to define the ball is to create a class. So now we have a ball class. Next, we need to identify what properties the ball must-have. To start off it must have a position in the world. In our virtual world, an X coordinate and a Y coordinate. Next, it must have an X velocity and a Y velocity. To make it come to life, we also need size and colours.

Next, the behaviours. The only behaviours the ball has is to present itself on the screen. To do this, we'll simply draw a circle. Every time we draw the ball, a unit of time passes by. So every time we draw the ball, we must update its locations according to the forces acting on it. This is where it gets interesting. First, we'll only focus on the Y-axis. The ball has a velocity. Velocity is the change in displacement of an object in a unit of time. So in our case, every time a unit time is passed (in our case every time we draw the ball), we must add the Y velocity to the Y coordinate of the ball. When we do this, we get this,

Quite boring, this is because no force acts on this ball. In real-world gravity gives it an acceleration. So now in each cycle, we'll add acceleration to the velocity as well.

Much better. Actually, that's it! We have emulated gravity in our computers. But still, we can do better. When an object hits the ground, it switches its direction and returns back to where it came from. Let's implement that. To do this, we need to add a conditional that checks whether the ball has reached the bottom. To check this, we'll check if the X coordinate + (size / 2) is equal to or greater than the height of the screen. If this is the case, we have hit the ground. Time to switch the velocity by multiplying it by -1, if not we do the usual and apply acceleration. To add a bit of flavour, we'll also make the ball lose a bit of its energy. This can simply be done by using a value between -1 and 0 instead of -1. Now every time the ball hits the ground, it loses some of its energy and returns back.

Perfect! We have a bouncing ball. Now we'll do the same to the X-axis as well. Both sides of the screen will be walls, no forces exist, but we apply a bounce when we hit the walls and each time we hit a wall, we lose energy. And we are done. We have a ball that bounces around on the screen!

Now it's just a matter of adding a few more balls with random colours, sizes, positions and velocities to create a beautiful simulation. As usual, you can find the code in the Github Repository.

External Links:

• Github Repository with the Processing Code: Github Repository