Digital Graphics for Computer Games Pixels Types of Digital Graphics (Raster and Vector) Compression.

Slides:



Advertisements
Similar presentations
Raster Graphics 2.01 Investigate graphic image design.
Advertisements

Introduction to Computer Graphics Raster Vs. Vector COMMUNICATION TECHNOLOGY.
Unit 30- Digital Graphics THEORY P2 and D2
Graphics CS 121 Concepts of Computing II. What is a graphic? n A rectangular image. n Stored in a file of its own, or … … embedded in another data file.
Graphics in the web Digital Media: Communication and Design
Ann Ware Digital Imaging 101. Digital Image Categories BITMAPVECTOR A bitmap is an image created with pixels (small squares of color) The number of pixels.
Introduction to Computers Section 11A. home Types of Graphics File Bitmap Vector.
Image and Sound Editing Raed S. Rasheed Image Image. Digital image. – Raster images. – Vector Images. – Stereo Images. – Image File Formats Lossless.
Manipulating Images Image A visual representation of something that is seen in real life. It can be two-dimensional or three-dimensional A visual representation.
BITMAP & VECTOR GRAPHICS Art Fundamentals of Graphic Design.
Prepared by George Holt Digital Photography BITMAP GRAPHIC ESSENTIALS.
COMP Bitmapped and Vector Graphics Pages Using Qwizdom.
Image Storage Bitmapped Graphics – in which an image is represented as a collection of dots Vector Graphics – in which an image is represented as a set.
 Scaling an image is resizing the image in a graphic editing software so it is the proper size before adding it to a site.  Important NOTE: If you insert.
SOFTWARE TYPES Word processing Page layout Paint Draw.
Understanding Images on the Computer How do images work and why?
Web Image Basics Comp 140 December 2. Vector Graphics Can be repositioned or resized – Will not diminish output quality Typically stored in AI, EPS, PICT.
Multimedia Elements II Graphics, Digital Video. UIT - Multimedia Production2 Multimedia Elements Multimedia elements include: Text Graphics Animation.
Image Representation. Objectives  Bitmaps: resolution, colour depth and simple bitmap file calculations.  Vector graphics: drawing list – objects and.
Digital Image Formats: An Explanation Guilford County SciVis V
Information Processes and Technology Multimedia: Graphics.
Image formats. Basic terminologies… Pixels: Pixels are the building blocks of every digital image. a pixel is a single point in a graphic image. Resolutions:
Raster Graphics. An image is considered to be made up of small picture elements (pixels). Constructing a raster image requires setting the color of each.
Graphics workshop Library and Information Services University of St Andrews.
2D Graphics Theory & Principles. Single Point Smallest addressable area on screen or digital image.
File Formats and Vector Graphics. File Types Images and data are stored in files. Each software application uses different native file types and file.
Digital Imaging 101 Ann Ware. Digital Image Categories BITMAP  A vector is created by using a series of mathematically defined lines and curves rather.
Digital Imaging 101 Ann Ware
Things to Remember When working with digital images.
Raster Graphics 2.01 Investigate graphic image design.
Image File Formats. What is an Image File Format? Image file formats are standard way of organizing and storing of image files. Image files are composed.
Graphics Concepts Presentation
Information Technology Images: Types, Resolution and Techniques.
Digital Image Editing Presented by John Hohn. File Formats JPEG – Joint Photographic Experts Group PNP – Portable Network Graphics GIF – Graphic Interchange.
Introduction to Images & Graphics JMA260. Objectives Images introduction Photoshop.
Image File Formats Harrow Computer Club – Wed, 1 Dec 2010 Bob Watson MA CMath MIMA MBCS.
Digital Image Formats: An Explanation Guilford County SciVis V
Information Systems Design and Development Media Types Computing Science.
Computer Graphics Lesson 2 July 12, 2005 Image Formats What are some formats you are familiar with? There are 4 basic image format types: Uncompressed.
Digital Basics Quiz Preparation. Basic Digital Image Concepts Aliasing & Anti‐aliasing Resolution Compression Raster & Vector Color mode & Image mode.
Basic Digital Imaging For PE 266 Technology in HPER.
ITEC2110, Digital Media Chapter 2 Fundamentals of Digital Imaging 1 GGC -- ITEC Digital Media.
8th Lecture – Intro to Bitmap or Raster Images
BITMAPPED IMAGES & VECTOR DRAWN GRAPHICS
Common Bitmap Image File Types
Digital Imaging 101 Ann Ware.
DIGITAL MEDIA FOUNDATIONS
2.01 Investigate graphic image design.
Bitmap vs. Vector.
Graphics Basics Ellen Eyth.
Raster Images CPSC 1030.
"Digital Media Primer" Yue-Ling Wong, Copyright (c)2013 by Pearson Education, Inc. All rights reserved.
Chapter III, Desktop Imaging Systems and Issues: Lesson IV Working With Images
Digital Images.
Image File Size and File Compression
Chapter 3:- Graphics Eyad Alshareef Eyad Alshareef.
File size and image quality
Digital Image Formats: An Explanation
1.01 Investigate graphic types and file formats.
Graphics Basic Concepts.
Representing Images 2.6 – Data Representation.
Web Design and Development
MED 2001 Advanced Media Production
Terms 1 Terms 2 Terms 3 Terms 4 Terms 5 1pt 1 pt 1 pt 1pt 1 pt 2 pt
2.01 Investigate graphic image design.
Digital Image Creation & Editing
2.01 Investigate graphic image design.
"Digital Media Primer" Yue-Ling Wong, Copyright (c)2013 by Pearson Education, Inc. All rights reserved.
2.01 Investigate graphic image design.
Creating Digital Graphics
Presentation transcript:

Digital Graphics for Computer Games Pixels Types of Digital Graphics (Raster and Vector) Compression

Pixels and Resolution A raster image or bitmap image is made up of pixels. The number of pixels per inch (ppi) is a measure of the resolution of the image. An image that is 2048 pixels in width and 1536 pixels in height has a total of 2048×1536 = 3,145,728 pixels or 3.1 megapixels. It can be described as 2048 by 1536 pixels or a 3.1-megapixel image. Or we can describe pixels per length unit or pixels per area unit, such as pixels per inch or per square inch.pixels per inch

Pixels and Resolution Web Images - low resolution - 72ppi (pixels per inch) Printed poster - high resolution - 300ppi (pixels per inch) Each pixel in an image has to be stored, so more pixels and higher resolution means larger file size.

Pixels and Resolution

Types of digital graphics: Raster images Raster images (bmp, gif, tiff, jpg, psd) images made from pixels Pixelate when zoomed up Image file size is linked to the number of pixels in an image and the color depth, or bits per pixel, of the image. Raster graphics deal with photographs and photo-realistic images better than vector graphics.

Vector images Vector images (psd, wmf, fla, ai) use mathematical expressions to represent graphics so lower file size Scales up with no adverse effects (no pixelation) The size of the image does not correlate to the size of the file. File size increases only with the addition of more vectors. Vector graphics are suited to typesetting or for graphic design.typesetting graphic design

Compression Image formats can be separated into three broad categories: uncompressed formats lossy compression lossless compression

take up the most amount of data, but they are exact representations of the image. Bitmap formats such as BMP generally are uncompressed. Uncompressed formats

Lossy Compression Lossy compression does not encode all the information of the file, so when it is recovered into an image, it will not be an exact representation of the original. generally suited for photographs. not suited for illustrations, drawings and text, as compression artifacts from compressing the image will standout. compression artifacts able to compress images very effectively compared to lossless formats, as it discards certain information. A prime example of a lossy compression format is JPEG

Lossless Compression suited for illustrations, drawings, text and other material that would not look good when compressed with lossy compression. will encode all the information from the original, there is no loss of information in lossless compression, when decompressed, it will be an exact representation of the original. not able to achieve as high a compression as lossy compression, in most cases, so larger file sizes. Examples of lossless image compression is PNG and GIF. (GIF only allows 8-bit images.)