Thursday, 17 January 2013

Lighting and Shaders Episode 1: Game Mockup

Another year, another school semester. And with that comes some new knowledge. This week I started learning about shaders, and how I can use them to make my games look nice. Shaders are small programs that run on a computer's GPU which augment or enhance the visual assets of a game. They are responsible for displaying (drawing) the game and can be used to achieve effects such as lighting, shadows, ambient occlusion, bloom, HDR etc. Finally (and most importantly) they do all of this at lightning speed.

Before I get down to the nitty gritty to start implementing this in my games, I've started with a few mockup designs for the effects I hope to achieve with shaders. The game I'll be working with is my team's current 3D prototype project "GTFO: The Double Dungeon Debacle". Below are some mockups I did in photoshop to simulate the look we're going for.

First let's have a look at our source image:

Nothing too exciting here... No lighting, flat shading, ugly particles, weak selection circle

Here's the first edit:


- Added a radial light to the player
- Added cartoon cel shaded effect to the characters (painted on manually)
- Added a new fireball sprite with trailing particles, made a nicer selection circle
- Added dynamic shadows to characters
- UPDATE: Adjusted brightness and contrast

Second Edit: (My personal favourite)

- Started with first edit
- Added a bloom effect (using diffuse glow in photoshop)
- Increased saturation slightly to compensate for diffuse glow effect
- UPDATE: Adjusted brightness and contrast

Third Edit:

- Started with second edit
- Added a subtle film grain effect (would be optional or used in cutscenes)
- UPDATE: Adjusted brightness and contrast

Overall I think these mock-ups are a significant improvement to the look of the game and will be going forward with these visual goals in mind. Feel free to comment with any feedback.