Programming for Art Three Dimensions ART 315 Dr

  • Slides: 49
Download presentation
Programming for Art: Three Dimensions ART 315 Dr. J. R. Parker Art/Digital Media Lab

Programming for Art: Three Dimensions ART 315 Dr. J. R. Parker Art/Digital Media Lab Lec 19 Fall

3 D Images are two dimensional – they have width and height. Paintings and

3 D Images are two dimensional – they have width and height. Paintings and drawings are 2 D, but are often representations of 3 D things. In 3 D one’s position and orientation dictates what can be seen. Points have 3 coordinates, and this represents space as we know it. 2 2

Viewing Objects are realworld items that have a recognizable 3 D shape, and what

Viewing Objects are realworld items that have a recognizable 3 D shape, and what an artist sees from their viewpoint can be rendered as a 2 D image

Viewing Imagine that the scene consists of a simple prism and that the center

Viewing Imagine that the scene consists of a simple prism and that the center of the front face of the prism is distance d from your eye. 4 4

Viewing The projection of the scene, or the prism here, is a two dimensional

Viewing The projection of the scene, or the prism here, is a two dimensional view obtained by placing a plane in between the viewer and the scene. 5 5

Viewing The plane being discussed is referred to as the viewing plane or projection

Viewing The plane being discussed is referred to as the viewing plane or projection plane (PP), and the location of the eye above is often called the center of projection or COP 6 6

Perspective in Processing perspective(fovy, aspect, z. Near, z. Far); 7 7

Perspective in Processing perspective(fovy, aspect, z. Near, z. Far); 7 7

Hidden Line/Surface Removal Some things might be hidden behind something else, or they may

Hidden Line/Surface Removal Some things might be hidden behind something else, or they may simply not be in your field of view. Simulating this involves clipping the objects outside of a viewing volume. Processing/Open. GL does this for us, and uses the popular Z-buffer method. 8 8

Z-buffer

Z-buffer

Z-Buffer A Z-buffer or depth buffer is a two dimensional array the same size

Z-Buffer A Z-buffer or depth buffer is a two dimensional array the same size as the viewing area. Objects are usually drawn one at a time, and if the Z -buffer has no entry in it for a pixel to be drawn, we save the distance from the viewpoint to the object at that point in the Z-buffer. If the Z-buffer has a distance in it already, we compare that against the distance of the pixel we are drawing; if it is greater than the current one, we draw the current pixel and save its distance. 10 10

Viewpoint A computer world is seen from the location of the player’s avatar. This

Viewpoint A computer world is seen from the location of the player’s avatar. This is a game’s viewpoint. camera(eye. X, eye. Y, eye. Z, // Viewpoint coordinates center. X, center. Y, center. Z, // Scene center up. X, up. Y, up. Z); // What direction is ‘up’? UP is usually (0, -1, 0). 11 11

Viewpoint involves both position and orientation

Viewpoint involves both position and orientation

Viewpoint

Viewpoint

Drawing in 3 D A goal of most graphics systems is to distance the

Drawing in 3 D A goal of most graphics systems is to distance the artist or programmer from the idea of pixels. High level systems like game engines convert our wishes, via a set of function calls, into a pixel image. We want to think of the scene as consisting of high level objects that we move about, not as pixels. 14 14

Drawing: Points

Drawing: Points

Drawing: Lines

Drawing: Lines

Drawing: polygons

Drawing: polygons

Drawing: Polygons

Drawing: Polygons

Drawing in 3 D

Drawing in 3 D

Objects – build them from polygons

Objects – build them from polygons

Polygons Why? - Fast and easy Visibility is efficient Polygon intersections simple to compute

Polygons Why? - Fast and easy Visibility is efficient Polygon intersections simple to compute Can be shaded so as to look smooth Can have texture applied Called a mesh. 22 22

Polygons Meshes are created by artists using a special modeling tool, such as Maya

Polygons Meshes are created by artists using a special modeling tool, such as Maya or 3 D Studio Max. Artists build the object from simple shapes and the tool creates and saves the mesh. The game will read in the meshes (as files) and draw the polygons locations relative to the object’s center. 23 23

float vertices[][] = new float[3][3]; size (640, 480, P 3 D); Drawing functions have

float vertices[][] = new float[3][3]; size (640, 480, P 3 D); Drawing functions have 3 D versions

Open. GL 25 25

Open. GL 25 25

New drawing things: 3 coordinate line drawing line (x 0, y 0, z 0,

New drawing things: 3 coordinate line drawing line (x 0, y 0, z 0, x 1, y 1, z 1); Drawing shapes as collections of things. begin. Shape(). . end. Shape(); e. g. begin. Shape (TRIANGLE); A vertex is a corner of a polygon. vertex (x 0, y 0, z 0); 3 vertices make a triangle.

Open. GL 27 27

Open. GL 27 27

Open. GL begin. Shape (TRIANGLE); // Start a new shape. // A triangle has

Open. GL begin. Shape (TRIANGLE); // Start a new shape. // A triangle has 3 corners (vertices) vertex (x 0, y 0, z 0); // First vertex (x 1, y 1, z 1); // Second vertex (x 2, y 2, z 2); // Last end. Shape (CLOSE); // Cause first and last points to be the same. 28 28

Perspective in Processing Default values: fovy = p/3 aspect = screen width/screen height z.

Perspective in Processing Default values: fovy = p/3 aspect = screen width/screen height z. Near=camera. Z/10 z. Far=camera. Z*10 Where camera. Z = (height/2)/tan(60. 0 o). Game Development Using Processing 29 29

Example Draw a 3 D triangle and move the viewpoint in 3 D using

Example Draw a 3 D triangle and move the viewpoint in 3 D using WASD keys. Note that pressing the w-s keys changes the viewpoint Z coordinate Pressing the A-D keys changes the viewpoint X coordinate. 30

Laplacian Column 0 1 2 3 4 5 6 7

Laplacian Column 0 1 2 3 4 5 6 7

Global image processing The image left over from Laplacian is grey level, but really

Global image processing The image left over from Laplacian is grey level, but really needs to be black or white. Converting from grey to bi-level is called thresholding, and Can be done by finding a good grey value to split the image Into black/white parts, and then applying that value to each pixel. A simple threshold value is the mean = T. Then look at all pixels, and set those with a value <=T to black And the rest to white.

Global image processing The image left over from Laplacian is grey level, but really

Global image processing The image left over from Laplacian is grey level, but really needs to be black or white. Converting from grey to bi-level is called thresholding, and Can be done by finding a good grey value to split the image Into black/white parts, and then applying that value to each pixel. A simple threshold value is the mean = T. Then look at all pixels, and set those with a value <=T to black And the rest to white.

Thresholding. void draw() { int row, col; if (done == 0) { load. Pixels

Thresholding. void draw() { int row, col; if (done == 0) { load. Pixels (); // Place edge values in the image for (row=1; row<height-1; row++) for (col=1; col<width-1; col++) if (row<N && col<N) pixels[col+row*width] = color(pic[row][col], // Calculate edge values pic[row][col]); for (row=1; row<height-1; row++) for (col=1; col<width-1; col++) // Draw if (row<N && col<N) update. Pixels(); pic[row][col] = done = 1; edge (row, col); } } Row 0 Row 1 Row 2

Row 0 Row 1 Row 2

Row 0 Row 1 Row 2

Last part: Draw the resulting image. void threshold () { int r, c; int

Last part: Draw the resulting image. void threshold () { int r, c; int t = 0; // Find the threshold value (mean) for (r=1; r<height-1; r++) for (c=1; c<width-1; c++) t = t + pic[r][c]; t = t /(N*N); t = t+20; println ("Threshold is " + t); // Apply the threshold for (r=1; r<height-1; r++) for (c=1; c<width-1; c++) if (pic[r][c]<=t) pic[r][c] = 0; else pic[r][c] = 255; } Row 0 Row 1 Row 2

Objects - flocking Flocking is about making moving objects behave like flocks or herds.

Objects - flocking Flocking is about making moving objects behave like flocks or herds. ‘Boids’ was a simulation of flocking behaviour created in 1986.

Objects - flocking Separation: steer to avoid crowding local flockmates Alignment: steer towards the

Objects - flocking Separation: steer to avoid crowding local flockmates Alignment: steer towards the average heading of local flockmates Cohesion: steer to move toward the average position of local flockmates

Objects - flocking

Objects - flocking

Objects - flocking

Objects - flocking

Objects - flocking

Objects - flocking

Objects - particles Particle graphics involves the generation of small particles (circles, ellipses, etc)

Objects - particles Particle graphics involves the generation of small particles (circles, ellipses, etc) in large numbers. Each particle has a position, speed, size and size variation, and color/alpha and variation, and a lifetime Particles are created by an emitter. Particles are generated at the position of the emitter, and move and change with Stochastic characteristics until they die. They are used to create fire, water, smoke, and related effects.

Objects - fire

Objects - fire

Objects - smoke

Objects - smoke

Objects - smoke

Objects - smoke

Objects – Star Trek ‘Genesis’

Objects – Star Trek ‘Genesis’

Objects – Star Trek ‘Genesis’

Objects – Star Trek ‘Genesis’

Objects –Other Particles

Objects –Other Particles

Finale

Finale