Topic: Multimedia Essentials (Flash Animation + Photoshop Design + Video Editing)
*Resources and notes used in the lesson will be posted on the teacher’s homepage / unit website so that students who are absent from the lesson can complete the lesson at home.


Objective
Topic
Resources
Remarks

Upon completing the ME unit, students are to apply the knowledge they have obtained thus far and put it to real use such as for the school project competition. From beginning to end, students will learn by doing their own and teacher’s directed Flash / Photoshop / Video based assignments / projects. All the submissions will be assessed for ACEs (Type 2) and Project Marks (Type 3).

The final project will be an integrated project that demonstrates any two or more combinations of the multimedia skills taught. For example, it must comprise two or more of the self-created Graphic, Animation and / or Video. An example for the final project is that student may create a personal portfolio website using Flash and in it contains some Photoshop’s edited images such as a designed logo or touched-up photos; or a Video introducing HCI and in it contains some Photoshop's edited images such as a touched-up photo of the school clock tower.
In this ME unit, you will learn basic animation using Flash, basic digital imaging and designing using Photoshop and basic video editing using Windows Movie Maker. 2 very common applications of Flash are to create animations and dynamic websites. Photoshop will come in handy for graphic design, image manipulation & enhancement. Windows Movie Maker can capture and edit your digital media very easily. The three softwares leverage on one another strength to produce strong visuals in design and motion graphics.

Introduction to Photoshop covers topics including tools, layers, layer mask, feather, retouching, color theory, and more.

Introduction to Flash covers topics including tools, layers, symbols, motion tween shape tween, mask, motion guide, movie clip, buttons, basic actionscript 2.0, and more.

Introduction to Video Making (with Windows Movie Maker) covers topics including video capturing, importing, editing and exporting, and more.

Computer lab

Software:
Flash, Photoshop CS 4, Windows Movie Maker

SMB account

Website:
http://isme.wikispaces.com
Assessment (100%):
· Term Test (30%)
· Projects (70%): Photoshop Photo Edit (Pair), Flash Animation Drawing (Pair), Forum , Final Project: Interactive Website



Wk1
You should be able to know:
1. Tools, Menu bar, Tool options bar, Toolbox, Info bar, Image window, Palette well, Palettes, Selection tools: Marquee, Lasso, Magic Wand
2. Feathering
3. Layer Masks

Lab 1 – Photoshop Intro 1
• Workspace
• Layers
• Feather
• Layer Mask



Computer lab

Handout#1 Assignment #1 (Photoshop Fun)

Websites:
http://tv.adobe.com/#vi+f1584v1027

http://www.photoshopsupport.com/tutorials/cs3-photoshop-10.html

http://www.adobe.com/designcenter/video_workshop/html/vid0011.html

Graphic Design lesson using Photoshop

Assignment #1: Photoshop Photo Fun Edit (Pair, 10%)
Wk2
You should be able to know:
4. Layer Styles
5. Retouching tools: Quick selection, healing brush, crone stamp, pattern stamp, patch
Lab 2 – Photoshop Intro 2
• Layer Style
• Retouching and Repairing



Computer lab

Handout#1 Assignment #1 (Photoshop Fun)

Websites:
http://tv.adobe.com/#vi+f1584v1027

http://www.photoshopsupport.com/tutorials/cs3-photoshop-10.html

http://www.adobe.com/designcenter/video_workshop/html/vid0011.html

Submission of Assignment #1
Wk3

Skill 1

You should be able to:
  1. use the tools effectively
  2. Convert an object / drawing to Symbol (F8)
  3. know how to insert a Keyframe (F6)
  4. know how to insert a Frame (F5)
  5. know how to Create a Motion Tween to create an animation from point A to point B
  6. know how to publish the file to swf format (Ctrl-Enter)
  7. view whole stage (Ctrl-2)
  8. zoom in/out (Ctrl – and Ctrl +)
  9. open a Library panel (Ctrl-L)

Lab 3 – Flash Intro 1
• Workspace
• Convert to Symbol
• Keyframe / Frame
• Layers
• Library
• Motion Tween
• Publish
• Shortcuts
Computer lab

Handout #2 Assignment #2
(Flash Animation Drawing)

Websites:
http://www.hci.sg/~kent/flmx/index.htm

http://www.w3schools.com/flash/flash_intro.asp


Basic Animation lesson using Flash

Assignment #2: Flash Animation Drawing (Pair, 10%)

Wk4

Skill 2

You should be able to:
  1. know how to Break Apart (Ctrl-B) a symbol
  2. know how to create a Shape Tween, Motion Tween
    1. go to Properties panel, Select Shape or Motion
  3. know how to break apart characters and Distribute to Layers
  4. know how to change Movie Dimensions (ctrl–J)
  5. know how to insert your Flash movie into your html page using the embed code (optional)

Skill 3

You should be able to:
  1. create a Mask
    1. do a spotlight effect
Lab 4 – Flash Intro 2
• Shape Tween
• Break Apart
• Distribute To Layers
• Mask


Computer lab

Handout #2 Assignment #2

Websites:
http://www.hci.sg/~kent/flmx/index.htm

http://www.w3schools.com/flash/flash_intro.asp

Submission of Assignment #2
Wk5

Skill 4

You should be able to:
  1. add a Motion Guide to your animation. Use “Orient to path”
  2. create a Movie Clip

Forum Discussions on Flash Purposes, Animation Types, Photoshop Purposes, Multimedia World

Lab 5 – Flash Intro 3
• Motion Guide
• Movie Clip
• Term Test Study Revision
Computer lab

Websites:
http://www.hci.sg/~kent/flmx/index.htm

http://www.w3schools.com/flash/flash_intro.asp

Forum Discussions

Term Test Study Guide

Assignment #3: Forum Discussions (10%)
Wk6
Class Test

Class Test

Classroom


Completing and closing all forum participations

Wk7

Skill 5

You should be able to:
1. create a Button
a. understand the 4 different stages (UP, OVER, DOWN, HIT)
b. add basic ActionScript for button (for ActionScript 2.0)
· play();
· stop();
· nextFrame();
· prevFrame();
· gotoAndPlay();
· gotoAndStop();
· stopAllSounds();
· on (release) {}
2. insert a Scene
3. hide and change your Mouse Cursor using Mouse.hide();

Final Project: Interactive Website

Lab 7 – Flash Intro 4
• Button
• ActionScript 2.0 / 3.0
• Scene
• Mouse Hide
• Final Project: Interactive Website


Computer lab

Websites:
http://www.hci.sg/~kent/flmx/index.htm

http://www.w3schools.com/flash/flash_intro.asp

Final Project: Interactive Website
Project: Final Project: Interactive Website (40%)

Wk8
Students will learn:
• to design a with links to another flash scene and external webpage
• incorporating edited image from Photoshop into Flash

Lab 8 – Final Project Consultation

Computer lab

Final Project: Interactive Website


Final Project Submission (Open)

Wk9
Students will learn:
• to design a Flash Interactive environment with links to another flash scene and external webpage
• incorporating edited image from Photoshop into Flash

Lab 8 – Final Project Consultation

Computer lab

Final Project: Interactive Website


Final Project Submission (Close at end of week)










Assessment of InfoComm Studies – Web & New Media

1. There will be no End Of Year examination, assessment will be based on the following:

Assessment Methods
Weighting
Remarks

Term Test


30%

Written test

Assignments + Projects
(To replace end of year examination)

Examples:
· Photoshop Photo Edit (Pair),
· Flash Animation Drawing (Pair),
· Forum ,
· Final Project: Interactive Website


70%
Marks (base 100) will be awarded for each of Term 1 to Term 3. The project for each term must be completed at the end of the term. Marks should be ready by the 2nd week of the next following term and will be posted to the students for viewing.


2. No ace points.

3. Mark allocation for the project work (40 – to be converted to 100 marks).


Criteria
Marks
  1. Flash skills incorporating tweens, masks, movie clips
10
  1. Flash skills incorporating ActionScripts i.e. getURL(), Mouse.hide()
10
  1. Photoshop skills on photo retouching and repairing, special effects
5
  1. Others i.e. incorporating sound and video, for academic purpose, meaningful contents
5
  1. Aesthetics
10
Total
40