Tutorials · Light and Shadow · Chapter 10

Depth from normal maps

20 minutes Uses: Sprite

By the end

A normal map generated from the back wall, strength 3, bevel 1, saved beside it
The wall’s Sprite with that map and a Specular of 0.25
Which lights a normal map answers, and what it costs

On this page

What a normal map is
Make one from the back wall
The wall takes it
What it costs
The raked bricks
Check it works

Reference

Sprite

What a normal map is

A normal map is a picture of a surface’s slopes: each pixel’s colour says which way that bit of the surface faces. With one, a light from the side lights the faces turned toward it and leaves the others darker, and the flat painting gains relief. Rengy makes one from the picture’s own brightness: bright reads as high, dark as low. The back wall is a painting of bricks, so its mortar reads as low, and each brick as raised.

Make one from the back wall

In Assets, open the art folder and select old-dark-castle-interior-background.png.
Press Details: the picture’s import settings open under the list.
On the Normal map row, choose Generate.
Set strength to 3 and bevel to 1.
Press Save. old-dark-castle-interior-background.normal.png appears beside the picture, with a .meta of its own.

The Assets panel with Details open on old-dark-castle-interior-background.png, a 960 by 304 picture: under Alpha, the Normal map row reads Off, lit, beside Generate, with strength 2.00 and bevel 1.0 dimmed — Before: **Normal map** `Off`.

The same panel with Generate lit on the Normal map row, and strength 3.00 and bevel 1.0 live beside it — After: **Generate**, strength `3`, bevel `1`.

Normal map: How the picture’s surface is described. Off gives it no map. Generate makes one from the picture’s own brightness when you press Save.
strength: How steeply a change in brightness tilts the surface, from 0, flat, to 16. 3 here. Lower, and the relief fades toward flat; higher, and every small mark in the painting tilts as hard as a brick’s edge.
bevel: How far in from a clear edge, in pixels, the surface rounds over, from 0 to 16. 1 here. A bevel works on a picture’s clear edges, where solid pixels meet transparent ones, and the back wall is painted across its whole width, so a bevel of 1 changes little in it. It is for a sprite with an outline, such as a pillar.

The wall takes it

Select wall. In its Sprite, drag art/old-dark-castle-interior-background.normal.png from Assets onto the Normal Map slot, or click the slot and choose it.
Set Specular to 0.25.
Press Ctrl+S.

wall selected, its Inspector narrowed with the search box, light, to the Sprite’s lighting rows: Unshaded and Light Only unticked, Normal Map holding old-dark-cas, the start of the generated picture’s name, and Specular at 0.25 on a slider; the Viewport looks through the game camera at the hall

Type light into the Inspector’s search box and it narrows to the rows that answer to light, as the picture shows.

Normal Map: The Sprite’s slot for the picture that says which way its surface faces. Empty, the surface is flat.
Specular: How brightly the surface catches a highlight where a light faces it, from 0, none, to 1, full. It does nothing without a normal map. 0.25 here: a damp shine near the lamps. At 1 the bricks beside a lamp catch a paler sheen.

The first lantern and its bricks without the normal map: a warm, even pool on the bricks round the lamp, the left pillar’s cap at the bottom right, a rune on the floor at the bottom left, and a cold haze in the bottom-left corner — Before: the bricks flat.

The same view with the normal map: the lamp’s light gathers closer round the lamp and the bricks beyond it fall darker, the rune dimmer, and the cold haze in the bottom-left corner gone — After: the lamp’s light gathers round the lamp, and the bricks beyond it carry more shape and less light.

The same view at Specular 0: the lamp’s pool on the bricks warm, with no sheen — For comparison, Specular `0`.

The same view at Specular 1: a paler sheen on the bricks beside the lamp — For comparison, Specular `1`.

What it costs

The raked bricks

Where	Field	Value
The back wall’s import settings	Normal map	Generate
	strength	`3`
	bevel	`1`
`wall`’s Sprite	Normal Map	`art/old-dark-castle-interior-background.normal.png`
	Specular	`0.25`