Skip to content
AD-503 (B) · Computer Graphics & Multimedia/Quick Revision Short Notes

Computer Graphics & Multimedia (AD-503 (B)) - Unit 3 Short Notes

How unit 3 is examined

This unit covers 3-D transformations, projections, hidden surface removal, curves, illumination and colour models; no topic was asked in the supplied papers, so each is taught with its definition, key points and formulas in case it appears this year.

3-D Transformations: Translation, Rotation and Scaling

<span style="display:inline-block;padding:.16em .6em;border:1.5px solid currentColor;border-radius:999px;font-size:.68em;font-weight:700;letter-spacing:.06em;text-transform:uppercase;opacity:.75">Not asked since 2022</span>

Definition. <mark>A 3-D transformation changes the position, orientation or size of an object by multiplying the homogeneous point $(x, y, z, 1)$ by a 4x4 matrix.</mark>

Key points.

  1. Translation moves every point by $(t_x,t_y,t_z)$: $x'=x+t_x$, $y'=y+t_y$, $z'=z+t_z$; the shape and size do not change.
  2. Scaling multiplies each coordinate by a factor, $x'=xs_x$, $y'=ys_y$, $z'=zs_z$, about the origin; equal factors keep the shape (uniform scaling).
  3. Rotation needs an axis. Rotation about the z-axis leaves $z$ unchanged and turns x and y as in 2-D; the x-axis and y-axis rotations follow by cycling the letters $x\to y\to z\to x$.
  4. Homogeneous 4x4 matrices let translation be written as a multiplication, so any sequence of transformations is concatenated into one matrix product (order matters, since matrix products do not commute).
  5. The inverse of a translation uses $-t$, of a scaling uses $1/s$, and of a rotation uses $-\theta$.

Formula.

$$T=\begin{bmatrix}1&0&0&t_x\\0&1&0&t_y\\0&0&1&t_z\\0&0&0&1\end{bmatrix},\quad S=\begin{bmatrix}s_x&0&0&0\\0&s_y&0&0\\0&0&s_z&0\\0&0&0&1\end{bmatrix},\quad R_z=\begin{bmatrix}\cos\theta&-\sin\theta&0&0\\\sin\theta&\cos\theta&0&0\\0&0&1&0\\0&0&0&1\end{bmatrix}$$

$$R_x:\ y'=y\cos\theta-z\sin\theta,\ z'=y\sin\theta+z\cos\theta;\qquad R_y:\ z'=z\cos\theta-x\sin\theta,\ x'=z\sin\theta+x\cos\theta$$

Example. Translate $P(2,3,4)$ by $(1,-2,5)$: $P'=(3,1,9)$. Scale $P(2,3,4)$ by $(2,2,2)$: $P'=(4,6,8)$. Rotate $(1,0,0)$ by $90^\circ$ about z: $(0,1,0)$.

Pitfall. Scaling and rotation act about the origin; to act about another point, translate to the origin, transform, and translate back.

Parallel & Perspective Projection: Types of Parallel & Perspective Projection

<span style="display:inline-block;padding:.16em .6em;border:1.5px solid currentColor;border-radius:999px;font-size:.68em;font-weight:700;letter-spacing:.06em;text-transform:uppercase;opacity:.75">Not asked since 2022</span>

Definition. <mark>Projection maps 3-D points onto a 2-D view plane along projectors; in parallel projection the projectors are parallel, and in perspective projection they meet at the centre of projection.</mark>

Key points.

  1. Parallel projection keeps parallel lines parallel and preserves relative dimensions, so it suits engineering drawings, but it does not look realistic because size does not shrink with distance.
  2. Orthographic parallel projection has projectors perpendicular to the view plane; front, top and side views are the usual outputs.
  3. Axonometric orthographic projections show several faces at once: isometric (equal foreshortening on all three axes), dimetric (two equal) and trimetric (all different).
  4. Oblique parallel projection has projectors inclined to the plane; cavalier keeps the receding lines at full length (angle $45^\circ$), and cabinet halves them (angle $63.4^\circ$).
  5. Perspective projection makes distant objects smaller, so it looks realistic, but it does not preserve sizes or angles and parallel lines converge.
  6. A vanishing point is where parallel lines not parallel to the view plane appear to meet; the number of principal vanishing points (one, two or three) gives one-, two- and three-point perspective.

Formula. With the centre of projection at the origin and the view plane at $z=d$: $x_p=\dfrac{x\,d}{z}$, $y_p=\dfrac{y\,d}{z}$. Orthographic projection on the plane $z=0$ simply drops z: $(x,y,z)\to(x,y,0)$.

Example. For $d=2$, the point $(4,6,8)$ projects to $x_p=4\cdot2/8=1$, $y_p=6\cdot2/8=1.5$.

Property Parallel Perspective
Projectors Parallel Meet at the centre of projection
Size with distance Unchanged Decreases
Realism Low High
Use Engineering drawing Games, animation, architecture

Hidden Surface elimination: Depth comparison, Back face detection algorithm, Painter’s Algorithm, Z-Buffer Algorithm

<span style="display:inline-block;padding:.16em .6em;border:1.5px solid currentColor;border-radius:999px;font-size:.68em;font-weight:700;letter-spacing:.06em;text-transform:uppercase;opacity:.75">Not asked since 2022</span>

Definition. <mark>Hidden surface elimination removes the parts of objects that cannot be seen from the viewpoint, so that only the visible surfaces are drawn.</mark>

Key points.

  1. Depth comparison is the basic idea: at each pixel the surface with the smallest distance from the viewer (the nearest z) is the one shown.
  2. Back face detection is an object-space test. A polygon with plane $Ax+By+Cz+D=0$ is a back face if $V\cdot N\ge0$, that is, if $C\le0$ when looking along the negative z direction; back faces are discarded, which removes about half of the polygons of a closed solid.
  3. Painter's algorithm sorts the polygons by depth and paints them from the farthest to the nearest, so nearer polygons overwrite farther ones; it fails when polygons overlap cyclically or intersect.
  4. The Z-buffer (depth-buffer) algorithm is an image-space method that keeps a depth buffer and a frame buffer per pixel.
  5. It needs extra memory for the depth buffer but handles any surface shape, and it needs no sorting.

Steps (Z-buffer).

Step 1: Set depth(x,y) = 1.0 (farthest) and frame(x,y) = background for all pixels.
Step 2: For each polygon, for each pixel (x,y) it covers, calculate z.
Step 3: If z < depth(x,y), set depth(x,y) = z and frame(x,y) = colour of the surface.
Step 4: After all polygons, the frame buffer holds the visible image.

Pitfall. Back face culling alone is not enough for concave objects or several objects, since a front face can still be hidden by another object.

Curve generation, Bezier and B-spline methods

<span style="display:inline-block;padding:.16em .6em;border:1.5px solid currentColor;border-radius:999px;font-size:.68em;font-weight:700;letter-spacing:.06em;text-transform:uppercase;opacity:.75">Not asked since 2022</span>

Definition. ==A Bezier curve is a smooth polynomial curve defined by control points, $P(u)=\sum_{i=0}^{n}P_i\,B_{i,n}(u)$, where $B_{i,n}(u)=\binom{n}{i}u^i(1-u)^{n-i}$ and $0\le u\le1$.==

Key points.

  1. A Bezier curve of $n+1$ control points has degree $n$; four points give the common cubic curve.
  2. The curve passes through the first and last control points only and is tangent to the first and last edges of the control polygon; the other points only pull the curve towards them.
  3. The curve lies inside the convex hull of its control points, and the blending functions sum to 1.
  4. Bezier curves have global control: moving any one control point changes the whole curve.
  5. A B-spline is built from polynomial pieces of a chosen degree $d$, joined smoothly, and each control point affects only a few nearby segments (local control).
  6. In a B-spline the degree does not depend on the number of control points, unlike the Bezier curve, so a long curve stays low-degree and smooth.

Formula. For a cubic Bezier: $P(u)=(1-u)^3P_0+3u(1-u)^2P_1+3u^2(1-u)P_2+u^3P_3$. At $u=0$ it gives $P_0$ and at $u=1$ it gives $P_3$.

Example. For $P_0=(0,0)$, $P_1=(1,2)$, $P_2=(3,2)$, $P_3=(4,0)$ at $u=0.5$: weights are $0.125, 0.375, 0.375, 0.125$, giving $P=(2,1.5)$.

Property Bezier B-spline
Degree Points minus 1 Chosen independently
Control Global Local
Passes through End points only Not necessarily any

Basic Illumination Model: Diffuse reflection, Specular reflection, Phong Shading, Gouraud shading, Ray Tracing

<span style="display:inline-block;padding:.16em .6em;border:1.5px solid currentColor;border-radius:999px;font-size:.68em;font-weight:700;letter-spacing:.06em;text-transform:uppercase;opacity:.75">Not asked since 2022</span>

Definition. <mark>An illumination model calculates the intensity of light at a surface point from the light sources and the surface properties; a shading model applies it across a polygon.</mark>

Key points.

  1. Ambient light is a constant background term, $I=k_aI_a$, that lights every surface equally.
  2. Diffuse reflection scatters light equally in all directions and follows Lambert's law: $I_d=k_dI_l\cos\theta=k_dI_l(N\cdot L)$, so intensity is highest when the surface faces the light.
  3. Specular reflection gives the bright highlight of shiny surfaces: $I_s=k_sI_l(R\cdot V)^{n}$, where a larger shininess exponent $n$ gives a smaller, sharper highlight.
  4. Total intensity is $I=k_aI_a+k_dI_l(N\cdot L)+k_sI_l(R\cdot V)^n$.
  5. Gouraud shading computes the intensity at the polygon vertices and linearly interpolates it across the surface; it is fast but can miss or blur specular highlights.
  6. Phong shading interpolates the surface normals across the polygon and applies the illumination model at every pixel, so it is slower but gives accurate highlights.
  7. Ray tracing follows a ray from the eye through each pixel into the scene, finds the nearest hit, and spawns reflected, refracted and shadow rays, giving realistic reflections, transparency and shadows at a high cost.
Property Gouraud Phong
Interpolates Intensity Normal vector
Calculation At vertices At each pixel
Speed Faster Slower
Highlights Poor Good

Color models like RGB, YIQ, CMY, HSV

<span style="display:inline-block;padding:.16em .6em;border:1.5px solid currentColor;border-radius:999px;font-size:.68em;font-weight:700;letter-spacing:.06em;text-transform:uppercase;opacity:.75">Not asked since 2022</span>

Definition. <mark>A colour model is a coordinate system with a subset of visible colours in which every colour is specified by a set of values.</mark>

Key points.

  1. RGB is an additive model built on red, green and blue primaries; a monitor adds light, so $(0,0,0)$ is black and $(1,1,1)$ is white.
  2. CMY is a subtractive model of cyan, magenta and yellow, used in printing because inks absorb light: $(C,M,Y)=(1,1,1)-(R,G,B)$, so cyan is the complement of red.
  3. YIQ is used in NTSC colour television: $Y$ is luminance and $I,Q$ carry chrominance, so black-and-white sets use $Y$ alone and stay compatible.
  4. HSV (hue, saturation, value) describes a colour as a hue angle from $0^\circ$ to $360^\circ$, its purity, and its brightness; it is drawn as a hexcone and matches how people choose colours.

Formula.

$$Y=0.299R+0.587G+0.114B,\quad I=0.596R-0.274G-0.322B,\quad Q=0.211R-0.523G+0.312B$$

Example. RGB $(1,0,0)$ red gives CMY $(0,1,1)$ and $Y=0.299$.

Last-minute revision

  • A 3-D transformation is a 4x4 matrix acting on $(x,y,z,1)$; a sequence is concatenated by multiplying matrices.
  • Rotation about z leaves $z$ unchanged; the other axes follow by cycling $x\to y\to z$.
  • Parallel projection keeps parallel lines parallel; perspective makes distant objects smaller.
  • Perspective formula with plane at $z=d$: $x_p=xd/z$, $y_p=yd/z$.
  • Orthographic types: isometric, dimetric, trimetric; oblique types: cavalier and cabinet.
  • Back face: $C\le0$; Painter's algorithm paints far to near; Z-buffer keeps the nearest z per pixel.
  • Bezier degree is points minus 1, passes through end points only, global control.
  • B-spline gives local control and a degree independent of the number of points.
  • Diffuse: $k_dI_l(N\cdot L)$; specular: $k_sI_l(R\cdot V)^n$.
  • Gouraud interpolates intensity; Phong interpolates normals; ray tracing gives reflections and shadows.
  • CMY $=1-$RGB; $Y=0.299R+0.587G+0.114B$.

Memory hooks

  • Painter paints far to near; the Z-buffer keeps the nearest.
  • Gouraud = Intensity (vertex); Phong = Normal (pixel).
  • RGB adds light for screens, CMY subtracts ink for print.
  • Bezier: one pull moves the whole curve; B-spline: only the neighbourhood moves.
  • Cavalier is full length, cabinet is half length.

Coverage checklist

  • 3-D Transformations: Translation, Rotation and Scaling: no past questions.
  • Parallel & Perspective Projection: Types of Parallel & Perspective Projection: no past questions.
  • Hidden Surface elimination: Depth comparison, Back face detection algorithm, Painter’s Algorithm, Z-Buffer Algorithm: no past questions.
  • Curve generation, Bezier and B-spline methods: no past questions.
  • Basic Illumination Model: Diffuse reflection, Specular reflection, Phong Shading, Gouraud shading, Ray Tracing: no past questions.
  • Color models like RGB, YIQ, CMY, HSV: no past questions.
Go to where you left off?

Quick Add to Notes

Save questions, your own notes and screenshots into notes filed by unit. It takes a free account.

Create free account

Have an account? Log in