Collaborative
Development of
ICT Content
RONEVIR C. DULIN, PCpE, MCE
A web page is a
document created for
the World Wide Web
(www) that can be
accessed via a web
browser.
01
How is web
page different
from
website?
WEB PAGE
❖ A web page is one of many files that make
up a website; an example is a home page or
a contact page of a particular site
WEBSITE
❖ A website on the other hand is a collection of
web pages coded in HTML that are linked to
each other and to pages on other sites.
The Best Web
Design Software
2023
https://www.forbes.com/advisor/business/software/best-web-design-software/
Types of Web Design Software
1 2 3
Code-free Code Graphic
web design editing design
software platforms software for
mockups and
prototypes
• Weebly:
• Best overall
• Squarespace:
• Best for multimedia sites
• Wix:
• Best software with
premade templates
• Shopify:
• Best for ecommerce sites
• Adobe Dreamweaver
• Best for professional
designers
• Sublime Text:
• Best simple code editor
• openElement:
• Best code editor for
community support
• WordPress:
• Best for blogs
• Adobe XD
• best for easy sharing
• Webflow
• best for designer-
developer workflows
How To Choose the Best Web
Design Software
Do you What is What What level How much
want to your features of flexibility
learn to budget? are you experience do you have
code or looking do you to
not? for? have? customize?
Basic Web Design Principles
and Elements
Web design is a concept where websites are
planned, created, updated, and maintained.
A good website design allows the user to
understand the message, contents, and
ideas in the most convenient way.
Basic Web Design
Principles and
Elements
Web Design
Elements
1. Text
2. Graphics/Illustrations
3. Shapes
4. Background – or texture
5. Color
6. Video/Audio
7. Links
Web Design
Principles
1. Portable Design – website design
must be portable and available
to end users who have various
browsers, operating systems,
and computer platforms.
2. Design for Low Bandwidth –
website design must be available
at different speeds.
3. Direction – define the order of
importance of the different
elements and position them in a
sequence where the eye moves
and perceive the objects it sees.
4. Accessibility – a visitor must be
able to quickly access the
information when he/she enters
the website.
5. White Spaces – use white spaces
intentionally as breathing space
in your design.
6. Simplify – the more choices you
add in your site, the more difficult
it is for a visitor to make a
decision and more time is
required to browse through them.
7. Convenience – to allow users to
make an action, the click buttons
should be accessible and
strategically placed in the web
page.
8. Regular testing – the website should
be periodically upgraded, updated,
and reviewed so that bugs can be
fixed quickly.
Parts of a
Website
Header
A website’s header
or banner is the
consistent section
at the top of the
site with the logo
and navigation
menu in it. Ocampos Fine Jewellery – Ocampo's Fine Jewellery
Menu System
These are the
hyperlinks at the
top of the page
to help you find
what you’re
searching for.
Ocampos Fine Jewellery – Ocampo's Fine Jewellery
Common menu found in a website
Home - a web page that serves as the
starting point of website.
About - provide information about your
website and what it can do or deliver.
Contact - allows visitors to contact the
organization or individual providing the
website.
Content Area
This is where the
main content of
the web page is
positioned.
Ocampos Fine Jewellery – Ocampo's Fine Jewellery
Sidebar
A sidebar is
website region
used to view
information that is
not part of the
main content of
the page. https:arbor-restaurant.co.uk)
The Footer
▪ A footer serves the
same function as the
header
▪ it’s a region on a
website that’s
constant from page
to page
Bentley University - Business School
Content Area
This is where the
main content of
the web page is
positioned.
Analyze the
pictures shown
Team Structure
and Dynamics for
ICT Content
RONEVIR C. DULIN, PCpE, MCE
●A Group involves people who
work independently to achieve
its goal, while a Team works
interdependently where each
member has a specific role or
function.
● Team Structure
○ refers to the creation of an
individual team or the creation
of a multi-system. It is an
essential component of the
teamwork process.
● Collaboration
○means individuals work
together to produce/
create a well-defined
content to achieve a
common business purpose.
● Online collaboration
○a work process where
people are interacting in
real-time over the internet.
Four (4) Parts of Collaboration
in a Flow Process
Sharing: Understanding: Reflection: Expression:
documenting adopting the analyzing or the process
explicit process interpreting of making
knowledge knowledge shared known ones
information thought or
feelings
Team Members
An effective team structure is composed of
efficient team members who have specific
roles and responsibilities.
● Project Manager
○ An individual who has
general accountability for
the successful initiation,
planning, design, execution,
monitoring, controlling, and
closure of a project.
○ Data Analyst
■ Someone who gathers,
processes, and performs
statistical analyses of Data.
A person who is accountable
in collecting the data for ICT
content.
○ Content Writer and Editor
■A person responsible
for reviewing the data
and finalizes a complete
of information.
○ The Web Designer
■A person responsible for
creating the appearance,
layout, and elements of a
website.
○ Web Developer
■ The person technically
develops the overall
functionalities of a web
page.
Online
Collaborative
Tools and
Processes
Online collaborative tools for ICT
content development
Facebook Groups Microsoft's Yammer
G Suite MS Office 365
Google Chat/ Hangouts Prezi
Google Docs, Sheets, and Trello
Slides
Google Drive Zoom
Microsoft Teams Skype/ Viber/ Kakao Talk/
WeChat/ Line
Online Platforms for Hosting ICT Content
● Presentation/ visualization (Prezi, Soho, Slideshare,
Mindmeister)
● Cloud computing (Google Apps)
● Social Media (Facebook Pages, Tumblr)
● Web Page Creation (Wix, Weebly)
● Blog sites (Blogger, Wordpress, Livejournal, Issuu)
Characteristics of Good
Collaborative Tools and
Platforms
1. must be user friendly.
2. has elements that are appropriate for
the team's goal.
3. prioritizes security and privacy.
Project
Management for
ICT Content
The application of knowledge, skills, tools, and
techniques to project activities is called Project
Management.
Five Phases of
Project
Management
● Initiating
○ An overview of the objectives of the
project, needs, and the problem is
identified.
○ It is where you create the project
charter with the Project Manager
assigned to the project.
● Planning
○ This is where a successful project
conclusion is worked out by the project
manager and the project team.
○ The team brainstorms the ICT theme to be
published, together with the collaborative
tools and online platforms to be used.
● Executing
○ This is where the project team
goes about executing the
project plan once the project
plan has been constructed.
● Monitoring and Controlling
○ This is where the project manager monitors
and controls the work for a time, cost,
scope, quality, risk, and other factors while
the project is being executed.
○ It is also an ongoing process that ensures
that the project meets its focus for each
project objective.
● Closing
○ This happens when each phase is
ended and when each entire project is
concluded.
○ It happens to ensure that all the work
has been finished, completed, and
approved.
Curating Existing Content for
Use on the Web
● Content curation is the process of publicly
gathering, organizing, adding value, and
openly sharing digital information
artifacts on a specific topic or area of
audience interest.
Creating and Choosing
Valuable ICT Content
Define Research Organize Summarize
your and the and
objectives analyze structure of proofread
your article
Three (3) Rules in Creating Quality Content
● Informative
○ it should provide valuable and useful information to the
reader.
● Interesting
○ it should catch the readers' attention from the title to the
last part of your content.
● Relevant
○ it should reflect how much you know the subject of your
content enough and who it is being written to make it
relevant to both.
ICT as Platform for Change
RONEVIR C. DULIN
ALPINE SKI HOUSE 69
Digital Citizenship and the
Filipino people
RONEVIR C. DULIN
ALPINE SKI HOUSE 77
ACTIVITY 1.
Highlight the word per item
which does not belong in the
group.
ALPINE SKI HOUSE 78
1.
Radyo Edsa President Cardinal
Veritas I Erap Sin
ALPINE SKI HOUSE 79
2.
pork 11 Edsa text
barrel prosecutor II brigades
s
ALPINE SKI HOUSE 80
3.
400,000 Million Ondoy Facebook
People and
March Change.org
ALPINE SKI HOUSE 81
4.
Google Yolanda SOGIE November
People Bill 2013
Finder
ALPINE SKI HOUSE 82
The Role of ICT in
Philippine History
RONEVIR C. DULIN
ALPINE SKI HOUSE 96
EDSA 1(PEOPLE POWER
REVOLUTION)
• Radio Veritas, a 24 – hour AM radio station operated by
the Roman Catholic Church
• The Philippine Revolution has been acclaimed as the first
televised revolution in the history.
• Cardinal Sin encouraged the Filipinos to help end the
regime of President Ferdinand Marcos.
• ICT played a vital role in the EDSA People Power Revolution as it becomes
the eye opener to the Filipinos to see what is the reality beyond the reign of
the dictator and an authoritarian president, Ferdinand Marcos for 20 years.
ICT has been useful and helpful as it becomes the modern sword of today’s
society.
ALPINE SKI HOUSE 97
EDSA DOS (2021 EDSA REVOLUTION)
• EDSA Dos, also known as the 2001 EDSA Revolution was a
four – day political protest from January 17 – 20, 2001.
People gathered and were demanding for the
resignation of President Joseph Estrada.
• The People Power II was empowered by new forms of
ICTs. It acts as an instrument during the revolution.
• Estrada’s corruption quickly spread all over the country
via text messages. The text brigade connects people to
facilitate the nonviolent protest on a long stretch of EDSA
ALPINE SKI HOUSE 98
MILLION PEOPLE MARCH
• Year 2013 when the public gone wild by the issue of
misuse of the Priority Development Assistance Fund or
PDAF
• Million People March was organized at Luneta Park from
August 22 – 26, 2013
• It is a series of protest, calling for the total abolition of the
Pork Barrel Fund.
• Many Filipinos expressed their anger through social
media and agree with the idea of abolishing the Pork
Barrel Fund.
ALPINE SKI HOUSE 99
YOLANDA PEOPLE FINDER
• Typhoon Haiyan, locally known as Yolanda hit the
Philippines on November 8, 2013.
• the People Finder Database which is powered by
Google become essential.
• This was made to help people track the situation of
their relatives across the globe.
ALPINE SKI HOUSE 10
ICT as Medium for Advocacy
RONEVIR C. DULIN
ALPINE SKI HOUSE 101
OBJECTIVES
• Change.org • is dubbed as the “world’s
platform for change” where anyone from
online community can create a petition
and ask others to sign it
• Change.org •It gives access to more
people by allowing the online community
to affix their digital signatures on a petition.
ALPINE SKI HOUSE 10
OBJECTIVES
• Change.org •Its mission is to help people from
around the world create the change they want to
see.
• Change.org • Sample petitions raised were:
economic problems, criminal injustice, abuse of
human rights, lack of education, environmental
concerns, animal abuse, human health concerns
and world hunger.own concept paper on proposed
ICT Project. ALPINE SKI HOUSE
10
Planning and
conceptualizing social
advocacy
RONEVIR C. DULIN
ALPINE SKI HOUSE 104
Planning and conceptualizing the content
106
ALPINE SKI HOUSE
SPECIFIC
• (What do you want to do
or want to achieve?)
• Make sure that your goals
are focused and can
identify a concrete
outcome. ALPINE SKI HOUSE 107
MEASURABLE
.
• (When will you know when
you reach it? What are the
signs of your success?)
• Make sure that you goal is
trackable and quantifiable
108
ALPINE SKI HOUSE
ATTAINABLE
• (Is it possible for you to
reach your goal?)
• Work towards a goal that
is challenging but
possible and doable.
109
ALPINE SKI HOUSE
REALISTIC
• (Are your current skills
enough to reach your
goal?)
• Knowing yourself is the
key to your success.
110
ALPINE SKI HOUSE
TIME-BOUND
• (When exactly do you
plan to accomplish it?)
• Give yourself a deadline.
111
ALPINE SKI HOUSE
CONCEPT PAPER
Concept papers are summaries of projects or
issues that contemplate interests, experience
and expertise that commonly serves as a
purpose of delivering an in-depth discussion
of a certain topic that a person has a strong
position on.
112
ALPINE SKI HOUSE
Key points on making your
concept paper
1. Rise with a concept topic or idea that you
are genuinely interested.
2. Write down the questions associated the
topic or idea you have chosen.
3. Create a possible solution from each of the
questions that you have developed. 113
ALPINE SKI HOUSE
Key points on making your
concept paper
4. Classify what kind of data you need that
will answer your questions and identity
how will gather the information needed.
5. Identify how you will analyze, interpret,
and present the overall data you
gathered ALPINE SKI HOUSE 114
ELEMENTS OF A CONCEPT
PAPER FOR SOCIAL ADVOCACY
RONEVIR C. DULIN
ALPINE SKI HOUSE 115
1. Title Page
• The title of your concept paper will
serve a lot in terms of getting the
audience interest, so make sure to
have a short but a catchy and
interesting title of your chosen
topic. 116
ALPINE SKI HOUSE
2. Introduction
• serves as the most important part
of your concept paper.
• adding value to convince the
reader about your project’s mission
and vision. ALPINE SKI HOUSE 117
2. Introduction
a) the clear problem you wanted to solve;
b) why did you like to investigate under this
study.
c) how your research or concept paper
would be helpful for others; and
d) what is the clear evidence that your study
is beneficial and necessary to be
discussed. 118
ALPINE SKI HOUSE
3. Purpose
• This element of concept paper
includes the reasons why your
chosen project or advocacy
campaign is worth all the time
effort and money. ALPINE SKI HOUSE 119
4. Description
• This element of concept paper
includes all the necessary
information, data and details
about your project.
120
ALPINE SKI HOUSE
5. Support
• This element of concept
paper contains your budget
needed for the project.
121
ALPINE SKI HOUSE
6. Contact Information
a) name/s of the creator/s,
b) address,
c) phone or telephone number,
d) email address, and
e) website. 122
ALPINE SKI HOUSE
123
ALPINE SKI HOUSE
