Cameras and scanners capture images in pixels. Vector Base

1
Basic Digital Imaging

• For PE 266
• Technology in HPER

2
2 Types of Computer Graphics

• Raster Graphics - also known as Pixel-based (you
  paint with pixels)
• Building blocks of images are pixels
• Pixels are tiny squares
• AKA painted images or bitmapped images
• Cameras and scanners capture images in pixels
• Vector Based (you draw objects with vectors)
• AKA drawn or object-based images
• Images are described in mathematical terms

3
Comparison of image types

• If you zoom in close on a pixel based image you
  will be able to see the pixels (you will see
  jagged edges when you zoom in closely)
• If you zoom in close on a vector based image you
  will always see smoothly drawn edges regardless
  of how closely you zoom in

4
Comparison of image types

• Pixel based images can be edited one pixel at a
  time individual pixels can be edited
• Vector based images are edited as a whole object
  you cant erase part of a vector image

5
Comparison of image types

• Pixel based images are typically used for
  photo-type images (from cameras and/or scanners)
• File sizes tend to be larger than vector based
  images
• File types are things like jpg, gif, bmp, tiff
• Vector based images are usually used for line art
  and web pages
• File sizes tend to be smaller than pixel based
  images
• Flash files are vector based
• Vector images can be scaled to any size with no
  loss of image quality

6
Issues when capturing images

• One of the main issues is resolution
• Resolution is the number of pixels (usually
  expressed as width and height)
• More pixels means better quality (and larger
  size), but it also means larger file sizes
• Larger file sizes mean it will take longer to
  work with and also to display on a web page

7
More on resolution

• Images are always captured in pixels per inch
  although it is often mislabeled as dots per inch
  (or DPI)
• DPI is actually used to describe the resolution
  for outputting images normally to a printer

8
Guidelines

• Always capture images in higher resolution than
  you ultimately will need (if possible).
• After capturing images process them to get the
  desired final image

9
Basic image processing

• Archive your original image (as raw, tif, or png
  file) and work on a copy.
• First crop your image
• Then size and if necessary re-sample your image
• Adjust levels
• Compress and export image

10
Digital Imaging Assignment

• Acquire 2 images one from a camera and one from
  a scanner
• Process/optimize both images for web page
• Create graphic with Fireworks and export it as a
  gif

11
Turn in the following

• 3 files should be turned in (and the file names
  should identify which is which)
• Both processed images one from camera and one
  from a scanner (.jpg)
• Gif file created in Fireworks
• Assignment can be turned in through e-mail or on
  USB storage device