CBC Creative Web Design 2018 (Online)
CBC Creative Web Design 2018 (Online)
([Link].00-03/08/17)
A. Course Design
Course Structure
Basic Competencies
(12 Hours)
Unit of Nominal
Module Title Learning Outcomes
Competency Duration
1.1 Communicate information about
1. Lead 1.1 Leading workplace processes.
workplace workplace
1.2 Lead workplace discussions. 2 Hours
communica communica
tion tion 1.3 Identify and communicate issues
arising in the workplace
2. Lead small 2.1 Leading 2.1 Provide team leadership. 2 Hours
teams small 2.2 Assign responsibilities among
1
members
2.3 Set performance expectation for team
teams
members
2.4 Supervise team performance
3. Develop 3.1 Developing
and and 3.1 Plan negotiations
practice practice 3.2 Participate in negotiations 2 Hours
negotiation negotiation
skills skills
4. Solve 4.1 Solving 4.1 Identify the problem.
workplace workplace 4.2 Determine the fundamental causes of
problem problem the problem.
2 Hours
related to related to 4.3 Determine corrective action
work work 4.4 Provide recommendation/s to
activities activities manager
5. Use 5.1 Using
mathemati mathemati 5.1 Identify mathematical tools and
cal cal techniques to solve problem
2 Hours
concepts concepts 5.2 Apply mathematical procedures/ solution
and and 5.3 Analyze results
techniques techniques
6.1 Study/select appropriate technology
6. Use 6.1 Using
relevant relevant 6.2 Apply relevant technology
6.3 Maintain/ enhance relevant 2 Hours
technologie technologie
s s technology
Common Competencies
(12 Hours)
Unit of Nominal
Module Title Learning Outcomes
Competency Duration
1. Apply 1.1. Applying 1.1.1. Assess quality of received materials.
Quality quality 1.1.2. Assess own work. 4 hours
Standards standards 1.1.3. Engage in quality improvement
2. Perform 2.1. 2.1.1. Plan and prepare for task to be
Computer Performing taken undertaken
Operation Computer 2.1.2. Input data into computer
Operation 2.1.3. Access information using computer
2.1.4. Produce output/ data using
8 hours
computer system
2.1.5. Use basic functions of a www-
browser to locate information
2.1.6. Maintain computer equipment and
systems
Core Competencies
(78 Hours)
Unit of Nominal
Module Title Learning Outcomes
Competency Duration
Develop Web Developing L.O.1. Relate traditional animation to 2D 26 hours
Animation Web Animation Digital animation.
using Adobe using Adobe L.O.2. Use drawing tools.
2
Flash Flash L.O.3. Work with symbols, timeline and
library.
L.O.4. Analyze model sheet.
L.O.5. Construct objects.
L.O.6. Review and correct vector objects
L.O.7. Integrate sound animated objects and
backgrounds
L.O.8. Apply animation techniques and
finalized 2D animation Sequence
Develop Developing L.O.1. Create vector graphics using graphics
Digital Image Digital Image applications.
with Adobe with Adobe L.O.2. Prepare printer Work Environment
Photoshop Photoshop L.O.3. Employ Various Graphics Application
Techniques Producing Artworks or 26 hours
Objects.
L.O.4. Produce printer ready graphics.
L.O.5 Upload Photoshop graphics to website
Nominal
Unit of Competency Module Title Learning Outcomes
Duration
N/A N/A N/A N/A
(List of recommended tools, equipment and materials for the training of (25)
trainees for (Creative Web Design).
QTY EQUIPMENT
1 Desktop or Laptop at least Dual Core with at least 2GB of RAM 500HDD
1 Webcam
1 Headset with Mic
Internet Connection at least 3MB (Recommended 5MB)
3
Any Web Browser (I.E, Firefox, Chrome)
Installed Photoshop any version (recommended CS6) picture editing
Installed Dreamweaver any version (recommended CS6) web design
Installed Adobe Flash any version (recommended CS6) basic animation
Google account for Google Meet Webinar
Qualification of Trainers:
• TM Certificate
Visual Graphics Design NC III Holder
• College Diploma or Training Certificate relevant to the course to be handled
• At least 2 years of relevant industry experience
4
BASIC
COMPETENCIES
5
Unit of Competency: LEAD WORKPLACE COMMUNICATION
Module Title: Leading workplace communication
Module Descriptor: This unit covers the knowledge, skills and attitudes
required to lead in the dissemination and discussion of
ideas, information and issues in the workplace.
7
Unit of Competency: LEAD SMALL TEAMS
Module Title: Leading Small Teams
Module Descriptor: This unit covers the knowledge, skills and attitudes to lead
small teams including setting and maintaining team and
individual performance standards.
10
Unit of Competency: DEVELOP AND PRACTICE NEGOTIATION SKILLS
Module Title: Developing and Practice Negotiation Skills
Module Descriptor: This unit covers the skills, knowledge and attitudes required to
collect information in order to negotiate to a desired outcome
and participate in the negotiation
12
Unit of Competency: SOLVE PROBLEMS RELATED TO WORK ACTIVITIES
Module Title: Solving Problems Related To Work Activities
Module Descriptor: This unit of covers the knowledge, skills and attitudes
required to solve problems in the workplace including the
application of problem solving techniques and to
determine and resolve the root cause of problems.
14
Enterprise goals, the reason
targets and behind the
measures observable
Enterprise action
quality, OHS
and
environmental
requirement
Principles of
decision making
strategies and
techniques
Enterprise
information
systems and data
collation
Industry codes
and standards
Using range of
formal problem
solving techniques
Identifying and
clarifying the
nature of the
problem
Devising the best
solution
Evaluating the
solution
Implementation of a
developed plan to
rectify the problem
15
identifying corrective action case studies /
measurable and provision of what ifs will
objectives, recommendations be required as
resource needs Relevant well as bank
and timelines in equipment and of questions
accordance with operational which will be
safety and processes used to probe
operating Enterprise goals, the reason
procedures targets and behind the
measures observable
Enterprise action
quality, OHS
and
environmental
requirement
Principles of
decision making
strategies and
techniques
Enterprise
information
systems and data
collation
Industry codes
and standards
Using range of
formal problem
solving techniques
Identifying and
clarifying the
nature of the
problem
Devising the best
solution
Evaluating the
solution
Implementation of a
developed plan to
rectify the problem
17
Unit of Competency: USE MATHEMATICAL CONCEPTS AND TECHNIQUES
Module Title: Using mathematical concepts and techniques
Module Descriptor: This unit covers the knowledge, skills and attitudes
required in the application of mathematical concepts and
techniques.
19
Unit of Competency: USE RELEVANT TECHNOLOGIES
Module Title: Using relevant technologies
Module Descriptor: This unit of competency covers the knowledge, skills, and
attitude required in selecting, sourcing and applying
appropriate and affordable technologies in the workplace.
22
COMMON
COMPETENCIES
23
Unit of Competency: Apply Quality Standards
Module Title: Applying quality standards
Module Descriptor: This module covers the knowledge, skills, attitudes and
values needed to apply quality standards in the workplace.
The unit also includes the application of relevant safety
procedures and regulations organization procedures and
customer requirements.
24
LO2: ASSESS OWN WORK
26
Unit of Competency: Perform Computer Operations
Module Title: Performing computer operations
Module Descriptor: This module covers the knowledge, skills and attitudes
and values needed to perform computer operations
which includes inputting, accessing, producing and
transferring data using the appropriate hardware and software
27
feedback.
• Interpreting user
manuals and
security
guidelines
30
Unit of Competency: MAINTAIN AN EFFECTIVE RELATIONSHIP WITH
CLIENT/CUSTOMERS
Module Title: Maintaining an Effective Relationship with Client/Customers
Module Descriptor: This unit covers the knowledge, skills and attitudes and
values required in building and maintaining an effective
relationship with clients, customers and the public.
31
Maintaining Records assessment
record book
33
Unit of Competency: MANAGE OWN PERFORMANCE
Module Title: Managing Own Performance
Module Descriptor: This unit covers the knowledge, skills and attitudes in effectively
managing own workload and quality of work.
36
CORE
COMPETENCIES
37
Unit of Competency:Develop Web Animation using Adobe Flash
Module Title: Developing Web Animation using Adobe Flash
Module Descriptor: This course is designed to enhance the knowledge, skills and
attitudes of a trainee/student on core competencies such as;
Produce Key Drawings for Animation, Produce Cleaned-up
and In-between Drawings, Create 2D Digital Animation and
Use an Authoring Tool to Create an Interactive Sequence in
accordance with the industry standards. It includes common
competencies such as: Apply Quality Standards, Perform
Computer Operations. It also includes basic competencies such
as; Lead Workplace Communication, Lead Small Teams,
Develop and Practice Negotiation Skills, Solve Problems Related
to Work Activities, Use Mathematical Concept and Techniques
and Use Relevant Technologies.
39
are browser
determined
from the
model sheet.
2. Special
effects are
determined
from the
model sheet
Assessment Assessment
Contents Conditions Methodologies
Criteria Methods
1. Scene are • Modeling of • Computer with • Online • Online quiz
built using objects Adobe Flash Lecture
object • Components of software
according to objects • Internet
the work connection
instruction. • Any web
2. Characters browser
are posed
based on
creative
40
requirements.
3. Objects are
combined into
a single
animated
steam
according to
creative
requirements
and technical
specifications
4. Static or
moving
backgrounds
are created as
required and
animated
objects are
integrated into
static or
moving
backgrounds.
5. Sound is
incorporated
where
necessary.
41
Unit of Competency:Develop Digital Image with Adobe Photoshop
Module Title: Developing Digital Image with Adobe Photoshop
Module Descriptor: This course is designed to enhance the knowledge, skills and
attitudes of a trainee/student on core competencies such as :
Develop design studies; create vector graphics using a graphics
application, create vector graphics, create raster graphics using
a graphics application. Develops designs for product packaging,
Design designs for booth and product/window display in
accordance with the industry standards. It includes common
competencies such as; Apply Quality Standards, Perform
Computer Operations. It also includes basic competencies such
as; Lead Workplace Communication, Lead Small Teams,
Develop and Practice Negotiation Skills, Solve Problems Related
to Work Activates, Use Mathematical Concept and Techniques
and Use Relevant Technologies.
Assessment Assessment
Contents Conditions Methodologies
Criteria Methods
1. The software • Image formats • Computer with • Online • Online quiz
used in 2D • Correct Adobe Lecture • Task
digital animation application Photoshop submission
is in accordance selection software for 2D
with the • Manipulation • Internet vector
specified of objects connection
delivery • Color modes • Any web
platform. • Attributes of browser
2. Components of appearance
personal • Effects
interface are • Filters
identified and • Text and
discussed. formatting
3. Set-up • Interpreting a
personal brief.
42
interface for
work
convenience
4. Objects traced
and vectorized
are previewed
and corrected.
5. Objects traced
are saved and
backed-up
continually in
accordance with
enterprise
requirements.
Assessment Assessment
Contents Conditions Methodologies
Criteria Methods
1. Set-up personal • Image formats • Computer with • Online • Online quiz
interface like • Correct Adobe Lecture
printer for work application Photoshop
convenience. selection software
2. Objects traced • Manipulation • Internet
and vectorized of objects connection
are previewed • Color modes • Any web
and corrected • Attributes of browser
and print. appearance
• Effects
• Filters
• Text and
formatting
• Interpreting a
brief.
Skills on :
Artistic and
creative skills
Communicati
on Skills
Interpersonal
skills
Listening
skills
Computer
application
skills
Tasking
management
skills to
provide
quality service
in less time
43
LO3: Employ Various Graphics Application Techniques Producing Artworks or
Objects.
Assessment Assessment
Contents Conditions Methodologies
Criteria Methods
1. All relevant • Image formats • Computer with • Online • Online quiz
clean up • Correct Adobe Lecture
requirements are application Photoshop
identified from selection software
the appropriate • Manipulation of • Internet
source material objects connection
2. All relevant • Color modes • Any web
model sheets are • Attributes of browser
collected for appearance
ready reference. • Effects
3. All key • Filters
drawings are • Text and
checked and any formatting
problems or • Interpreting a
errors brief.
encountered are Skills on :
referred to Artistic and
appropriate creative skills
personnel. Communicatio
4. All animation n Skills
breakdowns are Interpersonal
checked against skills
the camera Listening skills
sheet, and any Computer
problems or application
errors are skills
referred to Tasking
relevant management
personnel. skills to
5. All relevant provide quality
clean up service in less
requirements are time
identified from
the appropriate
source material
6. All relevant
model sheets are
collected for
ready reference.
7. All key
drawings are
checked and any
problems or
errors
encountered are
referred to
appropriate
personnel.
8. All animation
breakdowns are
checked against
44
the camera
sheet, and any
problems or
errors are
referred to
relevant
personnel.
9. All necessary
materials and
equipment are
identified and
prepared
according to the
task undertaken
Assessment Assessment
Contents Conditions Methodologies
Criteria Methods
1. Cleane • Image formats • Computer with • Online • Online quiz
d-up drawings • Correct Adobe Lecture • Task
produced are application Photoshop submission
consistent with selection software Image
requirements of • Manipulation • Internet effects for
source of objects connection grading
materials and • Color modes • Any web
within the • Attributes of browser
constraints of appearance
the production. • Effects
2. Cleane • Filters
d-up drawings • Text and
are matched formatting
and modeled to • Interpreting a
animators’ keys. brief.
3. Agreed Skills on :
design/model in Artistic and
precisely on Skills
reflected in the Interpersonal
standards application
4. All skills
Tasking
animation
breakdowns are management
accurately skills to
copied and provide
numbered onto quality service
cleaned-up in less time
drawings.
5. Any
revision or
45
corrections
required are
referred to
relevant
personnel.
Assessment Assessment
Contents Conditions Methodologies
Criteria Methods
1. Click the File • Image formats • Computer with • Online • Online quiz
Manager icon, • Correct Adobe Lecture •
located under application Photoshop
the Files selection software
category. • Manipulation • Internet
2. Open the public of objects connection
html directory. • Color modes • Any web
• Attributes of browser
3. Upload after
appearance
entering the
• Effects
public html • Filters
directory. • Text and
4. Click “Select formatting
File” to select a • Interpreting a
singular file, or brief.
simply drag- Skills on :
and-drop your Artistic and
file to the creative skills
outlined area. Communicati
5. Return to the on Skills
File Manager Interpersonal
46
Unit of Competency:Develop Web Page Design using Dreamweaver
Module Title: Developing Web Page Design using Dreamweaver
Module Descriptor: This course is designed to teach each new developers how to
create web sites using Dreamweaver CS3. This course is task-
based, and will help designers to jump immediately to Web Page
Designing without mastering HTML. Along with converting the
basic of Dreamweaver CS3, the course focuses on best
practices and design, stressing the importance of usability.
Nominal Duration: 26 Hours
Summary of Learning Outcomes:
LO1: Familiarize students to Adobe Dreamweaver environment.
LO2: Add proper type of font, Use of Cascading style sheets in a page and
Linking documents in Dreamweaver.
LO3: Create pages with frames and framesets and Application of effects in a
page.
LO4: Create form objects in a web page and Spry items.
LO5:Manage and Upload Site.
Assessment Assessment
Contents Conditions Methodologies
Criteria Methods
1. Identify • Learn the • Computer with • Online • Online Quiz
elements of activity in Adobe Learning
the using the Dreamweaver
Dreamweaver insert software
interfaces command, • Internet
2. Implement common, connection
settings for the text and • Any web
development layout tabs. browser
environment • Learn
using the: activity in
• insert panel customizing
• property text and
inspector images in a
• assets panel web page
• files panel • Create
3. Customize the pages with
workspace for the use of
website HTML
creation scripts/com
mands in the
47
Dreamweav
er
environment.
LO2: Add proper type of font, Use of Cascading style sheets in a page and
Linking documents in Dreamweaver.
Assessment Assessment
Contents Conditions Methodologies
Criteria Methods
1. Use Adobe • Link all their • Computer with • Online • Online Quiz
Dreamweave web pages Adobe Learning • Task
r in line with using Photoshop submission
identified Dreamweave software for simple
content to r • Internet page link
• define a • Classify connection
Dreamweav Internal, • Any web
er site External links browser
• create, title, • Make an
name, and anchor web
save a web page based
page • add on their
text to a project
web page • Explain
• insert reusable
images and templates
apply and libraries
alternative
text on a
web page
• link web
content
using
hyperlinks,
e-mail links,
and named
anchors
• insert rich
media in
Flash
• insert
navigation
bars,
rollover
images and
buttons
created in
Fireworks
on a web
page
• build image
maps
48
• import
tabular data
to a web
page
• import and
display a
Microsoft
Word or
Microsoft
Excel
document to
a web page
• create forms
LO3: Create pages with frames and framesets and Application of effects in a
page.
Assessment Assessment
Contents Conditions Methodologies
Criteria Methods
1. Modify • Deliver the • Computer with • Online • Online Quiz
website concept behind Adobe Learning • Task
content frames, Photoshop submission
including frameset and software for creating
• setting and html files. • Internet simple page
modifying • Describe the connection using frames
document steps in • Any web and frameset
properties making browser
• organizing frames, its link
webpage and its
layout with relations to its
relative and target
absolutely- • Explain
positioned tags behaviors in
and Cascading Dreamweaver,
Style Sheets its effect in the
• modifying text web
and its • Create pages
properties with Frames
• modifying and selected
images and behavior
image effects in.
properties
• creating web
page templates
• using HTML
tags to set up
an HTML
document,
format text,
add links,
create tables
and build
ordered and
unordered lists
49
• adding head
content to
make a web
page visible to
search engine
• using CSS to
implement a
reusable
design
Assessment Assessment
Contents Conditions Methodologies
Criteria Methods
1. Use a test • Present the • Computer with • Online • Online Quiz
plan to different form Adobe Learning • Task
conduct tags and Photoshop submission
technical tests elements software for creating
2. Identify • Browse some • Internet simple page
techniques for sample forms in connection inserting an
usability tests existing • Any web objects
3. Identify websites and browser
methods for critique on it.
collecting site • Appreciate the
feedback readymade
4. Present web icons for each
pages to form element
others for • Apply the spry
feedback and and form
evaluation elements in
one’s page
5. Manage
• Create several
assets, links,
pages with
and files for a
some form
site
elements
6. Publish and • Learn a short
update site
overview of
files to a
static and
remote serve
dynamic web
pages in
relation to form
tags.
Assessment Assessment
Contents Conditions Methodologies
Criteria Methods
1. Click the File • Learn how to • Computer with • Online • Online Quiz
Manager icon, manage their site Adobe Learning
located under • Upload their Photoshop
the Files web pages and software
category. present their • Internet
2. Open the project website connection
public_html • Managing & • Any web
directory. uploading sites browser
50
3. Upload after entail material
entering the cost for hosting
public_html services.
directory
4. Click “Select
File” to select
a singular file,
or simply
drag-and-drop
your file to the
outlined area.
5. Return to the
File Manager
and you will
see the
uploaded
archive in
your
public_html
directory
6. The archive
should be
extracted to.
7. Archive is now
extracted.
8. Website
should now be
fully uploaded
and
accessible via
your website’s
URL
51