Let’s get shakin’! Making your screen shake when hit.

We gave our player a sign when they are hit by adding engine damage to their wings. Now let’s REALLY let them know. How about a screen shake?

It’s really easy in fact. I have spent the last 2 days trying to implement a thruster gauge so it will show the player when they are out of gas but hit a snag (remember, snags always happen! Clear your head and go back to it). So I thought I would move on and implement this and then circle back.

Any way, it’s actually quite easy to implement this. You just need to create a new script — named CameraShake and add it to the Main Camera, then open it. Once inside we need this code (explanation on the other side).

Yes, it’s a lot, but let’s break it down.
- Create a coroutine named Shake. We are doing this so we can create the shake by moving in time (shake the x and y a little each frame). We want to pass in 2 parameters, 1 for the duration of the shake and one for the magnitude.
- Inside that we want to get the camera’s original position and set it to a variable named originalPos (how original.. ahem).
- Then another variable named elapsed that we will set to 0. This will be the time elapsed between shake.
- Then the dreaded while statement. Remember these can infinite loop you into crash purgatory, so careful. Anyways, we are just checking while the last shake is less than the duration then make x and y move at a random range and then actually moving the camera with the transform.localPosition line.
- Then we reset the elapsed time by adding Time.deltaTime. So every frame increase this value by the amount of time that has gone by.
- Then we add the yield return null line. This is important because it gives your code a chance to breath and no loop infinity times. It basically means before we continue on the next iteration of the while loop we want to wait until the next frame is drawn.
- Lastly we just reset our original position so the camera will be at the same place it start out at.

Now we need to start this coroutine — where would be the best place to do that for a “if our player is hit, shake the screen”.
The Damage Method!

I ran this code here because if the shields were active I didn’t want the screen to shake. You may not like that and want some shake even if shielded, I just chose this.

Basically we just have to get a handle of for the CameraShake script (SerializeField it so you can drag your camera into the empty box in the Player script. Now you have a handle to that you just need to start the coroutine if our player is unshielded and hit. It just calls the Coroutine (IEnumerator) we named Shake and gave it the 2 values asked for when we made it (duration and magnitude). You can play with those numbers but I was happy with those.

Let’s see it at work.

That’s it, that’s all there is too it. Now, I’m going to get back to the thruster gauge problem. As I said, take a break from a problem now and then and you will come back with a fresh mind and more confidence. Hope to have that article for you tomorrow!

Happy Clicking!



Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store