Tag Archives: communication

Vignetting and communicating with the player without distracting them

A normal mid-gray vignette applied all the timeIn the past couple of days I’ve added a vignette system to Hyper Gauntlet. A vignette is a coloured border around the edge of the screen. Typically it’s black, and goes pretty much unnoticed. I aim to replace the colour-changing background with it for two reasons:

1. You probably just said “What colour-changing background?” and went to check.

2. The eye sees and responds to changes better when they happen in the corner of your vision

So by placing a coloured border and changing it depending on the state of the game, responding to runs, power ups, slow motion, etc. I can give a subconscious hint to tell the player of game state changes without getting in the way of obstacles.

It’s not just the colour you change to that can be important, either. You can adjust how prominently a player will notice the change (for important or unimportant state changes) by changing how quickly the colour tweens in. A slow fade in will be barely perceptible, and should be used in situations where the player already knows what’s going on, such as when manually activating slow motion, or when a level up happens, A quick fade in will be sudden and immediately noticeable, and risks distracting the player from the action, but can be used effectively. Think the colour flash that happens when you’re shot in most FPS games. You notice it, particularly when you’re not expecting it, and for better or for worse it’s a good indicator that you need to quickly spam the mouse around looking for who’s shooting you.

So here are a couple of vignette colours that I’ll be using, so you can get used to them before v0.9 drops.

Slow motion

A teal vignette applied during slow motion

Health loss

A bright red vignette applied when the player hits an obstacle

Level up

A gold vignette shown when the player levels up

Run

An ominous, deep red vignette applied when a run is coming

So what do you think? Leave a comment if you like it, or tell me what I’m doing wrong!