ICT

Elective C Multimedia production and Web site development

Ch.2 Text
Formatting features Attributes Font and Typeface Font size Font style Text alignment o Left aligned, right aligned, Centre aligned, justified Line spacing, character spacing Text file format txt, doc, odt, pdf, html, rtf Text production OCR with scanner Changjei, Quick, Phonetic, Q9 with keyboard Voice recognition software with microphone Handwriting recognition software with Touch sensitive plate

Ch.3 Graphics
Bits and Bytes 1 byte = 8 bits Unit 1 Terabyte (TB) 1 Gigabyte (GB) 1 Megabyte (MB) 1 Kilobyte (KB) 1 Byte (B) Number of bytes 240 230 220 210 1 Denary equivalent value (approximation) 1012 109 106 103 100

Bitmaps and Vector graphics Nature Bitmaps Produce images with fixed grids of pixels. Generally larger High Difficult Higher Vector graphics Produce images using mathematical formulae with position information. Much smaller Nil (resolution independent) Easy Low for complex images

Memory usage/file size Loss of image quality when magnified Ease of editing component objects Display speed

Type of image using the format Common application

True colour photographs, complex diagrams Posting on web pages, desktop publishing

Simple shapes, graphs and charts Architectural drawings, 3-D animations, logos, badges and banner designs which frequent resizing is required

Bitmap Graphics Attributes Pixel the basic logical unit. Graphics resolution the dimensions (i.e. length and width). Aspect ratio the ratio of width to the height of the image. Colour depth the number of bits used to represent the colour of each pixel. Graphics file size (uncompressed) = Image width x Image height x Colour depth (in byte) Compression Techniques Lossless compression an algorithm is applied onto the image to reduce the target file size, CANT control the compression ratio. Lossy compression it eliminates unnecessary bits of information, CAN control the compression ratio. Higher compression ratio poor quality.

Bitmap file format bmp, jpeg, gif, png, tiff Maximum colour depth Compression method Compression ratio BMP 24-bit Uncompressed Nil JPEG 24-bit Lossy Generally high (depend on image quality and complexity) GIF 8-bit Lossless Low PNG 24-bit Lossless

TIFF 24-bit CCITT, LZW, JPEG Depend on compression method used

Slightly higher than GIF

Support multiple images in one file Support transparent Backgrounds Commonly used for

Black and white, grey- scale, true colour graphics

Final image output, web graphics, digital photo album

Web page graphics and animation

True colour graphics

Scan and fax

Graphical production Capturing Graphics Digital Camera, scanner, graphics pad, screen capture Graphics Editing and Processing Brightness, contrast, sharpness, blur Resizing and rotating Apply graphics filter

Ch. 4 Audio

Animation attributes Sampling Rate (Hz) the number of samples captured in the sound wave in one-second. Sample Size (bit) the number of bits used to represent the information of a sampled datum. Audio Channel mono, stereo Audio file size (uncompressed) = Sampling rate x Sample size x number of channels x Time Bit rate the amount of data passing through a particular point in an audio stream in one second. n Audio file size = Bit rate x Length of audio Audio File Formats

Ch. 5 Video

Video attributes

Video standard, e.g. PAL, NTSC, SECAM Frame Frame size Colour depth Frame rate Video file size (uncompressed) Frame size x Colour depth (in byte) x Frame rate x Duration Codec, e.g. MPEG-1 (VCD), MPEG-2 (DVD), MPEG-4 (blu-ray), rv, wmv, mov, divx Bit rate Video file size (compressed) = Bit rate (bps) x Length of video (second) Video file format avi, mpeg, rv, rm, wmv, asf, mov, flv Video production Video Capturing Video camera, pda / mobile phone, digital camera / web cam, video capture card Video Editing and Processing Adding transition effects, titles and subtitles Applying video filter

Ch. 6 Animation

Animation attributes Frame Frame size Colour depth Frame rate Animation production Animated Gif, stop motion Flash movie production Frame the basic components of a movie Keyframe frames which indicate a point of change in the frame contents along the Timeline. Frame-by-frame animation creating the individual animation frames one by one. Tweened animation the user only needs to create the frames in between. Motion tween, shape tween, path animation Create button add interactivity to an animation. Using ActionScripts set of commands used in Flash movies. Adding sound

 Frame rate Colour depth Image size Keyframes Sound Effects File size

Flash movies High (up to 30 fps) 24-bit Scalable Motion / Shape tweening Path animation Integrated Depends on l # of objects l Complexity of the objects Vector graphics Much more versatile

Animated GIFs Low (<10 fps) 8-bit Fixed NA NA Depends on l # of still images l Size and colour depth of images Bitmaps Rather simple

Nature of animation Magnify without loss of quality Multimedia and interactivity support Streaming support Browser plug-in required Editing software

Ch. 8-9 Design Factors of Web Pages

Web Site a collection of related web pages about the same theme. Stages of Web Authoring Planning and designing the content purpose and the target audience need to be decided so that the related idea and information can be developed and the web site can focus on a topic. Producing various multimedia elements can be assembled using web authoring software. Testing the web pages are tested using different browsers before being published. All links, images, animation, videos, programs and scripts used in every web page should be tested. Publishing and maintenance the web site content should be tested again and updated from time to time after being published. Technical Design Factors Site map can help a user navigate through a web site that has more than one page by showing the user a diagram of the entire sites contents. Layout n screen resolution n frame u Advantages: It is easier to navigate across web pages. When the content frame is scrolled, the navigation menu and the header do not move but stay visible all the time. u Disadvantages: The workspace shown on a browser window becomes smaller.

Not printer friendly. More difficult to be indexed by search engines. Color scheme Grouping information n Tables n Lists Printer Friendly n Problem if not use printer friendly u The width of the web page exceeds the printed page margin. u Not related information also printed. Use of images n Background image vs Text readability n Suitable resolution and image file format n Feedback u Public - weblog, newsgroup, forum, guest book u Private email, instant message Hardware constraints and platform compatibility n CPU processing power n Slow Internet connection n Different web browsers n Screen resolution n Language compatibility

Web Accessibility refers to the ease of access to the Web by everyone regardless of their disability. Visually impaired (Blindness) Braille display, text version web pages to facilitate speech synthesizer to read text on the screen. Low vision () / Color Blindness () design web pages with absolute larger font sizes, images with good contrast. Deafness include captions or transcripts for audio content on the web and use clear and simple language. Upper limb mobility problem more time given when filling out interactive forms on web sites as they may using pointing device such as a head-mouse, head pointer or mouth-stick. The materials can be found in elearning F4 ICT Resource Group Multimedia.