Chapter 3 Pelekanou Olga INF221 INTRODUCTION TO MULTIMEDIA.

Slides:



Advertisements
Similar presentations
Dale & Lewis Chapter 3 Data Representation. Representing color Similarly to how color is perceived in the human eye, color information is encoded in combinations.
Advertisements

Multimedia for the Web: Creating Digital Excitement Multimedia Element -- Graphics.
T.Sharon-A.Frank 1 Multimedia Size of Data Frame.
T.Sharon-A.Frank 1 Multimedia Image Compression 2 T.Sharon-A.Frank Coding Techniques – Hybrid.
Introduction to Computer Graphics
File Formats By Jack Turner. Raster (Bitmap) Raster or bitmap is a dot matrix data structure, containing columns of dots and rows, of a graphics image.
V Obtained from a summer workshop in Guildford County July, 2014
+ Video Compression Rudina Alhamzi, Danielle Guir, Scott Hansen, Joe Jiang, Jason Ostroski.
Digital Images. Scanned or digitally captured image Image created on computer using graphics software.
 Scanned or digitally captured image  Image created on computer using graphics software.
Dr Jimmy Lam CAD for Fashion and Textiles
Zinnia Bell. RAWimages are image files that have not yet processed, they contain minimally processed data from the image sensor of either a image scanner,
Fundamentals Rawesak Tanawongsuwan
1 Creating Web Graphics Outline 2.1 Graphics Types 2.2 Vector Graphics 2.3Bitmapped Graphics 2.4Graphics for the Web 2.5 GIF (Graphics Interchange Format)
GRAPHICS/IMAGES INFSCI Source: Learning Web Design by Jennifer Niederst RobbinsJennifer Niederst Robbins Creating Images:  Scanning  Be aware.
CS 1308 Computer Literacy and the Internet. Creating Digital Pictures  A traditional photograph is an analog representation of an image.  Digitizing.
Lecture 3. Fundamentals of Computer Graphics. Computer Graphics, a very broad term Fields Related to Computer Graphics Bitmap/Vector graphics, 2D/3D graphics,
Task 01 – Explain how different types of graphical images relate to file formats, file conversions, formats and compression. Emily Riley.
File Formats COM 366 Web Design & Layout. Native file format –Format native to software program –.psd > PhotoShop default Preserves layers –Use “Save.
File Formats About graphic file formats And image compression.
1 Image Compression. 2 GIF: Graphics Interchange Format Basic mode Dynamic mode A LZW method.
Lecture 4 - Introduction to Computer Graphics
 Refers to sampling the gray/color level in the picture at MXN (M number of rows and N number of columns )array of points.  Once points are sampled,
Vector vs. Bitmap
1 Perception, Illusion and VR HNRS 299, Spring 2008 Lecture 14 Introduction to Computer Graphics.
Digital Image: Representation & Processing (2/2) Lecture-3
Bit-Mapped Graphic Data: Input (Capture) Hardware Multimedia – Section 2.
Multimedia Elements: Sound, Animation, and Video.
Graphics and Animation Multimedia Projects Part 2.
1 Image Formats. 2  To be able save image data for future manipulation and display we need to be able to store it in a consistent manner  Formats enable.
Digital Cameras And Digital Information. How a Camera works Light passes through the lens Shutter opens for an instant Film is exposed to light Film is.
Data Compression. Compression? Compression refers to the ways in which the amount of data needed to store an image or other file can be reduced. This.
Information Processes and Technology Multimedia: Graphics.
Image Compression Supervised By: Mr.Nael Alian Student: Anwaar Ahmed Abu-AlQomboz ID: IT College “Multimedia”
Digital Multimedia, 2nd edition Nigel Chapman & Jenny Chapman Chapter 3 This presentation © 2004, MacAvon Media Productions Introduction to Computer Graphics.
Addressing Image Compression Techniques on current Internet Technologies By: Eduardo J. Moreira & Onyeka Ezenwoye CIS-6931 Term Paper.
Web Graphics By Chris Harding. Contents  Software  Vector Graphics and Pixel Based  Transparent Images  Compression  GIF vs. JPEG  Animated GIF.
10 | Graphics COM 366 Web Design & Production. Native file format –Format native to software program –psd > PhotoShop default Preserves layers –Use “Save.
Unit 1: Task 1 By Abbie Llewellyn. Vector Graphic Software (Corel Draw) Computer graphics can be classified into two different categories: raster graphics.
Multimedia Basics (1) Hongli Luo CEIT, IPFW. Topics r Image data type r Color Model : m RGB, CMY, CMYK, YUV, YIQ, YCbCr r Analog Video – NTSC, PAL r Digital.
 Scanned or digitally captured image  Image created on computer using graphics software.
Raster Graphics 2.01 Investigate graphic image design.
CSCI-100 Introduction to Computing Hardware Part II.
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.
Image File Formats By Dr. Rajeev Srivastava 1. Image File Formats Header and Image data. A typical image file format contains two fields namely Dr. Rajeev.
Photoshop Basics: Extended Instructor: Vicki Weidler Assistant: Joaquin Obieta.
Graphics and Image Data Representations 1. Q1 How images are represented in a computer system? 2.
1 Part A Multimedia Production Chapter 2 Multimedia Basics Digitization, Coding-decoding and Compression Information and Communication Technology.
Software Design and Development Storing Data Part 2 Text, sound and video Computing Science.
ITEC2110, Digital Media Chapter 2 Fundamentals of Digital Imaging 1 GGC -- ITEC Digital Media.
DIGITAL MEDIA FOUNDATIONS
Web Graphics 101 Web Image File Formats Image Optimization
Computer Science Higher
Chapter 3 Graphics and Image Data Representations
Introduction To Photo Editing SHIELA MAE A. AQUINO SRNHS.
2.01 Investigate graphic image design.
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
Image File Size and File Compression
Digital Images.
1.01 Investigate graphic types and file formats.
Introduction to Computer Graphics
Web Design and Development
2.01 Investigate graphic image design.
Final Study Guide Arts & Communications.
2.01 Investigate graphic image design.
Lecture 4 - Introduction to Computer Graphics
"Digital Media Primer" Yue-Ling Wong, Copyright (c)2013 by Pearson Education, Inc. All rights reserved.
2.01 Investigate graphic image design.
Presentation transcript:

Chapter 3 Pelekanou Olga INF221 INTRODUCTION TO MULTIMEDIA

Overview General introduction to Computer Graphics. Kinds of computer graphics. Basic graphics file formats. Desktop publishing.

Computer Graphics, a very broad term Fields Related to Computer Graphics –Bitmap/Vector graphics, 2D/3D graphics, Computer-aided design, Digital video, Interactive Multimedia, Net Art, Subcategory of Computer Science Digital Imaging – A field that includes digital photography, scanning, and composition and manipulation of bit-mapped graphics.

Analog to Digital Conversion Digital signals are generated by sampling analog signals Digital information is always a subset of analog information Digitization allow processing of images using computer, by providing better noise correction.

Bitmap (Raster) Graphics made up of a grid of dots known as pixels most common electronic medium for continuous-tone images, such as photographs or digital paintings resolution-dependent ( causes pixellation ) Photoshop

Vector Graphics made up of mathematically defined lines and curves called vectors move, resize, or change the color of a graphic object without losing the quality of the graphic resolution-independent Computer generated curves & objects Flash, Illustrator, Maya…

Bitmap vs Vector image

Anatomy of Bitmap Image Pixel –Basic building block of a bitmap image –Each pixel in the grid is the same size and has a tonal value –256 different levels or separate tones to create a smooth transition from dark to light

Anatomy of Bitmap Image Digital Data Based on binary numbers 1bit has a value either 0 or 1 8 bits=1 byte ( 2*2*2*2*2*2*2*2 = 256 combination, 0 – 255 ) 24 bits = 3 byte ( 256(8bit)*256*256 = 16,777,216 combination 0 – 16,777,215 ) 1024 bytes=1 kilobyte 1024 kilobytes=1 megabyte 1024 megabytes=1 gigabyte

Anatomy of Bitmap Image Bit Depth Number of bit needed to define a ton for a pixel

Compression? Compression refers to the ways in which the amount of data needed to store an image or other file can be reduced. This can help to reduce the amount of storage space needed to store your animation files and also to reduce the bandwidth needed to play them back. Lossy/Lossless compression Spatial/Temporal compression Compression features both software(Codec, compression algorithm) and hardware side(chips, graphic card).

Lossless Compression encodes and decodes the data perfectly the resulting image matches the original image perfectly no degradation, no data loss Run Length Encoding, Huffman coding, LZW( for GIF) Strategy : the more frequently used, the less data storage is used AAAABBBBBBCCCCEEE -> 4A6B4C3E For Images with high degree of detail that shouln’t be lost For computer generated graphics with large areas of the same color

Lossy Compression Allows redundant and nonessential information to be lost Removes data from an image that the human eye wouldn’t notice There us a tradeoff between compression and image quality Continuous tone images with complex shapes and shading More complicate algorithm JPEG, MPEG

Spatial Compression Techniques that operate on a single still image compression Has both lossy & lossless compression

Temporary Compression ( Inter- Frame Compression) Compression applied to a sequence of video frames, rather than a single image. Strategy: To save on space by recording only the areas of the image that have changed. Keyframe : frames of which information is fully stored to judge the differences in the scene in-between two keyframes Delta frame : Frames that record only those pixels that have changed since the previous frame Excessive use of keyframes will restrict the potential compression achieved. Where rapid motion exists in the sequence temporal compression can introduce undesirable artifacts

File Format A standard means of storing data Computer memory stores numbers in linear memory Any additional information like rows, cols., bits/pixel must be stored with the “data” - typically as a “header” Directly related to software and compression algorithm Many file formats use compression to reduce the file size of bitmap images - GIF, TIFF, PNG,JPG

Image File Formats - GIF Graphics Interchange Format 8 bits TOTAL/image (256 colors maximum) –Built in lossless compression –Has transparancy & interlacing features –Gif89a allows for easy animation –Better suited for line-art, cartoons,graphs etc. (as compared to JPEG)

Image File Formats - JPEG Joint Photographic Experts Group (JPEG) format –to display photographs and other continuous-tone images on the Web. –supports CMYK, RGB, and Grayscale color modes –does not support alpha channels. –retains all color information in an RGB image but compresses file size by selectively discarding data. (Lossy) – A higher level of compression results in lower image quality, and a lower level of compression results in better image quality.

Workflow of baseline JPEG encoding Transform image to luminance/chrominance color space(YCbCr) Reduce the color component( subsampling by 2)(1st lossy procedure) Partition image into 8*8 pixel blocks and perform DCT on each block Quantize resulting DCT coefficients(2nd lossy procedure) Entropy code the reduced coefficients(lossless)

Image File Formats - PNG Developed as a patent-free alternative to GIF Portable Network Graphics (PNG) format for lossless compression and for display of images on the World Wide Web. Unlike GIF, PNG supports 24-bit images and produces background transparency without jagged edges some Web browsers do not support PNG images. supports RGB, indexed-color, grayscale, and Bitmap- mode images without alpha channels. preserves transparency in grayscale and RGB images.

Image File Formats - TIFF Tagged-Image File Format –used to exchange files between applications and computer platforms. –8 bits/channel (24 bits for color) –Lossless image compression (2:1) –CMYK, RGB, Lab, indexed-color, and grayscale with alpha channels –Newer versions allows for additional compression techniques (JPEG) and color spaces –for scanner –big in file size

Data rate / Bandwidth Data Rates - the amount of data per second that has to flow to play back that sequence smoothly. Ex. 720 by 576 uncompressed PAL video the data rate is Mb per image × 25 frames per second = 31.1 Mb/s. Bandwidth - the ability of a system to deliver data. Data rate of a data stream (like a digital video file) > bandwidth of playback – not smooth Data rate of a data stream (like a digital video file) < bandwidth of playback –smooth. Uncompressed, broadcast-quality video requires 160 megabits per second (Mbps) of network bandwidth. Uncompressed, CD-quality audio requires approximately 2.8 Mbps.

MPEG (Moving Picture Experts Group) image compression standards MPEG is similar to JPEG (for individual frames) but exploits temporal redundancy (between frames) as well by estimating motion between frames. MPEG-1 - upto 1.5 Mbit/sec (Video CD) MPEG-2 -> 4Mb/sec – HDTV/DVD standard MPEG-4 - content based/MULTIMEDIA

Considerations in video compression Delivery method( CD, Internet(broadband), Internet(modem)) Image quality(color depth), Output data rate, number of Key frame Codec compatibility

Codec Comparison