Graded Unit Revision_001
-
Upload
urban-frogg -
Category
Documents
-
view
221 -
download
0
Transcript of Graded Unit Revision_001
-
8/4/2019 Graded Unit Revision_001
1/28
Graded Unit Revision -Graded Unit Revision -
PhotoshopPhotoshop
-
8/4/2019 Graded Unit Revision_001
2/28
22
OverviewOverview
The topics we need to discuss:Categories of digital graphics.
The purpose of digital graphics in applications
Uses of different types of digital graphics
Attributes of graphicsFile formats
Compression
Software Applications
-
8/4/2019 Graded Unit Revision_001
3/28
33
Categories of digital graphicsCategories of digital graphics
The topics we need to discuss:
Bitmap
Vector
Meta
Animated
-
8/4/2019 Graded Unit Revision_001
4/28
44
Bitmaps (Raster graphics)Bitmaps (Raster graphics)
Made up from rectangular picture elements
called pixelsEach pixel contains a specified number of bits hence bitmap
A bitmap file has a large size because it savescolour information for each pixel
Color depth is the amount of colours per pixelThe greater the number of bits the better thequality but the larger the file size
If resolution is too low, they becomespixellated
Anti-aliasing is a technique for smoothing outthe sharp edges of a bitmap
Resolution is a measure of how finely a devicedisplays bitmapped graphics
Bitmaps going onto a website should have an
-
8/4/2019 Graded Unit Revision_001
5/28
55
Bitmaps (Raster graphics)Bitmaps (Raster graphics)
Bitmap graphics are
rectangular.
On a white backgoundthis image may notappear to be square buton a dark backgroundthat it is rectangularbecomes obvious
-
8/4/2019 Graded Unit Revision_001
6/28
66
Bitmaps (Raster graphics)Bitmaps (Raster graphics)
When over-enlarged
this image becomeshighly pixellated.
It has a severe caseof the jaggies.
-
8/4/2019 Graded Unit Revision_001
7/28
77
Bitmaps (Raster graphics)Bitmaps (Raster graphics)
Common bitmap file types include:
JPEG A compressed format used for photorealistic graphics with lots of color and detail
GIF A lossless file format designed for fast
transfer over modems that is better suited tosimple graphics
BMP - An uncompressed Windows formatcreated by IBM not to be confused with thebitmap format in general
PNG Developed to avoid paying to use GIFthe format
TIFF - A flexible format designed forexchanging files between applications andcomputer platforms
-
8/4/2019 Graded Unit Revision_001
8/28
88
Bitmaps (Raster graphics)Bitmaps (Raster graphics)
Calculate the size of a file as follows:
Size in KBs = (H * W * B)/(8 * 1024)
where H is the height, in pixels W the widthin pixels of the image , B is the number ofbit / pixel, 8 the number of bits in a byteand 1024 the number of bytes in a kilobyte.
Example H = 256, W = 256, B = 24.
Size in KB = (256 * 256 * 24) / (8 * 1024)
= 1572864 / 8192
= 192 KB
You tr H = 128 W = 128 B = 8
-
8/4/2019 Graded Unit Revision_001
9/28
99
Vector graphicsVector graphics
Vector graphics are made up from co-ordinates, shapes, line and fill color data
Co-ordinates consist s of two values an x-coordinate and a y-coordinate e.g. (10, 5)
Lines can either be used on their own or inmultiples to create more complex graphics.
Fill color data is the color added to fill ashape
Paths are a series of lines and curves that goto make up a complex vector graphic
Paths can be opened or closed
Text can be anchored to a pathVector graphics are not resolutionindependent and can be scaled withoutloosing their quality
A vector graphic program uses algorithmsthat apply mathematical formulae to the co-
-
8/4/2019 Graded Unit Revision_001
10/28
1010
Vector graphicsVector graphics
A Vector graphic program uses algorithmsthat apply mathematical formulae to the co-ordinates, shapes, line and color data in orderto generate an image
Vector file files are smaller than bitmap filesbecause they contain much less data
Curved paths within a vector graphic arecalled Bezier curves, which consist of anchorpoints that can be adjusted to change the
shape of the curveVector graphics need to be rasterised beforethey can be included in a Web page
Vector file formats include: Al (AdobeIllustrator), FH (Macromedia Freehand) and
CDR (Coral Draw).
-
8/4/2019 Graded Unit Revision_001
11/28
1111
Path ShapingPath Shaping
Moving the controlhandles affects the shape
of the path
-
8/4/2019 Graded Unit Revision_001
12/28
1212
Quadratic Bezier CurvesQuadratic Bezier Curves
Construct intermediate
points Q0 and Q1 such thatas t varies from 0 to 1:Point Q0 varies from P0 to P1
and describes a linear
Bzier curve.Point Q1 varies from P1 to P2
and describes a linearBzier curve.Point B(t) varies from Q0 to
Q1 and describes a quadratic
Bzier curve.
-
8/4/2019 Graded Unit Revision_001
13/28
1313
Higher Order Bezier curvesHigher Order Bezier curves
Higher-order curves need
correspondingly moreintermediate points.
For fourth-order curves one
can construct intermediatepoints Q0, Q1, Q2 & Q3 that
describe linear Bziercurves, points R0, R1 & R2
that describe quadraticBzier curves, and points S0
& S1 that describe cubic
Bzier curves.
-
8/4/2019 Graded Unit Revision_001
14/28
1414
Meta graphicsMeta graphics
Meta files are graphic files that are acombination of bitmap and vector graphics
EMF is an interchange format for exportingvector graphic data.
When Illustrator saves vector data to EMFformat it may rasterize some vector datawhen exporting artwork to EMF format
Windows meta file (WMF) contains functioncalls that vector graphic statements while
others identify raster graphic imagesCGM is supported by ANSI and is commonlyused in CAD and presentation graphicapplications.
-
8/4/2019 Graded Unit Revision_001
15/28
1515
Animated graphicsAnimated graphics
Animated graphics are 'moving graphics' thatAnimated graphics are 'moving graphics' thatconsist of at least more than one graphic.consist of at least more than one graphic.
Vector graphics are mainly the basis ofVector graphics are mainly the basis of
animations.animations.
Effects generated by bitmaps can be addedEffects generated by bitmaps can be addedand bitmaps themselves can also beand bitmaps themselves can also be
animated.animated.
The illusion of movement is created byThe illusion of movement is created by
playing a series of graphics at a certainplaying a series of graphics at a certain
speed.speed.
The term applied to the playback setting isThe term applied to the playback setting is
known as frame rate. Measured in frames perknown as frame rate. Measured in frames per
second (fps)second (fps)
In computer based applications, the higherIn computer based applications, the higher
-
8/4/2019 Graded Unit Revision_001
16/28
1616
Animated graphicsAnimated graphics
The accepted frame rates used today are:The accepted frame rates used today are:
12 - 24fps for animations used in multimedia12 - 24fps for animations used in multimedia
12fps for web based animations12fps for web based animations24fps for TV in UK24fps for TV in UK
30fps for TV in USA30fps for TV in USA
25fps for film25fps for film
-
8/4/2019 Graded Unit Revision_001
17/28
1717
QuizQuiz
1. Define the term color depth
2. What is a Bezier curve
3. What type of graphic is represented by co-ordinates, shapes and fill data and whoseimage is generated by mathematical
equations4. Why do bitmap files have a large file size?
5. What is a WMF file made up from
6. What is pixellation otherwise known as thejaggies?
7. In vector graphics what is a path, what arethe two types of path?
8. What is a Meta file?
9. Give a definition of an animated graphic
10.What is the recommended frame rate for-
-
8/4/2019 Graded Unit Revision_001
18/28
1818
CompressionCompression
The aim of compression is reduce file size butThe aim of compression is reduce file size butto maintain the quality of the original data.to maintain the quality of the original data.
Files are usually compressed so that theyFiles are usually compressed so that they
take up less space on storage media or lesstake up less space on storage media or less
bandwidth when they are transferred over abandwidth when they are transferred over a
network.network.
Compression is used for different types ofCompression is used for different types of
data, for example documents, sound, anddata, for example documents, sound, and
video.video.
When compression is applied to multimediaWhen compression is applied to multimediagraphics it is almost invariably applied tographics it is almost invariably applied to
bitmapped graphicsbitmapped graphics
There are tow types of compressionThere are tow types of compression
technique:technique:
-
8/4/2019 Graded Unit Revision_001
19/28
1919
Lossless compressionLossless compression
Lossless compression algorithms reduce fileLossless compression algorithms reduce file
size with no loss in image quality.size with no loss in image quality.
This type of compression can be applied toThis type of compression can be applied to
any kind of computer data such asany kind of computer data such asspreadsheets, text documents, softwarespreadsheets, text documents, software
applications and graphics.applications and graphics.
To send a file as an e-mail attachment it is aTo send a file as an e-mail attachment it is a
sound idea to compress it using somethingsound idea to compress it using something
like winzip or winrar.like winzip or winrar.
The main disadvantage with losslessThe main disadvantage with lossless
compression is that it doesnt reduce the filecompression is that it doesnt reduce the file
size as much as lossy compression.size as much as lossy compression.
-
8/4/2019 Graded Unit Revision_001
20/28
2020
Lossy compressionLossy compression
Lossy compression looks for 'redundant' pixelLossy compression looks for 'redundant' pixel
information and discards it permanently.information and discards it permanently.
When the file is decompressed the originalWhen the file is decompressed the original
data isn't retrieved.data isn't retrieved.
Lossy is only effective with media elementsLossy is only effective with media elementsthat can still 'work' without all their originalthat can still 'work' without all their original
data.data.
These includeThese include
Audio,Audio, Video,Video,
images and detailed graphics for screenimages and detailed graphics for screen
design (computers, TVs, projector screens).design (computers, TVs, projector screens).
-
8/4/2019 Graded Unit Revision_001
21/28
2121
Compressed bitmap filesCompressed bitmap files
JPEG or JPG (Joint Photographic ExpertsJPEG or JPG (Joint Photographic Experts
Group) uses lossy compression. HighGroup) uses lossy compression. High
compression can be applied with little visiblecompression can be applied with little visible
loss of quality.loss of quality.
You can set the level of compression e.g.,You can set the level of compression e.g.,
low, medium & high.low, medium & high.
There a lossless version of JPEG, but this isn'tThere a lossless version of JPEG, but this isn'tas widely used as additional hardware mayas widely used as additional hardware may
required.required.
GIF (Graphics Interchange Format). This is aGIF (Graphics Interchange Format). This is a
lossless file format designed for fast transferlossless file format designed for fast transferof data over modems. It is widely supportedof data over modems. It is widely supported
by web browsers and multimediaby web browsers and multimedia
applications.applications.
PNG (Portable Network Graphic) wasPNG (Portable Network Graphic) was
produced to avoid paying to use GIF. It isproduced to avoid paying to use GIF. It is
-
8/4/2019 Graded Unit Revision_001
22/28
2222
Other compressed bitmap file formatsOther compressed bitmap file formats
Other compressed bit formats include:Other compressed bit formats include:Macintosh PICT and TIFF (Tagged-Image FileMacintosh PICT and TIFF (Tagged-Image File
Format)Format)
Macintosh PICT is used with Mac OS graphicsMacintosh PICT is used with Mac OS graphics
and page-layout applications to transferand page-layout applications to transfer
images between applications. PICT isimages between applications. PICT is
especially effective at compressing imagesespecially effective at compressing images
with large areas of solid colour.with large areas of solid colour.
TIFF (Tagged-Image File Format) is used toTIFF (Tagged-Image File Format) is used to
exchangeexchangefilesfiles betweenbetween applications andapplications andcomputer platforms. TIFF is a flexible bitmapcomputer platforms. TIFF is a flexible bitmap
image format supported by most paint,image format supported by most paint,
image-editing, and page-layout applications.image-editing, and page-layout applications.
Most desktop scanners can produce TIFF filesMost desktop scanners can produce TIFF files
Note: These formats are not su orted bNote: These formats are not supported by
-
8/4/2019 Graded Unit Revision_001
23/28
2323
Paint PackagesPaint Packages
Bitmap graphics software applications areBitmap graphics software applications areknown by several names including rasterknown by several names including raster
graphics editorsgraphics editors,, image editorsimage editorsandandpaintpaint
packages.packages.
The major players include:The major players include:
Adobe PhotoshopAdobe Photoshop
Coral Paint Shop Pro (PSP)Coral Paint Shop Pro (PSP)
Coral PainterCoral Painter
Adobe FireworksAdobe FireworksThe other contenders include: Corel Photo-The other contenders include: Corel Photo-
PaintPaint,, Photoshop Elements, GNU ImagePhotoshop Elements, GNU Image
Manipulation Program (GIMP)Manipulation Program (GIMP) andand MicrosoftMicrosoft
PaintPaint
-
8/4/2019 Graded Unit Revision_001
24/28
2424
Drawing PackagesDrawing Packages
Applications used for creating and editingApplications used for creating and editingvector graphics are known as Drawingvector graphics are known as Drawing
Packages.Packages.
These Include:These Include:
Adobe Illustrator.Adobe Illustrator. CorelDRAWCorelDRAW
Adobe FreehandAdobe Freehand
FireworksFireworks
Other packages include: KAI powertools, JascOther packages include: KAI powertools, JascWebDraw, LogoEase- web based software andWebDraw, LogoEase- web based software and
the Flame project - Open source softwarethe Flame project - Open source software
used to create SVG filesused to create SVG files
-
8/4/2019 Graded Unit Revision_001
25/28
2525
Animation PackagesAnimation Packages
More and more graphics software applicationsMore and more graphics software applications
support features for creating simple 2Dsupport features for creating simple 2D(dimensional) animated graphics e.g.(dimensional) animated graphics e.g.
PhotoshopPhotoshop
More complex animations for web andMore complex animations for web and
multimedia applications can be producedmultimedia applications can be produced
using specialist software applicationsusing specialist software applications
Packages include:Packages include:
Adobe Flash
Adobe Director
Other Animation graphics softwareapplications include:
ToonBoom Animation
Anime Studio
CelAction
-
8/4/2019 Graded Unit Revision_001
26/28
2626
QuizQuiz
1. What is the aim of file compression?2. What is the difference between lossless and
lossy compression3. What kind of files are suitable for lossless
compression4. What are the levels of compression for a JPEG
file?
5. Does JPEG support lossy or losslesscompression?
6. How does lossy compression work?7. Which two bitmap compression formats are
NOT supported by Web browsers
8. What is a Drawing package used for?9. What is a Paint package used for?10.List any three of the principle paint
packages
11.List any three drawing packages12.What are the market leading animation
-
8/4/2019 Graded Unit Revision_001
27/28
2727
SummarySummary
We have discussed:
Bitmapped and vector graphics Compression techniques Graphics application packages
We have done a couple of quizzesIf you had trouble with anything in thequizzes Get a copy of the slides from me and work
through them Read the notes carefully before the test
Read through the notes anyway. You cannever practice too muchPractice always makes you better at what youare doing.Go to it & give the test your best shotsAnd finally.
-
8/4/2019 Graded Unit Revision_001
28/28
2828
Good Luck!But you shouldnt need luck as you have allstudied
with Mrs. Meharg - it will be easy!