This document discusses digital graphics file formats and optimization. It covers: - Raster graphics are made of pixels that build images, while vector graphics use paths between points. - File formats like JPEG are for photos but lose quality over edits, while TIFF retains quality but has large files. - Optimization reduces file sizes without losing quality for faster loading on websites. - Scanners, cameras, and graphics tablets capture images digitally. - Naming conventions and folders help organize and locate assets efficiently.

1. Digital Graphics
File Formats
Amelia Browne

2. 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

3. 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

4. Raster Graphics

5. JPEG
Stands 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
programs
You 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

6. TIFF
Stands 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
memory
This file type my be unable to be opened
on devices such as phones

7. GIF
Stands 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

8. BMP
Stands 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

9. Vector Graphics

10. PSD
Stands 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

11. AI
Stands 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

12. FLA
Stands 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

13. WMF
Stands 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

14. File Format Capture
and Optimising

15. Compression
Definition 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

16. Image Capture
Method 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 Camera
How is it used for image capture of
graphics
Is 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 Tablet
How is it used for image capture of
graphics
The 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

17. Optimising
Why 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

18. Storage

19. File Size
What 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

20. File Naming Conventions
What 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

21. Asset Management
Why 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