Download as PDF, PPTX
Uploaded byJean Dcedric
Textgraphics1
The document discusses various components of multimedia including audio, video, animation and graphics. It then covers topics such as typography including font types, font size, spacing and contrast. Next, it discusses color schemes, color terms and the color wheel. Other topics covered include text layout principles, vector and bitmapped graphics, screen and image resolution, image depth, color models, file size and image compression techniques. Finally, common image file formats are presented.
More Related Content
Textgraphics1
- 1. Multimedia: Text and Graphics Dr. Tan CK 1
- 2. Multimedia Components Audio Cds Graphics Video Animation A i i Dr. Tan CK 2
- 3. What is typography? It is the art of choosing and h i d arranging font Dr. Tan CK 3
- 4. Typography yp g p y • What type of font should be yp used ? • What font size is the most suitable ? • What is the suitable space to p separate each row of text ? • What is the best contrast for the title and the text body ? y Dr. Tan CK 4
- 5. Font Classification Classification offont : Serif Sans serif Square serif Script Decorative / Alternative Dr. Tan CK 5
- 6. Font Classification SERIF Dr. Tan CK 6
- 7. Font Classification SANS-SERIF SANS SERIF Dr. Tan CK 7
- 8. Font Classification SQUARE-SERIF Dr. Tan CK 8
- 9. Font Classification SCRIPT Dr. Tan CK 9
- 10. Font Classification DECORATIVE & ALTERNATIVE Dr. Tan CK 10
- 11. The Wheel ofColour Dr. Tan CK 11
- 12. The Saying goes… Color affects our life. Color is physical ……we see it. Color C l communicates ……we receive it i t i information from the language of color. color Color is emotional ……it evokes our feelings. Bride M. Whelan M . ( (Color Harmony 2)... y ) Dr. Tan CK 12
- 13. Hot Colour Dr. Tan CK 13
- 14. Cold Colour Dr. Tan CK 14
- 15. Lukewarm Colour Dr. Tan CK 15
- 16. Cool Colour Dr. Tan CK 16
- 17. Light Colour Dr. Tan CK 17
- 18. Dark Colour Dr. Tan CK 18
- 19. Bright Colour Dr. Tan CK 19
- 20. Terms Related toColour Hue refers to colo r ( green yellow, red H colour green, ello and others) Value refers to value of the brightness / darkness when we add more white colour, the value is higher when we add more black colour, the value is lower Dr. Tan CK 20
- 21. Terms Related toColour Saturation the intensity, natural and richness y, of the colour usually represents the middle ll t th iddl segment of the wheel of colour pure colour (without white, black and grey) g y) Tint colour which is added with white little by little to become lighter b colour Dr. Tan CK 21
- 22. Terms Related toColour Shades colour which is added with black little by little until it becomes darker colour Dr. Tan CK 22
- 23. Basic Colour Schemes Primary Colour Dr. Tan CK 23
- 24. Basic Colour Schemes Secondary Colour Dr. Tan CK 24
- 25. Basic Colour Schemes Tertiary Colour Dr. Tan CK 25
- 26. Basic Colour Schemes Achromatic scheme Dr. Tan CK 26
- 27. Basic Colour Schemes Monochromatic scheme Dr. Tan CK 27
- 28. Basic Colour Schemes Complimentary scheme p y Dr. Tan CK 28
- 29. Basic Colour Schemes Splitcomplimentary scheme p p y Dr. Tan CK 29
- 30. Basic Colour Schemes Clash scheme Dr. Tan CK 30
- 31. Basic Colour Schemes Analogous scheme g Dr. Tan CK 31
- 32. Basic Colour Schemes Neutral scheme Dr. Tan CK 32
- 33. Text Layout Elements ofeffective text layout : C – Contrast R - Repetition A - Alignment P – P i it Proximity Dr. Tan CK 33
- 34. Text Layout Font Contrast Contrast C t t Colour C C Contrast Graphics Contrast Repetition Repetition of characters R titi f h t Repetition of g ap cs epet t o o graphics Combined Repetition of graphics and text te t Dr. Tan CK 34
- 35. Text Layout Alignment Alignmentof characters Graphics Alignment Text and graphics Alignment Proximity Distance between characters Distance between the graphics g p Distance between characters and graphics Dr. Tan CK 35
- 36. Example 1 Think Big, Big Start Small… Locally Implemented, Implemented a Proven Way to Global Data Warehousing Success. IDS Dr. Tan CK 36
- 37. Example 2 Think BIG ActLOCAL IDS International Data Security A Successful Global Data Warehousing Service 1003A Jalan Jelutong Utara, Bandar Virtual, 66710, Gnalk, AISYALAM Tel. No. 06-03-66765944 Dr. Tan CK 37
- 38. Example 3 Dr.Tan CK 38
- 39. Graphic images p g • A digital display is divided into discrete, individually addressable points called pixels • Images are produced by assigning a color and intensity to each pixel Dr. Tan CK 39
- 40. Screen Resolution (SR) •The maximal image area of the computer screen expressed in screen, horizontal and vertical pixels • Standard screen resolutions: • 640 x 480 • 800 x 600 • 1024 x 768 • 1280 x 1024 Dr. Tan CK 40
- 41. Screen Resolution • Whenscreen resolution increases, images become i i b smaller • M t h screen resolutions with Match l ti ith actual screen size: • 640 x 480 (ss: 14”, 15”) • 800 x 600 ( 15” 17”, 21”) (ss: 15”, 17” • 1024 x 768 (ss: 17”, 21”) 0 7 , ) Dr. Tan CK 41
- 42. Vector Graphics • Itis stored as a set of instruction which describe the dimension and shape of every component of the drawing • To display a vector graphic, each graphic instruction is read and converted to the shapes and colors that comprise the image • Created by DRAW programs (CorelDraw, MacDraw, etc ) (CorelDraw MacDraw etc.) Dr. Tan CK 42
- 43. Vector Graphics • Advantageous: • Object orientation: objects in a g p graphic can be manipulated p separately • Good for line art and charts • Disadvantageous: i d • The larger the graphic, the longer it g g p , g takes to render the image Dr. Tan CK 43
- 44. Bit Maps • Itis stored as a set of bits in computer memory that define the h d fi h color and intensity of each pixel y p in an image • Created by digitizing images (photo, art work) or using PAINT programs (PC P i b h Paintbrush, PaintShop Pro, etc.) p ) • Also called raster or pixel maps Dr. Tan CK 44
- 45. Bit Maps • Advantageous: • C di l faster than vector Can display f t th t graphics • Good for reproducing images with complex variations in color, shading and detail • Disadvantageous: • Require more disk space • Fi d resolution can lead to Fixed l ti l dt scalability problems Dr. Tan CK 45
- 46. Image Resolution (IR) •Size of the digitized image expressed in horizontal and vertical pixels • When IR and SR are identical, the image fills the screen i fill th • A 320 x 240 pixel image on a 640 x 480 pixel display will be one half the length and height of the screen and g g fill one quarter of the screen area • When IR > SR, only a portion of the SR image can be displayed (required scroll bars) Dr. Tan CK 46
- 47. Image Depth • Imagedepth refers to the maximal number of colors used in bitmap p • Each pixel can have 1 or more bits of color information attached to it Bits Colors Uses 1 2 Text, line drawing 4 16 Simple drawings, graphics 8 256 Natural images 24 16.7M Photographic realism g p Dr. Tan CK 47
- 48. Color Models • RGB each component of colors; red, red green and blue is stored. For stored example: in 24 bit color, there will be 8 bits of info for each of the 3 colors bit f i f f h f th l • HSL color info is divided into components of hue, saturation and luminosity (intensity) • CMYK components of cyan, magenta, yellow and black are stored. It is usually used for publishing Dr. Tan CK 48
- 49. Image File Size •Size (in bytes) = (Height x Width x Color Depth) / 8 • Sample file size for different images size and color depths: • Monocrome: (640 x 480 x 1 bit)/8 ( ) = 38 KB • 256 colors: (640 x 480 x 8 bits)/8 = 307 KB • 16M colors: (640 x 480 x 24 l bits)/8 = 922 KB Dr. Tan CK 49
- 50. Images : Issues •High quality images • Big file size • High resolutions • I Image requirement will affect i ill ff hardware and software selections including h i i l di authoring and graphic d hi software, video graphics adapter, disk space and data transfer rate Dr. Tan CK 50
- 51. Transfer Rate • Thetable below shows sample of transfer times for a hard disk with a 2 MB transfer rate and a CD-ROM drive (2X) with a 300 KB transfer rate Image Size I Si HDD CD-ROM CD ROM 307 K 0.2 0 2 sec 1.0 1 0 sec 922 K 0.5 sec 3.1 sec 2359 K 1.2 sec 7.9 sec Dr. Tan CK 51
- 52. Techniques • Techniques forreducing image size: •R d Reduce size of height and/or width i f h i h d/ id h of image • Reduce the number of colors (ex: image depth) g p ) • Image data compression Dr. Tan CK 52
- 53. Image Compression • Datacompression reduces file size by eliminating redundancy • Compression involves two parts : compression and decompression called codecs • Two types of data compression: • Lossless output is exactly the same compression (used for programs and data) (done by PKZIP, stacker) Dr. Tan CK 53
- 54. Image Compression • Secondtype of data compression: • Lossy a set of data will undergo a loss of accuracy after y compression. Typically used on image or graphics, animation, g g p , , audio and video • Eliminates info that is difficult for our eyes to detect (Ex: eye is less sensitive to change in color than it is to change in intensity Dr. Tan CK 54
- 55. Image Formats • Bitmap(.bmp) • Internal format used by Windows • Device Independent Bitmap (.dib) • S d d windows bitmap Standard i d bi • Encapsulated PostScript Format p p (.eps) • Used to exchange images between programs and platform • Graphics Interchange Format (.gif) ( gif) • Used to transmit and exchange images betweenCKplatforms Dr. Tan 55
- 56. Image Formats • JointPhotographic Expert Group ( jpg jp g) (.jpg/.jpeg) • Offers the greatest compression (10:1 without visible loss) • Targa (.tga) • Used in high end image capture (35% compression) • Tagged Image File Format (.tif) • Zsoft PCX (.pcx) ( pcx) • Used to exchange images bewteen programs Dr. Tan CK 56