Basic Introduction To Graphic File Formats
Download as PPTX, PDF11 likes4,453 views
The document provides an introduction to graphic file formats, covering both bitmap and vector image formats, along with their characteristics and uses. Bitmap images, composed of pixels, suffer quality loss when resized, while vector images are based on mathematical equations and maintain quality regardless of scaling. The choice between bitmap and vector formats depends on the nature of the design, with bitmaps suitable for photographic elements and vectors for illustrations with distinct shapes.
Basic Introduction To Graphic File Formats
- 1. Graphic File Formats Basic Introduction 10/4/2015 1Ankit Mishra|CS1 Fb.com/djankit007
- 2. Topics To Be Covered 10/4/2015 2Ankit Mishra|CS1 Introduction Multimedia File Formats Graphic File Formats Bitmap Image Vector Image Comparision Conclusion
- 3. Introduction 10/4/2015 3Ankit Mishra|CS1 Multimedia data and information are stored in a file using certain formats specific to the type of multimedia content. File •Digital storage of data. Format •The way content (data) is stored.
- 4. Multimedia File Formats 10/4/2015 4Ankit Mishra|CS1 A typical multimedia file may contain a specific or a wide range of data such as graphic,video,animation,MIDI information,fonts etc. MULTIMEDIA FORMATS Video AnimationGraphic Audio
- 5. Graphic File Formats 10/4/2015 5Ankit Mishra|CS1 Graphic file formats are standardized means of organizing and storing digital images. .bmp .gif .jpeg .png Bitmap .pdf .svg .cgm .eps Vector
- 6. Image Resolution 10/4/2015 6Ankit Mishra|CS1 Resolution refers to the total number of pixels in an image. For example: An image that is 1920*1080 (1920 pixels wide and 1080 pixels high contains 1920*1080 = 2073600 pixels (or 2.1 Megapixels).
- 7. Bitmap Image 10/4/2015 7Ankit Mishra|CS1 Bitmap (or raster) images are stored as a series/grid of tiny dots called pixels. Pixels are blocks representing smallest unit of information arranged in a 2-D grid. Bit depth of a pixel represents the relative amount of colour information present in it.
- 8. Bitmap Image Format 10/4/2015 8Ankit Mishra|CS1 The density of the dots, known as the resolution, determines how sharply the image is represented. In typical bitmaps, image pixels are generally stored with a color depth of 1, 4, 8, 16, 24, 32, 48, or 64 bits per pixel. Bitmap images are resolution dependant. On resizing a bitmap image, quality gets sacrificed.
- 9. Representing Images In Bitmap 10/4/2015 9Ankit Mishra|CS1 Images need to be converted into binary in order for a computer to process them so that they can be seen on our screen. Digital images are made up of pixels where each pixel in an image is made up of binary numbers. For example: 1 bit per pixel (0 or 1) gives two possible colors to represent an image. If 1 is black and 0 is white then a simple B&W picture can be created using binary.
- 10. Representing Images In Bitmap 10/4/2015 10Ankit Mishra|CS1 We can get more possible colors by using more bits per pixel. 1 bit per pixel (0 or 1): 2 possible colours 2 bits per pixel (00 - 11): 4 possible colours 3 bits per pixel (000 - 111): 8 possible colours 4 bits per pixel (0000 - 1111): 16 possible colours 8 bits per pixel : 256 possible colours 16 bits per pixel : 65k possible colours 24 bits per pixel : 16 Million possible colours 32 bits per pixel : 4 Billion possible colours Size of an image = (Rows) X (Columns) X (Bits per pixel(bpp))
- 11. Representing Images In Bitmap 10/4/2015 11Ankit Mishra|CS1 RGB color scheme is a method of mixing (R)ed, (G)reen and (B)lue light in order to produce almost any imaginable color. Here, a pixel stores 8 bits of information (color) for each Red(R),Green(G) & Blue(B) which has integer values from 0 to 255. This makes 256*256*256=16 million possible colors. RGB Color code: (127,127,203)
- 12. Representing Grayscale Image 10/4/2015 12Ankit Mishra|CS1 Grayscale image has number of shades of gray per pixel. Where shades of gray are the levels of color between Black (0) and White(1). An 8 bit grayscale image contains 2^8=256 levels. This 8 bit grayscale image has 1024 rows and 1024 columns hence, Size = 1024 * 1024 * 8 = 8388608 bits or 1 Mb.
- 13. Common Bitmap Image Formats 10/4/2015 13Ankit Mishra|CS1 Scanned images and images taken from digital camera are all bitmap. .gif Graphics Interchange Format Web graphics, buttons, chart, icons. .jpg Joint Photographic Expert Group Web images .tiff Tagged Image File Format High Quality Photographs
- 14. Vector Image Format 10/4/2015 14Ankit Mishra|CS1 Unlike bitmap, vector graphics are not made up of a grid of pixels. Instead, vector graphics are made up of mathematical equations, series of draw instruction comprised of paths, which are defined by a start and end point, angles, lines, squares, triangles, or curve shapes etc. These shapes are called objects and each object has some attributes (colour,fill,outline,shadow etc) Vector graphics are resolution independant. Resizing a vector image won’t effect its sharpness or crispness.
- 15. Vector Image Format 10/4/2015 15Ankit Mishra|CS1 Vector graphic also includes metafiles, which are graphics that contains both bitmap (raster) and vector data. Objects are bitmap but attributes are vector. Some common vector metafile formats are: .CGM (Computer Graphic Metafile), .EMF (Enhanced Metafile Format), .WML (Windows Metafile)
- 16. Common Vector Image Formats 10/4/2015 16Ankit Mishra|CS1 Vector images can be zoomed or scaled at any ratio thus, can be used for designing logos or magazines. They can’t be used for generating photo-realistic imagery. .cdr CorelDRAW vector graphics Vector illustrations, page layout, brouchures .swf ShockWave Flash web-based video games .ai Adobe Illustrator Layers, vectors, effects etc
- 17. Bitmap (Raster) vs Vector 10/4/2015 17Ankit Mishra|CS1 Vector Bitmap
- 18. Bitmap (Raster) vs Vector 10/4/2015 18Ankit Mishra|CS1
- 19. Bitmap (Raster) vs Vector 10/4/2015 19Ankit Mishra|CS1 Bitmap ImageVector Image
- 20. Conclusion 10/4/2015 20Ankit Mishra|CS1 • The choice to use bitmap or vector depends on the design itself. • If it's going to have photographic elements with continuous tones and blends of color, one should use bitmap editing programs like Photoshop. • And if considering final design to look like an illustration with clear contrasts between objects & shapes, then use a vector program like adobe illustrator.