Enhancing Visual Quality Chapter One

1
Enhancing Visual Quality(Chapter One)
Virtools North American User Day, Nov. 4th, 2005
Francisco Cabrita Virtools RD Engineer Game
Consultant
2
What

• Compilation of simple tips - Avoid common
  mistakes (often seen in Virtools and
  elsewhere) - Kind of check list for minimal
  visual quality - Chapter 1 theres many other
  things to add
• Not sorted - no topic is more relevant than
  the other - depends on each game - shorter
  topics are not less important
• 1 hour could be spent on each topics

3
Sky Cylinder
Sky Cylinder
4
Sky Cylinder
Whats a Sky Cylinder?
It is a tiling landscape texture
5
Sky Cylinder
Whats a Sky Cylinder?
and a cylinder around a camera
6
Sky Cylinder
Whats a Sky Cylinder?
apply the landscape texture to the cylinder
7
Sky Cylinder
Whats a Sky Cylinder?
stretch UVs a little to avoid bad filtering at
caps
8
Sky Cylinder
Whats a Sky Cylinder?
tile UVs 3 or 4 times along U axis
9
Sky Cylinder
Whats a Sky Cylinder?
Use pre-lit mode (full emissive)
10
Sky Cylinder
Whats a Sky Cylinder?
move cylinder to match camera horizon
11
Sky Cylinder
Whats a Sky Cylinder?
change cylinder referential to match camera
position
12
Sky Cylinder

• When to use a Sky Cylinder?
• When memory is a concern (cube map 512x512x6
  6 MB!)
• When top and bottom faces are almost never seen
• When one want a good sky resolution
• When sky is animated

• How to use a Sky Cylinder?
• Pre-lit mode in most case
• Dont use mipmap
• Simply set the skys position to the cameras
  position (use lower priority on sky!)
• Dont allow picking

13
Sky Cylinder

• What about singular details?
• Sun can be a lens flare
• Sun can be attached to the sky as a 3d sprite
• Other far away objects can be added the same way

• In fact any object stuck to the cameras
  position is perceived as unreachable
• Stars
• Mountains
• Clouds

14
Sky Cylinder
Play this game!
Ballance- Atari -by Cyparade
Virtools
Planet could be a real rotating object
Vertex Render BB for stars, attached to the sky
cylinder
Virtools
Virtools
Moving Clouds is a plane attached to the sky
cylinder
15
Environment Map
Environment Map
16
Environment Map

• Types
• Cube Map - Correct reflection from any
  viewing direction - Useful for live
  environment reflection - Expensive
• 2D Map - Fake reflection (chrome effect)
  - Correct only from one view point -
  Moving object wont appear in the env. map.
  - Cheaper - Can be used on any 3d cards

How to achieve realistic rendering?...
17
Environment Map
Analyzing components of reflective materials
Full mirrorPerfect for ChromeToo shiny otherwise
Most materials absorb light so that only
highlights remains
but at edges they reflect more (Fresnel)
Some materials produce a more diffuse reflection
A realistic env. map is a balanced combination of
those components.
18
Environment Map
Applied on a blue object channel in Zero/One
Blending mode. Using directly the mirror ball
produces a very shiny chrome effect.
Applied on a blue object channel in One/One
Blending mode. Using highlights at the middle
and Fresnel factor for edges produces a nice
glossy effect.
19
Environment Map

• Additional tips
• 50 of the env. map quality come from the
  initial shot.- Take a picture of a reflective
  ball in a contrasted environment - Windows, sun
  or spot lights look good- Horizon to separate
  ceil from floor
• Easier to tweak from an HDR shot- Especially
  to get correct diffuse/specular maps or retrieve
  highlight feature (lower exposition)
• Can generate env. map from a ball rendered in a
  3D Package- 3dsMax, Maya, or any package can
  render nice balls.- Dual_Tone_Car_Paint shader
  in Virtools can also be used !

20
Environment Map

• Flat surfaces can use 2D env. Maps - Add a
  little bit of the 2d vertexs position to the
  normal - Its already done in the Env.Map BB. -
  Provided Reflection shader already exposes the
  vertexPositionInfluence as a parameter. How
  its done in the shader

Note States and Vertex Shaders are emulated when
using DirectX9, so you can still use a vertex
shader if you want (more control). An env.map
shader with no pixel shader code would work
pretty fast on a non-shader compliant 3d card.
Without position influence
With position influence
21
Alpha Channel Transparency
Alpha Channel Transparency
22
Alpha Channel Transparency
RGB Channel should overflow the Alpha Channel




23
Alpha Channel Transparency

• Special case
• Sometimes Alpha Channel can overflows the RGB
  Component

Blue around letters helps the score to stand out
against background.
24
Alpha Mask
Alpha Mask
25
Alpha Mask

• What is Alpha Mask in Virtools?
• Material with alpha channel used as a binary
  mask - Just like the oldish color key
  transparency but with a threshold (Alpha Ref)-
  Texels passing the alpha test are drawn, others
  are not (binary)
• By default Alpha Mask is blended with
  background- Drawn texels are blended with a
  classic SrcBlend / DestBlend mode.- In most case
  it means only edges are blended.
• Alpha Mask object are not treated as
  transparent!- They are rendered in the same loop
  as opaque objects- so they are not sorted (very
  fast to render)- and they read and write in
  Z-Buffer

Alpha Ref 13
Alpha Ref 85

• When to use Alpha Mask?
• Perfect for trees, vegetation, rubbish on the
  ground - Because Alpha Mask objects are not
  sorted!
• When standard transparency produce unsolvable
  sorting issues- Transparency sorting is valid
  at object level, and correct if objects are
  non-self-penetrating convex.

Alpha Ref 220
26
Alpha Mask

• Take care of rendering order
• If blending is used (default mask mode) be sure
  to set lower render priority

Tree render priority lower than landscape
Default render priority 0 for all objects

• If blending is not used, dont worry about
  rendering order (see hierarchy manager)
• Note This is not an Alpha Channel filtering
  issue!

27
FOV
Field of View
28
FOV
Default FOV (50 mm 39.5 º) is too narrow in
most cases - Player already see the scene
through a narrow window the computer screen.-
Kills perspective effect- Makes action harder to
follow

• Use a wider FOV in most cases (35mm 54 º)

Narrow FOV hard to see distances
Wider FOV better choice here
29
FOV

• Use narrow FOV (85 mm 24 º)
• - Car race replay- During close up dialogues

Car race replay at end of curve.
Narrow FOV aesthetic close up.
Wide FOV comic effect.

• Use wide FOV (28mm 63 º)- In an FPS- When
  the camera is stuck between a character and a
  wall- Acceleration effect

30
Shadow
Shadow
31
Shadow

• Shadows help understand perspective.
• They are useful to feel contacts.

Shadow says object is floating in the air
No Shadow how big and far is the object?
Shadow says objects lies on floor!

• Many games still only use a simple ball shadow
  at characters feet because its sufficient to
  feel the contact (and its right!)

• For stencil shadows use manifold objects (closed
  topology)

32
MipMap
Mip Mapping
33
MipMap
Faster on every 3D cards (GPU Cache
friendly) Textures and materials use mip-mapping
automatically since Virtools Dev 3.5.Disable
it explicitly only if you dont need it - Sky
cylinder- UI textures- Any texture that will
never be shrunk when rendered (i.e. texture size
rendering size from any view point).Consume
33 more GPU memory Need memory? Reduce
needlessly big textures before disabling
MipMapping!

34
Light
Light
35
Light

• Lights give the relief and the atmosphere
• In most case not here to show object

Lights in movies are far from being realistic,
but they appeal to the human vision - the way we
see things is in many senses different from their
real nature.

• Use darker ambient color to attenuate stencil
  shadow popping artifact

Stencil Shadow popping artifact
darken ambience
36
Light
Using one light is correct from one direction
but too dark from behind
Whats the solution?
37
Light
Put a lot of lights or use full emissive!?
Dont do that !
- It flatten the rendering- It drops down the
frame rate
38
Light
Using one directional light ambient color
Correct from behind.
39
Light
Faking realityExample Overflowing light
a
0 º
40
Texture Tiling
Texture Tiling
41
Texture Tiling
No mipmap here
Too many prominent details
Nice tiling but brightness variation
Simple rules

• Use Mip-Mapping!
• Avoid strong details - Theyll worsen
  tiling artifacts.
• Dont remove too much details it will flatten
  the texture.
• Ensure uniform brightness
• You can use an additional dust channel (organic)
  with a desynchronized tiling to break periodicity.

Perfect tiling (no precision loss)
42
Texture Tiling
Removing brightness variation without altering
texture details
Grey Scale
Strong Blur
Soft LightBlending
Invert
Auto level Strong Blur
No details have been destroyed by this process!
Note for better result you should work on a
tiled version (3x3 tile of the initial texture)
and then crop the end
43
T vertices
T vertices
44
T vertices

• Rasterizer interpolation dont match vertex
  transformation.
• Geometry is not closed ? Can also produce holes
  in stencil shadows
• Even more noticeable on stretched triangles

BAD
GOOD
45
Face Intersection
Face Intersection
46
Face Intersection

• Worsen Z-fighting

• Produce map filtering artifacts

47
Z Fight
Z Fight
48
Z Fight
Why Is that happening to me? Z test is computed
using the rasterizer interpolation of W 1/Z
which is precise for small Z (i.e. Z closed to
the cameras near plane).Using a small cameras
near plane compared to the scene size forces
every Z test to become inaccurate when faces are
almost coplanar.

• Solution?
• Dont create coplanar faces one above the other
  - which furthermore is really bad for the fill
  rate.
• Use a camera near plane distance proportional to
  scene size.if scene is small you can use a very
  small camera near plane, if scene is big you
  should use a greater camera near plane)

49
Frame Rate
Frame Rate
50
Frame Rate

• Synchronize to screen.
• Use Free only for testing purpose.Free can
  produce very noticeable frame rate jumps, and
  slow down the whole computer (especially on
  laptop).
• Even more for web content where the end-user
  dont want to see its browser start freezing.

• Processing order can produce frame-rate-like
  artifact.Ex
• - Post rendering effect should occur after camera
  motion
• - Objects Slider BB on camera must be processed
  after the camera motion too.

51
Resources
Resources
52
Resources
Our resources are examplesIf we knew our basic
sky around texture or the ugly -because-too-dark
simple shadow texture were to be used in so many
productions, we would have made much more efforts
to make them look really professional.Same goes
for the particle textures youll get more chance
to reach the effect you want with a custom
texture.Ex achieving dark smoke. With a
wealth of this experience we pay more attention
to our new resources yet they are still to be
taken for what they are examples.