Digital Graphics File Formats

Amelia Browne

Raster Graphics• Raster Graphics are made up of bit maps, this is a graphic that is made up of pixels each pixel/

square shows a different colour gained from the graphics given information, the variety of colours used for each pixel build up to create the intended image for the graphic.

• Bitmapped images have a fixed resolution meaning that if the image is resized then it may become distorted e.g. pixilation

• The resolution of an image is measured in dpi (dots per inch), when we use Photoshop we set a resolution of 300dpi

• When taking a picture with a camera in order to capture the image the camera separates the image in to millions of pixels to record the colours of each part of the image. megapixels are used to tell us how many million pixels/ bits the image is separated into, the number of megapixels in an image determines the image quality, the greater the number of pixels the better the quality as a greater number of colours are able to be recorded.

• When images are put on the internet they are compressed into less megapixels in order to allow faster browsing, however this means when an image is taken of the internet and resized it is more likely to become distorted due to the loss of image quality

As the image has been cropped down the fixed resolution has caused the image to distort

This image shows the increase in quality and clarity of an image as the number of pixels increases

Vector Graphics• Vector graphics are made up of vectors/ pathways these are when there is a start and an end point between

which are curves, points and angles filled in by the computer, this type of information means the path could become a line angular shape (e.g. triangle) or even a curvy shape

• The benefit of using vector graphics is that you are able to scale them as big or small as you want and there will be no loss of definition in the image unlike when using bitmaps, using vectors can therefore be extremely useful for company logos which will be used on a variety of sized product from pens to billboards, it is also particularly good for text as it prevents it from becoming pixilated and therefore illegible

This image is using vector graphics meaning that

with each increase in size no definition has been

lost

Raster Graphics

JPEGStands For Joint Photographic Experts Group

Used For/Example The majority of images online are JPEGs as they allow fast browsing and are versatile, for example photographs on Facebook are JPEGs

Advantage It is an adaptable file format as you are able to open this type of format in most programsYou are also able to make them low resolution which is useful when they are used online as it allows faster browsing

Disadvantage The quality of the image decreases over time if multiple edits take place as the image is compressed each time it edited and saved

TIFFStands For Tagged Image File Format

Used For/Example Its popular with Graphic designers who use it for desktop publishing for example when producing magazines and leaflets

Advantage It allows multi paged documents to be saved to a single TIFF file there is the option for them to be lossless meaning that compression wont reduce the quality over time

Disadvantage Due to the multiple pages and no compression the file size can often end up being huge, therefore taking up a lot of memoryThis file type my be unable to be opened on devices such as phones

GIFStands For Graphics Interchange Format

Used For/Example Used for low quality digital animations much like a flick book, these often appear on the internet

Advantage The animation works like a flick book with few pictures, meaning that the size of the file can be kept relatively small in comparison to more complex animation

Disadvantage The quality of image is often quite poor as it has been compress quite a lot I order to reduce the file size

BMPStands For Bitmap Image file

Used For/Example This file type is similar to TILL and JPEG and is good for programmes such as paint where you create images

Advantage It keeps the initial level of detail of the image as there is no loss in compression so the file will not loose quality over time

Disadvantage This flies size is generally quite large, meaning a greater amount of memory will be taken up if you wish to save the image

Vector Graphics

PSDStands For Photoshop Document

Used For/Example It is used for image manipulation and often for cover images on magazines as it allows you to save the layers without compression

Advantage It uses vector graphics meaning that the image quality doesn't decrease when the size is altered, it also allows transparency such as no fill textboxes so things can be printed with clear elements. When saved all the layers are saved along with page formatting information, swatches etc.

Disadvantage This file is only usable in Photoshop and can only be opened in adobe software meaning it isn't very versatile

AIStands For Adobe Illustrator art

Used For/Example It is used for digital drawing and artwork and is often used in logo creation, by using graphics to represent the company

Advantage The image is able to be scaled big and small with no loss in definition due to the use of vector graphics this is particularly useful with logos as they will be used on a variety of very different sized products

Disadvantage This type of file is only usable in adobe illustrator meaning that its not very versitile

FLAStands For Flash File

Used For/Example To create animation and games and is needed to view them over the internet along with videos

Advantage It is able to produce small sized files that are still high quality and are also able to include sound

Disadvantage The file is not as powerful or advanced as other tools meaning that the production process may be slow

WMFStands For Windows Metafile

Used For/Example This file type appears in the clipart application in windows files such as windows and provides free premade images it is similar to AI files and can also be used for logos

Advantage It can be scaled big or small as it contains vectors and therefore the image wont have a loss in definition

Disadvantage The images can sometimes contain both vectors and bitmap components therefore meaning there is the chance that there will be a loss in definition if the image as resized

File Format Capture and Optimising

CompressionDefinition Lossy compression is used to reduce the

file size by reducing the amount of information this saved

Advantage The file size becomes smaller meaning that it takes up less space once saved, it also allows faster browsing online as less information is needed to be loaded

Disadvantage The quality of the image is reduced as it becomes more pixilated due to to loss in the number of pixels

Low compression

Medium compression

High compression

Image CaptureMethod Scanner

How is it used for image capture of graphics

You are able to digitalise images the scanner scans the object/ image and turns it into visual data on the computer you may do this to sketches, physical photos or mixed media products can be used to upload an image to repair picture damage

Method CameraHow is it used for image capture of

graphicsIs used to take pictures which can be uploaded to the computer and edited in software such as Photoshop where corrections can be made and filters/ effects can be added

Method Graphics TabletHow is it used for image capture of

graphicsThe computer mouse is able to be controlled like a pen which allows for great control in order to produce digital drawings, selection or digital handwriting

OptimisingWhy would you optimise? In order to assure easy and quick viewing

when you upload an image to the internet or insert one into a piece of work such as in a PowerPoint

How can you optimise? You are able to optimise an image by changing the “Image Size” in Photoshop you can also reduce the bit depth (number of colours used for the pixels) the image resolution could also be changed or the image could be compressed

Advantage to optimising It prevents initially large sized files from taking so long to download which is beneficial for websites as if their content takes longer than 5-7 seconds to load then people will most likely give up waiting and leave their website

Disadvantage to optimising The file size is decreased and therefore so has the number of pixels meaning the image quality has also reduced

Storage

File SizeWhat could affect a Working Scale (Photoshop) document file size?

This is dependent on the pixel dimensions of the image and the number of layers in the document. Images with more pixels or layers need more space to be saved.

How could you reduce the file size of a Working Scale document without

affecting quality?

You select you image and upload it to Photoshop you then go to Image> Image size and use the drop down to select ‘Bicubic Sharper (best for reduction)’ you then go to the dimensions and half them to prevent the image from looking distorted then press OK

What is an advantage of scaling up images before exporting?

The quality of the image would improve as there would be a greater number of pixels allowing for a greater variety of colours

What is a disadvantage of scaling up images before exporting?

The file size of the image would be larger meaning it would take longer for people to download

File Naming ConventionsWhat naming conventions could you use when creating your video game assets?

• You could name each asset describing what they are for example ‘Tree’ or the name of the character e.g. ‘witch’ then if there is more than one asset for each character or piece of scenary then you should add a describing word e.g. ‘dark green tree’ or witch facing left’

Why is it a good idea to accurately name your assets?

So you are able to quickly and easily recognise which asset is which once you have saved them as this will save you a great amount of time when it comes to finding the asset you want

Asset ManagementWhy would you use folders when storing

your assets?So you can find the asset you need quickly and easily as they would all be logically grouped together

What folders would you create and what would you save within them

You would create a folder for the characters and one for the scenery then within these folder you would create more folders for each character or each element of scenery