Vector Images

Vector images are the images that contain paths that contain text, lines and shapes. It is composed with lines and curves to make the image smoother and the colours are arranged by a mathematical equation called vector. Unlike raster images vector images are resolution independent meaning the images will not lose their quality no matter how big they are made. This would be useful for posters, magazine covers, website images, web pages, web advertisements, logos and billboards.

 

The only disadvantage of vector is that it’s not photorealistic. It lacks depth and appearance in the value and colours of a continuous tone image.

 

PSD

 

PSD is Photoshop Document shortened. It is created when you save a document on Photoshop. It can be converted to a raster image or a vector image. It can have the maximum height and width of 30,000 pixels and the limit size of 2 Gigabytes. It is used for Webpages and logos. But also Photoshop can also work on raster images.

 

FLA

 

FLA files contain source material from adobe flash. This format can be compiled into Shock Wave Flash (SWF). Flash is also what’s used to make GIF files and it is also known to make my own animations for web cartoons and for making flash video games.

 

AI

 

Ai files are used in Adobe Illustrator. It is a vector based format. It can be used to make images and game sprites. I quickly made this character to show as an example that even if you resize the image like a building it would not lose its quality. In my personal experience I use Illustrator to create the background and sprites for a video game I was making called “Halo Boy”.

 

PDF

 

In 1991 adobe systems created the Portable Document Format or PDF for short. It was created to be a document format that can work on software, hardware and operating systems. The contents of this format would have texts, fonts, graphics and other information required. This is a vector because when I enlarge the document it does not lose its quality and become blurry so I can see the words clearly (it’s easier to read with vector formats).

 

Rater Image Formats

Pixel Art

Pixel art is a form of digital art that is created in raster graphics software. The images are edited at a pixel level, so it’s a very retro style that was used in old console games, in calculators and some mobile games use pixel art to get that retro feel.

There are 3 types of pixel art files that can be used in video games.

 

1.    GIF: In 1987 CompuServe created the Graphics Interchange Format (or GIF). A raster format that is web friendly, it supports 24-bit colour RGB colour space containing 256 colours. It is also used for animation so it can be used to make a sprite look like it’s moving by its self in the game. It’s a lossless compression format so it basically doesn’t lose any of its data when it’s uploaded.

2.    PNG: In 1995 the Portable Network Graphics was produced by the same people who created GIF. It’s a raster graphics format that supports palettes of 24-bit or 32-bit colours. It also supports lossless compression meaning that it can reduce the size of the PNG image but it does not permanently lose its data and still keeps the image’s quality. So it would be mostly used to create sprites for a game.

3.    JPEG: Joint Photographic Experts Group or JPEG was created in 1991 by the Joint Photographic Experts Group. It is a format file designed for photos digitally uploaded on the computer. It is one of the most commonly used format file. Its colour depth goes to 24 bit meaning it contains about 16 million different colours. It is web-friendly but it is not good for lettering or simple line drawing. It’s a lossy compression format mean that when an image compress into a digital format it loses a bit of data and get it back.

4.    BMP: Stand for Bitmap picture. BMP are very large files, there colour depth goes up to 32 bit (16 million colours) and can be used on many operating systems. Since BMP are large files they can take up a lot of space on your computer and when you magnify the image, it loses its clarity and looks more block because of the pixels.

5.    TIFF: In 1992 the Tagged Image File Format or TIFF for short was created. It support for all platforms (MAC, PC etc.). It is used as a leading commercial and professional image standard. They come in large files with colour depth of 48 bit (16 million colours). They are often use in print documents. Electrical equipment such as scanners and digital cameras save images as TIFF files. Tiff files can be opened with Photoshop or with Windows Picture and fax Viewer.

 

 

As I mentioned before, the only flaw that when you enlarge a raster image, the image would lose its quality and it would look blurry and pixelated. Here’s an example, the small picture is the actually image size 64x64 and when I enlarge the image has now become blurry and pixelated so it can’t be used for any large prints.

 

 

 



Raster and Vector Images

There different digital image formats on the computer with different sizes and different purposes.

There is the raster image which consists of BMP, GIF, JPEG and TIFF files and there is the vector image which also consists of PDF, FLA and AI files.

The difference between raster and vector is that raster images have pixels which can capture pictures with continuous variety of colour tones and can be edited in Photoshop. But if I were to enlarge a raster image too much, the image would lose its quality and become blurry and I would start see the pixels.

Vector images contain paths which are coloured lines, texts and shapes and are not contained in pixels so that the image can increased or reduced without losing quality. When I create a vector image on Adobe Illustrator it creates a mathematical path based on the command of the user also when I resize the vector image to big or small it would not lose its quality but the vector image can’t have great detail with multiple colours only one colour for each shape so it can’t be used for photo editing software.

For an example I copied this image from http://vector-conversions.com/images/raster_vs_vector.jpg to show the different of raster and vector. The versus image in the raster corner has been enlarged but it starts to loses the quality and starts to become blurry and you can see the pixels, while in the vector corner the versus image has been enlarged but it keeps the good quality of the image with no blurriness or any pixels showing.

So if I were to make a logo big or small I would use the vector images, but if I want to capture a digital image with great details in colours and can edit them on Photoshop then I would use raster images.