Tutorials · Light and Shadow · Chapter 14

Light on a phone

30 minutes Uses: Light

By the end

The statistics overlay read: light draws, shadows and light passes
The hall at the Android tier, and what it changes
White point and the Lights override, the Render menu’s last two rows
The hall budgeted, two soft shadows hard and two channels off, and exported

On this page

What the hall costs
The hall at a phone’s tier
White point
Budget the hall
Every light on, every light off
The phone budget
Export the hall
Where to go from here
Check it works

Reference

Light

What the hall costs

A phone’s graphics chip draws the screen in tiles, and every pass over the whole screen makes it write each tile out and read it back. That costs bandwidth, which is what a phone has least of. Lights are drawn in passes of their own, so the hall has a price, and the editor will tell you what it is.

Open Render and tick Render statistics.
Read the panel that appears over the Viewport’s top right.

The statistics panel’s rows, from passes to light passes, for the hall as chapter 13 left it: passes 7, draws 11, batches 5 broke on a texture, instances 213, culled 0, lights 14 drawn, 10 with shadows, shadows 56 edges and light passes 4 — The hall as chapter 13 left it: 14 light draws in 4 light passes.

passes: The passes the whole frame is drawn in, the scene’s and the post chain’s included. Each is a tile flush on a phone.
draws: The frame’s draw calls: the sprites’, the meshes’ and the normal pass’s.
batches, instances, culled: How the sprites were gathered into draws and why a run could not merge, how many sprites were drawn, and how many were skipped for being out of view. These rows are for sprites; they stay as they are while you budget lights.
lights: Light draws this frame, and how many of them cast shadows. A soft light counts once for each of its three samples, and each draw with shadows draws a stencil pass first. 14 drawn, 10 with shadows.
shadows: The occluder edges that cast this frame, each two triangles of stencil fill. 56 edges.
light passes: One pass for each light channel in use, each a tile flush on a phone. Channels 0, 1, 2 and 3 are in use: 4.

The hall’s 14 light draws are the two soft lanterns, three draws each, and the eight other lights, one each: the third lantern, the sconce, the moonlight, the stained glass, the shaft, the halo, the cold pocket and the moon. Four channels are in use, so four light passes. The chapters each priced their own controls; here they are in one place.

Control	What it costs
A light	One draw, and a stencil fill for each occluder edge that casts on it.
An Occluder	Its edges, in the shadow of every light that reaches it: chapter 3.
Softness above `0`	Three draws and three shadow passes: chapter 4.
A Channel other than `0`	A pass of its own over the whole screen: chapter 9.
A normal map	A pass that draws every sprite with a map into a buffer the lights read: chapter 10.
A light shader of your own	Its code, on every pixel the light covers: chapter 12.
Bloom	Two passes for each Blur Pair; Spread costs none: chapter 13.

The hall at a phone’s tier

Open Render, and under Preview as choose Android.

The editor previewing the Android tier: the toolbar’s readout reads Android 5p, look 1.00, 16.67 ms and 26 nodes; the Viewport shows the hall through the game camera with its light in coarser blocks and the window’s glow shorter than before

The first lantern with its light circle drawn over it, the left pillar below with a smooth shadow edge, and the top of the window at the right with a wide soft glow, at the game’s own tier — The game’s own tier.

The same part of the Viewport at the Android tier: the first lantern’s light in coarser blocks, the pillar’s shadow edge stepped, and the window’s glow shorter and streaked — The Android tier: the light in coarser blocks, a shorter, streaked glow.

Preview as: The tier the Viewport draws at: Desktop, Android or Android Low, a weaker phone’s. It is not saved with the project, and the editor opens without one. The toolbar’s readout names it and the passes it takes, as Android 5p.
Post → Game: The project’s own tier, which an exported game uses. It is where the editor starts, and where you go back to stop previewing.

The Android tier lights the hall at half the screen’s size, in the screen’s own eight bits, and runs a shorter post chain. Soft edges come out coarser, the glow blockier, and light past 1 is cut off. The hall still reads, which is the point of having previewed it: a phone is not where you want to find out.

White point

A computer’s light buffer can hold light brighter than 1: two lanterns shining on one brick add up to more than either. When the buffer is composited onto the screen, White point is the light value that lands at full white. Above 1, a soft curve bends bright light down to fit under it.

Open Render and, under Preview as, choose Desktop.
Open Render again. The Light buffer row is live, with Float16 chosen, and White point reads 2.00.
Drag White point to its left end, 1, and look at the first lantern’s bricks and the window. Then drag it to its right end, 4.
Open Render, and under Post choose Game, to stop previewing.

The Render menu cut to its upper part in a Desktop preview: Post set to Desktop with the line look 1.00 under it, Preview as Desktop chosen with a count of 7 passes, Anti-aliasing Off, View Shaded, Light buffer with Float16 chosen, and a White point slider reading 2.00; the word Lights below it — A Desktop preview: the **Light buffer** row live, **White point** `2.00`.

The first lantern, the left pillar and the window’s left edge at White point 1: the bricks round the lamp burnt pale yellow, the window pure white — White point `1`: light past `1` burns to white, as Game and an exported game draw it.

The same view at White point 2: the bricks round the lamp warmer and less pale, the window white with its panes’ lattice showing — White point `2`, the Desktop preview’s own: the brightest bricks pulled back below white.

The same view at White point 4: the whole view dimmer, the bricks a deeper orange-brown, the window a pale grey with its lattice clear — White point `4`: the whole hall dimmer, its highlights soft.

Light buffer: The format the lights are drawn into. Float16 holds light past 1 and is a computer’s; Surface is the screen’s own eight bits, a phone’s, which cut light off at 1. In Game the row is dimmed, since the project’s tier chooses; in a preview it is live.
White point: The light value that maps to full white, from 1 to 4. At 1 nothing is bent and light past 1 burns to white. Above it, a soft curve bends bright light down, so two lanterns’ summed light lands at white instead of clipping, and the whole picture comes out dimmer. 2.00 in a Desktop preview. It needs a Float16 buffer, since at eight bits light past 1 is gone before the composite sees it, and choosing Surface snaps it back to 1.

Budget the hall

Check that Render → Post is on Game, so you are not previewing.
Select lantern_1 and set Softness to 0. Do the same on lantern_2.
Select cold_pocket and untick Enabled. Do the same on moon.
Press Ctrl+S.

The statistics panel’s rows, from passes to light passes, after the budget: passes 7, draws 11, batches 5 broke on a texture, instances 213, culled 0, lights 8 drawn, 5 with shadows, shadows 32 edges and light passes 2 — After the budget: 8 light draws in 2 light passes.

The rows above lights are the whole frame’s and read as before. lights fell from 14 draws to 8, shadows from 56 edges to 32, and light passes from 4 to 2.

Every light on, every light off

The Render menu’s Lights row overrides every light’s Enabled for the frames the editor draws, and nothing else. It shows the room powered or unpowered without unticking anything.

Open Render and, in the Lights row, choose All off. Look at the hall.
Choose All on: the cold pocket and the moon you switched off for the budget come back.
Choose As authored again.

The Render menu with the Lights row near its foot and All off chosen: Post Game, Preview as, Anti-aliasing, View, a dimmed Light buffer row with a White point of 1.00 and the line Game runs the light buffer of the project’s quality tier, then Lights with As authored, All on and All off, and below it Gizmos, Shader globals, Render statistics and Debug draw — The **Lights** row, **All off** chosen.

The editor with Lights set to All off: the toolbar reads look 1.00 and lights All off in orange, the Render button lit, and the Viewport shows the hall at its ambient alone, dark and blue, with only the window and the lanterns’ glass bright

The editor with Lights set to All on: the toolbar reads look 1.00 and lights All on in orange, and the Viewport shows the hall with every light on, the moon’s small disc back above the window and the cold pocket darkening the bottom left

Lights: Whether the editor draws every light by its own Enabled, or all on, or all off, for the frames it draws. It never changes a light or the scene file.
As authored: Each light’s own Enabled, which is what the game does.
All on: Every light on, the ones you switched off included: the room as if powered.
All off: Every light off and only the ambient left: the room unpowered. That is not the same as a scene with no light at all, which draws at full brightness.

The phone budget

Change	Before	After
`lantern_1` Softness	`6`	`0`
`lantern_2` Softness	`6`	`0`
`cold_pocket`	on	off
`moon`	on	off
lights	`14` drawn	`8` drawn
light passes	`4`	`2`

The Render menu, for lighting

Row	What it is for
Preview as	A tier’s look: Desktop, Android or Android Low.
Light buffer	Surface or Float16, live in a preview.
White point	Where light past `1` lands, from `1` to `4`.
Lights	Every light on or off, for a look.
Render statistics	What the lights cost.

Export the hall

Export writes the hall to a folder of its own: your project, with its pictures prepared for the game to load, and a copy of the player that came with Rengy, named after your project. Nothing is compiled: the scripts run as they are. Exporting has the whole of it, and Crypt Knight’s export walks through the same steps.

Save with File → Save all: Export copies the files as they are on disk.
Click the Build tab, or choose View → Panels → Build if it is not there.
In its Export section, a line under Export says where the game will be written, ending in light-and-shadow/dist/light-and-shadow/light-and-shadow.
Press Export. When it is done, the editor opens the new folder in your file manager.
Double-click light-and-shadow, or light-and-shadow.exe on Windows. On Linux, if double-clicking does not start it, run ./light-and-shadow in a terminal in that folder.

The editor with the Build panel open under the Viewport: Build now beside the line Interpreter, scripts run directly, nothing to build, then the Export section with Export and Cook only and the line light-and-shadow/dist/light-and-shadow/light-and-shadow, and a folded Cook assets; the Viewport shows the budgeted hall through the game camera

The Build panel’s Export section: the Export and Cook only buttons, and under them the line light-and-shadow/dist/light-and-shadow/light-and-shadow

The hall in the game’s own window as the exported game draws it: the first lantern’s bricks warm with a hard shadow edge from the pillar, the window glowing white, the second lantern at the right, the stained glass on the floor, a timber leaning on the right pillar and a pale shaft in the doorway; no cold haze at the bottom left and no moon above the window — The exported hall, in its own window.

An exported game lights with its tier’s light buffer, at the white point the editor’s Game view uses, so it looks as you tuned it.

Where to go from here

Every control on a light is now one you have used. The last chapter, A gallery of lights, puts them to work in six small scenes you can lift into your own game: a neon sign, a searchlight, a campfire, day and night, a lava pool and light through blinds. Lighting and shadows is the guide to keep beside you, Effects and shaders covers the Post Volume and light shaders, and the Light reference lists every field.