2.  Scanned or digitally captured image  Image created on computer using graphics software

4.  Object-oriented graphics  Made-up of vectors  Resolution independent – can be scaled to any size without losing any detail  Used primarily for hard-edged graphics such as drawings, logos, charts, illustrations, and type  Adobe Illustrator, Macromedia Freehand, Corel Draw

6.  Made-up of pixels – each pixel (picture element) is assigned a specific location and color value  Resolution Dependant – contain a FIXED number of pixels (size of image is based on the image resolution)  Can represent subtle gradations of color - used primarily for continuous-tone images such as photographs  Adobe Photoshop, Paintshop Pro, Painter

8.  Issues to consider  Type of Image  Intended Usage  Open standard or proprietary format  TIFF & EPS  GIF, JPEG, PNG

9.  TIFF(Tagged ImageFile Format) – raster only  This format is a good way to save scanned images. (Long-term archival storage)  It is a platform-independent file format.  TIFF is strictly used for bitmap data.  The TIFF format allows for changes in contrast, density, and color to be made easily.  TIFFs support virtually all color spaces and support a large number of compression algorithms. (can remain uncompressed)  A TIFF file can be any resolution you choose.  The main drawback to saving a file in TIFF format is that, because of the large amount of information saved, the file size may be quite large.

10. EPS (Encapsulted PostScript Files)  EPS is a vector file format. (can hold raster data) The EPS “package” contains the PostScript information (the page description language that defines desktop publishing) that the file needs for printing, and QuickDraw/Preview information (rasterized (TIFF or PICT) preview) that the computer uses for display of images on screen.  Originally the native format of Illustrator  Since EPS files are written in PostScript, they should work with every PostScript device and most layout, illustration, and paint programs.  EPS files are mostly exported from a graphics program (Illustrator/Photoshop) and placed in a layout program.

11. PSD AI  Adobe’s proprietary file formats for Photoshop & Illustrator PDF (Portable Document Format)  Not really a graphic file format  Designed to contain entire pages (graphics, type, vector shapes, layout)  Electronic equivalent of your printed documents  Incorporates fine detail and quality of print publications with the interactivity of electronic publications

12. Common Web File Formats  GIF Graphics Interchange Format  JPEG Joint Photographic Experts Group  PNG Portable Network Graphic  SVG Scalable Vector Graphic

13.  We prepare images based on our intended use Output device  Images for PRINT  Should have a higher resolution  Usually in CMYK color mode  Images for DIGITAL DISPLAY  Usually have a lower resolution  Use RGB color mode

14.  The quantity and distribution of pixels in an image  PIXEL  An abbreviation for picture element.  The smallest element of a bitmap image  Monitors and printers use a fine grid of pixels to display images  Each pixel can be turned on or off and assigned a color.

15.  Pixel dimension (ppi??) (web)  # of pixel elements of image  800pX 600p  Dots per Inch (dpi) - Resolution  “dots” of ink per inch when a digital image is printed  Resolution often referred to in dpi (distribution of pixels in an image)  300 dpi image  5X7 image at 300dpi resolution = pixel dimensions of 1500X2100

16.  When we create or scan a digital image we are capturing pixel information  Scanners record the color value and brightness of each area of an image when scanned. (resolution/bit depth)  WE decide how much pixel information to capture by setting the resolution as we scan.  The resolution or image dimension determines what we can do with the image (print/video) (resolution determines how large we can print or display our image and still have it be sharp)

18.  The number of bits used to represent the colors of each pixel in an image. The greater the bit depth means more bits of information per pixel.  Black & white: 1-bit one bit to describe each pixel – black & white (on/off) (lineart)  Grayscale: 8-bit 256 possible colors (Ex: 256 shades of gray in a grayscale image)  Full Color: 24-bit millions of colors (full color, truecolor)  Three 8-bit channels: 256X256X256 = 16 million color combinations  Represents a significant portion of the range of colors visible to the human eye  32-bit = CMYK images or RGB images with a 4 th Alpha channel  48-bit = generally highest bit-depth available  Three 16-bit channels  Most software and hardware not able to display this much data

20.  Higher resolution & Higher bit-depth images...  Have a larger file size  Contain more pixels  can reproduce more detail & subtle color transitions

21. MegapixelsResolution 8MP3264x2448 9MP3464x2600 10MP3648x2736 12MP4000x3000 http://au.news.yahoo.com/technology/photography/article/-/7364542/what-is-a-megapixel/

22.  Images for digital display typically have a lower resolution (72 ppi) – pixel dimension  Image pixels map one-to-one with the display resolution of a monitor  Monitor resolution varies by platform and user configuration  Monitor resolutions  http://www.w3schools.com/browsers/browsers_dis play.asp http://www.w3schools.com/browsers/browsers_dis play.asp X

23.  High resolution graphics – not needed online. They just appear larger on screen and take up more file size and bandwidth.

24. http://help.adobe.com/en_US/photoshop/cs/using/WSfd1234e1c4b69f30ea53e41001031ab64- 7945a.html

28.  Intended use of the graphic will determine  Type of file  Tool used to create it  File format needed

29. BITMAP IMAGES CONTAIN A FIXED # OF PIXELS! Good Ducky! Bad Ducky!

30.  Create Archival Master  Scanned at highest level possible - appropriate for your environment  Save in uncompressed file format  Create all derivative files from the archival master  Back-up Archival Master

31. The Claremont Colleges Digital Library Scanning Best Practices http://ccdl.libraries.claremont.edu/inside/CCDLScanningBestPractices.pdf

32.  To produce good quality images we must…  understand image dimension & resolution  Create or edit the image size to be suitable for our intended use  Start with a good source file (digital image/scan)  If you plan to edit or scale the image in any way, start with a higher resolution image and optimize and compress image for web after all edits are complete.

33. Resources  Adobe Web Tech Curriculum Lesson 5.1: Graphics Basics http://www.adobe.com/education/instruction/webtech/CS2/unit_graphics1/gb_ print.htm http://www.adobe.com/education/instruction/webtech/CS2/unit_graphics1/gb_ print.htm  Scanning Tips by Wayne Fulton http://www.scantips.com/ http://www.scantips.com/  Claremont Colleges Digital Library Scanning Best Practices http://ccdl.libraries.claremont.edu/inside/CCDLScanningBestPractices.pdf http://ccdl.libraries.claremont.edu/inside/CCDLScanningBestPractices.pdf  Scalable Vector Graphics http://www.adobe.com/svg/viewer/install/main.html http://www.w3.org/TR/SVG/intro.html http://www.adobe.com/svg/viewer/install/main.html http://www.w3.org/TR/SVG/intro.html