Images and Graphics. 4. Images and Graphics - Copyright Denis Hamelin - Ryerson University

Similar documents
LECTURE 02 IMAGE AND GRAPHICS

4 Images and Graphics

Fundamentals of Multimedia

INTRODUCTION TO COMPUTER GRAPHICS

Multimedia-Systems: Image & Graphics

Bitmap Image Formats

LECTURE 03 BITMAP IMAGE FORMATS

Multimedia. Graphics and Image Data Representations (Part 2)

Chapter 3 Graphics and Image Data Representations

Chapter 3 Graphics and Image Data Representations

3.1 Graphics/Image age Data Types. 3.2 Popular File Formats

Dr. Shahanawaj Ahamad. Dr. S.Ahamad, SWE-423, Unit-06

1 Li & Drew c Prentice Hall Li & Drew c Prentice Hall 2003

Raster (Bitmap) Graphic File Formats & Standards

CSC 170 Introduction to Computers and Their Applications. Lecture #3 Digital Graphics and Video Basics. Bitmap Basics

Digital Imaging & Photoshop

Lecture - 3. by Shahid Farid

B.Digital graphics. Color Models. Image Data. RGB (the additive color model) CYMK (the subtractive color model)

CMPT 165 INTRODUCTION TO THE INTERNET AND THE WORLD WIDE WEB

The BIOS in many personal computers stores the date and time in BCD. M-Mushtaq Hussain

PENGENALAN TEKNIK TELEKOMUNIKASI CLO

Understanding Image Formats And When to Use Them

Raster Image File Formats

MOTION GRAPHICS BITE 3623

Digital imaging or digital image acquisition is the creation of digital images, typically from a physical scene. The term is often assumed to imply

15110 Principles of Computing, Carnegie Mellon University

15110 Principles of Computing, Carnegie Mellon University

CGT 211 Sampling and File Formats

Bitmap Vs Vector Graphics Web-safe Colours Image compression Web graphics formats Anti-aliasing Dithering & Banding Image issues for the Web

Factors to Consider When Choosing a File Type

Image Perception & 2D Images

Welcome Back to Fundamentals of Multimedia (MR412) Fall, 2012 Chapter 3. ZHU Yongxin, Winson

Graphics for Web. Desain Web Sistem Informasi PTIIK UB

CHAPTER 3 I M A G E S

Course Objectives & Structure

Image is a spatial representation of an object or a scene. (image of a person, place, object)

Images and Colour COSC342. Lecture 2 2 March 2015

6. Graphics MULTIMEDIA & GRAPHICS 10/12/2016 CHAPTER. Graphics covers wide range of pictorial representations. Uses for computer graphics include:

Bit Depth. Introduction

UNIT 7C Data Representation: Images and Sound

HTTP transaction with Graphics HTML file + two graphics files

Specific structure or arrangement of data code stored as a computer file.

CGT 511. Image. Image. Digital Image. 2D intensity light function z=f(x,y) defined over a square 0 x,y 1. the value of z can be:

Welcome to Photoshop CS

Digital Images. Digital Images. Digital Images fall into two main categories

5.1 Image Files and Formats

Introduction to Color Theory

Indexed Color. A browser may support only a certain number of specific colors, creating a palette from which to choose

Compression and Image Formats

Digital Imaging - Photoshop

UNIT 7C Data Representation: Images and Sound Principles of Computing, Carnegie Mellon University CORTINA/GUNA

ITP 140 Mobile App Technologies. Images

IMAGE SIZING AND RESOLUTION. MyGraphicsLab: Adobe Photoshop CS6 ACA Certification Preparation for Visual Communication

GUIDELINES & INFORMATION

Digital Image Processing Lec.(3) 4 th class

raw format format for capturing maximum continuous-tone color information. It preserves all information when photograph was taken.

Applying mathematics to digital image processing using a spreadsheet

Vector VS Pixels Introduction to Adobe Photoshop

ITP 140 Mobile App Technologies. Colors Images Icons

Digital Imaging and Image Editing

An Analytical Study on Comparison of Different Image Compression Formats

Ch. 3: Image Compression Multimedia Systems

Computer Graphics. Rendering. Rendering 3D. Images & Color. Scena 3D rendering image. Human Visual System: the retina. Human Visual System

3. Image Formats. Figure1:Example of bitmap and Vector representation images

The next table shows the suitability of each format to particular applications.

The Need for Data Compression. Data Compression (for Images) -Compressing Graphical Data. Lossy vs Lossless compression

Computers and Imaging

Color & Compression. Robin Strand Centre for Image analysis Swedish University of Agricultural Sciences Uppsala University

Computer Programming

Photoshop 01. Introduction to Computer Graphics UIC / AA/ AD / AD 205 / F05/ Sauter.../documents/photoshop_01.pdf

BEST PRACTICES FOR SCANNING DOCUMENTS. By Frank Harrell

Common File Formats. Need to store an image on disk Real photos Synthetic renderings Composed images. Desirable Features High quality.

Image processing in MATLAB. Linguaggio Programmazione Matlab-Simulink (2017/2018)

TEST INFORMATION: 40 questions 50 minutes 70% minimum required to pass. Score is based on a 1000 pt system so passing will be a 700.

SECTION I - CHAPTER 2 DIGITAL IMAGING PROCESSING CONCEPTS

CATEGORY SKILL SET REF. TASK ITEM

Color, graphics and hardware Monitors and Display

1. Using Images on Web Pages 2. Image Formats 3. Bitmap Image Formats

Elements of Design. Basic Concepts

apt solutions, inc. Tips Graphics - An Introduction Vector vs. Raster Graphics Vector Graphics

4/9/2015. Simple Graphics and Image Processing. Simple Graphics. Overview of Turtle Graphics (continued) Overview of Turtle Graphics

CMPSC 390 Visual Computing Spring 2014 Bob Roos Review Notes Introduction and PixelMath

Digital Images: A Technical Introduction

Image Processing Computer Graphics I Lecture 20. Display Color Models Filters Dithering Image Compression

Unit 1.1: Information representation

1. Describe how a graphic would be stored in memory using a bit-mapped graphics package.

Pros and Cons for Each Type of Image Extensions

FUNDAMENTALS OF MULTIMEDIA

CHAPTER 8 Digital images and image formats

Sampling Rate = Resolution Quantization Level = Color Depth = Bit Depth = Number of Colors

UNIT 7B Data Representa1on: Images and Sound. Pixels. An image is stored in a computer as a sequence of pixels, picture elements.

How to Avoid Landmines: Managing your Motion Graphics Projects

APPLICATION OF COMPUTER VISION FOR DETERMINATION OF SYMMETRICAL OBJECT POSITION IN THREE DIMENSIONAL SPACE

Astronomy and Image Processing. Many thanks to Professor Kate Whitaker in the physics department for her help

MULTIMEDIA SYSTEMS

Digital Asset Management 2. Introduction to Digital Media Format

The worlds we live in. The worlds we live in

Picsel epage. Bitmap Image file format support

CS101 Lecture 19: Digital Images. John Magee 18 July 2013 Some material copyright Jones and Bartlett. Overview/Questions

STANDARD ST.67 MAY 2012 CHANGES

Transcription:

Images and Graphics

Images and Graphics Graphics and images are non-textual information that can be displayed and printed. Graphics (vector graphics) are an assemblage of lines, curves or circles with attributes such as style, width and colour Individual components of graphics can be edited individually.

Images and Graphics Images come from the real world and its individual components are not editable. The smallest addressable image element is called a pixel. A set of pixels is called a bitmap. Images need more space than graphics. Graphics need more processing power than images.

Capturing Images A digital image consists of N lines with M pixels each. A picture is a 2D image capture of a realworld scene that represents a momentary event from the 3D spatial world. A capturing device such as a CCD scanner or CCD camera converts the brightness signal into an electrical signal.

Capturing Images

Capturing Images The first step is to sample and digitize the electrical signals. The second step involves quantization to achieve an aggregation of color regions to reduce the number of colors. Points at which an image is sampled are called picture elements or pixels. Resolution specifies the distance between points. It represents accuracy.

Capturing Images A digital image is represented by a matrix of numeric values each representing a quantized intensity value. I(r,c) - intensity value at position corresponding to row r and column c of the matrix.

Capturing Images Intensity value can be represented by bits for black and white images (0=black, 1=white), 8 bits for monochrome imagery to encode color or grayscale levels (256 colors from 00=black to FF=white).

Capturing Images 8-bit grayscale 1-bit grayscale (pure black & white) 4-bit grayscale 24-bit color

Capturing Images Digital images are very large: An image represented in a matrix of 1280x960 where each pixel is represented by a 24-bit integer allowing a total of 16,000,000 colors, would contain 1,228,800 pixels of 24 bits each for 29,491,200 bits or 28.125 Mb!!

Image Formats Two parameters are important: spatial resolution and color encoding. An image is stored in a 2D matrix in which each value corresponds to one data pixel. Pure B&W: one bit per pixel.

Color Images For color images there are a few possibilities: 3 numbers to specify the intensity of red, green and blue components. 3 numbers referencing a table containing the red, green and blue intensities. A single referencing a table containing color triples. An index pointing to another set of structures holding colors.

Popular Formats The most popular formats for images are PostScript, GIF (Graphics Interchange Format), XBM (X11 Bitmap), JPEG, TIFF Tagged Image File Format), PBM (Portable Bitmap), PNG (Portable Network Graphics) and BMP (Bitmap).

PostScript PostScript is a programming language optimized for printing graphics and text. Introduced by Adobe in 1985. PostScript must know in advance the size of the image. EPS (Encapsulated PostScript), solves that problem. EPS files contain one image and comment lines.

GIF GIF: Graphics Interchange format. Introduced in 1987 by CompuServe. Easy to decode and display. Images are compressed 20-25% of original size with no loss of quality: data compression only. Uses LZW compression algorithm GIF89a supports animation and transparency. Supports only 256 colors.

JPG The name JPEG stands for Joint Photographic Experts Group, the name of the committee that created the standard. The compression method is usually lossy compression, meaning that some visual quality is lost in the process and cannot be restored. The JPEG compression algorithm is not as well suited for line drawings and other textual or iconic graphics, and thus the PNG and GIF formats are preferred for these types of images.

PNG PNG: Portable Network Graphics. Introduced in 1999. PNG supports three main image types: true colour, greyscale and palette-based (``8-bit''). JPEG only supports the first two; GIF only the third (although it can fake greyscale by using a grey palette). PNG supports variable alpha channels (transparency).

TIFF TIFF: Tagged Image File Format. Introduced in 1987 by Aldus and Microsoft. TIFF supports many colour levels: binary levels, grey levels, palettes, RGB and CMYK. TIFF supports many compression methods.

XBM and XPM Used in the Unix world for program icons and background images. No compression is used. XBM is monochrome and stores one byte array per line. XPM is color and stores a hot spot, the image dimension and a RGB color identified by an ASCII character.

XBM

XPM

Comparisons GIF: 356 K PNG: 303 K JPG: 136 K

Comparisons GIF: 2 K PNG: 2 K JPG: 6 K

BMP BMP files are device-independent files most frequently used in Windows systems Based on RGB color model. Uses no compression. Header region contains info about size and color depth. Data region contains the values of each pixel in a line.

Graphics Formats Specifies graphics images through graphics primitives and attributes. Graphics primitives: line, rectangle, circle, ellipse, specifications of 2D and 3D objects. Graphics attributes: line style, line width, color. Graphics formats represent a higher level of image representation, they are not represented by a pixel matrix initially.

Graphics Formats Advantage: less storage space per graphical image Disadvantage: more overhead during display time; must convert from a graphical image to the image format which may be a bitmap or pixmap. Examples: PHIGS (Programmer s Hierarchical Interactive Graphics System), GKS (Graphical Kernel System).

Image Analysis Techniques to extract descriptions from images. Used in the fields of astronomy, medicine, forensics and intelligence to name a few. Image improvement: A technique to improve the image quality by eliminating noise or by increasing contrast. Pattern discovery/recognition is another technique.

Image Analysis Image recognition methods use color, texture and edges to classify images. Color: The basic approach is to use a color histogram. The color histogram for an image is constructed by counting the number of pixels of each color. Other methods involve texture, edges classification and segmentation.

Color Histogram A Histogram is a graph of the distribution of red, green, blue, greyscale, hue, saturation, and/or lightness values in an image. The horizontal axis represents the lightness values of the image from black to white (0 to 255). The vertical axis indicates the number of pixels at each value.

Color Histogram

Color Histogram By examining the graph, you can learn whether the image contains enough detail to be successfully corrected, and if it does, where the image needs correcting. If the graph is spread across, the image contains enough detail to correct it successfully. If the graph is compressed into a narrow area, the image probably doesn t contain enough detail.

Color Histogram In an image with enough detail, the position of the graph shows where the image needs correcting. A fairly even distribution of the graph indicates an image with a balanced composition. If too much of the graph is situated on the right side, you need to reduce the image s lightness. If too much is on the left, you need to increase it. If the lines are not spread out enough, you need to increase the contrast.

Reconstructing Images A 3D reality to be represented on a 2D screen must be projected. The Radon transform is an integral transform whose inverse is used to reconstruct images from medical CT scans. A technique for using Radon transforms to reconstruct a map of a planet's polar regions using a spacecraft in a polar orbit has also been devised.

Stereoscopy Two-dimensional drawings or photographs that when viewed by both eyes appear to exist in three dimensions in space. Stereoscopic pictures are produced in pairs, the members of a pair showing the same scene or object from slightly different angles that correspond to the angles of vision of the two eyes of a person looking at the object itself.

Stereoscopy

Stereoscopy

Raster Display Computers display images using a raster display device. A raster is composed of horizontal raster lines that are each composed of pixels. The raster is stored in the form of a pixel matrix that represents the entire screen area. The video controller samples the entire screen line by line.

Raster Display

Raster Display Imagine the smiley face in the top left corner as an RGB bitmap image. When zoomed in, it might look like the big smiley face to the right. Every square represents a pixel. Zooming in further, one can analyze three individual pixels, with their colors constructed by adding the values for red, green and blue.

Dithering Full-color photographs may contain an almost infinite range of color values. Dithering is the most common means of reducing the color range of images. Dithering is the process of juxtaposing pixels of two colors to create the illusion that a third color is present.

Dithering

Dithering

Dithering with optimized palette original 16 colors not dithered 16 colors - dithered

End of lesson