lesson 3 graphics types
TRANSCRIPT
![Page 1: Lesson 3 graphics types](https://reader035.vdocument.in/reader035/viewer/2022062822/587af4a21a28ab7f378b71ad/html5/thumbnails/1.jpg)
Types of imageRaster, Vector and file extensions
![Page 2: Lesson 3 graphics types](https://reader035.vdocument.in/reader035/viewer/2022062822/587af4a21a28ab7f378b71ad/html5/thumbnails/2.jpg)
What can you remember from last week?
• Raster• Vector• Compression• Lossy • Lossless
![Page 3: Lesson 3 graphics types](https://reader035.vdocument.in/reader035/viewer/2022062822/587af4a21a28ab7f378b71ad/html5/thumbnails/3.jpg)
Types of digital graphics
• Vector images - Uses points, lines and curves- When scaled up there is no loss of
clarity- E.g: psd, wmf, fla, ai
• Raster images- Based on pixels- When scaled there is a loss of clarity- E.g: bmp, gif, tiff, jpgRaster
![Page 4: Lesson 3 graphics types](https://reader035.vdocument.in/reader035/viewer/2022062822/587af4a21a28ab7f378b71ad/html5/thumbnails/4.jpg)
Compression
• Lossy- reduces the size of the file but also looses quality.
• Lossless- reduces the size of the file but the quality stays in tact.
![Page 5: Lesson 3 graphics types](https://reader035.vdocument.in/reader035/viewer/2022062822/587af4a21a28ab7f378b71ad/html5/thumbnails/5.jpg)
Learning Aims:
• All of you will be able to discuss the different types of image
• Most of you will be able to research and make references to the different types of images
• Some of you will be able to criticise the use of different image types in graphics.
![Page 6: Lesson 3 graphics types](https://reader035.vdocument.in/reader035/viewer/2022062822/587af4a21a28ab7f378b71ad/html5/thumbnails/6.jpg)
A Bitmap or Raster graphic• When you take a photograph
using a digital camera or scan an image from a magazine, you are creating a bitmap graphic.
• A bitmap graphic is composed of many tiny parts, called pixels, which are often many different colours.
![Page 7: Lesson 3 graphics types](https://reader035.vdocument.in/reader035/viewer/2022062822/587af4a21a28ab7f378b71ad/html5/thumbnails/7.jpg)
A Bitmap or Raster graphic• It is possible to edit each individual
pixel.
• Since the computer has to store information about every single pixel in the image, the file size of a bitmap graphic is often quite large.
• When you resize a bitmap graphic, it tends to lose quality.
![Page 8: Lesson 3 graphics types](https://reader035.vdocument.in/reader035/viewer/2022062822/587af4a21a28ab7f378b71ad/html5/thumbnails/8.jpg)
What are vector graphics?
• Vector graphics are created in graphics packages and consist of shapes called objects.
• It is possible to edit each object separately, for example, change the shape, colour, size and position.
![Page 9: Lesson 3 graphics types](https://reader035.vdocument.in/reader035/viewer/2022062822/587af4a21a28ab7f378b71ad/html5/thumbnails/9.jpg)
What are vector graphics?
• Even if an object in a vector graphic is quite large, it doesn't need a lot of computer memory.
• Therefore the file size of a vector graphic is often very small.
• Vector graphics are scalable - ie when you resize them, they do not lose quality.
![Page 10: Lesson 3 graphics types](https://reader035.vdocument.in/reader035/viewer/2022062822/587af4a21a28ab7f378b71ad/html5/thumbnails/10.jpg)
File Types used in graphics
• bmp, • png,• gif, • jpg, • Psd• tiff
![Page 11: Lesson 3 graphics types](https://reader035.vdocument.in/reader035/viewer/2022062822/587af4a21a28ab7f378b71ad/html5/thumbnails/11.jpg)
Tiff files ending in .tif• stands for Tagged Image File Format.
• TIFF images create very large file sizes.
• TIFF images are uncompressed and thus contain a lot of detailed image data (which is why the files are so big)
• TIFFs are also extremely flexible in terms of color (they can be grayscale, or CMYK for print, or RGB for web) and content (layers, image tags).
![Page 12: Lesson 3 graphics types](https://reader035.vdocument.in/reader035/viewer/2022062822/587af4a21a28ab7f378b71ad/html5/thumbnails/12.jpg)
JPEG (also known as JPG), file types ending in .jpg
• stands for Joint Photographic Experts Group
• JPEG files are images that have been compressed to store a lot of information in a small-size file.
• JPEG files are usually used for photographs on the web, because they create a small file that is easily loaded on a web page and also looks good.
• JPEG files are bad for line drawings or logos or graphics, as the compression makes them look “bitmappy” (jagged lines instead of straight ones).
![Page 13: Lesson 3 graphics types](https://reader035.vdocument.in/reader035/viewer/2022062822/587af4a21a28ab7f378b71ad/html5/thumbnails/13.jpg)
What can you remember about GIFs?
• What does it stand for?
• Lossy or lossless?
• What is it mainly used for?
• Stands for Graphic Interchange Format
• compresses images but, as different from JPEG, the compression is lossless
• This format is never used for photography, because of the limited number of colors.
• GIFs can also be used for animations
![Page 14: Lesson 3 graphics types](https://reader035.vdocument.in/reader035/viewer/2022062822/587af4a21a28ab7f378b71ad/html5/thumbnails/14.jpg)
PNG, file types ending in .png• stands for Portable Network
Graphics.
• It’s used almost exclusively for web images, never for print images.
• It also allows for a full range of color and better compression.
• PNG can retain it’s transparency
![Page 15: Lesson 3 graphics types](https://reader035.vdocument.in/reader035/viewer/2022062822/587af4a21a28ab7f378b71ad/html5/thumbnails/15.jpg)
Psd, file types ending in .psd• Photoshop document
• These types of files are very large files allowing for large colour information.
• Usually images are retained in this format for print.
• These types of files are generally raster files, but there are some elements which are vector based.
![Page 16: Lesson 3 graphics types](https://reader035.vdocument.in/reader035/viewer/2022062822/587af4a21a28ab7f378b71ad/html5/thumbnails/16.jpg)
.Ai file types
• Illustrator document
• Vector images
• Use large colour information
![Page 17: Lesson 3 graphics types](https://reader035.vdocument.in/reader035/viewer/2022062822/587af4a21a28ab7f378b71ad/html5/thumbnails/17.jpg)
Bitmap graphics Vector graphics
What are they made up of?
What can be edited?
What is the file size?
What happens when they are resized?
How real do they look?
Native formats
Common file formats
![Page 18: Lesson 3 graphics types](https://reader035.vdocument.in/reader035/viewer/2022062822/587af4a21a28ab7f378b71ad/html5/thumbnails/18.jpg)
Bitmap graphics Vector graphics
What are they made up of? Pixels of different colours Objects
What can be edited? Individual pixels Individual objects
What is the file size? Large, as the computer stores details of every pixel
Small, as the computer stores details of objects, which do not require much memory
What happens when they are resized?
They lose quality They do not lose quality
How real do they look? Real Not real (many of them look like cartoon images)
Native formats .bmp .svg
Common file formats .bmp, .dib, jpeg, gif, tiff, .png .psd
.cgm, .svg, .odg, .eps, .xml .ai
![Page 19: Lesson 3 graphics types](https://reader035.vdocument.in/reader035/viewer/2022062822/587af4a21a28ab7f378b71ad/html5/thumbnails/19.jpg)
TASK: Write your article “What is digital graphics technology?”Research and explain using examples:
• Vector Graphics• Raster Graphics• Types of image• Advantages and
disadvantages of using different types of graphics.
• How Vector and raster graphics are created