"Digital Media Primer" Yue-Ling Wong, Copyright (c)2013 by Pearson Education, Inc. All rights reserved.

Slides:



Advertisements
Similar presentations
CHS GRAPHICS GDP UNIT 01 FILE FORMATS Understanding File Formats.
Advertisements

L.Ghadah R. Hadba CT1514-L1.  Computer Graphics :refers to processing of creating a new image from Geometry, Lighting parameters, Materials and Textures.Using.
Chapter 2 Fundamentals of Digital Imaging
Droddy.  “Pixel” is short for two words: Picture and Element. Pixels (tiny squares) combine to form the image the human eye perceives Too small for the.
ETT 429 Spring 2007 Digital Photography/Scanners.
Graphics in the web Digital Media: Communication and Design
File Formats The most common image file formats, the most important for cameras, printing, scanning, and internet use, are JPG, TIF, PNG, and GIF.
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.
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.
Digital Images. Scanned or digitally captured image Image created on computer using graphics software.
File Formats Different applications (programs) store data in different formats. Applications support some file formats and not others. Open…, Save…, Save.
Russell Taylor Week 3. Image File Formats - TIF, JPG, PNG, GIF - which to use? The three most common and important image file formats for for printing,
Dr Jimmy Lam CAD for Fashion and Textiles
Prepared by George Holt Digital Photography BITMAP GRAPHIC ESSENTIALS.
Multimedia Specification Design and Production 2012 / Semester 1 / L4 Lecturer: Dr. Nikos Gazepidis
Digital Images Chapter 8, Exploring the Digital Domain.
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.
All About File Formats Mr. Butler John Jay High School Department of Technology.
SOFTWARE TYPES Word processing Page layout Paint Draw.
THE THEORY & CONCEPTS Lesson 1 – Part 1. What is Graphic Design It’s a CREATIVE PROCESS Undertaken in order to convey a specific message/s I can’t teach.
Digital Image Formats: An Explanation Guilford County SciVis V
CS- 375 Graphics and Human Computer Interaction Lecture 1: 12/4/1435 Fundamental Techniques in Graphics Lecturer: Kawther Abas.
File Formats Different applications (programs) store data in different formats. Applications support some file formats and not others. Open…, Save…, Save.
Photoshop Photoshop works with bitmapped, digitized images (that is, continuous-tone images that have been converted into a series of small squares, or.
ADOBE PHOTOSHOP VECTOR VS RASTER. Pixel A pixel is the fundamental unit of an image in Photoshop. It is a small square block of color. An image often.
2D Graphics Theory & Principles. Single Point Smallest addressable area on screen or digital image.
Digital Imaging 101 Ann Ware. Digital Image Categories BITMAP  A vector is created by using a series of mathematically defined lines and curves rather.
Color and Images. Color The natural colors we see and the colors we see on computer monitors are different. CMYK -natural RGB -monitor.
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 Graphics for Computer Games Pixels Types of Digital Graphics (Raster and Vector) Compression.
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
Photoshop Basics: Extended Instructor: Vicki Weidler Assistant: Joaquin Obieta.
ITEC2110, Digital Media Chapter 3 Digital Image Processing 1 GGC -- ITEC Digital Media.
Understanding Images. Pixels pixels Every image is made up of very small squares called pixels, and each pixel represents a color or shade. Pixels within.
ITEC2110, Digital Media Chapter 2 Fundamentals of Digital Imaging 1 GGC -- ITEC Digital Media.
© 2016 Pearson Education, Inc., Hoboken, NJ. All rights reserved.
2.01 Understand Digital Raster Graphics
File Formats Different applications (programs) store data in different formats. Applications support some file formats and not others. Open…, Save…, Save.
Common Bitmap Image File Types
2.01 Understand Digital Raster Graphics
Digital Imaging 101 Ann Ware.
DIGITAL MEDIA FOUNDATIONS
Chapter 3 Image Files © 2013 Cengage Learning. All Rights Reserved. May not be scanned, copied or duplicated, or posted to a publicly accessible website,
2.01 Understand Digital Raster Graphics
Image Formats.
"Digital Media Primer" Yue-Ling Wong, Copyright (c)2013 by Pearson Education, Inc. All rights reserved.
Introduction To Photo Editing SHIELA MAE A. AQUINO SRNHS.
2.01 Investigate graphic image design.
Raster Images CPSC 1030.
Chapter 3 Image Files © 2017 Cengage Learning®. May not be scanned, copied or duplicated, or posted to a publicly accessible website, in whole or in part.
"Digital Media Primer" Yue-Ling Wong, Copyright (c)2013 by Pearson Education, Inc. All rights reserved.
A computer display is made up of small squares, called pixels.
Image File Size and File Compression
Digital Images.
Digital Image Formats: An Explanation
Graphics Basic Concepts.
2.01 Understand Digital Raster Graphics
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.
Nuts and Bolts of Digital Imaging
2.01 Understand Digital Raster Graphics
Basic Concepts of Digital Imaging
timo. fi (59003) www. biocenter
2.01 Investigate graphic image design.
2.01 Investigate graphic image design.
Presentation transcript:

"Digital Media Primer" Yue-Ling Wong, Copyright (c)2013 by Pearson Education, Inc. All rights reserved.

Chapter 2 Fundamentals of Digital Imaging Part 3 File Size and File Compression

In this lecture, you will find answers to these questions How do pixel dimensions affect the image file size? How does the bit-depth affect the image file size? Why should JPEG files NOT be used as working files for further editing?

Why Compression? higher resolution or higher bit depth  larger file size Without compression, image files would take up an unreasonable amount of disk space. Larger files take longer time to transfer over the network.

How many bits? Let’s look at the size of a typical high resolution image file without compression.

How many bits? Suppose 6-megapixel digital camera may produce digital images of 3000  2000 pixels in 24-bit color depth. Total pixels: 3000  2000 pixels = 6,000,000 pixels File size in bits: 6,000,000 pixels  24 bits/pixel = 144,000,000 bits File size in bytes: 144,000,000 bits / (8 bits/byte) = 18,000,000 bytes  17 MB

Strategies To Reduce File Sizes Reducing the pixel dimensions Lowering the bit depth (color depth) Compress the file

Reducing Pixel Dimensions Capture the image at a lower resolution in the first place Resample (resize) the existing image to a lower pixel dimensions

Reducing Pixel Dimensions Returning to our calculation of the file size of an image of 3000  2000 pixels in 24-bit color depth. Let's calculate the file size of an image of 1500  1000 pixels in 24-bit color depth.

How many bits if half the size in each pixel dimension? Total pixels: 1500 1000 pixels = 1,500,000 pixels File size in bits: 1,500,000 pixels  24 bits/pixel = 36,000,000 bits File size in bytes: 36,000,000 bits / (8 bits/byte) = 4,500,000 bytes  4.3 MB It's 1/4th of the file size.

Lowering the Bit Depth Returning to our calculation of the file size of an image of 3000  2000 pixels in 24-bit color depth. Let's calculate the file size of an image if we reduce the bit depth to 8-bit.

How many bits if reduced to 8-bit? Total pixels: 3000  2000 pixels = 6,000,000 pixels File size in bits: 6,000,000 pixels  8 bits/pixel = 48,000,000 bits File size in bytes: 48,000,000 bits / (8 bits/byte) = 6,000,000 bytes  5.7 MB It's 1/3rd of the file size.

24-bit vs. 8-bit 24-bit: 224 (about 16 million) colors 8-bit: 28 (about 256) colors

Weighing Bit Depth Against File Size 24-bit  8-bit: You lose about 16 million colors! May cause image quality degradation. But 8-bit will work well if your image does not need more than 256 colors.

24-bit  8-bit Without Noticeable Image Quality Degradation Grayscale images: e.g. scanned images of black-and-white photos hand-written notes (may be even lowered to 4-bit, 2-bit, or 1-bit) Illustration graphics: e.g. poster or logo contains only a few colors as large areas of solid colors

File Compression Methods File compression: To reduce the size of a file by squeezing the same information into fewer bits. Lossless compression method: e.g., TIFF, PNG, PSD No information is lost GIF files also use lossless compression but it limits the number of colors to 256 Lossy compression method: e.g., JPEG Some information is lost in the process. For digital media files, the information to be left out is chosen such that it is not the human sensory system most sensitive to.

Working with Lossy Compression JPEG files: JPEG compression, which is lossy (i.e., the lost information cannot be recovered) Do not use JPEG files as working files for further editing Repeated saving a JPEG file will degrade the image quality further Save as JPEG only in the very last step of your editing process. For example, when you have finished editing the image and are ready to post it on the Web. Avoid using JPEG for images intended for high quality prints

An original TIFF image

A JPEG with a very low quality setting. Note the ugly artifacts around the contrast edges.

Closeup view of the JPEG with a very low quality setting. Note the blockiness and ugly artifacts around the contrast edges.

File Types During Editing or Capturing PSD : A .PSD file is a layered image file used in Adobe PhotoShop. PSD, which stands for Photoshop Document, is the default format that Photoshop uses for saving data. PSD is a proprietary file that allows the user to work with the images' individual layers even after the file has been saved.

PNG A PNG file is an image file stored in the Portable Network Graphic (PNG) format. It contains a bitmap of indexed colors and uses lossless compression, similar to a .GIF file but without copyright limitations. PNG files are commonly used to store graphics for web images

TIFF Tagged Image File Format, abbreviated TIFF or TIF, is a computer file format for storing raster graphics images, popular among graphic artists

camera RAW للاطلاع A popular type of raw file is "Camera RAW," which is generated by a digitalcamera. Instead of processing the image captured by the camera, the data is left unprocessed and uncompressed until it is opened with a computer program. 

Common File Types of Pixel-based Images File Suffix Standard Color Modes Use Compression JPEG (Joint Photographic Experts Group) .jpg .jpeg RGB CMYK Best for continuous tone images such as photographs can be used for Web images Lossy compression method called JPEG compression that works well with photographs The CMYK color model (process color, four color) is a subtractive color model, used in color printing, and is also used to describe the printing process itself. CMYK refers to the four inks used in some color printing: cyan, magenta, yellow, and key.

Common File Types of Pixel-based Images File Suffix Standard Color Modes Use Compression GIF (Graphics Interchange Format) .gif Indexed color, grayscale Supports up to 8-bit color Best for illustration graphics or cartoon-like pictures with large blocks of solid color and clear divisions between color areas a proprietary format of CompuServe can be used for Web images Lossless compression method called LZW compression

Common File Types of Pixel-based Images File Suffix Standard Color Modes Use Compression PNG (Portable Network Graphics) .png indexed, grayscale, black and white Supports 8-bit and 24-bit color Can be used for Web images Lossless compression

Common File Types of Pixel-based Images File Suffix Standard Color Modes Use Compression TIFF (Tag Image File Format) .tif .tiff RGB, CMYK, CIE-Lab, indexed, grayscale, black and white Proprietary format of Adobe Photoshop good for any types of digital images that Photoshop supports stores layers supports alpha channel Lossless compression

Common File Types of Pixel-based Images File Suffix Standard Color Modes Use Compression PSD (Photoshop Digital Image) .psd RGB, CMYK, CIE-Lab, indexed, grayscale, black and white Supported on both Windows and Mac common file format supports alpha channel Allows uncompressed, LZW compression (lossless), ZIP (lossless), JPEG (lossy)

Common File Types of Vector Graphics File Suffix Information and Use Encapsulated PostScript .eps Standard file format for storing and exchanging files in professional printing Adobe Illustrator file .ai Adobe Flash file .fla .swf Windows Metafile format .wmf Many cliparts from Microsoft Office are in this format Enhanced Metafile format .emf Developed by Microsoft as a successor to .wmf

Review Questions Note to instructor: Depending on your preference, you may want to go over the review questions at the end of this lecture as an instant review or at the beginning of next lecture to refresh students' memory of this lecture.

Review Question Generally speaking, how does the file size change if the total number of pixels of an image is doubled? doubled doubled

Review Question Generally speaking, how does the file size change if the number of pixels of both the width and height of an image are doubled? 4x 4x

Review Question Generally speaking, how does the file size change if the bit depth of an image is increased from 8-bit to 16-bit? doubled

Review Question Generally speaking, how does the file size change if the bit depth of an image is increased from 8-bit to 24-bit? 3x

Review Question Give one example of the image file type that supports lossy compression and one that supports lossless compression. lossy: JPEG lossless: TIFF, PNG, GIF, PSD lossy: JPEG lossless: TIFF, PNG, GIF, PSD

Review Question BMP, JPEG, PNG, GIF, JPG, PSD, TIFF Which file extensions indicate pixel-based files? BMP DOC JPEG TXT PNG GIF JPG PSD TIFF EPS WMF BMP, JPEG, PNG, GIF, JPG, PSD, TIFF BMP, JPEG, PNG, GIF, JPG, PSD, TIFF

Review Question EPS, WMF Encapsulated PostScript (EPS) file format Which file extensions indicate vector graphic files? BMP DOC JPEG TXT PNG GIF JPG PSD TIFF EPS WMF EPS, WMF EPS, WMF Encapsulated PostScript (EPS) file format WMF. Short for Windows Metafile Format, graphics file format used to exchange graphics information between Microsoft Windows applications.