Graphics Concepts

download pdf

Components of a Basic Graphics System

graphic system compontent

The Power of the GPU

  • AMD Threadripper 3990X - 64 cores ($3,990.00 MSRP)
  • Nvidia RTX 3090 - 10,496 cores ($1,499.00 MSRP)

While the CPU has higher per core clock speeds, the GPU can do TONS of calculations in parallel.

(This is why crypto miners love them!)

Getting an Image to the Screen

  • CPU gets the specifications for a geometric shape from an application
  • The CPU hands the geometric data (and possibly additional operations) to the GPU
  • The GPU rasterizes the data by converting by deciding which pixels to use to represent the data
  • The GPU places the pixel data into the framebuffer to show on the display screen

Rasterization

Credit: Lea Rosema

Framebuffer

Comprised of multiple buffers for both pixel locations and pixel colors

framebuffer and rasterization

Image Formation

Conceptually mimics phyical imaging systems

  • Cameras
  • Microscopes/Telescopes
  • Human Eye

Elements of Image Formation

  • objects- subjects in a scene
  • viewer- observes the object and forms the image
  • light sources(s)- reacts with object and its material properties
    physical camera model

Objects

  • objects we create with computer graphics are synthetic (artificial)
  • vertices, a set of locations in space, form the basis for geometric primatives
    • points
    • lines
    • polygons

Viewers

Form the object by provideing context to the scene

Light

  • Physical light sources emit light in a variety of ways
  • Approximated with geometric optics models
      • point source emits light equally in all directions
  • A ray is semi-inifinte and travels from the point source out straight outward

Ray Tracing (Physical)

  • No light, can't see anything
  • Only concerned with what enters the camera
  • Tracing the path of the light rays
  • Material Types:
    • Reflective
    • Diffuse
    • Translucent
Ray Tracing

Luminance Image

  • Monchromatic
  • Levels of Grey (Black -> White)

Color Image

  • Hue - Name of the color (red, green, etc.)
  • Saturation - how much of the color is present (Black -> color)
  • Lightness - the brightness of the color (White -> color)
  • We don't need to match every possible color...why?

Three Color Theory

  • Rods: monochromatic, night vision
  • Cones: Three types of cones
    • three (tristimulus) values sent to brain
  • Only need to match three primary colors
    • Red, Green, Blue
The human visual system

RGB Color Model

  • Additive Color
  • Mixes Red, Green, and Blue to make colors
  • Common in digital displays

CMY Color Model

  • Subtractive Color
  • Filter white light with Cyan, Magenta, Yellow, and Black
  • Common in print media
    • Often refered to as CMYK
    • K is known as key and is a separate color for black

The Human Camera

  • Cornea protects the lens
  • Corenea and lens help focuses light on the retina
  • Iris determines how much light to let in
  • Retina is the surface on which an image is projected
The human visual system

Modeling a Camera

Pinhole Camera

Pinhole Camera
  • A light ray from (x,y,z) enters the center of our camera lens
  • Hits the camera at a projection of the original point
  • The intersection forms two similar triangles

What if we moved it?

Moving the projection plane

COP is center of projection

Synthetic Camera Model

The Synthetic Camera Model

The image plane becomes a view for our scene and can be rasterized to the display.

What do we get from the Synthetic Model

  • Separaton of objects, viewer, and light sources
    • Leads to a simpler API
  • Model considers 3D first
    • 2D is a special case
  • Fast Hardware Implementation

Graphics Pipeline

  • Process objects one at a time in the order they are generated
    • only local lighting
  • Input from application program
  • Pixels to the display
  • Everything else can be done in hardware
Graphics Pipeline Architecture

Vertex Processing

  • Access each vertex individually
  • Perform any necessary transformations
  • Perform any necessary transformations
  • Compute colors and attributes
Graphics Pipeline Architecture

Primative Assembler

How do we process the vertex data?

  • Points
  • Lines
  • Triangles
Graphics Pipeline Architecture

Clipper

https://webglfundamentals.org/webgl/frustum-diagram.html Graphics Pipeline Architecture

Rasterizer

  • Creates a set of fragments
    • set of pixels that make up an object
  • depth of the pixel
  • color and location
Graphics Pipeline Architecture

Fragment Processor

  • hidden surface removal
  • texture mapping
  • sends result to framebuffer
Graphics Pipeline Architecture