Best way to create a "screen shake" effect

A place for people with an interest in developing new shmups.
Post Reply
User avatar
Squire Grooktook
Posts: 5997
Joined: Sat Jan 12, 2013 2:39 am

Best way to create a "screen shake" effect

Post by Squire Grooktook »

In an effort to make things feel a bit more visceral and violent, I wanted to add a minor "rumble" to certain bombs and events via screen shaking, similar to Imalice's laser.

How would you guys script this? I'm thinking:

Step 1: Take every on screen sprite and object (or alternatively, the screen/camera itself, though the outcome seems the same to me. Whichever is more convenient in your game)
Step 2: Apply a short and small but intense sine wave to their x/y locations (depending on the direction of the rumble)

Any other suggestions for a more organic effect would be appreciated. I'm not really worried about moving all the sprites around, just what kind of movement method would "feel" most like a violent rumble (so in other words, Step 2 ideas/advice?).
RegalSin wrote:Japan an almost perfect society always threatened by outsiders....................

Instead I am stuck in the America's where women rule with an iron crotch, and a man could get arrested for sitting behind a computer too long.
Aeon Zenith - My STG.
User avatar
trap15
Posts: 7835
Joined: Mon Aug 31, 2009 4:13 am
Location: 東京都杉並区
Contact:

Re: Best way to create a "screen shake" effect

Post by trap15 »

If you're shaking the screen, you need to make sure that the player doesn't actually have to do anything precise during that time. In the end, I removed screen shake from my game because it didn't add that much, and it was mostly distracting and annoying.

For the behavior, I did something like:

Code: Select all

// Positions are 8.8 fixed point, angles are 0~0xFF = 0~359 degrees
int mrand(int min, int max);

every_couple_frames() { // iirc it was like every 8th frame, idk, play with it
  // You could shape the shaking by making this more like `tgt_angle + mrand(-7, 7)` or whatever
  angle = mrand(0, 0xFF);
  mag = mrand(0, 0x1000); // tweak this, whatever
  // convert polar to cartesian
  xoff = SQR_DX(angle, mag);
  yoff = SQR_DY(angle, mag);
}
every_frame() {
  scrpos_x = raw_scrpos_x + xoff;
  scrpos_y = raw_scrpos_y + yoff;
  xoff /= 2;
  yoff /= 2;
}
Doing the per-frame halving looks quite nice and makes it feel a lot more comfortable.
@trap0xf | daifukkat.su/blog | scores | FIRE LANCER
<S.Yagawa> I like the challenge of "doing the impossible" with older hardware, and pushing it as far as it can go.
User avatar
Squire Grooktook
Posts: 5997
Joined: Sat Jan 12, 2013 2:39 am

Re: Best way to create a "screen shake" effect

Post by Squire Grooktook »

trap15 wrote:If you're shaking the screen, you need to make sure that the player doesn't actually have to do anything precise during that time.
Much like the above Imalice example, its during a bomb activation, so precision isn't much of an issue. I was also thinking about using it for certain brief cinematic setpieces (ie have a boss enter by smashing his way up through the floor).

So if I'm reading your code right:

You're moving the screen every frame, and you randomly repick the direction and distance to move it in every 8th (or so) frame. You also reduce the rumble in the interim bewteen each new "rumble" by dividing the the movement by 2.

Correct?
RegalSin wrote:Japan an almost perfect society always threatened by outsiders....................

Instead I am stuck in the America's where women rule with an iron crotch, and a man could get arrested for sitting behind a computer too long.
Aeon Zenith - My STG.
User avatar
trap15
Posts: 7835
Joined: Mon Aug 31, 2009 4:13 am
Location: 東京都杉並区
Contact:

Re: Best way to create a "screen shake" effect

Post by trap15 »

Yeah, exactly. Obviously you can change how often to re-pick the rumble to taste. You could also do some smoothing between re-picks (average the new and previous offsets, for example) to make it a bit less judder-y too.

In the sample code, raw_scrpos is supposed to be the "normal" screen position, and scrpos is for what is actually used.
@trap0xf | daifukkat.su/blog | scores | FIRE LANCER
<S.Yagawa> I like the challenge of "doing the impossible" with older hardware, and pushing it as far as it can go.
User avatar
Darckonte
Posts: 36
Joined: Mon Jul 18, 2016 12:01 pm
Location: north america

Re: Best way to create a "screen shake" effect

Post by Darckonte »

what language are you looking for? I can help you with unity. I make it in my game (https://www.youtube.com/watch?v=jx6IwVkVeEM) I can share the shaking camera script with you if needed ;)

Pasting the code so anyone can benefit, also take into account that you're moving your camera a fixed velocity over time you can use a temp target position to store the new position + the shaking effect:

You can put this into a C# MonoBehavior class, (add variables to make it work).

Code: Select all

         //call it with the intensity you want to shake (small enemies 0.1f , big enemies 0.75f).
        public void OnShake( float amount )
	{
		shakeAmount = amount;
	}
	
	// Update is called once per frame
	void Update () {
		targetPosition += Vector3.up * speed * Time.fixedDeltaTime;

		shake = Vector3.Lerp(shake, new Vector3(Random.value * shakeAmount, Random.value * shakeAmount, 0), 0.25f);

		shakeAmount = Mathf.Lerp(shakeAmount, 0, 6f * Time.fixedDeltaTime);
			
		transform.position =  targetPosition + shake + offset;
	}
User avatar
Squire Grooktook
Posts: 5997
Joined: Sat Jan 12, 2013 2:39 am

Re: Best way to create a "screen shake" effect

Post by Squire Grooktook »

Thanks for that. I was working in Unity with C#, but I actually transferred over to Game Maker since a lot of other people around here were using it, and it seemed easier if I wanted to ask advice.

So what you're doing there is another variant of random angle and distance offset per frame?
RegalSin wrote:Japan an almost perfect society always threatened by outsiders....................

Instead I am stuck in the America's where women rule with an iron crotch, and a man could get arrested for sitting behind a computer too long.
Aeon Zenith - My STG.
User avatar
Darckonte
Posts: 36
Joined: Mon Jul 18, 2016 12:01 pm
Location: north america

Re: Best way to create a "screen shake" effect

Post by Darckonte »

Squire Grooktook wrote:Thanks for that. I was working in Unity with C#, but I actually transferred over to Game Maker since a lot of other people around here were using it, and it seemed easier if I wanted to ask advice.

So what you're doing there is another variant of random angle and distance offset per frame?
Yup, basically you lerp your current "random offset" to the next "random offset" and it will give the feeling of shake, doing it smothly with the lerp function.
Last edited by Darckonte on Tue Aug 02, 2016 8:34 pm, edited 1 time in total.
User avatar
Squire Grooktook
Posts: 5997
Joined: Sat Jan 12, 2013 2:39 am

Re: Best way to create a "screen shake" effect

Post by Squire Grooktook »

Ah right, I forgot about LERP. Smoothing one offset to another at a time. Interesting. I'll give both of the suggested methods a try later when I have some time to work on this. Thanks to both of you.
RegalSin wrote:Japan an almost perfect society always threatened by outsiders....................

Instead I am stuck in the America's where women rule with an iron crotch, and a man could get arrested for sitting behind a computer too long.
Aeon Zenith - My STG.
User avatar
Darckonte
Posts: 36
Joined: Mon Jul 18, 2016 12:01 pm
Location: north america

Re: Best way to create a "screen shake" effect

Post by Darckonte »

You're very welcome! good luck in your development ;)
User avatar
Rozyrg
Posts: 918
Joined: Wed Feb 11, 2009 12:03 am
Location: Southeast USA

Re: Best way to create a "screen shake" effect

Post by Rozyrg »

All I do is have specific vars (that remain at 0 normally) added to any background elements' base coordinates. When a shake event is triggered, a timer counts down - with every tick, the variables change: think from say -3 to 3, then return to zero when the timer reaches zero. You want that variation to be consistent between elements, though, and make sure it's all occurring on the same step/frame.
User avatar
BPzeBanshee
Posts: 4859
Joined: Sun Feb 08, 2009 3:59 am

Re: Best way to create a "screen shake" effect

Post by BPzeBanshee »

Yeah I'd just shake the view_xview/view_yview variables myself. Crude but effective, although I have found with a lot of indie devs they like abusing the shit out of this so I don't use it myself.
User avatar
S20-TBL
Posts: 440
Joined: Mon Jan 18, 2010 6:48 am
Location: Frying over a jungle and saving the nature
Contact:

Re: Best way to create a "screen shake" effect

Post by S20-TBL »

BPzeBanshee wrote:Yeah I'd just shake the view_xview/view_yview variables myself. Crude but effective, although I have found with a lot of indie devs they like abusing the shit out of this so I don't use it myself.
Also, if done improperly (i.e. you don't reset your view coordinates to the correct value) the viewport will end up being offset.
--Papilio v0.9 Beta now on itch.io! (development thread)--
Xyga wrote:Blondest eyelashes ever.
User avatar
ptoing
Posts: 1118
Joined: Wed Jan 11, 2006 10:36 pm
Location: Gurmany
Contact:

Re: Best way to create a "screen shake" effect

Post by ptoing »

Alternatively to shaking the whole screen you can shake the HUD. Which works well if you got a decently big HUD. SDOJ and some other Cave games do this on boss explosions (maybe bombs too, not sure). It gives a feeling of shaking without fucking with the actual controls. But again, you need quite a bit of HUD, at least a typical Cave one with bombs at the bottom, etc. The SDOJ one with the hyper stuff and counter obviously has even more shit that can be moved around, so it works well.

For Fire Lancer it would not work great since we only got a bit of stuff at the top.
User avatar
Squire Grooktook
Posts: 5997
Joined: Sat Jan 12, 2013 2:39 am

Re: Best way to create a "screen shake" effect

Post by Squire Grooktook »

I put some of this stuff to use today, and I'm pretty happy with the results. Thanks all :)
RegalSin wrote:Japan an almost perfect society always threatened by outsiders....................

Instead I am stuck in the America's where women rule with an iron crotch, and a man could get arrested for sitting behind a computer too long.
Aeon Zenith - My STG.
Post Reply