Category: Level Design

Juice Up Your Game

cli Leave a comment

Jan Willem Nijman – Vlambeer – “The art of screenshake”

“Just fill your game with love and tiny details.”

Jan Willem Nijman

The 30 little Tricks from Jan Willem Nijman to Juice up your Game

I collected all the 30 tricks on the youtube video from Jan Willem Nijman in this article. Basically the trick name and a little tiny explanation. It’s actually just for my own convenience. But hey if it’s helpful for you, you are welcome.

1. Basic Animations & Sounds

Makes walking, jumping, picking up things, and shooting more fun. It doesn’t really matter if it’s high quality or simple. It makes it alive.

2. Lower Enemy HP

It’s more fun. It’s super frustrating if you need to shoot ten times on an enemy before he dies, makes your weapon feel feeble and boring.

3. Higher Rate of Fire

It’s a video game about shooting so put more bullets in there. You hardly can overdo it. Really. Just add more bullets. Give your weapon a higher fire rate.

4. More Enemies

Because of juice number 2 you need more enemies to shoot. It’s satisfying if they pop like popcorn.

5. Bigger Bullets

Don’t use realistically sized bullets as it looks so silly, make them big. The player wants to see those badass killer bullets. The weapon feels much more powerful.

6. Muzzle Flash

Just make the first bullet frame a circle. Very simple, very effective.

7. Faster Bullets

Slow bullets are lame, make it faster.

8. Less Accuracy

If your gun is not too accurate it looks more realistic and is more fun.

9. Impact Effects

Let the player know he hit something, don’t just remove the bullets. Like fragments falling off the wall if a bullet hits it or blood strains if a character gets hit by a bullet.

10. Hit Animation

Let the player know that he damaged the enemies. The simplest trick is to make the enemy flat white for a fraction of a second.

11. Enemy Knockback

But knockback force if you hit enemies. Your weapon feels so much more powerful and makes it more realistic from a physical point of view.

12. Permanence

Don’t remove dead bodies, it helps you remember if you come back in a room with a huge pile of dead bodies in it.

13. Camera Lerp

Smoother cameras make the character feel more in motion.

14. Camera Position

Your camera focus on important things in your video game. This is one of the hardest part and takes a lot of trials and testing.

15. Screen Shake

This is an important rule add screen shake on explosions it looks so much more powerful than without.

16. Player recoil

Shooting feels much more powerful with recoil on the player and you can use it to avoid that player do not shoot all the time as it has a drawback.

17. Sleep

If you set a deadly hit sleep for 100 or 200 ms, it puts more meaning in that action. Brawl games do that a lot.

18. Gun Delay

Make the character and its props look like they have weight/momentum when moving.

19. Gun Kick

Add recoil to things that would have it.

20. Strafing

If you shoot and change the direction the shooting will be still in the same direction until you stop shooting to turn around the gun.

21. More Permanence

Put ejecting shells in your game and make them permanent. It also helps to remember that you were in that room and that you did shoot a lot.

22. More Bass

Add bass to your shooting and explosions they get much more meaning and power.

23. Super Machinegun

Try ridiculous variations on how shooting performs, maybe three bullets a time, go crazy.

24. Random Explosions

That is a funny one but it puts more action in your game if you put some random explosions to your game when you shoot enemies, don’t overdo it.

25. More Enemies

You tuned up your gameplay so that you got the feeling you do have not enough to shoot at.

26. Even Higher Rate of Fire

Because it is more fun to shoot

27. Even Higher Rate of Camera Kick

Make your camera kick in the direction of the action/shooting.

28. Bigger Explosions

Seriously, who doesn’t like explosions?

29. Even More Permanence

Put some dust after your gigantic explosions and let it fade slowly.

30. Meaning

Let your player win or loos. It’s an obvious one.

Level Design Patterns

cli Leave a comment

Intro

A collection of level design patterns, which might be helpful for someone.

Patterns

Safe Zone

A safe zone is a pattern that refers to an area where the players are not exposed to danger. A Safe Zone gives the player the possibility to analyze the surroundings and plan their next actions. A safe zone is especially important at the starting point of the avatar.

When you enter a level you always should be in a safe zone where nothing attacks or threatens you. No enemy should be able to enter the safe zone, it’s upon the player to leave the safe zone.

When you enter a level you always should be in a safe zone where nothing attacks or threatens you.

My rooms for All Fucked Up start always in a safe zone means no hazard or enemies will enter that zone. I will use leap of faith jumps for storytelling and therefore I will soften the strict rules for the safe zone a little bit. It will be guaranteed that there is no hazard or enemy at the landing point which would kill you instantly. The player should have enough time to react and have the necessary amount of ammunition and weaponry. As well a leap of faith jump will never be at the end of a room or level. Combined with the fast and endless respawn this should be acceptable.

Guidance

Guidance is a pattern that refers to the use of non-verbal game elements to guide players in an intended direction. Guidance is especially important for explorative games.

Guide the character through the level shape from the start to the end. Besides gangways, shafts, and entry/exit doors, also enemies or collectibles can be used to guide the player through the level. But as well cracks in a wall can indicate that with a certain amount of force you can destroy that wall to enter a new room.

My levels have entry and exit points in rooms that are not too big. I plan to have hidden entries to bonus rooms and those I have to somehow decorate with a guidance pattern like destroyable blocks and walls.

Branching

Branching is a pattern that refers to providing the players with multiple paths to reach their goals.

Not just one possible path but a couple of possible paths. You can have difficult but faster ways through for experienced players or simpler but slower paths for beginners.

Alternative ways to kill your enemies.

For All Fucked Up I recently found another way of branching, not in the sense of alternative paths but alternative ways to kill your enemies. I started to work on a level with falling blocks and the blocks start to shake for a sec and fall down as soon I’m underneath them. If I can lure my enemies underneath the falling blocks and manage to save my ass in time I can kill the enemies without a gun. I can now think of more ways like this, like shooting fuel barrels near enemies and letting them be blown away.

Foreshadowing

Safely introduce a new enemy for example, by showing the new enemy in a safe way before it attacks you.

There are different ways to introduce new enemies, threats, or hazards. One way is to combine Foreshadowing with the Safe Zone pattern, the player is placed in a safe spot where he can observe the new enemy, threat or hazard and plan his action. Even new possibilities could be introduced that way, like the trampoline or the moving platform in celeste.

One way is to combine Foreshadowing with the Safe Zone pattern.

In All Fucked Up fast respawn after death, endless lives, and short levels make it quite easy to get knowledge of new enemies and threads. All my threads and enemies are introduced isolated at the beginning of a room, this gives the player an easy way to figure it out as he gets respawned right away after he gets killed by the new threat or enemy.

Layering

Layering is a pattern that refers to combining multiple game objects to create a new experience or challenge.

This pattern is most often combined with Foreshadowing. For example, introducing a new enemy separated and then combining them in a flock or together with already introduced enemies, threats or hazards. This gives the game new challenges.

In All Fucked Up I combine a lot the Foreshadowing and the Layering pattern. One example are the falling blocks. Whenever the player is underneath a falling block the block starts to shake for a sec and fall then down and smashes everything underneath also enemy entities. The player can combine the falling block in his tactic to smash following enemies.

The player can combine the falling block in his tactic to smash following enemies.

Pace Breaking

Pace breaking pattern refers to purposely changing the dramatic arc of the game.

Changing the surroundings or the sound for example when a boss enters the scene. Or to slow down the game for short moment to give the player time to prepare for the next wave of enemies.

In All Fucked Up I have some silent moments when finishing a room by adding a longer corridor where you just walk. But as well by environmental sound change. For example in the hall of hydraulic hammers you hear the hydraulic sound when the hammers lift and the boom noise when the hit the ground.

Proxy

Proxy is a pattern that refers to indirectly triggering an action.

Switches that open a door or unleash an event. The switch is not directly connected. Or an invulnerable enemy which I can only be kill by destroying a power supply. Fuel barrels which explode if you shoot at it. And more.

In All Fucked Up I introduced smart cards which you need to open the door to the next room. Those smart cards are carried by some of the enemies. This also should give the player the necessity to shoot those fuckers and not just try to avoid them.

Privileged Move

Privileged Move is a pattern that refers to the fact that not all objects do have the same impact on different objects.

Bullets from enemies do not damage enemies themselves only the player. Or an acid ground does not affect enemies but the decrease the players health.

For All Fucked up bullets from enemies only damage the player never other enemy entities. In case I introduce co-op mode I will do the same for the players that player bullets only damage enemies never the other player.

I get a small commissions for purchases made through the following links, I only have books in this section which I bought myself and which I love. No bullshit.

References

https://www.gamasutra.com/blogs/AhmedKhalifa/20190610/344344/Level_Design_Patterns_in_2D_Games.php

https://eledris.com/design-2d-platformer-levels/

https://www.gamasutra.com/view/feature/132649/the_case_for_game_design_patterns.php?print=1

https://www.youtube.com/watch?v=4RlpMhBKNr0

Cinematic Camera

cli Leave a comment

I Want

In the process of my game, I started to think about an advanced camera system. I wanted to define camera bounding boxes in which a certain type of camera is active. But this was not enough for me as I wanted them stacked. And I wanted to attach these camera bounding boxes as well on moving targets like enemies.

Why?

Well, I was thinking of a cool intro where the hero falls down a deep hole. I wanted to zoom close in the beginning and zoom out in the middle part and zoom in on the landing. Furthermore, I wanted to overlay camera bounding boxes to zoom in on certain objects or when I enter or leave a room or level. I was as well thinking of a centered camera for a squared room to see everything in it and as soon I leave this room I wanted my follow camera back. So it’s complicated. And then I thought OK would be cool to have a zoom-in if enemies approach me to give that more focus and this camera bounding box has to follow the enemy… of course.

So it’s all about the cinematic effects I guess.

How?

I think the best is a visualization of my idea.

I tried to describe it in the level itself. The long light blue bounding box across the full room contains a follow camera and is on the bottom of the stack that’s why it’s numbered with a ‘0’. The middle camera bounding box is darker blue and is on top of the following camera and contains a centered camera, which means inside this box the camera will not follow the character but point to the center of the bound box. This box has the priority ‘1’ and is on top of the priority ‘0’. On top of this, we have a yellow bounding box with a zoomed-in centered camera with the priority ‘2’. The higher the number of the bounding box camera the higher its priority. On the right, we see a yellow bounding box with priority ‘1’ which is higher than ‘0’ with a follow camera with a different zoom.

In Action

Now in action

This is pretty neat isn’t it?

Behind the Scenes

OK, I try to explain it with some pseudo-code. Let’s assume we have all the camera bounding boxes and their camera type. Furthermore, we can load these camera types on the fly.

public void updateCamera(float tpf, Vector2 playerPosition) {
    stream()
            .filter(cam -> cam.getAabb().contains(playerPosition))
            .sorted(Comparator.comparingInt(CameraAabbData::getOrder).reversed())
            .findFirst()
            .filter(cam -> cam.getMyCamera() != currentCam)
            .ifPresent(cam -> {
                LOG.debug("Enter camera area with cam data type: " + cam.getType() + " properties: " + cam.getProperties());
                if (cam.getMyCamera() == null) {
                    cam.setMyCamera((MyCamera) feather.instance(cam.getType()));
                }
                currentCam = cam.getMyCamera();
                currentCam.setAabb(cam.getAabb());
                currentCam.setProperties(cam.getProperties());
            });
    currentCam.update(tpf);
}

So in short

  • We check if the player is in the camera AABB
  • We sort the camera AABB due to its order
  • We just take the first, which means the top one (it’s ordered)
  • The next check is to avoid that we set the camera properties on every frame
    • And if there is a camera AABB we check if we already instantiated the camera (caching)
    • We set the current camera and its properties
  • Last but not least we update the current camera on every frame
    • A lerp function smooths the switch from one zoom to another
    • A follow camera for example updates its position depending on the character’s movement
    • Update other dynamic features of the current camera

The object “cam” is just a data holder and often referred as a DTO.

Barrel Distortion Lens

cli Leave a comment

After the fisheye lens shader turned out to be too extreme for All Fucked Up I looked for other lens shaders and found barrel distortion shaders which makes a similar effect like a fisheye but less extreme. It just widens up the lens. Looks totally cool. I got the best and simplest shader for barrel distortion here on github. It’s in a different format than I need it for jMonkeyEngine but was quite simple to adapt it.

I always start with the part I need to embed the shader in the code and as I do not make anything fancy or parametrized it’s fairly straight forward

package ch.artificials.bubble.system.mvc.view.post.filter;
import com.jme3.asset.AssetManager;
import com.jme3.material.Material;
import com.jme3.post.Filter;
import com.jme3.renderer.RenderManager;
import com.jme3.renderer.ViewPort;
public class BarrelDistortionFilter extends Filter {
     public BarrelDistortionFilter() {
         super(BarrelDistortionFilter.class.getSimpleName());
     }

     @Override
     protected Material getMaterial() {
         return material;
     }

     @Override
     protected void initFilter(AssetManager manager, RenderManager renderManager, ViewPort vp, int w, int h) {
         material = new Material(manager, "MatDefs/Post/BarrelDistortion.j3md");
     }
}

The referenced MatDefs/Post/BarrelDistortion.j3md holds the references to the shader code and also defines possible parameters which we want to hand over from code to the shader code.

MaterialDef Toon {
    MaterialParameters {
         Int NumSamples
         Int NumSamplesDepth
         Texture2D Texture
         Color Color        
    }
    Technique {
         VertexShader GLSL100:   MatDefs/Post/BarrelDistortion.vert
         FragmentShader GLSL100: MatDefs/Post/BarrelDistortion.frag
         WorldParameters {
         }
         Defines {
             RESOLVE_MS : NumSamples
         }
    }
}

The vertex shader code is very simple and just hands over the tex coordinate and the position

import "Common/ShaderLib/GLSLCompat.glsllib"
attribute vec4 inPosition;
varying vec2 Vertex_UV;
attribute vec2 inTexCoord;
void main()
{
    vec2 pos = inPosition.xy * 2.0 - 1.0;
    gl_Position = vec4(pos, 0.0, 1.0);    
    Vertex_UV = inTexCoord;
}

The barrel distortion logic is in the fragment shader code and looks like this

import "Common/ShaderLib/GLSLCompat.glsllib"
import "Common/ShaderLib/MultiSample.glsllib"
uniform sampler2D tex0;
varying vec2 Vertex_UV;
uniform sampler2D Texture;
const float BARREL_DISTORTION = 0.25;
const float rescale = 1.0 - (0.25 * BARREL_DISTORTION);
void main()
{
    vec2 tex0 = Vertex_UV;
    vec2 texcoord = tex0 - vec2(0.5);
    float rsq = texcoord.x * texcoord.x + texcoord.y * texcoord.y;
    texcoord = texcoord + (texcoord * (BARREL_DISTORTION * rsq));
    texcoord *= rescale;
    if (abs(texcoord.x) > 0.5 || abs(texcoord.y) > 0.5)
         gl_FragColor = vec4(0.0);
    else
    {
         texcoord += vec2(0.5);
         vec3 colour = texture2D(Texture, texcoord).rgb;
         gl_FragColor = vec4(colour,1.0);
    }
}

And the lens effect in action looks like this

I get a small commissions for purchases made through the following links, I only have books in this section which I bought myself and which I love. No bullshit.

Risk Mitigation: Add more Details to Death Animation

cli Leave a comment

This is the follow-up article about lens #16, the lens of risk mitigation from The Art of Game Design: A Book of Lenses written by Jesse Schell. If you buy books through the links in this article I will get a small commission for that.

I tried quickly if more details for death animation would give the game more depth.

And it does. Need some more fine-tuning and random but the idea is there and looks good and funny. But I need to add some random explosion if I kill a mass of soldiers. The blood fragments have to be more random in the depth axis so the helmet is not all behind the blood fragments. But this is fine-tuning for a prototype this is enough.

I get a small commissions for purchases made through the following links, I only have books in this section which I bought myself and which I love. No bullshit.

Enter Game, Switch Level, and Die

cli Leave a comment

To make my first couple of testable levels, I need a clear understanding of how to preserve the game state and how to reset the level when I die and also how many times I wanna die and where I will get reborn, and how I get reborn.

Soft Requirements

So I made a simple list of some soft requirements.

  • Making dying a painless thing
  • Getting reborn at a save spot to be able to try again
  • Seeing the relicts of past battles I fought
  • Picking up the game after a day without losing anything

Hard Requirements

The soft requirements lead to a set of hard requirements. The hard requirements are easier to make happen in code than a fluffy set of soft requirements.

Connect the Rooms
The rooms exit and entrance are connected that way I know where I have to place the player after he left the room through a certain door or exit.

Player Enters a New Game
If I start a new game I need a default entrance point for the player and this is only for the very first room anyway.

  • Drop the player at the rooms default location
  • Load the room in its initial state

Player Switch the Room
In case I die I wanna back the inial state of my ammo and weaponry to have a fair chance to be able to clear this room.

  • Store the state of the current room
  • Remove the current room
  • Keep all collected and not used up ammo and weapons
  • Load the room you switch either the saved or the initial one
  • Drop the player at the connected entrance of the new room
  • Store ammo and weapon state at this point

Player Dies
I must get back the state I had when I entered the room to be able to clear this room else I might run out of ammo over time and the chance to make it through that room goes to zero.

  • Drop the player on his last entrance
  • Remove all items the player collected in the current room
  • Load either the saved room or the initial room
  • Load ammo and weapon state

Player Dies in Not Finished Room
I have one special case, if I enter a new room collect ammo and weapons, go back to old rooms and use up all ammo in those old cleared rooms, I have no chance to make it through the new not yet cleared room. So I need the following rule.

  • If you die in a not yet cleared room reset that room to initial state

First Footage

A short footage about switching levels with the rules from above. Enjoy.

There is still some problems with falling stuff if I left a level. This falling stuff will stop falling if I leave the level and continue falling if I reenter the level.

I get a small commissions for purchases made through the following links, I only have books in this section which I bought myself and which I love. No bullshit.

Shoot in All Directions

cli Leave a comment

I can now shoot in all directions with my little cute hero. And you can see he enjoys it a lot! My game goes now the action game path with a very simple level design. The idea is to improve the visuals with small little details. The ejected shells are one sample, the hearth if he collects new ammo, and the funny lauthter if he shoots like crazy. I plan to add more things which interacts with the hero or any NPC, like crickets which fly aroung and get disturbed in the the bullet hell.

I think it’s now quite hard to aim on something and as ammo is a limited resource I probably need kind of an automatic aim. The idea is that if there is something to shoot and I aim in a directions the automatic aim to the next shootable thing in that direction if it is in range. But I need to do first game testing. This is actually the next step any way to have a set of simple levels and let people play them so I can collect feedback. In the past I did that with steam, I probably also will look into itch.io as well.

I get commissions for purchases made through the following links, I only put stuff in this section I also would buy or I already bought

The Art of Game Design: A Book of Lenses

cli Leave a comment

This book is an awesome guide with more than 100 lenses to look at your game. Written by Jesse Schell a professor of entertainment technology for Carnegie Mellon University’s Entertainment Technology Center (ETC).

I like the concept of the lenses in this book, it let you look at your game from different angles to assure you have a fun game in the end. The lenses are summarized in orange boxes which makes this book an awesome guide through your process crafting a fun game. It’s like having an instructor on tap.

Sneak Peek Of Our First Levels

cli Leave a comment

We happily present you a sneak peek of our first couple of levels including failures.

The game gives instant feedback on failure and puts you at the beginning of the mini levels. It only needs little to get killed. The enemies are not very smart and shoot each other in the chaos of the battle.
It’s currently more feel-good gameplay than very challenging or surprising. The weapon and collecting ammo is the main mechanic in this simple platformer game. We would love to hear your opinion or maybe ideas about what kind of mechanics we could introduce.