1

Perception, Illusion and VR

HNRS 299, Spring 2008Lecture 19

Other Graphics ConsiderationsReview

2

Simple Graphics

In this class we have learned some simple graphics techniques. We have learned to:

•Use a graphics library (OpenGL) to create simple drawings and objects.•Transform the position of the object.•Color the objects•Create multiple copies of an object (with a loop)•Perform a simple animation

3

What OpenGL does for us

OpenGL performs several processes automatically.• Clip the objects so only things within the clipping volume are rendered.•Project the objects onto the image plane.•Remove the hidden surfaces.•Renders the object in pixels.•Updates the drawing at regular intervals (using the idle function).

4

More Advanced Graphics

To create more advanced graphics we need at least the following:

• More complex objects.•Lighting and shading.•Texture Mapping.•Collision detection.•User Interface.

5

Hidden Surface Removal--The Painters Algorithm

When rendering objects, we would like to show only the surfaces that are closest to us, and remove those that are behind other surfaces.

•The painter's algorithm renders each surface as it is encountered.•If two surfaces project to the same position, the one that is drawn second "paints over" the first one. The second one will be rendered regardless of the depth of the two surfaces.•This algorithm is more useful if you first sort the objects according to their distances from the camera. Render the most distant ones first.

6

Hidden Surface Removal--The Z-buffer Algorithm

•The Z-buffer algorithm uses an area of memory (the Z-buffer) to keep track of the depth of each rendered pixel.•As each object is rendered, the depth of each pixel is compared to the current Z value stored for that position.•If the depth of the new pixel is less than the stored depth, the new pixel replaces the old pixel (and the new depth replaces the old stored depth).•If the depth of the new pixel is greater than the stored depth, the new pixel is discarded.

Z = -600Z = -400

7

More Complex Objects

•Complex objects are made up of small polygons, usually triangles (sometimes 1000's of them).•Specific algorithms allow the creation of curved surfaces from polygons.•More polygons give smoother surfaces, but are slower for rendering.•Speeding things up for real-time applications often means using somewhat blocky looking objects.•OpenGL provides a library of objects:

Spheres, Cylinders, Cones, Teapots

8

Lighting and Shading

•Most real-time graphics use simple models of lighting and shading to generate shaded objects quickly.•The models compute the approximate shaded color of each surface pixel based on the following properties:

•Simulated position of the light source•Orientation of the surface relative to the position of the light source•The color of the light•The material properties of the surface:

•Color and amount of diffuse reflection (dull surface)•Color and amount of specular reflection (shiny surface)•Color and amount of ambient lighting.

•OpenGL allows specification of all of these properties.

9

More realistic lighting and shading

More realistic shading comes with a time cost. The techniques are not generally used for Virtual Reality because they're slow.

Ray Tracing:•In ray tracing, the light rays are traced from the simulated eye position, through each pixel on the screen, back to the object.•If necessary, the reflected light ray is projected to the light source.

Radiosity: In this technique, the light energy is computed as it reflects off multiple surfaces. This is the slowest technique.

10

Texture Mapping•Rendering scenes with lots of detail can take too much time.•Imagine drawing all the individual blades of grass in a field.•We can give the appearance of detail by mapping an image onto a surface. This is known as texture mapping.•For example, we can map a picture of grass onto a flat rectangular floor.•This is a fast, easy way to generate detailed looking scenes.

11

Collision DetectionWhen objects are moving, we need to detect when one object collides with another, so they can interact appropriately.Example: Pong•The ball bounces off the paddles or the walls and changes direction with each bounce.•The computer must keep track of the position of the boundaries of the ball and test for when the ball touches a surface.

For complex objects, we can use a bounding box to calculate the position of the boundaries.

12

User Interface

Interactivity is essential to Virtual Reality. The user must be able to interact with objects within the virtual world.Simple Interactivity:We can use basic computer tools to interact:

Use the mouse to select and dragUse menus to perform actionsUse the keyboard to enter commands.

Slightly more complex:Use a game-controller to interact.

Most Complicated:Track the user's position.Track the position of a data glove.Allow the user to interact with objects using the glove.

13

Review--Essay questions1. Consider the Muller-Lyer illusion (shown below). Describe the illusion and give an explanation of why it appears the way it does. Justify your answer based on what we have learned about visual perception.

2. What is change blindness? What are the implications of this for how we view movies?

14

Review--Essay questions3. In the painting shown, list 3 cues to depth used by the artist. Briefly describe each.

4. Describe how Spatial summation is used by artists.

15

Binary, Hexadecimal, Decimal5. a) Convert the following binary number into hexadecimal:

11000111101

b) Convert the following binary number into decimal:110111

c) Convert the following hexadecimal number into decimal:25B

16

Colors6. a) What is indexed color?

b) What color is represented by #AA00EF?

c) How many colors can be represented using a bit depth of 10?

d) If we are using 32 bit color, and our screen has a resolution of 850 x 1000, how many bytes are needed to store the color values for the entire screen?

17

Computer Graphics7.a) What 4 stages are performed by a computer graphics system in the imaging process?

b) Write the openGL commands to draw a square outline with corners located at p1, p2, p3, p4, given below, that is first rotated by 45 degrees and then translated to the right by 100 units.p1 = (-50, -50) p2 = (-50, 50) p3 = (50, 50) p4 = (50, -50)

c) Given point P = (10, 20, -100), what is the result, P', of rotating P by 30 degrees about the Y axis?

€

sin30 =1/2

cos30 = 3 /2

18

Programming8. What is the result of the following code?

int count = 0;while (count < 5) {

glPushMatrix( );glTranslatef(25*count, 25*count, 0);glBegin(GL_TRIANGLE);

glVertex2f(0,0);glVertex2f(25, 25);glVertex2f(50, 0);

glEnd( );glPopMatrix( );count = count + 1;

}