1. A raster graphic is an image composed entirely of single pixels to create a larger, more detailed
image. You would typically expect images from cameras, screenshots and the web to be made up of
separate pixels. There are many file formats which will be used to save raster images, although
typically the most common formats would be .jpg, .jif, .png . Each of the corresponding formats will
be used for a different purpose. A Fantastic example of a raster image would be large pixel art
portraits, like the one pictured below:
Although at a distance the picture appears to be very high in detail, however on closer inspection it
is very clear that the image is composed of many smaller pixels that have been carefully placed so
that at a further distance, the image becomes much clearer and appears to have more detail.
Raster images are resolution dependant, this means as the image is scaled up, and the size of both
planes will determine the resulting quality. This means they cannot be scaled up to an arbitrary size
without loss of detail and pixilation. For example an image that is 1000x1000 would look perfect at
its native resolution (1000x1000), however if this image was then scaled up to 2000x2000 it would
create dramatic amounts of pixilation and distortion, resulting in an unusable image.
Some of the advantages of Raster Graphics:
The image is typically much more compatible than a vector.
Each location of each cell holding a pixel is implied by its position in the cell matrix. This
means other than an origin point, no geographic coordinates are stored.
Quick to perform and easy to program.
Easy to create.
Some of the disadvantages of Raster Graphics:
2. Images can be scaled but with a distinct loss in image quality, so typically the size a raster
image is taken in, will be the size it stays forever.
They require higher resolutions and anti-aliasing for smooth appearences.
Some formats not compatible with other operating systems.
Raster Applications
Paint:
Firstly it is important to know what you are going to be using the final graphic for and what you need
from the editing software. Typically if you only want to do extremely primitive editing such as
cropping, free-hand drawing or small typographay based pictures a program such as Paint will
suffice.
Photoshop:
Photoshop is widely considered one of the mose powerful and feature rich raster image editing
packages available on the market. There is a plethora of tools which can take years to completely
master and come to terms with. There is a multitude of different tools such as:
Pen tools
Filters
Gradient Fills
In-Depth text editing
Hundreds of image and colour adjustments
Masking
And thousands more...
Lossy compression
Lossy Compression eliminates “unnecessary” bits of information, changing the
file so that it becomes smaller. This type of compression is used commonly for
reducing the size of bitmap pictures, which are usually quite large in size.
Typically, a substantial amount of data can be discarded before the result is
sufficiently degraded to be noticed by the user, this is very useful as you can
lower the file size a fair amount and save space without any problems. Files are
compressed to reduce the overall size and this make them more suitable to use
for streaming mediums I.E an internet gallery.
.jpeg images can be saved at different compression rates and thus altering the
file size, and also unfortunately lowering the overall quality of the image, there
is a definite loss of colour reproduction and also quality, as you lose large
amount of detail.
3. Lossy compression works by “Discarding” data that is less neccicary. In photos this can be things
such as deep blacks, whites and relative colours that are near each other, for example in the above
image, this is why you will find images “layering” the colours in an image, for example the three
images opposite have all been altered in quality, with the best one at the top, and the worst at the
bottom. You can see layering in the sky of the bottom picture.
Vector Graphics
Vector Graphics use “geometrical primitives” and mathematical equations to keep the quality
extremely consistent, not matter how much zoom or expansion is placed on that particular image.
Vectoring does this by applying mathematical equations to ever shape
placed into the particular image, to constantly resize the shape and create
a smooth undeviating line whenever it is resized or expanded. Since these
formulas can produce an image scalable to any size and detail, the quality
of the image is limited only by the resolution of the display, and the file
size of vector data generating the image stays the same.
Vectors can be particularly useful as there is never a loss of quality, and a
consistent image is always portrayed, no matter what zoom or stretch is
applied to the image.
The drawback to using vector graphics is that they are more processor
intensive than raster images, meaning this inherently limits the functionality for large data sets.
Points are a mathematical plot in the vector image. These are saved in relation to where the other
points are. They are used to bridge the gap between another point and the lines that join them.
Lines are the items used to go in-between the points, these are called paths and they are
determined by where the points are.
Typically Vector images are saved in the following file formats:
Ai:
The Adobe illustrator file is a common file type used for saving vector images. It is one of the most
widely used graphic design programs. It has a file with the tag AI, meaning that this is the file
originally used for developing the vector image design. These files can almost always be opened by
Adobe Illustrator programs exclusively and cant be brought into other applications.
EPS:
EPS stands for Encapsulated PostScript. Surprisingly, it can contain both vector and bitmap data.
PostScript Is the universal language used for computer printers and also professional printers. If the
file contains only vectors it can easily be reduced or enlarged without loss of resolution and is the
best file to use for printing logos or vector graphics.
4. SVG:
SVG or Scale Vector Graphics File is a family of an XML-based file format. Similarly to the rest of the
vector file formats it allows for unlimited scaling.
Vector Applications
Adobe Fireworks:
Fireworks is a vector and bitmap graphics editor. Typically you would associate Fireworks with web
editing due to the fact it has image splicing in order to reduce load times and also includes may
other features which would be of use to the budding web designer.
Adobe Illustrator:
Illustrator is a vector specific application which shares a few qualities with Photoshop, this is mainly
due to the fact both Photoshop and Illustrator are made by the same company, Adobe. This
program would be for the “high end” user, although typically vectors should not be created or
altered by people who don’t know what they are doing as it is distinctly more difficult that dealing
with Raster images. Illustrator features things such as:
Pen and line tools
Live trace
Live paint
Gradients
Layers
Lots more...
Metafiles
Metafiles is a bracket term used for a file format that can contain both Raster & Vector images,
commonly graphics formats. These files can contain Raster, Vector and Type Deta. There are a few
different file formats used to save metafiles, with the most common being a PDF (Portable
Document Format). Another format that you would associate with Metafiles would be SVG or
Scalable Vector Graphic(s). There are some key things to do with Metafiles which are worth noting,
they are:
Mobile
Can host both Raster and Vector
Widely compatible
Common
5. When saving a file it is important to know wether or not you’re going to need a metafile, this will
typically depend on what the final use of the graphic file will be. If there is no reason to use a
Metafile it would be more sensible to use a Raster or Vector.
There are a number of different programs you can use to edit and create Metafiles. The most
common of these would probably be Photoshop, however adobe also has Illustrator for creating a
mix of Raster and Vector.
.svg
Scalable Vector Graphics (SVG) is an XML-based vector image format for two-dimensional graphics
that has support for interactivity and animation. This format is used by all major
internet browsers such as Chrome, Firefox, Opera and Safari, and can mark up directly. .svg is able to
include Raster, Vector and Text which makes it useful for creating lots of various things.
.PDF
This format is quite possibly the most well known and highly distributed form of Metafile, it is used
in lots of online documents and is the product of Adobe Systems, created in 1993. Each PDF file
encapsulates a complete description of a fixed-layout flat document, including the text, fonts,
graphics, and other information needed to display it.