1. Image Compression CSC 1040

2. CSC 1040 - Computing with Images2 How do we use fewer bytes to encode the same or similar information? Reduce redundancy Take advantage of human visual system – don’t bother differentiating things that are unnoticeable Make compromises!

3. CSC 1040 - Computing with Images3 Human Vision Human eye tends to “blend” nearby colors Visual acuity varies markedly across features –Discontinuities easily seen, absolutes less crucial Color perception is relative

4. CSC 1040 - Computing with Images4 Do these colors look the same as...

5. CSC 1040 - Computing with Images5... as these?

6. CSC 1040 - Computing with Images6 Not quite

7. Compression: Reducing Redundancy Run-length encoding – Group areas of similar pixels together and encode their color only once – Reduces size as if image had fewer pixels Palette selection – Encode only the colors actually used in the picture (may be much fewer than total number of possible colors) – Reduces size by using fewer bits per pixel CSC 1040 - Computing with Images7

8. 8 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 Opportunity: Large regions of a single color are common Approach: Record # of consecutive pixels for each color An example of lossless encoding Run length encoding

9. CSC 1040 - Computing with Images9 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 Opportunity: Large regions of a single color are common Approach: Record # of consecutive pixels for each color An example of lossless encoding Uncompressed 0000000000000000111111111111100000000000000001111111111111111111111111 Run length encoding

10. CSC 1040 - Computing with Images10 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 Opportunity: Large regions of a single color are common Approach: Record # of consecutive pixels for each color An example of lossless encoding Uncompressed 0000000000000000111111111111100000000000000001111111111111111111111111 Run Length Encoding Row 1, 16:0,13:1;16:0;25:1 Run length encoding

11. CSC 1040 - Computing with Images11 “Lossy” compression types: JPEG Genuine Fractals Mr. SID OriginalCompressed 9:1 “averaging”

12. CSC 1040 - Computing with Images12 JPEG Joint Photographic Experts Group Opportunity: Eye sees sharp lines better than subtle shading Approach: Run length encoding + lossy compression Retain detail only for the most important parts Allows user-selectable fidelity Results: Typical compression 20:1

13. CSC 1040 - Computing with Images13 JPEG Joint Photographic Experts Group Preferred format for scanned photographic images for use over the internet or Web. Not meant for printing. Not good for images with a lot of solid color, vector drawings, type, or line art or images with “Web-safe” colors. JPEG compression is lossy! Save and archive the original before converting to JPEG.

14. CSC 1040 - Computing with Images14 In Photoshop, when you Save as… a JPEG file, you can choose the level of compression and, therefore, the size and quality of the file.

15. Compression: Reducing Redundancy Run-length encoding – Group areas of similar pixels together and encode their color only once – Reduces size as if image had fewer pixels Palette selection – Encode only the colors actually used in the picture (may be much fewer than total number of possible colors) – Reduces size by using fewer bits per pixel CSC 1040 - Computing with Images15 JPG

16. Compression: Reducing Redundancy Run-length encoding – Group areas of similar pixels together and encode their color only once – Reduces size as if image had fewer pixels Palette selection – Encode only the colors actually used in the picture (may be much fewer than total number of possible colors) – Reduces size by using fewer bits per pixel CSC 1040 - Computing with Images16 JPG GIF

17. CSC 1040 - Computing with Images17 Palette selection Opportunity: –No picture uses all 16 million colors –Human eye does not see small differences Approach: –Select a palette of 256 colors –Indicate which palette entry to use for each pixel –Look up each color in the palette

18. CSC 1040 - Computing with Images18 Type of image Bits/pixel320 x 240 image 640 x 480 image 1024 x 768 image Bitmap 1320x240=76,800 pixels =9,600 bytes =9.375 KB 307,200 bits =38,400 =37.5 KB 786,432 bits =98,304 bytes =96 KB Grayscale8 =76,800 bytes =75 KB = 307,200 bytes =300 KB 786,432 bytes 768 KB RGB color 24 (3 bytes) 225 KB900 KB2,304 KB =2.25 MB 32 bit color (4 bytes) 32 (4 bytes) 300 KB1200 KB3,072 KB = 3 MB 256 color GIF 8 75 KB300 KB768 KB 16 color GIF4 37.5 KB 150 KB384 KB Size of images Same as grayscale Half of grayscale

19. CSC 1040 - Computing with Images19 GIF Graphics Interchange Format Industry standard graphic format for on-screen viewing through the Internet and Web. Not meant to be used for printing. The best format for all images except scanned photographic images (use JPEG for these). GIF supports lossless LZW compression.

20. CSC 1040 - Computing with Images20 Photoshop Save for Web details for this option Tools settings

21. CSC 1040 - Computing with Images21 JPEG cautions: Images with hard edges, high contrasts, angular areas, and text suffer from JPEG compression. Scanned “natural” photographs do not lose much, especially at High or Maximum quality. Only save finished images as JPEGs, every time you open and save again, even if you don’t edit, you lose quality. Always keep the original non-JPEG version (the native.psd format). So why use JPEG? It is the best format for photographic images on the Web. Its compression ability is very great.

22. CSC 1040 - Computing with Images22 GIF cautions: Restricted number of colors – not suitable for photographs Very good compression for line drawings (uniform color areas) Only save finished images as GIFs Always keep the original non-GIF version (the native.psd format). So why use GIF? It is a good format for images that have few colors and is widely available Can do lossless compression Its compression ability is great, especially for images with few colors Can also be used for animation

23. CSC 1040 - Computing with Images23 http://en.wikipedia.org/wiki/Graphics_file_format_summary Adobe Photoshop Photoshop can save files in many file formats:.psd — Photoshop Document (“native” format).pdf — Photoshop Portable Document Format.eps — Photoshop Encapsulated PostScript.tiff — Tagged Image File Format.gif — Compuserve Graphic Interchange Format.jpg — JPEG, Joint Photographic Experts Group.bmp — Windows Bitmap.png — Portable Network Graphic etc., etc. A summary of Graphics file formats and uses can be found in: printingweb

24. CSC 1040 - Computing with Images24 EPS Encapsulated PostScript Preferred file format for importing into page layout programs such as QuarkXPress, PageMaker, InDesign, XPress, etc. for subsequent printing. An object-oriented format. Will only print to a postscript printer. Uses lossy JPEG compression. Only save your file as EPS if you need to import it into a page layout program.

25. CSC 1040 - Computing with Images25 TIFF Tagged Image File Format Widely used cross platform file format also designed for printing. A bitmap image format. TIFF supports lossless LZW compression which also makes it a good archive format for Photoshop documents.

26. CSC 1040 - Computing with Images26 PDF Portable Document Format Developed to transfer and read documents without having to print them—the “paperless office.” Cross platform format that can be read with the free download Adobe Acrobat Reader. Can represent both vector and bitmap graphics. Can also contain electronic document search and navigation features as well as hypertext links. Can be created from almost any application, but the user cannot edit or modify the file except with Adobe Acrobat (or other software). Document formatting, fonts, colors, etc. are maintained and appear identical across platforms. Excellent in the “prepress” process — can be sent to the printer, but can also be placed in other documents.

27. CSC 1040 - Computing with Images27 Some of the slides in this presentation were adapted from: http://www.entomology.umn.edu/museum/links/coursefiles/ENT 5051/PowerPoint presentations/Lec 7-File formats.ppt and http://www.umiacs.umd.edu/~jimmylin/LBSC690-2004-Fall/Week10.ppt