Part A Multimedia Production Rico Yu

Part A Multimedia Production Ch.1 Text Ch.2 Graphics Ch.3 Sound Ch.4 Animations Ch.5 Video

Multimedia Text Graphics Audio information Animation Videos

Graphics Bitmaps Vector graphics Reference: What are bitmap and vector graphics, and how are they different?

Bitmaps A. Sources of Bitmap Graphics Scanner Digital Camera Screen Captures

Bitmaps Digitisation Devices for digitisation: Scanner Digital Camera Analog singalDigital Form

Bitmaps B. Comparing to Vector Graphics 1. Easy to create 2. Supported by all browser 3. More realistic

Bitmaps C. Image Resolution also called “Image Size” measured in pixels References: HKCityUHKCityU, Adobe PhotoshopAdobe Photoshop

Bitmaps C. Image Resolution 1.Aspect Ratio - Computer screen mostly have this ratio Aspect Ratio = Horizontal side: vertical side = 1024 : 768 = 4 : 3

Bitmaps C. Image Resolution 2.Digital Camera Effective number of pixels = largest picture can obtained Effective # of pixelsLargest picture 2.0M1414 x M1789 x M2000 x M2236 x 2236

Bitmaps C. Image Resolution 3.Printed Size - Print resolution - measured by dpi ( dot per inch) dpi (minimum ) Minimum Image Pixel = Size of output x 300

Bitmaps Passport Photo 2” x 1.5” 600 x 450 pixels

Bitmaps 3R Photo 5” x 3.5” 1500 x 1050 pixels

Bitmaps D. Colour depth - determine the number of possible colours for each pixel Colour depth Combinatio n No. of possible colours for each pixel e.g. of use 1-bit (B/W)2 1 = 22 (Black and White)OCR 8-bit (color)2 8 = colourLine arts 12-bit (color)2 12 = colourPhone mon. 24-bit (true color) 2 24 = 16,777,216 >16M colourColor photo

Bitmaps E. Graphic file size Size of bitmap graphics without compression = Image resolution x colour depth (in byte)

Bitmaps 1-bit black and white File size = 640 x 480 x 1 bit = 307,200 / 8 bytes = 38,400 / 1,024 kB = 37.5 kB

Bitmaps 8-bit colour File size = 640 x 480 x 8 bit = 2,457,600 / 8 bytes = 307,200 / 1,024 kB = 300 kB

Bitmaps 24-bit colour File size = 640 x 480 x 24 bit = 7,372,800 / 8 bytes = 921,600 / 1,024 kB = 900 kB

Bitmaps F. Compression of bitmap graphics - reduce storage space - speed up transmission Compression ratio = Initial file size : Final file size Compression ratio  File size 

Bitmaps F. Compression of bitmap graphics Lossy compression eliminates unnecessary bits of information, like indistinguishable colours higher compression  poorer quality CAN’T get original file back Low compression High compression

Bitmaps F. Compression of bitmap graphics Lossless compression algorithm apply onto the image  reduce file size same in reverse (enlarge) CAN’T control compression ratio Reverse without loss

Bitmaps G. Various Forms of bitmap graphics 1. JPG (Joint Photographic Experts Group) 24-bit colour, suitable for photos and complex graphics used in digital camera lossy compression NOT work in cartoons  Image may lose clarity ( 清晰 ) and sharpness ( 鮮明 ) Reference: What is JPEG graphics file format?

Bitmaps G. Various Forms of bitmap graphics 2. GIF (Graphics Interchange Format) 256 colours Better than JPG if images with only a few distinct colours, such as drawing Supports transparency lossless compression Reference: What is GIF graphics file format?

Bitmaps G. Various Forms of bitmap graphics 3. PNG (Portable Network Graphics) Similar to GIF 256 colours % < GIF files Reference: What is PNG graphics file format? Article Reading: What is the difference between JPEG, GIF and PNG?

Vector Graphics A. File Size Depends on the complexity of the picture Independent of the size of the picture i.e. not the scale of picture < Less complexity More complexity

Vector Graphics B. Creation Basic shapes, like lines, triangles, circles and rectangle Software: Corel ® Draw Adobe ® Illustrator Macromedia ® Flash Macromedia ® Freehand Microsoft ® Word PowerPoint Limited Tools

Vector Graphics C. Converting Vector Graphics into Bitmap Graphics use vector-based graphic to export Screen capture can’t edit

Vector Graphics D. Limitations with suitable plug-in e.g. Flash ® player