3-Graphics in Game (Game Development - UMT Spring 2017)
-
Upload
hafiz-ammar-siddiqui -
Category
Education
-
view
104 -
download
1
Transcript of 3-Graphics in Game (Game Development - UMT Spring 2017)
GraphicsinGame
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
ComputerGraphicsandRendering• Computer graphics is the generation and manipulation of images using a computer as a
rendering tool
• Graphics rendering is a process of generating a graphical output from images or models
by means of computer programs. It can contain geometry, camera viewpoint, texture
and lighting information.Twopopular graphics rendering techniques are
• Rasterization
• Ray Tracing
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
2DGraphics
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
2DGraphics• 2D graphics is the computer-based generation of 2D visuals from digital images, text or
2D geometricmodels
• There are two basic types of 2D graphics
• Raster Graphics (Digital Images)
• Vector Graphics (2D GeometricModels)
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
RasterGraphics(DigitalImages)• Raster graphics are digital images which contain picture elements called pixels, each of
which has a particular location and value
• Digital image represents rectangular grid of pixels
• Each pixel in digital image has a color
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
RasterGraphics(DigitalImages)• Sprite: A sprite is a 2D rectangular digital image that is drawn to the screen
• Static Sprite: Contains a single sprite image (no animation)
• Dynamic Sprite: Containsmultiple sprite images (image sequence creates animation)
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
VectorGraphics(2DGeometricModels)• Vector graphics are geometric models which are created through a sequence of
commands or mathematical statements, a 2D geometric model file describes a series of
points to be connected by edges or mathematical equations
• 2D geometricmodels contain points, lines, polygons and curves
• Each point in 2D geometricmodel has a definite position on X and Y axes
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
VectorGraphics(2DGeometricModels)• Point: Point or vertex is an exact position or location in space
• Line: Line or edge is a connection between two points in space
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
Pointat(1,1)
Linefrom(0,0) to(1,1)
VectorGraphics(2DGeometricModels)• Polygon: Polygon is closed shape formedwith straight lines
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
Polygonwithlines(0,0) to(1,0)(1,0) to(1,1)(1,1) to(0,1)(0,1) to(0,0)
VectorGraphics(2DGeometricModels)• Curve: Curve is set of points that satisfy one or more equations and form a
continuously bending line without angles
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
x2+y2 =r2 y=sin(x)
3DGraphics
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
3DGraphics• 3D graphics is the computer-basedgeneration of 3D visuals from3D geometric models
• 3D geometric models are created through a sequence of commands or mathematical
statements, a 3D geometric model file describes a series of points to be connected by
edges or mathematical equations
• 3D geometricmodels contain points, lines, faces and surfaces
• Each point in 3D geometricmodel has a definite position on X, Y and Z axes
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
3DGeometricModels• Point: Point or vertex is an exact position or location in space
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
Pointat(1,1,1)
3DGeometricModels• Line: Line or edge is a connection between two points in space
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
Linefrom(1,1,1) to(2,2,2)
3DGeometricModels• Face: Face is closed shape formedwith straight lines which is equivalent to polygon
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
Facewithlines(0,0,1) to(1,1,1), (1,1,1) to(2,0,2), (2,0,2) to(0,0,1)
3DGeometricModels•Mesh: Mesh is composed of points, lines and faces that defines a 3D shape
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
Meshofunitcube
3DGeometricModels•Meshes
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
3DGeometricModels• Surface: Surface is set of points that satisfy two or more equations and form a
continuous plane
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
x=rcos(∅), y=rsin(∅),z=r2 [r=1/3to1,∅=0to2 𝜋]
Transformations
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
CoordinateSpaces• A coordinate space represents an object’s relationship to the rest of the scene
• Local Coordinate Space: Coordinates of object are defined locally with respect to the
object itself (usingan origin pointwhich exists within the object)
• Global (World) Coordinate Space: Coordinates of object are global with respect to
the scene (using an origin pointwhich existswithin the scene)
• Object in a scene is represented by its position and orientation
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
AffineTransformations• Affine transformation is any transformation which preserves collinearity (points,
straight lines and planes) after transformation
• Basic affine transformationsare
• Translate
• Rotate
• Scale
• Shear
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
Translate• Translate changes position of 2D or 3D object in space in direction of at least one axis
by some units
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
Translatedinpositivex-axisdirectionby5units Translatedinnegativex-axisdirectionby5units
5 5
Rotate• Rotate a 2D object at particular angle from its origin and rotate a 3D object around at
least one axis at particular angle
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
Rotatedatangleof45degrees Rotatedatangleof45degreesaroundz-axis
Scale• Scale changes size of a 2D or 3D object in space along at least one axis by some factor
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
Scaledupalongx-axisby2factor Scaleddownalongy-axisby0.5factor
Shear• Shear slants shapeof a 2D or 3D object along particular axis by some factor
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
Shearedalongpositivex-axisby0.25factor Shearedalongnegativex-axisby0.25factor
CameraProjections
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
Projection• Projection is the display of 3D objects on a 2D plane also known as the view plane
(output display - viewport with camera perspective and viewpoint), defines how objects
will appear on the screen after mapping to 2D
• Projection is formedby intersection of projector lines with the viewing plane
• Two types of projections
• Parallel Projection
• Perspective Projection
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
ParallelProjection• Orthographic: Projector lines are parallel and perpendicular to the view plane
• Oblique: Projector lines are parallel but not perpendicular to the view plane
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
Viewplane
Viewplane
Frontview Topview Sideview Actualobject
PerspectiveProjection• 1 Point Perspective: Lines of any1 axis converge to its vanishingpoint in view plane
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
PerspectiveProjection
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
• 2PointPerspective:Linesofany2axesconvergetotheirvanishingpointsinviewplane
PerspectiveProjection
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
• 3 Point Perspective: Lines of all 3 axes converge to their vanishingpoints in view plane
ColoringandTextureMapping
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
Coloring
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
• Coloring is applying solid colors to a geometricmodel
• Every point (vertex) in a geometric model contains color information that is applied on
a polygon (face)which contains that point (vertex)
Polygonswithsinglecolor Polygonswithmultiplecolors
TexturingMapping
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
• Texture: Array of values (1D, 2D, 3D) containing color, alpha, depth and normal. Can be
loaded from images or generated procedurally bya program
• Texel: A single array element in a texture which is characterized by texture coordinates
ranges from0 to 1
• Texture Mapping: Process of applying texture to a geometric model. Point (vertex) in a
geometric model contain texture coordinate information that is mapped to a texture
TexturingMapping
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
0 10
1
u
v
2DTexturewithtexturecoordinates 3DGeometricmodel Texturemapped
TexturingMapping
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
Texturemapping ofacube(cubemapping)
OtherMaps&Mappings
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
• Height Map: Grayscale8-bit image which represents information in 1 dimension
• Bump Mapping: Create fake bumps on the surface of object by perturbing the
surfacenormalswhich are used in lighting calculations
• Displacement Mapping: Manipulate the position of points of a geometricmodel
• Normal Map: Color RGB 24-bit image which represents information in 3 dimensions
• Normal Mapping: Create fake depth illusions on the surface of object by changing
the surfacenormals in 3 dimensionswhich are used in lighting calculations
OtherMaps&Mappings
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
Heightmap
Normalmap
Displacementmapping
NormalmappingTexture
LightingandShading
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
Lighting
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
• Light is emitted by light sources
•When light interactswith object, it gets reflected (scattered) or absorbed by surface
• Lighting: The process of computing the light intensity reflected from a surface
Lightsource
Humaneye Object
Shading
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
• Process of assigning a color to a pixel (creates illusion of depth in object by varying the
amount of darkness by evaluating angles between light rays, surface normals and
camera)
• Twomost common types of shading
• Flat Shading: Pixels on the same polygon (surface) have samecolor
• Smooth Shading: Each pixel have its own (usually different) color
Shading
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
Flatshading Smoothshading
LightSources
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
• Ambient Light: It does not have a direction or position and its intensity is constant at all
points in a scene
• Point Light: Light rays are emitted from a point at some position in all possible
directions and their intensity decreaseswith squareof distance
Pointlight
LightSources
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
• Spot Light: Light rays are emitted from a point at some position that are directed with
cone projection and their intensity is highest at the center which decreases with square
of distance
Spotlight
LightSources
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
• Directional Light: Light rays are emitted in specified fixed direction (as if the point is
infinitely far away) and their intensity remains constant
• Area Light: Light rays are emitted from a 2D area in all directions uniformly across their
surfacearea and their intensity decreaseswith squareof distance
Directionallight
LightReflections
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
• Ambient Reflection: Reflect light fromother objects
• Diffuse Reflection: Reflect incoming light in all outgoing directions (assume equally)
which is independent from the viewing direction, for examplea rough surface
• Specular Reflection: Reflect incoming light in the direction of reflection which is
dependenton the viewing direction, for examplea shiny surfaceor mirror is ideal
Diffuse
SpecularIncoming
LightReflections
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY
Ambient Diffuse Specular Combine
Reference• GameGraphicsProgramming- AllenSherrod
• 3DMathPrimerforGraphicsandGameDevelopment- FletcherDunn,IanParberry
• FundamentalsofComputerGraphics- PeterShirley,SteveMarschner
• PrinciplesofComputerGraphics– Shalini Govil
FROM:HAFIZAMMARSIDDIQUI– COURSE:GAMEDEVELOPMENT– INSTITUTE:UNIVERSITYOFMANAGEMENTANDTECHNOLOGY