Where WeÕve BeenÉ Éugweb.cs.ualberta.ca/~c250/F07/schedule/lectures/Lecture10.pdfRendering CMPUT...
Transcript of Where WeÕve BeenÉ Éugweb.cs.ualberta.ca/~c250/F07/schedule/lectures/Lecture10.pdfRendering CMPUT...
History of Technology in Games3D Graphics
CMPUT 250
Fall 2007
Tuesday, October 9
CMPUT 250: Fall 2007 Lecture #10: History 3
Where We’ve Been…
! Processing
! Storage
! Graphics
! CRT
! Vector Graphics
! Raster Graphics
! Bitmaps
! Resolution, Colour Depth, Frame Rate
! Early Arcade Games Raster Wins
CMPUT 250: Fall 2007 Lecture #10: History 3
…
! 2D Graphics
! Sprites
! Layers
! Collision Detection
! Specialization and Generalization
! History of Home Consoles
CMPUT 250: Fall 2007 Lecture #10: History 3
Today
! 3D Graphics
! Camera
! Meshes
! Triangles
! Models
! Culling
! Volume Partitioning
! Advances in 3D
! Shading and Texturing
! Special Effects
CMPUT 250: Fall 2007 Lecture #10: History 3
3D Graphics
! This is a very complex subject
! Video screens are 2D; World is 3D
! Produce a 2D image of a 3D world
! Virtually build our 3D world
! Point a virtual camera at it
! How do we describe the objects in the world?
! What does our camera do?
Scene
Rendering
CMPUT 250: Fall 2007 Lecture #10: History 3
Types of Rendering
! Non Real-Time (e.g., raytracing)
! Trace paths of beams of light in the world and computetheir colour when they hit the camera’s field of view
! Slow (minutes or hours for one frame) but high quality
! Used in movies like Pixar’s Toy Story, etc.
! Sometimes used to pre-render scenes in games
! These images can also be used as a background
! Real-Time
! Draw image in real-time (quickly enough to animate)
! Lower quality but world can change with player actions
CMPUT 250: Fall 2007 Lecture #10: History 3
! A camera is a view of the world
! Occupies a position in 3D space (x,y,z) and pointsin a direction
! Viewing angle (horizontal and vertical)
! Real cameras also have:
! Focal length
! Lens Distortion
! Focus
! Depth of Field
The Camera
CMPUT 250: Fall 2007 Lecture #10: History 3
The Camera: Frustum
! Volume visible to camera: view frustum
© George Otto, Penn State University
CMPUT 250: Fall 2007 Lecture #10: History 3
The Camera: Styles
! Fixed cameras
! Finite position and direction (Myst, 7th Guest)
! Fixed position (Myst 3)
! Fixed direction (some RTS, isometric view)
! Fixed path (rail-shooters like Virtua Cop)
! Fixed path with free direction (rail-shooters like
Panzer Dragoon)
CMPUT 250: Fall 2007 Lecture #10: History 3
The Camera: Styles
! Free cameras
! Chase camera (3rd person, follows behind)
! Free-look (1st person, looks wherever you point)
! Look-spring (1st or 3rd camera can be moved butautomatically returns to its default when released)
! Rear-view (look behind you)
! Droppable (move and then leave it there)
! Switching from 1st to 3rd or vice versa
CMPUT 250: Fall 2007 Lecture #10: History 3
The Camera: Friend or Foe?
! Obstructions in 3rd person view
! Where does the chase camera go when you
back into a wall?
! Camera won’t allow the angle you want
! Camera too slow
! Camera too erratic or has jerky transitions
! Camera too automatic or too manual
CMPUT 250: Fall 2007 Lecture #10: History 3
Simple “3D” Tricks
! Scaling: making 2D sprites bigger or smaller tosimulate moving toward or away
! Boot Hill (Midway, 1977)
! Isometric view: 2D artistic style showingperspective from a fixed angle
! Zaxxon (Sega, 1982)
! These aren’t really rendering
! We want a world with real 3D objects (i.e., they occupysome volume of space… not just an area of the screen)
CMPUT 250: Fall 2007 Lecture #10: History 3
The Scene
! Need to represent things in the world
! Irrelevant what they look like inside
! Let’s make “hollow” objects
! Here’s the plan:
! Objects defined by surfaces (or meshes)
! Surfaces built out of polygons
! Polygons built out of triangles
! Triangles defined by their vertices
CMPUT 250: Fall 2007 Lecture #10: History 3
Polygons
! Polygons are 2D objects described by three
or more points connected by line segments.
! They are closed (all line segments
connected) and line segments do not cross
each other.
! A point used to describe a polygon is called
a vertex (plural: vertices).
CMPUT 250: Fall 2007 Lecture #10: History 3
Example of Polygons
CMPUT 250: Fall 2007 Lecture #10: History 3
Examples of Non-Polygons
Not line segments
Not closed
Line segments cross
CMPUT 250: Fall 2007 Lecture #10: History 3
Triangles
! Simplest polygon
! Nice mathematical properties
! Can divide up more complex polygons into
triangles (tessellation)
CMPUT 250: Fall 2007 Lecture #10: History 3
Coordinates
! Two dimensional points can be described using2D coordinates or vertices
! Each coordinate is two numbers (x and y), referring tohorizontal and vertical position
! For our surfaces, we must use 3D coordinates(x, y, z) referring to horizontal, vertical, and depth
! Our polygons (triangles) will be described by 3Dcoordinates
CMPUT 250: Fall 2007 Lecture #10: History 3
Meshes
! A collection of triangles for a single
“object” is called a mesh
! In the end, a mesh is just a big list of vertex
coordinates
CMPUT 250: Fall 2007 Lecture #10: History 3
Multiple Meshes
! Figures can be composed of multiple
meshes. The pieces (meshes) can separate.
CMPUT 250: Fall 2007 Lecture #10: History 3
Normal Vectors
! Recall our objects are hollow and we only
care about the “outside”
! Which side is the outside?
! Normal vectors point out from a triangle’s
visible side
CMPUT 250: Fall 2007 Lecture #10: History 3
How to Draw a Scene
! World is built out of many, many triangles
! Place the camera in the world
! We can calculate what a triangle looks like from thecamera’s position
! But some triangles obscure others (?)
! One idea:
! sort triangles by how far away they are
! draw them from furthest to closest
! closer triangles will be drawn over top of furthertriangles
CMPUT 250: Fall 2007 Lecture #10: History 3
Problem
! Too many triangles
! Limited number can be drawn per frame
! Essentially the same problem we had in vectorgraphics and sprite graphics
! Always need to consider scene complexity
! Many factors to complexity
! Number of potentially visible triangles
! Effects in rendering those triangles
! How can we draw complex worlds?
CMPUT 250: Fall 2007 Lecture #10: History 3
Culling
! Reduce the number of triangles we need to draw
! Culling is the process of eliminating trianglesfrom the list of those we need to draw.
! Can obviously ignore
! triangles behind the camera
! triangles out of the forward field of view up-down andright-left
! triangles beyond the camera’s range
! all this is called frustrum culling
! only consider triangles inside the camera’s frustrum
CMPUT 250: Fall 2007 Lecture #10: History 3
The Camera: Frustum
! Volume visible to camera: frustum
© George Otto, Penn State University
CMPUT 250: Fall 2007 Lecture #10: History 3
Clipping
! Only considering triangles inside the
frustum now
! Triangle may only be partially inside
! Cut off part of triangle that is outside
! This process is called clipping
CMPUT 250: Fall 2007 Lecture #10: History 3
Still have problems…
! With complex worlds, even computing what
triangles are inside the frustum may be too slow!
! Camera’s max depth may cover most of the world
! Need a fast way of deciding what triangles might
be visible before we cull
! Let’s break the world up into manageable spaces
CMPUT 250: Fall 2007 Lecture #10: History 3
Philosophical Question
Ever wonder why you can’t just
blow any and every wall up?
CMPUT 250: Fall 2007 Lecture #10: History 3
Static vs. Dynamic Objects
! Static Objects, e.g., walls, statues, trees
! Precompute (calculate ahead of time) and store
information about the visibility of its triangles
! Use the information to speed up rendering
! If most of the world is static… life is good
! … but boring
! Static objects can still help
CMPUT 250: Fall 2007 Lecture #10: History 3
Volume Partitioning
! Use static objects to divide up (partition)
the world into separate spaces (volumes)
! Rooms are a natural way to do this
! We can manually specify the division when
we design the levels
! There are more automatic methods, but we
start with a portal system.
CMPUT 250: Fall 2007 Lecture #10: History 3
Portals
A
B
CD
A B C
D
CMPUT 250: Fall 2007 Lecture #10: History 3
Portals
! Divide world into regions connected by
portals
! Camera is limited to triangles in the same
region as it (or adjoining regions)
! Allow portals to be open or closed to keep
the number of regions small
CMPUT 250: Fall 2007 Lecture #10: History 3 CMPUT 250: Fall 2007 Lecture #10: History 3
Automated Volume Partitioning
! Automated methods split the world’s
volume up into pieces using geometry.
! Examples include
! Binary space partitioning
! Quadtrees
! Octrees
! Many games use a mixture of manual and
automatic methods
CMPUT 250: Fall 2007 Lecture #10: History 3
Early 3D
! Made possible by volume partitioning
! 2D graphics (sprites) in a 3D environment
! The Games
! Ultima Underworld (Looking Glass, 1992)
! Wolfenstein 3D (id Software, 1992)
! Doom (id Software, 1993)
! Heretic (Raven Software, 1994)
! Marathon (Bungie, 1994)
! System Shock (Looking Glass, 1994)
! Duke Nukem 3D (3D Realms, 1996)
CMPUT 250: Fall 2007 Lecture #10: History 3
Early 3D: 2.5D
! One “floor”: possibly variable height
! No rooms above rooms (except by trickery)
! History
! Ultima Underworld allowed a complex environment(angled walls, inclined surfaces) but was slow
! Wolfenstein 3D made simplifying assumptions (e.g. all-right angles, all floors the same level) and was fast
! Doom relaxed restrictions (some angled walls, somevariable height floors) while keeping the speed
! Heretic allowed angling viewpoint up and down
CMPUT 250: Fall 2007 Lecture #10: History 3
Early 3D: Beyond 2.5D
! More History:
! System Shock broke 2.5D and allowed floors above
other floors and transparency (although slow)
! This functionality might have been around in Ultima
Underworld
! But, the id games were ultimately more successful
! Simpler
! Faster
CMPUT 250: Fall 2007 Lecture #10: History 3
System Shock (Looking Glass, 1994)
© MobyGames
CMPUT 250: Fall 2007 Lecture #10: History 3
Doom (id Software, 1993)
© MobyGames
CMPUT 250: Fall 2007 Lecture #10: History 3
Models
! Sprites look weird in a 3D world!
! We need 3D objects
! Game creatures, power-ups, doors
! Destructible parts of environment
! These are sometimes called models to
distinguish them from static background
CMPUT 250: Fall 2007 Lecture #10: History 3
Models
! Meshes!
! Lots of triangles per model, though
! Can’t precompute anything
! Limit number of visible models
! Keep track of where model is in volume partitioning
! Ever notice that sprite-based 3D games had many,
many enemies. In polygon-based, not so many
CMPUT 250: Fall 2007 Lecture #10: History 3
Quake (id Software, 1996)
© MobyGames
CMPUT 250: Fall 2007 Lecture #10: History 3
Later 3D: Sprites Replaced
! Descent (Parallax, 1995)
! Quake (id Software, 1996)
! Quake II (id Software, 1997)
! GoldenEye 007 (Rare, 1997)
! Half-Life (Valve, 1998)
! Thief (Looking Glass, 1998)
! Unreal (Epic, 1998)
! System Shock 2 (Irrational Games/Looking Glass,1999)
CMPUT 250: Fall 2007 Lecture #10: History 3
Modern 3D: Graphics Hardware
! Early 3D games used software rendering
! Up to around Quake II (1997)
! Computed entire process on the general-purpose CPUSprite hardware only semi-useful
! 3D hardware rendering was very expensive
! Developed by Silicon Graphics (SGI) throughout thelate 80’s and 90’s
! Commercially viable for home gaming startingwith the Voodoo card from 3dfx in 1996
CMPUT 250: Fall 2007 Lecture #10: History 3
Modern 3D: GPU
! Much of 3D is repetitive calculations
! Custom hardware can do this more
efficiently than the general-purpose CPU
! Graphics Processing Unit (GPU)
! Initially, vertex information computed by CPU
and sent to GPU to draw with textures
CMPUT 250: Fall 2007 Lecture #10: History 3
Modern 3D: GPU
! More and more features added to GPUs
! Hardware transform and lighting
! Complex texturing operations
! Completely programmable “pixel shaders” –
more like a traditional CPU!
! Sound familiar?
! Expect to see physics and collision
detection soon!
CMPUT 250: Fall 2007 Lecture #10: History 3
Rendering Triangles
! Now we know what triangles to draw
! How do we draw them?
! A little math figures out what the triangle’s
shape is from the camera’s perspective
(transform)
! What do we draw?
CMPUT 250: Fall 2007 Lecture #10: History 3
Rendering: Wireframe
! Just draw the lines: wireframe
© www.realityfactory.ca
CMPUT 250: Fall 2007 Lecture #10: History 3
Rendering: Filled
! Fill triangles with a single, solid colour
! Soecify colour for each triangle with RGB
values
! Problem: adjacent faces of
the same colour indistinguishable
© www.realityfactory.caCMPUT 250: Fall 2007 Lecture #10: History 3
Rendering: Flat-Shading
! Draw filled triangles shaded according to light
! Flat-shading
! Specify colours for triangles
! Specify light(s)
! Compute effect of light
on filled triangles
! Single (but different) colour
for each triangle
! Gives a proper 3D impression, but crude
© www.realityfactory.ca
CMPUT 250: Fall 2007 Lecture #10: History 3
Rendering: Smooth-Shading
! Shade each triangle according to lights
! Smooth-shading
! Colour varies over triangle
! Smoother transitions between
adjacent triangles
© www.realityfactory.caCMPUT 250: Fall 2007 Lecture #10: History 3
Rendering: Texturing
! Fill triangles with an image
! Texturing
! Specify entire image for surface
(i.e., a colour for every pixel)
! Texture pixels called texels
! Can shade texels according
to light as well
! Texture mapping: stretch image
over an entire mesh, instead
of just a single triangle
© www.realityfactory.ca
CMPUT 250: Fall 2007 Lecture #10: History 3
Texturing Issues
! Texturing adds a huge amount of realism
! Can add surface detail without adding triangles
! Textures can even be animated (i.e., change theimage over time)
! However, requires much more storage thanshaded triangles
! A huge part of modern gaming technology isconcerned with allowing more textures, withhigher resolution, and moving texture informationaround efficiently
CMPUT 250: Fall 2007 Lecture #10: History 3
Texture Resolution
! If you get very close to a texture, it may look“blocky” because you can see individual texels
! Far away objects don’t need much detail
! Standard solution: mipmapping
! copies of same texture at multiple resolutions
! switch copies as camera moves further/closer
! Switching resolutions can cause odd problems
! partially solved by filtering: bilinear, trilinear,anisotropic
CMPUT 250: Fall 2007 Lecture #10: History 3
Level of Detail
! Mipmapping is an example of a level of detail
(LOD) approach
! Basic idea is that far away things need less detail
! Other LOD approaches, include
! Changing meshes at different distances (fewer triangles
when far away) (e.g., “Messiah” by Shiny, 2000)
! Dropping lights, shadows, and any other special
features when objects are far away
CMPUT 250: Fall 2007 Lecture #10: History 3
Advanced 3D
! It’s all about the effects
! What about windows?
! What about fog or mist?
! What about smooth versus rough surfaces?
! What about shiny surfaces?
! What about mirrors?
! What about water or fire?
! What about realistic clothing or hair or fire or smoke?
! What about shadows?
CMPUT 250: Fall 2007 Lecture #10: History 3
Transparency
! Colour the light that passes through translucent objects
! Do this by adding an extra value to every pixel (texel)
! Red, green, blue, and alpha
! Alpha specifies how transparent the pixel is
! When drawing the scene, transparent pixels modify thevalue of stuff behind instead of overwriting it
! Keep in mind that transparency means more visibletriangles!
CMPUT 250: Fall 2007 Lecture #10: History 3
Lights
! Another very complicated subject
! Basic properties
! Intensity (brightness)
! Colour
! Source
! Advanced properties
! Diffusion, specular highlights, reflection
CMPUT 250: Fall 2007 Lecture #10: History 3
Kinds of Light
! Ambient light
! Artificial concept of light that is “everywhere” in thescene – all surfaces are lit by it equally
! Everything is visible to some minimum extent
! Point-source lights
! Placed in the world (like the camera)
! Shine in all directions
! Directional lights
! Placed in the world (like the camera)
! Shine in a cone
CMPUT 250: Fall 2007 Lecture #10: History 3
Diffuse vs. Specular Lighting
! Diffuse lighting refers to surfaces absorbing andthen emitting light uniformly over the surface
! Angle of incoming light matters
(affects quantity of emitted light)
! But viewer’s angle does not
! Specular lighting “bounces” off the surface
! light comes in at an angle and leaves at an angle
! viewer’s angle matters
! responsible for “shiny spots”
or “glare” on objects
CMPUT 250: Fall 2007 Lecture #10: History 3
Specular Highlights
CMPUT 250: Fall 2007 Lecture #10: History 3
Reflectivity
! The reflectivity of a material determines how
much light is absorbed versus reflected.
! Highly reflective surfaces create reflections
! Parts of the scene appearing in shiny surfaces
! Expensive to do properly, so faked instead
CMPUT 250: Fall 2007 Lecture #10: History 3
Environment MappingCube Map
© www.developer.com CMPUT 250: Fall 2007 Lecture #10: History 3
Environment MappingCube Map
© Stephen Chenney, U. Wisconsin
CMPUT 250: Fall 2007 Lecture #10: History 3
Precomputing Lighting
! If lights are static, we can precompute their
effect on a surface and store it
! The stored information is called a lightmap
! Combined with the texture of a surface
during rendering to change its look
CMPUT 250: Fall 2007 Lecture #10: History 3
Lightmaps
+ =
Texture Lightmap Rendered surface
© www.flipcode.com
! Reuse textures with different lightmaps
! Saves space
CMPUT 250: Fall 2007 Lecture #10: History 3
Bump Mapping
! A per pixel lighting effect
! Each pixel specifies its own surface normal
! Light is bounced off each pixel relative its
individual surface normal
! Great for adding roughness to surfaces
CMPUT 250: Fall 2007 Lecture #10: History 3
Bump Mapping
CMPUT 250: Fall 2007 Lecture #10: History 3 © www.earthenrecords.com
Halo (Bungie Studios, 2003)
CMPUT 250: Fall 2007 Lecture #10: History 3 © www.earthenrecords.com
Halo (Bungie Studios, 2003)
CMPUT 250: Fall 2007 Lecture #10: History 3
Bump Mapping: Angle Sensitive
© www.earthenrecords.com
CMPUT 250: Fall 2007 Lecture #10: History 3
Lighting: Finer than Triangles
! So far, lighting behaviour specified for each triangle
! Contemporary lighting doesn’t stop at triangles
! Lighting can be per vertex
! Lighting specified for each vertex and “blended” over the triangles
! Lighting can be per pixel
! Each pixel on the surface specifies its own lighting behaviour
CMPUT 250: Fall 2007 Lecture #10: History 3
Materials
! We seem to be collecting a lot of information to describetriangles
! Information about drawing triangles is often calledmaterial information
! Colour/texture
! Transparency (alpha)
! Reflectivity
! Special effects (e.g. bump mapping info)
! Precomputed effects (e.g. light maps, shadow maps)
! Games are using more and more detailed materialinformation – it all costs storage!
CMPUT 250: Fall 2007 Lecture #10: History 3
More, more, more
! Pixel shaders
! Shadows
! Particle effects
! Cel-shading
! 3D Collisions
! More realism… more hardware
CMPUT 250: Fall 2007 Lecture #10: History 3
In Summary…
! 3D graphics is a very complex subject
! Video screens are 2D; World is 3D
! Produce a 2D image of a 3D world
! Virtually build our 3D world
! Point a virtual camera at it
! How do we describe the objects in the world?
! What does our camera do?
Scene
Rendering
CMPUT 250: Fall 2007 Lecture #10: History 3
Questions?
CMPUT 250: Fall 2007 Lecture #10: History 3
Post Mortems
! A critical examination of the game design
process and the resulting final product.
! What went right?
! What went wrong?
! By the designers!
! They know their design goals.
! They know the process and decisions that went
into their game.
CMPUT 250: Fall 2007 Lecture #10: History 3
Why Post Mortems?
! The process is good for the designers.
! Critically analyze the design process.
! Identify mistakes to be avoided in the future.
! Can also benefit other designers.
! Inside track on their design goals and process.
! Learn from others mistakes.
CMPUT 250: Fall 2007 Lecture #10: History 3
Katamari Damacy (2004)