Vector graphics use mathematical formulas to define images as objects made of points and paths, allowing resolution-independent scaling. Raster graphics are composed of pixels arranged in a grid to form images. Key factors that determine raster image quality include resolution, color depth, and file format. Common file formats like JPEG, PNG, and GIF vary in their compression algorithms and support for animation and transparency.

1.  Describe the various graphic formats used in digital media.

2. In This Chapter, you’ll learn on:
 The Basics of Digital Image Formation
 Identifying of the Various file types such as JPEG,
GIF, AI, PDF and etc
 The Characteristics and use of the Various Graphic
Formats

3. In this chapter, we will look at the basic types of digital
images and file formats. Images, such as pictures, clip
art, 3-D graphics, and animation, are commonly used
in designing for both multimedia and the Web.
Regardless of their forms, multimedia images are
generated by the computers in two ways: as vector-
based graphics and bitmap images

4. The Basics of Digital Image Formation
Vector graphics
 Vector-based images are defined by mathematical
relationships between points and the paths connecting
them to describe an image.
 Graphical elements in a vector file are called objects.
Each object is an independent entity with properties,
such as color, shape, size, outline, and position on the
screen, by its definition. Since each object is a self-
contained entity, you can easily move and change its
properties while maintaining its original clarity, and
without affecting other objects in the illustration.

5.  Object graphics are very little memory because
only the location and design information must be
defined – very simple values. This also applies to the
colors used in object graphics, which are also
expressed numerically.
 These characteristics make vector-based programs
ideal for illustration and 3D modeling, where the
individual objects usually need to be created and
manipulated through the design process.

6. Figure 1. Vector-based graphic: the image itself on
the left and the actual lines that make up the drawing
on the right.

7. Working with Vector Graphics
Outlines and Lines
 Lines and outlines in object
graphics can assume any
color.
 You can also specify how
thick the lines should be, the
style of the lines (solid,
dotted, etc) and the shape
of the corners (curved,
squared, etc).

8. Fill
 Curved and closed objects
can be filled with colors,
color shifts and patterns.
 The colors are expressed
numerically in terms of the
ink coverage required for
the respective printing inks.
 You can select fill patterns
and color shifts from a
predetermined menu.

9. Patterns
 A pattern consists of a small group of objects repeated in a
square pattern. It is easy to make your own patterns.
Gradients
 Color shifts are transitions among several colors at set distances.
 Gradients can either be linear or circular

10. Compound Path (Knockouts)
 Also known as knockouts, A curve that is placed
within a closed object – a star within a square, for
example – can be selected as a knockout.
 In this example, the selection means that a star
knocks out a transparent hole in the square. As a
result, whatever you put behind the square will be
visible through the star hole.

12. Applications for Object Graphics
 Object graphics are created in illustration software
such as Adobe Illustrator
 Adobe Streamline is one example. They are usually
used to convert pixel-based logotypes into object
graphics so they can be used in all possible sizes.
 Object graphics are usually saved in the image
format Encapsulated Postscript (EPS). You can also
save them in whatever format the software uses,
but then the object may not be able to be placed
in a page layout application.

13. Raster Graphics
 Raster graphics also known as bitmap images are made of individual dots
called pixels that are arranged and colored differently to form a pattern. The
individual squares that make up the total image can be seen when zoomed
in. However, from a greater distance the color and shape of a bitmap image
appear continuous.
 Since each pixel is colored individually, you can easily work with photographs
with so many colors and can create photo-realistic effects such as shadowing
and increasing color by manipulating select areas, one pixel at a time.
Pixel Graphics
Digitalized photographic images
consist of tiny squares of a color,
called pixels. The eye cannot
perceive the pixels unless the
image is greatly enlarged.

14. Bitmap programs are ideal to retouch photographs,
editing images and video files and creating original
artwork. Variety of changes to photographs can be
made, such as adjusting the lighting, removing
scratches, people, and things, swapping details
between images, adding text and objects, adjusting
color, and applying combinations of special effects.

15. Working with Graphics
 When photographs or illustrations are scanned into
a computer, pixel-based images, or pixel graphics,
are created. Another term of pixel is raster.
 A pixel graphic is a divided into tiny squares of
color, almost like a mosaic. These tiny squares of
color are referred to as pixels.
 Pixel graphics can also be created directly in the
computer or by a digital camera.

16. Resolution
 If you assume that a pixel-based image is printed in
a certain size, the image will consist of a certain
number of pixels per centimeter or per inch (ppi).
 The resolution of an image is measured in ppi. This
refers to the number and size of the pixels that
make up a particular image.
 Sometimes the unit dpi is used (incorrectly) instead
of ppi. Dpi, which means dots per inch, is the unit
used to describe the output resolution in printers.

17.  If the resolution of an image is low, the pixels will be large, and you will clearly
see that the graphic consists of a mosaic-like pattern. At a higher resolution,
however, the eye cannot perceive that the image is made up of pixels.
 There is an appropriate high-level resolution for most images; if you make the
resolution higher than that, you will not get a better quality image but it will
take up more storage space
Image Resolution
A pixel-based image always has a
set resolution (pixels per inch, or
ppi).
In the example, the image has 8
pixels/0.0228 inches = 350 pixels per
inch, or 350 ppi.

18. Color Modes, Channels and Bit Depth
 Bit Depth
o For now, I believed that you have a better understanding
of what is object and pixel graphics. As to let you know, in
vector-based programs, such as Adobe Illustrator and
CorelDraw Graphics Suite, the drawing tools make shapes
based on mathematical formulas.
o As to recap, vector objects have smooth lines and
continuous colors even when you magnify the image.
Vector drawings are resolution independent, meaning that
when print a vector-based drawing, the quality depends
only on the resolution of the printer.

19. A vector drawing looks the
same whether viewed at its
actual size or magnified.

20.  In pixel-based programs, such as Photoshop,
images are made up of tiny pixels that are
arranged and colored to form a pattern. Each pixel
represents a color.
 When you view a pixel-based image at its intended
size and resolution, the colors and shapes appear
smooth, but if you magnify the image, tiny
individual squares become more evident. You can
edit a pixel-based image pixel by pixel, and pixel-
based images depend on the resolution at which
they are saved for quality when printing the image.

21.  Color depth sets how many colors are available in
each pixel. The number of colors available in a pixel
can range from two colors to millions.
A pixel-based image
looks smooth at its
actual size but shows its
pixels when magnified.

22.  A color mode determines how the channels in each pixel
create the colors in an image. And each channel in a pixel
represents a primary color.
 Typically, color information is saved in a measurement called
bit depth or color depth.
 This color depth measures how much color information is
available in each pixel. The more bit depth that an image has,
the more colors are available. More color depth translates to
more accurate representation of color on-screen as well as on
the printed page.
 Typical color depth values are 1-bit, 8-bit, 16-bit and 24-bit. For
instance, a pixel with a 1-bit color depth has two possible
color values – black and white. An 8-bit pixel has 256 possible
color values and a 24-bit pixel has about 16 million possible
color values.

23. Channels
 Every image you create in Photoshop contains
channels. Channels store an image’s color
information.
 Each pixel in an image can have as few as one and
as many as four channels. The number of channels
in an image depends upon the color mode in
which the image is set.

24.  To view the channels in a
color image, use the
Channels palette to display
the image’s channels. Click
on one of the channels to
display only that channel.
Clicking RGB would restore
the full channel display).
 A special grayscale
channel that is used to save
selections is known as an
alpha channel.

25. Color Modes
 A color model is a scheme used to break colors
down into their component primary parts. Color
models are used to represent color in images in a
standardized way.
 In Photoshop, color models are applied to images
as color modes.
 Photoshop supports eight color modes: Bitmap,
Grayscale, Duotone, Indexed Color, RGB, CMYK,
Lab and Multichannel.

26.  Any image can be converted to or edited in any
one of the eight color modes. To convert an image
to another color mode, choose Image > Mode and
select a color mode from the submenu
 The different color modes contain a different
number of channels. Table 1 shows the number of
channels per mode.

27. Table 1
The Number of Channels in a Color Mode
One Channel Three Channels Four Channels
Bitmap RGB CMYK
Grayscale Lab
Duotone Multichannel
Indexed Color

28.  If you want to convert an image to a color mode
that is unavailable on the submenu (unavailable
options are grayed out), you need to convert the
image to another color mode before converting it
to the desired color mode.
 For instance, if you want to convert an RGB color
image to Bitmap mode, you have to convert the
image to Grayscale first. You will learn more about
the various color modes in the later chapters

29. The Various File Types and its Characteristics
 Pixel-based images can be saved in a number of
file formats. Some of them have more or less
becomes industry standards. They are primarily
differentiated by which color modes they can
handle as well as the level of features they are
capable of.

35. The most common image file formats are Photoshop, EPS,
TIFF, PICT, GIF and JPEG. Some are only used on Macintosh
and others only on Windows. The two formats generally
used in graphic production are TIFF and EPS.