MANUEL V. GALLEGO FOUNDATION COLLEGES, INC.

Cabanatuan City, Philippines

(www.mvgfc.edu.ph)

COURSE INFORMATION:

Course Code/Catalogue No. ______________

Course Description: A condensed, hands-on workshop designed to provide the student with a beginning knowledge of
Macromedia Flash software for web site design. (F,Sp)
Credit Unit: 3
Contact Hours: 3
Pre-requisite: __________
Intended for: BSCS
Instructor/Professor: Joseph Reyes
E-mail Address /Contact No. [email protected]
VISION MISSION

MVGFC shall be among the leading educational institution in In the pursuit of its Vision, MVGFCI shall assure quality and
Nueva Ecija that is known for its accredited academic relevance in its curriculum, instruction, research, extension,
programs, high ratings in nationally recognized examinations and student services through continuous quality improvement.
and high employment rate of its graduates.
PROGRAM OUTCOMES (PO)/PERFORMANCE INDICATORS (PI)
On completion of the degree program, the student is expected to be able to do the following:
PROGRAM OUTCOMES PERFORMANCE INDICATORS
1. Analyze complex problems, and identify and define the Shows average up to advanced mastery in designing and
computing requirements needed to design an appropriate creating a dynamic website
solution.
2. Apply computing and other knowledge domains to Creating An Interactive Website
address real-world problems.
3. Design and develop computing solutions using a system- Mastery of Photoshop / Dreamweaver
level perspectives
4. Utilize modern computing tools Creation of “My own Website” with database

RELATIONSHIP BETWEEN CO AND PO

After completion of the course, the student should be able to:
CO Code COURSE OUTCOMES PO1 PO2 PO3 PO4 PO5
CO1 Creating Plain Webpage HTML I I I I
CO2 Creating own design for the web page. I I I P
Understanding the tools and functions for creating
image design and Website lay-outs.
CO3 Make your pages dynamic based upon user interaction, P P P P
interacting with HTML forms.
CO4 Principles and practices of database management and P P
database design using XAMMP local server.
 LEGEND: I – Introduce; P – Practice; D – Demonstrate

THE LEARNING PLAN

In order to achieve the outcomes of this course, the learners will go through this learning plan:

CO INTENDED LEARNING OUTCOMES TOPIC TEACHING/ LEARNING ASSESSMENT TIME

RESOURCES FRA
LEARNING TASKS/TOOLS
ME
ACTIVITIES
Knowledge Skills Attitudes
CO1 Define Web Create a Identifying Laying Out a Page Formative: Television/LCD Laboratory Pre-
Development webpage the with HTML5: projector for assessment: prelim
(Introductory
using notepad Importance Virtual Images inary
for HTML  Introduction activity) -
and illustration
Activity (Create
of a Website HTML an interface for
Enumerate to HTML
 Introduction student
most
of Necessary information)
commonly Reference
Software’s seatwork
reasons book
 Creating
Why we
Development
creating a
Environment Whiteboard
website
 Revising
Marker and
Basic HTML
online Quiz: (identifying
HTML5 Properties:
Research the correct HTML
 Supported tags)
Media Types
 like Audio,
Video and
Explain all the
Images
properties of a
plain HTML to  Scripting
a Dynamic Media
Website Elements
 Tags
 Creating
Style Sheet

CO2 Identifying the Create Adapt Photoshop/Dream Formative: Television/LCD The learners will Prelim
tools that is balance weaver: projector for going to present inary
Their own
needed to edit thinking Virtual Images their own system
website Photoshop:
the image and and correct Images type and illustration interface
design
design for the decision-  Getting And Color
(Photoshop)
website. making Started Combination
using Reference
Photoshop book
 Working
with Images
Draw a (GUI)
 Working Whiteboard
For student’s with Basic
Marker and
information Selections
System.  Layers, online
Painting Research
 Color
Correction
 Creating
Special
List down all
 the tools and Effects
functions in
Dreamweaver:
Photoshop/Dre
amweaver  Functions
 Tools
 Adjustments
for webpage
 Coding

CO3 Give examples Apply the Builds Object Oriented Formative: Television/LCD The learner will Midter
of various process of a strong PHP Basics: projector for practice making m
Scenario that website, foundation Virtual Images an Object
may encounter for PHP  Object and illustration Oriented Program
Situational
And masters Oriented PHP
for a logical processes, performing
the given role in the
errors
conditional And logical WWW Reference The learner will
codes. thinking.  Basic PHP
Analyzing book discuss issues in
Explain Syntax problems logical errors
 PHP Tags
Program skills
 PHP Whiteboard
to build
Functions *Laboratory
interactive Marker and
website.  PHP Activity
Operators online
Creating Research
Dynamic
Pages Flow
 Control Summative
Conditional assessment:
Processing
Quiz (Syntax for
 While loop PHP and
Conditional
Processing)

CO4 Explain all the Create their Practice Database Formative: Television/LCD The learners Finals
Importance of own database the Manageme projector for analyze and
database uses relational nt Virtual Images manually create a
and security. connection  XAMMP and illustration simple database
for Primary  Understandi
key ng For Seatwork
Variables Reference Summative
 Data types book/blogs assessment:
 Value Virtual
Designing Quiz:
 Relationship
Identification
 Connecting Whiteboard
(data types)
website to
Database Marker and
Student
online information
Research Database

MAJOR COURSE OUTPUTS (MCO)

As evidence of attaining the course outcomes, students are required to do and submit the following:
 MCO CODE REQUIRED OUTPUT PERFORMANCE CO SATISFIED DUE DATE
TARGET
MCO1 Student information Create a website that CO1/CO2 A week before the
website will display the preliminary
information of the examination
students.
MCO2 Online Shop With Developing a website CO3/CO4 A week before the final
Inventory System design that has an examination
impressive user
interface will result in a
much better conversion
rate, which leads to
better business and
revenue.

LABORATORY ACTIVITIES (For subjects with lab)

The following are the activities/exercises to be performed in the laboratory:
EXERCISE NO. TITLE DURATION
1 Creating a plane HTML Webpages(students information) 2 days
2 Create a Graphical User Interface Design 2 days
3 Interactive Store Management 3 days
4 Database for the Store 2days

ASSESSMENT TOOLS/RUBRICS
Students practical output will be graded using the criteria below:
 Web Development Rubric:
Student Name: _____________________________ Period: ________ Project Name: _____________________________
CATEGORY Exceed Standards At Standards Approaching Below Standard
Standards
Executions of codes All codes are executed All codes are Codes are executed All codes are not
in excellent executed in good in standards executed properly
(HTML)
and use Div class and use Div class and use Div class and not use Div class
properly and easy to properly can’t read the
read the program program easily
Web Page Design Floor plan Lay-outs The pages are eye- The pages appear The pages are
shows poor drafting catching and "busy" or "dull." Text unattractive. Text is
qualities including attractive. Text is may be difficult to difficult to read. The
proportion, and not easy to read. The read. The backgrounds backgrounds are
meet backgrounds are are somewhat distracting.
Paper diagram subtle and distracting
cleanliness appropriate.

Navigation / Links Links are created with Links are consistent The user may become The user may become
images and icons to and easy to find so confused when lost or links may be
enhance the text links. that the user can navigating between missing or not working.
easily navigate back pages. Some links may
and forth through not work
pages.
Graphics Photos, icons, and clipart Photos, icons, and Photos are blurry or There are no photos,
are used creatively and clipart are fuzzy; icons and clipart icons or clipart, or they
may follow a theme. appropriate, of high do not "fit" with the are inappropriate or of
quality, and topic. Too many low quality.
download fairly pictures make the
quickly. download time slow.
GRADING SYSTEM
Grades/performance of students will be evaluated as follows:

Detailed grading criteria will be provided for each deliverable. The following shows how each graded item counts
towards the overall grade for the course:

Written works/Outputs – 30% Attendance – 5% Performance/Practical Task – 25%

End-term Examination – 40%

Terms Percentage
Pre-Prelim 15%
Prelim 15%
Midterm 30%
Finals 40%

COURSE POLICIES AND STANDARDS

Academic Policies Policies on Punctuality/tardiness Class Format

 Academic Integrity: Violations of  Absences (Provide an early

academic integrity, including notification or send a formal excuse
dishonesty in assignments, letter at least 1 day before the
examinations, or other academic schedule or in case of emergency
performances are prohibited. You are and health cases that requires
not allowed to make copies of serious medications kindly provide a
another person’s work and submit it medical certification from your
as your own. All cases of academic attending physician)
dishonesty will be reported for  Grace Period of:
 appropriate sanctions in accordance 10 minutes for 1 hr class
with the guidelines for handling 15 minutes for 1 ½ and full 3 hrs class
students’ misconduct as spelt out in  3 lates = 1 Absent
the Students’ Handbook  2 consecutive lates = Oral reprimand
 Late! (You can enter the room but you
are not entitled to get the
 Code of Conduct in Lecture Rooms assessment)
and Laboratories: Students should
turn off their cell phones during
lectures. Students are prohibited
from engaging in other activities
(such as texting, watching videos,
etc.) during lectures. Food and drinks
are not permitted in the laboratories.

 If possible (EOP Zone)

REFERENCES
https://www.khanacademy.org/computing/computer-science/algorithms
https://www.smartdraw.com/flowchart/flowchart-symbols.htm
https://www.smartdraw.com/flowchart/
Prepared by: Reviewed by:

Mr. Joseph Y. Reyes Dr. Ruth G. Luciano

(Instructor/Professor) (Dean)
Recommending Approval: Approved:

Ms. Rosalyn B. Bilog, RN, MAN Dr. Corazon A. Quintana

(VPAA) (EVP/Chief Academic Officer)
Upon successful completion of this course, students should be able to:

A. Use Macromedia Flash software to:

1. Draw basic shapes
2. Use text
3. Work with layers
4. Import artwork
5. Use the Flash Library
6. Create simple animations
7. Use and modify sound
8. Add simple interactivity
B. Publish and export your Macromedia Flash Movies
Detailed Outline of Course Content and Sequencing
Lesson 1: Introduction to Macromedia Flash
Lesson 2: Creating Artwork and Adding Sound
Lesson 3: The Macromedia Flash 5 Interface
Lesson 4: Basic Drawing in Macromedia Flash 5
Lesson 5: More Drawing, Using Text, Working with Layers, and Importing Artwork
Lesson 6: Symbols, the Macromedia Flash Library, and the Movie Explorer
Lesson 7: Animation
Lesson 8: Using Sound
Lesson 9: Adding Interactivity
Lesson 10: Publishing and Exporting Your Macromedia Flash Movies

http://www.teacherclick.com/flash8/index.htm

teacherClick. Flash 8 Tutorial. Index

How to use this tutorial.

13. Movement Animations

1. Introduction 7. Working with Objects
14. Form Transformations
2. My first Flash Animation 8. Layers
15. Effects on Animations
3. Working Environment 9. Symbols
4. Drawing 10. Graphics 16. Generating and Publishing Movies
5. Working with Texts 11. Movie Clips 17. Introduction to ActionScript 2.
6. Sounds 12. Button 18. Examples of Use of the ActionScript 2.

Detailed Index
 Unit 1. Introduction Unit 10. Graphics

What's FLASH 8 What's graphics?

Why should we use FLASH 8 Graphics types
From FLASH MX 2004 to FLASH 8 Creating graphics and verifying its properties
Flash 8 Alternatives. Javascript Introducing bitmap
Flash 8 Alternatives. CSS Introducing a vectorial file
Flash 8 Alternatives. DHTML Exporting a Flash object as bitmap
The eternal deal. Exporting a Flash object as animation
Javascript, examples and uses. Graphics Types
Unit 2. My First Flash Animation
Unit 11. Movie Clips
First Steps
Making the Animation What's a Movie Clip
Verifying the Clip properties
Unit 3. Flash 8 Environment
Creating a new Clip
Importing and Exporting Movie Clips
Flash 8 Interface Other uses of the Movie Clips.
Menu Bar
Timeline Unit 12. Buttons
Layers
Work Area What's a Button
Views or Zooms Creating a Button
Panels Buttons Shapes
Zooms. Text Buttons. Active Zone Importance
Scenes. Including Clip in a Button
Frames. Types and uses Bitmaps and buttons
Unit 4. Drawing and Working with Color Actions in Buttons
Including a sound in a Button

Drawing in Flash 8 Unit 13. Movement Animations

Tool Bar. Basic Tools
Tools Bar. Advanced Tools Flash Animation
Tools Bar. Options Movement Interpolation (I)
Mixer Panel Movement Interpolation (II)
Fill Panel Texts Animation
Lines Animation
Interpolation by Movement Guide
 Unit 5. Texts Frame by Frame Animations
Unit 14. Shape Transformations

Starting Interpolations by Shape

Properties of the Texts Transformating Texts
Text Types Shape Advices
Static Text Unit 15. Effects on Animations
Dynamic Text
Input Text
Introduction
Writing texts
Effects on the Movement Interpolations
Effects on the Interpolated symbol
Brightness Effect
Unit 6. Sounds Tint Effect
Alpha Effect
Starting
Importing Sounds
Sound Properties Unit 16. Generating and Publishing Movies
Inserting a Sound
Publishing Sounds
Considerations about Movies Size
MP3 or WAV
Audio Formates. MP3 and WAV Preloading
Distributing as swf file in an independent player
Unit 7. Working with Objects Distributing for Web pages

The Objects. Initiation Unit 17. Introduction to ActionScript 2

Selecting
Placing Objects. Alignment Panel What's the ActionScript
Info Panel Actions Panel
Groups
Operators
Unit 8. Layers Actions
Objects
Layers. Let's understand them Properties
Working with Layers Initial concepts of Programming
Working with Layers. Advanced Options Unit 18. Examples of ActionScript 2 use
Reorganizing the Layers
Layer Types
Examples of use of the ActionScript code
Examples of ActionScript in Buttons
 Unit 9. Symbols Examples of ActionScript in Movie Clips
Examples of Sounds handling with AS
Examples of ActionScript in abstract objects. The object MATH
Creating of loader or preloader
What are the Symbols
How to create symbols
The Libraries
The Difference between Symbol and Instance
Modifying an Instance
Instance Properties Panel
Panel of Effects on Instances
Panel of Effects on Instances (II)

Video tutorials
2. My first Animation 10. Introducing a bitmap
3. Types of Views 10. Exporting Flash object as image
4. Eyedropper Tool 11. Creating an empty clip
4. Making a Gradient 11. Importing Symbols from other Libraries
5. Interaction Dinamic Texts-Input 12. Creating and Publishing a Button
6. Importing Sounds 12. Text Buttons. Active Zone
6. Inserting Sounds. 2 posibilities 12. Including a Clip in a Button
6. Controlling the sound sincronization 12. Actions in a button
7. Selecting Objects 13. Animation of Lines
7. Aligning Objects 13. Interpolation by Movement Guide
7. Working with the basic properties of the objects 14. Interpolation by Form
7. Groups 14. Text Transformating
8. Working with Layers 14. Applicating Form Advices
8. Working with Layers. Advanced Options 15. Automatic Rotation
8. Reorganizing the Layers 15. Right Rotation
9. Inserting a Symbol 15. Creating a complete animation with effects
9. Application of Alpha effect on a Instance 16. Publishing a movie for the web
17. Change object Properties using ActionScript

Exercises step by step

3. Creating Movement Guides 9. Creating Symbols
3. Changing Movies Properties 9. Modificating Instance
3. Accessing to the Panels 10. Exporting Bitmap
4. Creating an oval 12. Button in Relief
4. Applicating Color to an oval 13. Chaining Interpolations
4. Creating a Transparent color 13. Animate text by blocks
5. Changing type of Text 15. Accelerating Movement
8. Changing Objects in Layer 16. Publishing SWF

Proposed Exercises

11. Clips
3. Flash 8 Environment
12. Buttons
4. Drawing the Olympic Rings ant Planet Saturn
6. Sounds 14. Animation by Form
7. Objects 15. Effects on animations
9. Symbols

Evaluation Tests
1. Introduction 10. Graphics
2. My First Flash Animation 11. Clips
3. Flash 8 Environment 12. Buttons
4. Drawing 13. Movement Animations
5. Working with Texts 14. Animation by Form
6. Sounds 15. Effects on animations
7. Objects 16. Generating and Publishing Movies
8. Layers 17. ActionScript 2
9. Symbols 18. Examples of ActionScript 2 use

Course Description
 Adobe Flash CS4 can be a complex program to use and understand, even if you already have basic knowledge. It's very easy to get lost in the
interface and confused by the many features it offers. This course was designed to solve the mysteries of Adobe Flash CS4, no matter if you're a
beginner or more advanced user. Each lesson is extremely comprehensive, but written in easy-to-understand terms so that, by the time you
finish the course, you can use the Flash software as easily as you can tie your shoe.

The course starts out with an introduction to the software, followed by a tour of the interface. Once you know your way around the
numerous panels and menus, you'll start to learn the drawing modes and tools that allow you to create vector and raster images to
animate. Each lesson gives you plenty of instruction to learn, then plenty of time to practice. All students are encouraged to take their
time and become comfortable with each aspect of Flash that is taught before moving on to frame-by-frame animations and tweens.

By the time you finish this course, you'll easily be able to create:

 Animations
 Slideshows
 Banner ads
 Movies
 Graphics presentations
 And all sorts of other animation projects using Adobe Flash CS4

It's a fact that once you learn everything you need to know about vector and raster images, as well as movie clips and graphics,
creating animations becomes a breeze. You'll spend the rest of the course learning to bring graphics and other images to life, and
delving into ActionScript to learn to create even more complex Flash presentations. If you've spent time trying to learn more about
Flash without much luck, then this course is exactly the solution that you need.

Course Requirements
This course will not require you to have previous experience in any particular area but you should have the following:

- Adobe Flash CS4 (recommended) *

 - a high school reading level.

No books will be required.

*students interested can download the free trial version of Adobe Flash for this course.

Course Topics

Lesson 1: Flash Basics

 Creating a Flash Document

 Reviewing the Interface

 Managing the Workspace

Lesson 2: Getting Started

 Creating Shapes

 Using the Primitive Tools

 Drawing with Pen, Pencil and Line Tools

 Editing Shapes

 Using the Selection Tools

 Managing Color and Gradients

 Importing Files

Lesson 3: Working with Graphics

 Creating Rectangles

 Using a Gradient Fill

 Making Selections

 Drawing Ovals

 Creating a Simple Animation

 Working with Lines

 Manipulating Objects

 Masking Objects
 Testing a Movie

Lesson 4: Creating and Editing Symbols

 Importing Illustrator Files

 About Symbols

 Converting Objects to Symbols

 Importing Bitmap Images

 Adding Bitmaps to a Movie Clip Symbol

 Working with Buttons

 Adding Transparency

Lesson 5: CREATING & MANAGING CONTENT

 Touring the Flash Interface

 New Document Settings & Navigation

 Drawing & Selecting Simple Vector Shapes

 Drawing Curves with the Pen & Pencil Tools

 Exploring Other Drawing Tools

 Interaction between Shapes

 Grouping Objects

 Working in Object Drawing Mode

Lesson 6: MANAGING WEBSITE CONTENT

 Working with Layers

 Using Bitmaps

 Adding Text

 Use the Regular & Primitive Shape Tools to Build a Graphic

 Creating & Adjusting a Symbol

 Transforming Objects with the Free Transform Tool

 Exploring Color Types & Gradients

Lesson 7: THE TIMELINE

 Timeline Basics
 Create a Span of Frames & Control the Playhead

 Creating Keyframes

 Insert Blank Keyframes & Clear Keyframes

 Frame-by-Frame Animation & Onion Skin

Lesson 8: MOTION PRESETS

 Getting Started with Motion Presets

 Modifying a Motion Tween

 Stretching Tween Spans

 Save Custom Presets & Create Layer Folders

 Moving Tween Spans

 Setting Static Frames

 Building a Test Movie

Lesson 9: CREATING A MOTION TWEEN

 Adding a Motion Tween

 Setting Property Keyframes for Scale & Rotation

 Creating a Motion Tween from a Shape

 Easing Keyframes

 Creating a Fade-in by Adjusting the Alpha

 Making a Motion Preset

Lesson 10: ANIMATION TECHNIQUES

 Importing Slideshow Content

 Working in a Movie Clip Timeline

 Animating the First Image in the Slideshow

 Non-linear Animation

 Swapping Objects

 Using the Distribute to Layers Command

 Adjust Timeline View Options & Animation Timing

Lesson 11: ACTIONSCRIPT & BEHAVIORS

 Introducing ActionScript

 Adding a Stop Action

 Creating Buttons & Setting Button States

 Creating Interactive Text Buttons

 Adding Site Content

 Setting up for ActionScript 2

 Adding Behaviors with ActionScript 2

 Writing ActionScript 3

Lesson 12: USING SOUND & VIDEO

 Adding a Sound File to the Timeline

 Adding Sound to a Button

 Encoding Video for Import into Flash

 Set Import Options & Choose a Player Skin

 The FLVPlayback Component & Component Inspector

 Flash Video for ActionScript 2 & Older Players

Lesson 13: PUBLISHING YOUR SITE

 Overview of Flash Publish Settings

 Compression in Bitmaps & Sounds

 Other Flash Publish Settings

 HTML Settings
 Publishing Your Flash Movie

 Dreamweaver(R) Integration

 Uploading Your Site to a Server via FTP

 Credits

Course Materials
All course material will be provided in the lessons and netlinks. There are no required materials to purchase before taking the class.
In order to fully benefit from this course, though, you do need access toAdobe Flash CS4.

Grading Policy
Each lesson will include a lesson review exam along with an assignment. Students will successfully complete this course by
mastering all learning outcomes with 70% or higher overall grade.

Learning Outcomes
By successfully completing this course, students will be able to:

 Understand what Flash is and what you can do with it.

 Create and Manage content.

 Manage Website Content

 Create and Edit Symbols.

 Use the Timeline.

 Use Motion Presets.

 Add and Manage Tweens.

 Create Animations Using Motion Tweens.

 Create Slideshows.

 Use ActionScript.

 Incorporating Sound and Video.

 Publish Your Websit, and

 Demonstrate mastery of lesson content at levels of 70% or higher.