How to create a camera shake effect in Unity

To create a compelling story, different mechanisms are used, one of them is the camera shake effect, used to portray some kind of violence like a bomb going off or you being shot at.

Konadu Akwasi Akuoko
CodedKAA
6 min readFeb 17, 2021

--

Press ‘s’ to shake the camera.
Camera Shake Effect

Visual effects are a great way to improve your storytelling abilities in games. Effects simulate the imagined events in the story and it makes players attached to your game. One of the effects is the screen or camera shake effect, this is one of many tools in the game maker’s toolkit. The camera shake effects can be used in different ways, it can be used to portray when a bomb goes off, when a barrel explodes, when you get hit by a gun and so much more. In this tutorial, we shall learn how to produce a camera shake or screen shake effect in our games using unity.

First of all, we need to create a script and name it CameraShake, we then move on to attach the script to our main camera

This is where we start coding and things start to get fun, open your script, and lets have some fun.

Attaching the script to the camera.
Attach the CameraShake script to the camera.

We will be using a function called Random.insideUnitSphere, according to unity, it Returns a random point inside a sphere with radius 1. We will be choosing random points within a sphere and make our main camera move there and back to our original position, thus creating a shake effect. The following are the variables we will need to create the camera shake effect(it pays to know your variables you will be working with beforehand).

  1. cameraTransform = it is the transform of the camera.
  2. originalPosOfCamera = this is the original position of our camera; this is where the camera will return to after shaking.
  3. shakeFrequency = it can be said it is the radius of our circle, this will be multiplied to random.insideUnitSphere, thus the higher the number of the shake frequency the greater our radius, and the lower the number of our radius the lower the shake frequency. The reason this will be happening is that, the random.insideUnitSphere selects a point at vector3(0,0,0) within the radius of one, by multiplying it by the shake frequency of a higher number the radius of the circle to choose from also expands, creating a high frequency or a bigger radius to choose a random point from, if you want to create a lower frequency make the shake frequency or in other words the radius low as well.

Random.insideUnitSphere Returns a random point inside a sphere with radius 1.

Now that we know what variables we will be using let’s find out how to create them. We start by declaring all our variables, we make the cameraTransform and the shakeFrequency public variables because we will like to assign them in the inspector window. Go ahead and make the originalPosOfCamera private.

Create your variables here.
Create your variables.

On void Start(), we assign the current camera position to originalPosOfCamera,

Assigning of positions in void start.
void Start().

this is where the camera will be after shaking. Take note that this does not apply to cameras that are constantly moving. That will be in another HOW-TO article.

We then move on to the Update(), in this place things get a little trickier.

The void update method, the place where the magic happens.
void Update().

Here we must get the input of the key S, every time it is pressed, and also get the input when it is pressed but and held, hence the Input.GetKey, which always stays true when a key is pressed and the key is being held in place, that calls the CameraShake() function. This leads us to the second conditional statement, the else if, we must note that the else if statement is dependent on the if statement, thus the computer will check the value of the if statement if it is true, if true it will keep on executing the task, the moment it becomes false the computer checks the else if statement to see if it is true, if it is true the computer executes the task in there, that is why we used the Input.GetKeyUp here, because one will be holding the S key for the shake to happen, and the moment you removes your hand the else if statement becomes true and that also calls the StopShake() function.

Probably by now, you have noticed that we used functions instead of writing our code in the Update function, it will be totally fine if you write yours inside the update function. But because we want our code to be more readable and easier to fix when there is an error we used functions.

Now the first function which is called when one presses the S key is the CameraShake() function.

The magic of code, where the camera shake happens.
The CameraShake() function.

When this function is called what it does basically is that it changes the camera position to the random point selected by the Random.insideUnitSphere. The Random.insideUnitSphere always has a center position (NB: It is a sphere) of Vector3(0,0,0), to choose a position around the camera, we add the original camera position to the value of Random.insideUinitSphere, thus offsetting the value. For example, say the Transform.position of our camera is Vector3(10,5,10) when we add it to Random.insideUnitSphere its coordinates changes from Vector3(0,0,0) to the coordinates of Vector3(10,5,10), thus it chooses a point around where our camera is located. We then multiply it by our shakeFrequency in other words our radius. The bigger the radius the higher the shake frequency and vice versa.

The second and last function is the StopShake() function.

When this is called the magic stops, this stops camera shake.
The StopShake() function.

This function returns the camera to its original position when the S key is released.

Well, we finished and this is what we created…

How it went.

Well and that is it, that is how to create a camera shake effect in games. But remember this only applies to stationary cameras, for it to work for a moving camera some little tweaks have to be made, hopefully, I hope I can do another tutorial about that also. But remember you can edit it the way you want it, tweak the code for your purpose, feel free and have fun with it. This is a GitHub link for the whole project.

I hope this tutorials helped you and gave you some idea of how the VFX effect of a camera shake looks like.

If you enjoyed this article, you can give me as mush as 50 claps 👏👏👏, you can also follow me on Medium and social media if you are interested in technology and software development. You can follow me on Twitter as we will talk about coding and the general tech world, my DM is always open.Join me on YouTube and let’s do some coding together. Have a nice day. And until next time happy coding.

--

--