Web Authoring with Dreamweaver Presentation.pdf · Character Coding System Alphanumeric, symbols...

Computer Literacy Multimedia Presentation

__________________________________________________________________________________________

of 18

Multimedia Presentation

Contents

1. Multimedia Elements (Page 1)

2. File Formats (Page 5)

3. Multimedia Production (Page 8)

4. Presentation Software (Page 12)

Multimedia Elements

There are 5 major types of multimedia elements.

1. Text

2. Graphics

3. Audio

4. Video

5. Animation

Text

Character is the basic storage unit of text. Different kinds of characters are represented by

different coding systems.

Character Coding System

Alphanumeric, symbols American Standard Code for Information Interchange (ASCII)

Traditional Chinese Big5 code

Simplified Chinese Guo Biao (GB) code

All existing languages Unicode

Activity 1

Find the character coding system used in the web page of our school.

___________________________


__________________________________________________________________________________________

of 18

Graphics

There are two graphics systems.

1. Bitmap Graphics

2. Vector Graphics

Bitmap Graphics

Pixel is the basic storage unit of bitmap graphics. Colour depth is the number of bits used to

represent the colours in a pixel.

One bit can represent two different values. Thus, a colour depth of 8 bits can represent 28

colours.

For example, the file size of a one million pixels uncompressed bitmap graphics with 24-bit

colour depth

= 1,000,000 x 24 bits

= 3,000,000 bytes (1 byte = 8 bits)

= 2.86 MB (1 K = 1024; 1 M = 1024 K)


__________________________________________________________________________________________

of 18

Vector Graphics

Vector graphics are composed of a number of objects such as points, lines, curves and shapes

or polygons. All of them are based on mathematical expressions.

Activity 2

Visit http://www.w3schools.com/svg/ and click the ‘Try it yourself’ button. Hence, try to draw

one larger red coloured circle.

Study the expressions of polygon and line. Produce the

following vector graphics.

Comparison table of bitmap and vector graphics.

Bitmap Graphics Vector Graphics

Basic Element Pixel Object

Resolution Larger resolution (more pixels)

more details and larger file size.

Independent of resolution.

Colour Depth 1-bit / 8-bit / 24-bit Independent of colour depth.

File Size Dependent on resolution and

colour depth.

Dependent on the number and

complexity of the objects.

Usually, the file size is smaller.

Scaled Image Loss of clarity. Without degrading quality.

Editing The principle of editing the image

is to change the colour of relevant

pixels.

Each object can be modified

independently.

Applications Photos, scanned images, drawings Design works

Compatibility Can be supported by most

software.

Limited support by a few software.


__________________________________________________________________________________________

of 18

Audio

Digitization is a process of converting the original analogue audio into the digital form.

A higher sampling rate (unit: Hz) can capture more data samples from the source.

(1000 Hz means 1000 samples are captured in one second.)

A larger sample size (unit: bit) can represent the data sample more accurately.

Characteristics of different types of audio.

Audio Type Sample Size Sampling Rate (Hz)

Voice over telephone 8-bit 11,025

FM broadcast 16-bit 22,050

CD 16-bit 44,100

DVD 24-bit 96,000

Stereo audio contains two channels, known as the left sound track and right

sound track. Mono audio contains only one sound track. To play back the stereo

audio, we need a pair of speakers.

For example, the file size of a 5 minutes CD song

= 2 x 44,100 x (5 x 60) x 16 bit (2 channels; 5 x 60 seconds)

= 50.5 MB


__________________________________________________________________________________________

of 18

Video

Video is a sequence of full-motion images together with sound tracks.

Some of the factors affecting the size of a video files are listed below.

Frame Size Number of pixels displayed on each frame.

DVD: 720 x 576 pixels.

HDTV: 1920 x 1080 (the high definition TV broadcast in HK)

UHDTV: 3840 x 2160 (also known as 4K resolution)

Frame Rate Number of frames played in one second. Unit: frame per second (fps).

Usually, it is 25fps or above.

Colour Depth Usually, it is 24-bit

Duration Play time of the video clip

Compression A video contains large number of frames such that the file size can be

very large. A suitable compression method is usually taken to reduce the

file size. Before the video can be played back, it should be decompressed.

Animation

Animation uses the illusion of seeing motion by displaying a

sequence of static images quickly.

File Formats

Text

File Format Description

TXT Store plaintext only

DOC

DOCX

Default file format for Microsoft Word

Support lots of formatting features

Large file size

PDF Open with Adobe Reader

Cross platform

Layout can be preserved

Not easy to modify the content


__________________________________________________________________________________________

of 18

Graphics

File Format Compression Colour depth Other characteristics

BMP Nil 24 bit Native format for Windows

Very large file size

JPEG (JPG) Lossy 24 bit Very popular (digital cameras, web pages)

GIF Lossless 8 bit Support transparency and animation

PNG Lossless 24 bit Support transparency

Number of colours can be represented = 2 colour depth

Audio


WAV Native format for Windows

Uncompressed very large file size

MP3 Compressed and good quality (file size is about 10% of WAV)

MIDI Stores the music of musical instruments only

Very small file size

WMA Compressed format developed by Microsoft

Video


AVI Native format for Windows

Uncompressed AVI very large file size

MPEG Compressed format

MPEG-1: used in VCD

MPEG-2: used in DVD

MPEG-4: used on the web

WMV Compressed format developed by Microsoft

Animation


GIF Stores the data of all frames

Cannot support sound and interactivity

SWF Store the data of keyframes and tweening options

Support sound and interactivity


__________________________________________________________________________________________

of 18

Activity 3

The followings are some popular multimedia file formats. Use them to answer the following

questions. You may use each file format more than one time.

AVI MP3 GIF SWF WAV BMP MIDI JPEG

DOC MPEG TXT PDF

(a) Write down two animation file formats

(b) State a video file format that no compression is applied.

(c) State the file format of parent letters posted on our school web site.

(d) State the file format of a photo taken with a digital camera.

(e) What is the file format used in DVD?

(f) State one audio file format that no human voice can be stored.

(g) State a file format that is commonly used in a word processing software.


__________________________________________________________________________________________

of 18

Multimedia Production

Text

Besides typing text with a keyboard, there are other ways to input text.

Handwriting Recognition

Speech Input

Optical Character Recognition (OCR)


__________________________________________________________________________________________

of 18

Graphics

Means to prepare graphics.

1. Create with an image editing software

2. Scan the printed materials

3. Captured with a digital camera

4. Download from the Web

Audio

Two software are introduced.

1. Audacity – record and edit audio

2. Anvil Studio – compose a song

Audacity

Audacity is a freeware and it can be downloaded from http://audacity.sourceforge.net/.

Before starting recording, please check the available recording devices.

Right click the sound icon on the task bar and

choose ‘Recording devices’.

Stereo Mix is very useful to record audio from other

programs. Download the necessary driver if it is

missing.


__________________________________________________________________________________________

of 18

Activity 4

1. Choose either the ‘Microphone’ or ‘Stereo Mix’ as the recording device.

2. Press the ‘Record’ button to start recording and press the ‘Stop’ button when finish.

3. Highlight any portion of the recording and use the ‘Cut’, ‘Copy’ and ‘Paste’ commands

to edit the recording.

4. Press the ‘Play’ button to hear the result.

5. Highlight a portion of the recording. Click Effect Change Pitch. Change the pitch and

click the ‘Preview’ button.

6. Try other effects such as ‘Amplify’ and ‘Change Speed’.

7. Export the audio as WAV or MP3 format.

Anvil Studio

Anvil Studio is a freeware and it can be downloaded from http://www.anvilstudio.com/.

A song in MIDI format can be composed with a MIDI keyboard.

Activity 5

1. Click the Edit track button to start.


__________________________________________________________________________________________

of 18

2. Select the musical symbol and click the MIDI keyboard to compose a song.

3. Use the keyboard (left, right, Backspace and Delete keys) to edit the song.

4. Click the Play button to play the song.

5. Try to clone a new track and choose an appropriate instrument. Listen to the song again.

6. Click File Export Midi-Format 0 file and save the song in MIDI format.

Video

Movie Maker is a built-in application in Windows to edit video.

iMovie is an all-in-one app for i-Devices. It covers useful video capturing, editing and

production features.

Activity 5

See the videos in http://www.plk83.edu.hk/cy/multimedia/ and try to use iMovie to create a

video.

Animation

Open http://gifmaker.me/ with Google Chrome. Upload a sequence of similar images and

create the GIF animation.


__________________________________________________________________________________________

of 18

Presentation Software

Microsoft PowerPoint is a common presentation software to display information in a slide

show format. Multimedia elements can be included in the slides.

Adding new slides

Click ‘New Side’ and select a suitable layout.

Drag the slide thumbnail to change the position of a slide.


__________________________________________________________________________________________

of 18

Slide Layout

Click ‘Layout’ and modify the slide layout.

Themes and Background

Select a theme under the ‘Design’ menu.

Click ‘Format Background’ to change the background colour or picture.

Start the slide show

Click the ‘Slide Show’ button at the bottom.

Try to use ‘Set Up Slide Show’, ‘Hide Slide’ and ‘Rehearse Timings’ under the ‘SLIDE

SHOW’ menu.


__________________________________________________________________________________________

of 18

Insert Text

Click ‘Text Box’ or ‘WordArt’ under the ‘INSERT’.

Insert Graphics

Click ‘Pictures’ under the ‘INSERT’ menu.

(Or simply use the Ctrl+C and Ctrl+V method.)

Insert Audio and Video

Click ‘Audio’ or ‘Video’ under the ‘INSERT’ menu.

Insert Animation

The insertion of GIF animation is the same as inserting graphics.

The insertion of Flash animation is more complicated. Please Google search with the following

keywords.

how to insert flash into powerpoint 2013

Activity 6

Download various multimedia files (graphics, audio, video and animation) from

http://www.plk83.edu.hk/cy/multimedia/ and insert them to a PowerPoint file.


__________________________________________________________________________________________

of 18

Slide Master

Click ‘Slide Master’ under the ‘View’ menu.

Select a slide master layout on the L.H.S.

Click to edit the styles.

You may add some multimedia elements.

Click ‘Close Master View’ when finished. The changes will affect all the corresponding

slides.

Header and Footer

Click ‘Header & Footer’ under the ‘INSERT’ menu.

The positions of different header & footer elements can be modified in the slide master.


__________________________________________________________________________________________

of 18

Transitions

Click the ‘TRANSITIONS’ menu.

Select a suitable transition and timing settings.

Animations

Click the ‘ANIMATIONS’ menu.

Select an object on the slide.

Select one animation for the current object.

Click ‘Add Animation’ if multiple animations are applied to one object.

Set the appropriate timings for various animations

Open the ‘Animation Pane’ to reorder the animations.

Hyperlink


Click ‘Links’ under the ‘INSERT’ menu and choose ‘Hyperlink’.

Enter the address.


__________________________________________________________________________________________

of 18

Action


Click ‘Links’ under the ‘INSERT’ menu and choose ‘Action’.

Activity 7

Create a presentation to display three simple questions on three slides. Users can click a button

to see the answer of each question.

(Note: Set the ‘Show Type’ to ‘Browsed at a kiosk’ in ‘Set Up Slide Show’ under the ‘SLIDE

SHOW’ menu.)

Export Presentation

Click the ‘FILE’ menu.

Click ‘Export’ and then ‘Package Presentation for CD’.

Hence, users can conduct the presentation without Microsoft PowerPoint.


__________________________________________________________________________________________

of 18

Assignment

Title

My Favourite XXX

Task

Replace XXX in the title with any suitable word(s). Design a multimedia presentation to

describe your favourite item.

Requirements

Submit a multimedia presentation with the following elements.

1. Involves various multimedia elements such as text, graphics, audio, video and animation.

2. Bonus marks will be given if the multimedia elements are self-created or edited.

3. The presentation should have the following features.

a. Animation effect

b. Transition effect

c. Table

d. Chart

e. Slide number

f. Hyperlink

g. Action

Web Authoring with Dreamweaver Presentation.pdf · Character Coding System Alphanumeric, symbols...

Documents

Transcript of Web Authoring with Dreamweaver Presentation.pdf · Character Coding System Alphanumeric, symbols...