11/12

SHS - APPLIED
EMPOWERMENT
TECHNOLOGIES
Quarter 2
Module 1
Principles of Interactivity and
Rich Content in the Context of
Web 2.0
 Republic of the Philippines
Department of Education
REGION VII, CENTRAL VISAYAS
SCHOOLS DIVISION OF SIQUIJOR
_________________________________________________________________________
COPYRIGHT NOTICE
Section 9 of Presidential Decree No. 49 provides:

“No copyright shall subsist in any work of the Government of the Republic of the Philippines.
However, prior approval of the government agency of office wherein the work is created shall
be necessary for exploitation of such work for profit.”

This material has been developed through the initiative of the Curriculum Implementation Division (CID)
of the Department of Education – Siquijor Division.

It can be reproduced for educational purposes and the source must be clearly acknowledged. The material
may be modified for the purpose of translation into another language but the original work must be acknowledged.
Derivatives of the work including the creation of an edited version, supplementary work or an enhancement of it
are permitted provided that the original work is acknowledged and the copyright is attributed. No work may be
derived from this material for commercial purposes and profit.

Borrowed materials (i.e. songs, stories, poems, pictures, photos, brand names, trademarks, etc.) included
in this module are owned by their respective copyright holders. Every effort has been exerted to locate and seek
permission to use these materials from their respective copyright owners. The publisher and authors do not
represent nor claim ownership over them.
Published by the Department of Education

OIC-Schools Division Superintendent: Dr. Neri C. Ojastro

Assistant Schools Division Superintendent: Dr. Edmark Ian L. Cabio

Development Team of the Learning Module

Writer: Nicole Steffe Baena - Duhaylungsod

Evaluators: Anna-Liza S. Jimenez Susan A. Calibo Ivy Mae L. Dimagnaong Noel P. Paluray
JiJimJimenez
Julieta A. Sarvida Roger B. Antipuesto Kenneth P. Llorente

Management Team: Dr. Marlou S. Maglinao

CID – Chief

Raul R. Abapo
Education Program Supervisor ( EPS – TLE/TVL)

Edesa T. Calvadores
Education Program Supervisor (LRMS)

Printed in the Philippines by___________________________

Department of Education – Region VII, Central Visayas, Division of Siquijor
Office Address: Larena, Siquijor
Telephone No.: (035) 377-2034-2038
E-mail Address: deped.siquijor@deped.gov.ph
 11/12

SHS - APPLIED
Empowerment
Technologies
Quarter 2

Module 1
Principles of Interactivity and
Rich Content in the Context of
Web 2.0
 Introduction
Hello dearest learners! Welcome to the Alternative Delivery Mode module on
Principles of Interactivity and Rich Content in the Context of Web 2.0.

The recent explosions of Web features provide rich experience for users. YouTube, for
instance, essentially provides services to amateur film makers/animators with the features it
gives them. Users can simply jump on and create an animated video within a few minutes using
app extensions. YouTube likewise offers an online movie editor that can color correct video
and even stabalise the camera shake. This only proves that more avenues are provided for
optimum user engagement and interaction. Are you excited? Let’s explore the world of ICT
together through this module!

In this module, you’ll get to explore more on rich media content and interactivity and
how they affect the user experience in the delivery and consumption of ICT.

In accomplishing this module, you’ll encounter the following activities/tasks:

■ Expected Learning Outcome — This lays out the learning outcome that you are
expected to accomplish at the end of the module.

■ Pre-test — This determines your prior learning of the particular lesson you are about
to take.

■ Discussion of the Lesson —This provides you with the important knowledge,
principles, and attitude that will help you meet the expected learning outcome.

■ Learning Activities — These provide you with the application of the knowledge and
principles you have gained from the lesson and enable you to further enhance your skills as
you carry out prescribed tasks.

■ Post-test — This evaluates your overall understanding of the module.

With the different activities provided in this module, may you find this material
engaging and challenging as it develops your critical thinking skills.
 What I Need to Know
At the end of this lesson, you will be able to:

Explore the principles of interactivity and rich content in the context of Web
2.0 and the participation of the user in the online experience
CS_ICT11/12-ICTPT-IIk-14

What I Know
Let’s try to see what you already know about the topic of this module by answering the
questions below.

A. Directions: Write TRUE if the statement is correct. If the statement is

incorrect, write FALSE.

___________1. Web 2.0 allows easy social interactions through responding more immediately
to users' queries and needs.
___________2. User centeredness, ability to be browsed or navigated and rich graphical and
textual elements are among the principles of interactivity.
___________3. Courseware includes online survey forms and tests that automatically display
the results when finished.

___________4. Vodcast is an episodic series of audio or text files streamed online.

___________5. Candy Crush and Farmville are browser-based games.

___________6. Social networking sites, blogs and wikis fall under Web 1.0.

___________7. Dynamic page refers to the web pages that are affected by user input or
preference.
___________8. Folksonomy allows users to categorize and classify/arrange information using
freely chosen keywords (e.g. tagging).
___________9. Web 2.0 paves way for long-term memory transfer of information because it
utilizes dual coding.
___________10. Long Tail is another feature of the owner of website is not the only one who
is able to put content. Others are able to place a content on their own by
means of comments, reviews, and evaluation.

___________11. Rich user interface enables users to place a content on their own by means of
comments, reviews, and evaluation.
B. Use numbers 1 – 5 to arrange the steps in inserting YouTube video to your
blog.
____________ Paste the code on your WordPress composer’s text tab.

____________ Copy the code.

____________ Click on Embed.

____________ Go to the bottom of the video and click the share button.

____________ Search for your YouTube video.

Hi! My name is Banner BEE! Are you ready for some adventures?

Hurry! Let’s buzz on to the next lesson . . . 😊

 What’s In
In the previous modules, it has been highlighted that creating a website is not a skill
that only computer programmers can do. Today, even high school students with enough
creativity can do the job! Moreover, websites have evolved into tools and platforms for
discovery, sharing, connection and co-creation. Using what you have learned about web design
principles and elements, try to evaluate the content and interest of the following website. Use
the rubrics provided below.

Screenshot from https://i.ytimg.com/vi/c1EcfIKU9q0/maxresdefault.jpg

CATEGORY CATEGORY 4 CATEGORY 3 CATEGORY 2 CATEGORY 1

Links (to content) Links (to content) Almost all links Most links point Less than ¾ of
All links point to point to high- to high-quality, the links point to
high-quality, up quality, up to- up to-date high-quality, up
to-date credible date credible credible sites. to-date credible
sites. sites. sites.
Content The site has a The site has a The purpose and The site lacks a
. well stated clear clearly stated theme of the site purpose or theme
purpose and purpose and is somewhat
theme that is theme but may muddy or vague
carried out have one or two
throughout the elements that do
site. not seem to be
related to it.
Layout The Web site has The Web pages The Web pages The Web pages
an exceptionally have an attractive have a usable are cluttered
attractive and and usable layout but may looking or
usable layout. It layout. It is easy appear busy or confusing. It is
is easy to locate to locate all boring. It is easy often difficult to
all important important to locate most of locate important
elements. White elements. the important elements
space, graphic elements.
elements and/or
alignment are
used effectively
to organize
material.
Links for Links for Links for Some links do
Navigation navigation are navigation are navigation take not take the
clearly labeled, clearly labeled, the reader where reader to the sites
consistently allow the reader s/he expects to described. A user
placed, allow the to easily move go, but some typically gets
reader to easily from a page to needed links lost.
move from a related pages seem to be
page to related (forward and missing. A user
pages (forward back), and sometimes gets
and back), and internal links take lost.
take the reader the reader where
where s/he s/he expects to
expects to go. A go. A user rarely
user does not becomes lost.
become lost.
Interest The author has The author has The author has The author has
made an tried to make the put lots of provided only the
exceptional content of this information in minimum amount
attempt to make Web site the Web site but of information
the content of this interesting to the there is little and has not
Web site people for whom evidence that the transformed the
interesting to the it is intended. person tried to information to
people for whom present the make it more
it is intended. information in an interesting to the
interesting way. audience

Source: http://www.u.arizona.edu/%7Ershah/Rubric.html
 What’s New
Based on the definition provided by the screenshot below, what would you combine to
make your digital content interactive?

The image below shows online features that enhance a video content. Which feature/s
would engage you? Why?
 What Is It
Information Sheet

There was a time that the Internet was not as fast as today’s internet that only text,
images and bits of sound are placed on most websites. It’s because when WWW was invented,
most web pages were static. Static (also known as flat page or stationary page) in the same that
the page is “as is” and cannot be manipulated by the user. This page is referred to as Web 1.0.
Today, with the advent of Web 2.0, however, more videos and music are now placed
freely on most websites, making it more interactive.
Web 2.0 technologies provide users with opportunities to share information and engage
and interact with other users. This development and the increase in user participation have led
to the demand for new methods or tools to navigate the web in order to increase knowledge
and enhance the learning experience.

Look at the illustration below.

Web 2.0 is the interactive version of web-based communities and social networking
websites like facebook and video sharing sites as wikis, blogs, mashups, etc. It allows the user
to interact with the page known as dynamic page; instead of just reading a page, the user may
be able to comment or create a user account. Dynamic page refers to the web pages that are
affected by user input or preference. The user cannot only receive information, but also
contribute and modify the available content.
Figure 1. Four characteristics of Web 2.0 technologies

Presence Web 2.0 tools provide the users with the facilities
to have an account under Twitter, Facebook and
Blogs, in which the followers can follow and
interact with each other through these technologies.
The users are actively engaged via uploading
videos, pictures, events, information etc.
Modification Web 2.0 tools allow the users the opportunities to
modify their website page and account with more
information and pictures.
User-generated content Web 2.0 tools provide a user-centred environment,
where the users are the producers of the contents.
For example, Wikis help users to generate the
contents in order that the interested users interact
and collaborate in the topic.
Social participation Web 2.0 provides the users with the tools so that
they can participate in different activities through
them. The more the users participate the more they
are engaged.
https://bura.brunel.ac.uk/bitstream/2438/12466/1/FulltextThesis.pdf

Key Features of Web 2.0

Folksonomy

This allows users to categorize and classify/arrange information using freely chosen
keywords (e.g. tagging). Popular social networking sites such as Twitter, Instagram, Facebook,
etc. use tags that start with a pound sign (#) or hashtag.

Rich User Interface

The content is dynamic and is responsive to user’s input. An example would be a website
that shows local content. In the case of social networking sites, when logged on, your account
is used to modify what you see in their website.

User Participation

The owner of website is not the only one who is able to put content. Others are able to
place a content on their own by means of comments, reviews, and evaluation.

Long Tail

Services are offered on demand rather than on a one-time purchase. This is synonymous
to subscribing to a data plan that charges you for the amount of time you spent on Internet or a
data plan that charges you for the amount of bandwidth you used.
Since Web 2.0 provides avenues for users to modify and interact, it is very important to employ
the principles of interactivity in enhancing the digital content.

1. Rich graphical and textual elements along with video and/or sound
2. Typically, user-centered
3. Ability to be browsed and/or navigated
4. Typically defined by user control
a. User controls path via navigation
b. User controls time in program and exit time
5. Media is more illustrative and metaphorical
a. Communicates messages through graphics
6. Addresses multiple modalities, or type of information transfer
7. Usually has an orienting effect for user
a. Providing help
b. Illustrating navigation and program features
8. Linear or non-linear
a. Linear like a page turner, non-linear with random features
9. Promotes encoding of stimulus by dual coding
a. Dual coding means bringing information in on two channels at the same time;
increases transfer to long-term memory
b. Involves graphics (one coding) and text (one coding) or other combination of
media formats

Multimedia Content

Here are the multimedia contents that may enhance the interactivity of websites:

1. Videos. Through video hosting sites, you can take a video and show it to the entire
world (e.g., YouTube).
2. Sound, Music or Audio. If videos are too much for you, you can always record sounds.
You can now share your sound bites to the entire world (e.g., Soundcloud).
3. Online Games. Game developers now create what is called “browser-based games.”
You do not need to install these games to your computer as they run in most updated
web-browsers. (e.g. AdventureQuest, Farmville, Candy Crush).
4. Online Tests. Online survey forms and test that automatically display the results when
finished (e.g. Online IQ and Personality Tests).
5. Courseware. Online courses that simulate classroom online (e.g., E-learning Courses
using a Learning Management System).
6. Podcasts. An episodic series of audio or text files streamed online (e.g. Stuff You
Should Know, TED Talks, The Starters, Ear Biscuits).
7. Vodcasts. An episodic series of video streamed online (e.g., YouTube series).
Inserting Youtube Videos on Your Blog Post

For an instance, you are to create a blog post about any significant OPM (Original
Pilipino Music) that you like. Any music will do just as long as it does not have swears or
inappropriate messages. Remember, your goal is to make your blog post interactive by means
of inserting videos.

Search any OPM songs of your choice on YouTube.com. You can use
STEP 1 official music video or someone else’s upload.

STEP 2 Got to the bottom of the video and click the Share button.

Click on Embed.
STEP 3
 Copy the code.
STEP 4

Create a new post on your blog then on the editor, click on the Text tab.
STEP 5

Note: You can write an article about this song describing it and why you featured it on your blog.

Paste your code here.

STEP 6

Go back to the Visual tab and add text content on either the top of your
STEP 7 video or the bottom.

Preview then publish the content.

STEP 8

How’s it goin’? 😊 Try to demonstrate what

you have learned through the activities below.
 What’s More

Independent Activity

Directions:
o Go over the interactive multimedia contents once more. This time,
you are to produce your own video containing the following:
a. an introductory video about yourself
b. a video about your interests—enticing others to know more about them
c. a video observing decency, with no use of offensive and inappropriate
words
o Create a script including the flow of your video. Write it in your notebook.
o The video should not exceed three minutes.
o Post your video on YouTube then embed it to your own blog.

Rubrics for scoring the video and/or script

4 3 2 1
Criteria Excellent Proficient Adequate Limited
Content Engaging and Clear and Straightforward Simplistic and
insightful thoughtful and developing emerging
presentation of presentation of presentation of presentation of
thoughts and thoughts and thoughts and thoughts and
supporting supporting supporting supporting
details details details details
Organization Introduction, Introduction, Introduction, Introduction,
detail, detail detail detail
arrangement, arrangement, arrangement, arrangement,
transitions, transitions, transitions, transitions,
conclusion and conclusions and conclusion and conclusion and
coherence are coherence are coherence are coherence are
superior. very good. satisfactory. limited.
Achievement Purpose is Purpose is Purpose is Purpose is
of Purpose clearly clearly established but vaguely
established and established and may not be established and
effectively generally sustained. may not be
sustained. sustained. sustained.
Use of Precise and Carefully Generally Vague,
Language sophisticated chosen and precise and imprecise or
(diction, vocabulary complex straightforward inappropriate
sentences) used. vocabulary is vocabulary is vocabulary is
Sentences vary used. used. used. Mainly
in pattern and Sentences often Sentences simple
length. vary in pattern sometimes vary sentences,
and length. in pattern and lacking in
length variety are
used.
Correctness Great attention Attention has Less attention Little attention
has been paid to been paid to has been paid to has been paid to
correctness. correctness. correctness. correctness.
Text contains Text contains Text contains Text contains
essentially no minor errors, errors which many errors
errors which none of which interfere with which limit the
interfere with interfere with clarity of clarity of
clarity of clarity of communication. communication.
communication. communication.

Independent Assessment

Directions: Answer the following questions briefly.

1. What are other video hosting sites besides YouTube?
2. Do you think the video you produced will help add interactivity to your blog?
Why or why not?

What I Have Learned

Directions: Pick out the statement which bears your learning for this
module. List them down in your notebook.
1. Multimedia content is used by modern websites to give the site visitor a way to
interact with what is on the website.
2. Multimedia content could range from videos, sound, online browser-based games,
online tests, courseware, podcast, and vodcasts.
3. The principles of interactivity, if employed, can maximize interaction of the site
visitor to the site.
4. One can insert a YouTube video on your blog post by simply copying the code
from the Embed tab in the Share menu. Copy this code to the Text tab of the
composer. Preview it to see if it appears correctly.

What I Can Do
Directions: Answer the questions comprehensively. Do it in your notebook.
1. How do the principles of interactivity and rich content enhance the user’s online
experience?

2. How do you add interactivity to a digital content?

 Rubric for Essay Type Questions

Needs
Criteria Unsatisfactory Improvement Satisfactory Outstanding
(2 pts.) (4 pts.) (6 pts.) (8 pts.)

Content is Content is not Content is Content is

Content & incomplete. comprehensive and accurate and comprehensive,
Development Major points /or persuasive. persuasive. accurate, and
are not clear. Major points are Major points persuasive.
Specific addressed, but not are stated. Major points are
examples are well supported. Responses are stated clearly and are
not used. Responses are adequate and well supported.
inadequate or do address topic. Responses are
not address the Content is excellent, timely and
topic. clear. Specific address topic.
Specific examples examples are Content is clear.
do not support used. Specific examples
topic. are used.
Satisfactory
Organization Structure of the Structure is Structure of the
and structure paper is not easy to mostly clear paper is clear and
Organization detract from follow. Transitions and easy to easy to follow.
& Structure the message. need improvement.
follow. Transitions are
Writing is The conclusion is
disjointed and missing, or if Transitions are logical and maintain
lacks provided, does not present. The the flow of thought
transition of flow from the body conclusion is throughout the
thoughts. of the paper. logical. paper. The
Satisfactory conclusion is logical
and flows from the
body of the paper

Paper contains Paper contains few Rules of Rules of grammar,

numerous grammatical, grammar, usage, and
Grammar, grammatical, punctuation and usage, and punctuation are
Punctuation & punctuation, spelling errors punctuation followed; spelling is
Spelling and spelling are followed correct.
errors. with minor
errors.
Spelling is
correct.

Hurray!

Now that we’re almost done with our venture, let’s try to assess what you have
learned from this lesson!
 Assessment
A. Directions: Write TRUE if the statement is correct. If the statement is
incorrect, write FALSE.
___________1. Web 2.0 allows easy social interactions through responding more immediately
to users' queries and needs.
___________2. User centeredness, ability to be browsed or navigated and rich graphical and
textual elements are among the principles of interactivity.
___________3. Courseware includes online survey forms and tests that automatically display
the results when finished.

___________4. Vodcast is an episodic series of audio or text files streamed online.

___________5. Candy Crush and Farmville are browser-based games.

___________6. Social networking sites, blogs and wikis fall under Web 1.0.

___________7. Dynamic page refers to the web pages that are affected by user input or
preference.
___________8. Folksonomy allows users to categorize and classify/arrange information using
freely chosen keywords (e.g. tagging).
___________9. Web 2.0 paves way for long-term memory transfer of information because it
utilizes dual coding.
___________10. Long Tail is another feature of the owner of website is not the only one who
is able to put content. Others are able to place a content on their own by
means of comments, reviews, and evaluation.

___________11. Rich user interface enables users to place a content on their own by means of
comments, reviews, and evaluation.

B. Use numbers 1 – 5 to arrange the steps in inserting YouTube video to your blog.

____________ Paste the code on your WordPress composer’s text tab.

____________ Copy the code.
____________ Click on Embed.
____________ Go to the bottom of the video and click the share button.
____________ Search for your YouTube video.

Congratulations! You have successfully accomplished this module!

Continue to buzz on to the next modules! Keep safe!

References

“Digital Image.” Accessed: October 29, 2020. https://pdfs.semanticscholar.org

“Empowerment Technologies: Student Reader for Senior High School” Accessed October
29, 2020. https://goo.gl/dfNPfa

“Principles of Interactive Multimedia.” Slideshare. Accessed: October 30, 2020.

https://www.slideshare.net/RosdenHingpit/lesson-8-empowerment-technologies

“The Impact of the Interactivity of Web 2.0 Technologies on the Learning Experience of
Students in Higher Education.” Accessed October 30, 2020
https://bura.brunel.ac.uk/bitstream/2438/12466/1/FulltextThesis.pdf

Innovative Training Works, Inc. Empowerment Technologies.Sampaloc Manila:

Rex Bookstore, Inc., 2016