MODULE OF INSTRUCTION

Graphic Design 1
Graphic Design
Here’s a thought experiment: Imagine something. Anything. Ok, are you done? You don’t have
to describe what you imagined but answer this: How did you imagine it? More likely than not,
you saw a picture or a scene in your head. That’s human nature. Humans are very visual
creatures. We rely heavily on visual images to understand the world around us.
In this chapter, you will learn how to use ICT to create images for whatever purpose you choose.
In this chapter, you will learn about graphics design.
In simple terms, graphics design is a form of visual communication that uses words and images
to express an idea or send a message.
Graphic design is used for various purposes. Take the following examples:
Figure 1.0: Safety and direction
Traffic signs are a common example of graphic design. As a rule, traffic and safety signs need to
have simple designs that are easy to understand. They also use bright colors such as yellow and
red to catch people’s attention
X.X Graphic Design
2
Figure 2.0: Branding and advertising
Effective graphics design can make ideas stick to people’s minds. For example, Coca-Cola’s
simple red and white logo is easily one of the
most popular designs in history. Graphics design is widely used in
commerce to promote products.
Figure 3.0: Public relations
KEEP CALM AND CARRY ON was a motivational poster created by
the British government to raise the morale of the population duting
World War 2. Its striking color and well-balanced typography sent a
clear message of courage and perseverance.
MODULE OF INSTRUCTION
Graphic Design 3
Digital Image
Before we start creating some graphics, first we have to learn how
digital imaging works. A digital image is simply the digital version of
a two-dimentional image. A digital image can either be a vector or a
raster.
Vector vs Raster
Figure 4.0 Vector vs Raster
Vector
A vector image file contains points, lines, and shapes. A vector image
retains its quality even if you zoom in on it. An example of vector
image is the fonts that you use in your word processor apps. Notice
how the text remains smooth and readable no matter how big or small
you make them.
Raster
A raster image is composed of a grid of dots called pixels. Each pixel
can have a different color. Therefore, groups of pixels can appear to
form an image. Most of the pictures that you see in the Internet are
raster images.
For a more detailed explanation, check out this Youtube video:
https://youtu.be/-Fs2t6P5AjY
X.X Graphic Design
4
Lossy vs Lossless
Our next topic will be image formats but we can’t understand those
without knowing the difference between lossy and lossless
compression. Compression is the method of reducing the file’s size or
the number of bits that it is composed of. Lossless compression retains
all the original data in the file while lossy compression removes some
of the data to make the file smaller.
Think of it like packing a pile of clothes into a bag. Lossless
compression is like squeezing all the clothes into the bag until they all
fit while lossy compression is very much like removing some items of
clothing from the pile so that the rest can fit into the bag.
Image File Formats
By now, you might have already noticed that some digital images have
“.jpg” at the end of their file names. Some have “.png” and so on.
These are file formats. A file format is a standard way in which digital
information is written and stored in a computer. All digital files have
formats and different formats are good for different uses. Here are the
most common formats of digital images and what they are best
suitable for:
JPG or JPEG
JPEG stands Joint Photographic Experts Group, the organization that
created it. JPEG uses lossy format. JPEG can be greatly compressed,
which makes it ideal for online use. JPEG is commonly used in
websites, and digital cameras.
GIF
You may have already heard of the debate about the pronounciation of
GIF. Some say gif as in “gift” while some say jif as in “Jill”. We’re not
gonna settle that debate here so please, pick a side and start arguing.
Anyway, GIF stands for Graphics Interchange Format. It uses lossless
compression and supports 256 colors. It is ideal for images with sharp
edges and few colors such as letters and logos. GIF also supports basic
animation.
PNG
Short for Portable Network Graphics, PNG was created as an opensource
alternative to GIF. Like GIF, PNG also uses lossless
MODULE OF INSTRUCTION
Graphic Design 5
compression. However, unlike GIF, which recognizes only 256 colors,
PNG supports 16 million colors.
GIMP
Time to do some actual graphics design. For this lesson, we will be
using GIMP. Short for GNU Image Manipulation Program, GIMP is
open-source, which means anyone can download and use it for free.
First, some background information. GIMP has been around for 20
years now. It was first released in 1996 under the name General Image
Manipulation Program. Eventually, the word general was replaced by
GNU. Without going into much detail, GNU is the operating system in
which GIMP was first associated with.
To be perfectly honest, GIMP is quite complicated. It’s probably the
most complicated app that you will use this semester and there’s no
way we can discuss everything in just one chapter. But don’t worry
because you don’t have to learn everything about GIMP in order to use
it effectively. Think of it like a car. You don’t need to be a highly
trained professionl to drive one. You just need the basic skills. The rest
of it, you will learn along the way.
Download and Installation
Downloading and installing GIMP is pretty straightforward. First, go
to their official website at gimp.org. One of the first things that you
will see is the download link for the latest version. Just click it to start
your download. Once you’ve downloaded the installer file, open it and
follow the instructions to instll GIMP.
X.X Graphic Design
6
The User Manual
As meantioned earlier, GIMP is quite complex and we won’t be able
to discuss every detail in this chapter. Fortunately, there’s a free user
manual, which can be accessed from the GIMP website. Simply click
the Docs tab then click the link for the English user manual.
For the rest of this chapter, we will only be discussing the bare basics
of GIMP. However, further information about every item that we will
discuss can be found in the user manual.
Creating a Document
To create a new document, click File then New. In the window that
will open, you can set the size of the image. Click the px dropdown
button to select what unit of measurement you want to use. You can
choose from pixels (px), inches, millimeters, centimeters, etc. Click
OK once you’re done choosing.
MODULE OF INSTRUCTION
Graphic Design 7
Basic Concepts:
Here are some of the most important concepts that you need to be
familiar with.
Images
In GIMP terms, an image is a single file like a JPG or a PNG. In the
GIMP app, a single window display corresponds to one image
Layers
An image can be composed of one or several layers. Basically, a layer
in itself is an image with transparent areas. Layers are stacked on top
of each other to form an image. An image or a GIMP file can have one
or several layers. We’ll discuss this further later in this lesson
Resolution
By now, you’re already familiar with pixels. Resolution is the ratio
between the size of the image in pixels and its physical size when
printed on paper. The more pixles there are in an image, the better the
quality of the image is. The most common unit of measurement for
resolution is pixels per inch or ppi.
Selections
When using GIMP, you will want to isolate some parts of an image so
that your actions will only apply to that part and not to the rest of the
image. This part is called a selection. In GIMP, moving dashed lines,
which are sometimes called “marching ants”, marks a selection. There
are several ways to make a selection, which will be discussed later.
Undoing
You can undo an action or go back to the state of the image before the
action is done. This is useful when you make mistakes. For example, if
X.X Graphic Design
8
you accidentally erased a part of an image, you can simply undo the
erase action and start over. GIMP keeps track of your actions or your
history. This feature will allow you to undo several actions at once.
Main Windows
Before we proceed, you may want to know that GIMP has 2 modes.
The first one is the multi-window mode, which is usually the default
mode. Frankly speaking, multi-window mode is needlessly
complicated. You may want to switch to the other mode which is the
single-window mode by clicking Windows (top part of the screen)
then Single-Window Mode.
Now that’s out of the way, let’s talk about the main windows in the
GIMP app. There are five main windows that are composed of dozens
of different functions. Again, we won’t be discussing everything in
detail. More detailed information can be found in the user manual.
(http://docs.gimp.org/2.8/en/gimp-concepts-main-windows.html)
Some of these windows can be moved. As a beginner, it is advisable to
not move any of these windows to avoid confusion.
1. Main Toolbox
The main toolbox contains several icons. Each icon represents
a tool. At the bottom of the main toolbox, you will see the
foreground and background colors.
MODULE OF INSTRUCTION
Graphic Design 9
2. Tool Options
Below the main toolbox is the Tool Options. Here, you will see
the options for the tool that is currently selected. In the
example below, Tool Options shows the options for the brush
tool.
3. Image Window
In the middle of the screen, you will see the image window.
This is the window that displays the image that you are
currently working on. It is possible to open several image
windows at once but you can only work on one image window
at a time.
X.X Graphic Design
10
MODULE OF INSTRUCTION
Graphic Design 11
4. The Layers, Channels, Paths, Undo History dock
This window is in the upper right part of the screen. Layers,
Channels, Paths, and Undo History can be accessed through
tabs in this window.
5. Brushes/Patterns/Gradients
Another tabbed window, this one can be found it the lower
right part of the screen. Each tab manages brushes, patterns,
and gradients, respectively.
X.X Graphic Design
12
Exercise: Birthday Party Invitation
In this exercise, we will learn to make a simple invitation for a kid’s
birthday party. The methods that we will be using here can also be
applied in creating other kids of graphics like posters, tarpaulins, and
flyers.
Step 1. Create a new image.
Because this image will be printed, we need to make sure to use a
good resolution. Click Template and select 1024x768. Click the arrow
beside Advanced Options and type 300 in the resolution. Finally, click
OK.
Step 2. Change the background color
a. Select a forground color at the bottom of the main toolbox.
b. Select the Bucket Fill Tool (the bucket icon)
c. Click anywhere in the image window to apply the color to the
background layer.
MODULE OF INSTRUCTION
Graphic Design 13
3. Add pictures
In this case we will be using a birthday cake clipart that we found
online and a picture of the birthday celebrant.
a. Drag and drop the clipart to the image window. This will create
a separate layer for the picture.
b. Use the Scale tool (shortcut: shift+T) to resize the image
c. Use the Move tool (shortcut: M) to move the picture
4. Add Text
To make sure that the colors in our design match, simply copy colors
from other parts of the image and use them as font colors.
a. Select the color picker tool (shortcut: O) and click on the color
that you want to copy. This will set the copied color as the
foreground color.
b. Right click anywhere in the image then click layer, New Layer,
and then OK. This will add a new blank layer.
c. Select the Text tool (letter A icon) then click and drag in the
image. Type your text and use the tool options to customize the
font syle, color, size, etc.
You can repeat this step several times to add different text styles.
X.X Graphic Design
14
5. Save your work
a. Click File then Save (or use shortcut Ctrl+S). Type a name for
your image then click Save. This will save a GIMP file for
your image with the extension xcf. Use this file if you want to
edit your image.
b. To save your project in an image file format, click File then
Export (Ctrl+E). Click the arrow beside Select File Type and
choose a format. By default, the export format is png. Which
will do just fine. Click Export.
c. Finally, go to the folder where you exported the image and
open it.
d.
MODULE OF INSTRUCTION
Graphic Design 15
Tips:
Now that we’re done with the technical stuff, here are some tips that
you can follow:
1. Consider the viewer.
Remember that graphic design is a form of communication so
always consider if your work will capture your intended
viewers’s attention and if the message that you want to convey
will be clearly understood. When choosing between what you
like and what the viewers will like, always choose the what
your viewers will like.
2. Learn from other people.
If you encounter a problem or if you want to learn a new trick
in GIMP, just google it. More often than not, you will find a
how-to guide, a forum thread, or an instructional video about
the topic.
3. Take advantage of free stuff.
The Internet is full of free graphic design resources like stock
photos, color palettes, fonts, etc. Just be careful not to
plagiarize or break copyright laws.
4. Keep it simple.
If your design has too many elements, the viewers may get
confused and lose interest. So keep your design simple. Do not
use more than two fonts. Choose matching colors. Focus on
one element and make the other elements match it.
MODULE OF INSTRUCTION
The Current State of ICT
Web Content Development
Web content development is the process of planning, researching,
creating, and maintaining information for online publication.
Practically, all information that we see in websites is produced using
this practice.
As of 2016, there are more than 1 billion websites in the Internet.
(source: internetlivestats.com) Because of this, coming up with ideas
for new websites has become a very challenging task. In a time where
there is 1 website for every 7 people in the planet, how can we create
web content that is unique, useful, and interesting to the public?
What is web content?
Web content is the term used to describe text, sounds, images, videos,
and other media that are published in a website.
What is web traffic?
Web traffic is the number of visitors in a website and the number of
web pages that they visit. Web traffic is used to measure the popularity
of websites and web contents.
Web Content Lifecycle
Web content lifecycle is a series of steps or phases that web content
has to go through before and after it is published. There are no official
steps for web content lifecycle because people and organizations that
develop and publish web contents have different practices and
methods. However, for the purpose of this lesson, we will be exploring
5 most common stages:
1. Planning
The logical first step, planning is where the idea for a web content is
born. In this stage, we determine what type of web content should be
created, how it fits in the website’s objectives, and whether or not it
will be interesting to the readers. Here we also lay out important
details such as budgets and deadlines.
X.X Online Search
2
2. Creation
After a solid plan has been created, it is time to create our web content.
The creation stage involves research, writing, and other creative tasks
such as graphics design, photography, and video editing.
3. Deployment
After the content is completed, it is now ready to be delivered to the
readers. Deploying web content may not be as simple as posting a
copy of it in a website. It has to be made available to different regions
and different types of devices and Internet browsers. The content may
also have to be translated to different languages in order to be more
accessible to people from all around the world.
3. Promotion
Web content needs to be seen by as many people as possible but just
because your web content can be accessed by anyone doesn’t mean
that everyone will see it. Promotion has to be done to persuade Internet
users to view web contents. Here are some strategies that are used to
reach potential viewers:
a. Social media
Internet users spend most of their online time in social media
sites and apps like Facebook, Twitter, and Instagram. This
makes social media a great way to attract potential website
visitors. It is now a common practice for websites to have
social media accounts so they can reach out to people and
promote their contents.
b. Paid ads
Basically, you can pay others to promote your content for you.
Many websites earn money by displaying advertisements for
products, services and other websites. For example, you may
see short commercials that play before Youtube videos or
search-related ads at the top of your Google search results.
c. Email advertising
Websites can ask users to sign up and receive emails that will
inform them about the latest contents and offers. These email
newsletters are often sent in a regular basis and contain links
that will direct the recipient to the featured content
MODULE OF INSTRUCTION
The Current State of ICT
d. Web syndication
You can give other websites permission to publish your
original contents. These websites are required to give you
credit and even include a link to your website. This will make
your contents visible to other websites’ traffic.
e. Search Engine Optimization
SEO is a popular practice used to make web contents more
visible to online search engines. There are numerous SEO
techniques but all of them require knowledge of how search
engines work and how people use them. For example,
keywords that are related to your content’s topic are
strategically placed in titles, sentences and URLs to increase
the chance that a search engine will pick up your content
whenever someone searches for these keywords.
4. Maintenance
Web content maintenance is the process updating existing web
contents. Certain elements of the content such as pictures, statistics
dates and sources can be updated to keep it fresh, useful, and
interesting to the viewers. Aside from constantly creating new
contents, updating the old ones is a good way to attract web traffic.
Web content can generate a steady stream of traffic for years if it is
properly maintained.
5. Retirement
During this step, old and unpopular web contents are removed from
the website. These web contents can either be archived or permanently
deleted. Web content that become outdated or unpopular have to be
removed for several reasons:
Digital information takes up memory space. Removing old and
unused contents will free that can be used to store new data.
Removing the old and unpopular web contents brings focus to
the new and popular ones.
Outdated contents are bad for the website’s image. If a website
has more old contents than new ones, viewers may get the
impression that it is poorly managed and not credible.
What is archiving?
Archiving is the process of gathering and preserving information for
future use. Outdated web contents can be unpublished and moved to an
X.X Online Search
4
archive instead of being totally erased. Archived content can be
viewed in the archive and used as a source of historical data.
Content Management System
A Content Management System or CMS is a software application or a
set of softare applications that is used to create, publish, and manage
online content. Modern CMS applications have collaborative
environments, which allow multiple users to work on a single project.
Today, you don’t have to be a programmer or an ICT expert to create
and publish web content. In this lesson, you will learn how to work in
a team to produce and promote your very own content.
Blog:
Short for weblog, a blog is an online journal owned by an individual or
a group. A web content that is published in a blog is called a post and
bloggers normally publish them on a regular basis. Unlike a website
which has it’s own unique web address which has to be bought, a blog
can be hosted by a CMS for free.
WordPress
Wordpress is one of the top content management systems today. It is
free and easy to use. In this lesson, we will learn how to create a
WordPress blog.
How to Create a WordPress Blog
Figure 1. The WordPress homepage
MODULE OF INSTRUCTION
The Current State of ICT
To begin, go to wordpress.com. Here you will see the “Get Sterted”
button. Click this and you will be taken to the first step of the creation
process.
Step 1: Select a category.
Figure 1.1. What is your website about?
In the list provided, select a category that best describes the type of
contents that you will be creating.
Step 2: Select a layout.
Figure 1.2. What would you like your homepage to look like?
A layout is how the parts of your blog will be arranged. Choose one
that suits your taste.
X.X Online Search
6
Step 3: Select a theme.
Figure 1.3. Choose a Theme
A theme is a set of design elements such as font, colors and icons that
work together to your blog a certain style. WordPress themes can be
changed so the one that you will select in this step will not be
permanent.
Step 4. Find a domain name
Figure 1.4. Let’s find a domain
During this step, you will be asked to name your domain. WordPress
will check if the name that you selected is available. If it is already
tken, wordpress will suggest a name close to the one that you chose.
Free blogs have “wordpress.com” included in the domain name.
MODULE OF INSTRUCTION
The Current State of ICT
What is a domain?
As the name implies, your domain is your online territory. A domain is
a part of the Internet that is under the control of a particular person or
group. Examples of domain name are wordpress.com and ama.edu.ph.
Step 5. Select a plan
Figure 1.5. Pick a plan that's right for you.
For the purpose of this lesson, just select the Free Plan.
Step 6. Create a WordPress account
Figure 1.6 Create your account
You will need a wordpress account to access your blog. To create one,
enter your email address and set a password then click the “Create My
Account” button. WordPress will send you an email. Open the email
and click the “Confirm now” button. This will open the log in page.
Enter your email address and password to complete access your blog.
X.X Online Search
8
Figure 1.7 Check out amaempowertech.wordpress.com. This is
an actual blog created using the steps that we just learned.
Congratulations! You have successful created a blog. You can now
explore your WordPress account and post your original web content. If
you need help on how to use WordPress, you can visit its support page
at en.support.wordpress.com
MODULE OF INSTRUCTION
Online Search 1
Web Page Design
By now, you probably have a clear understanding of how the Internet
works. You probably already know that electronic data is stored in
computers and shared with other computers through a massive global
network. Now, think about how this information is presented to you.
As a user, you prefer to view information in a manner that makes sense
to you. Information should be delivered in a way that is organized and
easy to locate and understand. This is achieved through websites. In
this chapter, we will learn what makes up a website and what goes into
building one.
What is a website?
In simple terms, a website is a collection of web pages that can be
accessed through the Internet. A website typically serves a single topic
or function. Technically speaking, a website an online location that
points to a group of web pages.
What is a web page?
A web page is an electronic document that is stored in a server and can
be accessed through the Internet using a web browser. Web pages are
the backbone of websites.
Parts of a website
When designing a website, you have to take into consideration the
people who will use it. One of the main goals of a designer is to make
the website simple and easy to use. This is why even though some
creative liberties can be taken in designing a website, it is still
important to include features that the users are familiar with.
The following are the most common components found in websites:
1. Header
Also known as a masthead, the header is usually located at the
top of each web page and contains the website’s name and
logo. Its purpose is to display the websites name and logo in
order to make it instantly recognizable to users.
2. Navigation
The navigation section is an interactive list that contains the
names of the webpages in a website. It can be located
X.X Online Search
2
anywhere in the webpage but it is preferable to place it where it
can be easily seen. Users can go to another web page by
clicking its name in the navigation.
3. Content Section
As you may already know, contents are the main focus of any
website. Contents like texts, images, and videos take up the
largest space in websites.
4. Contact Section
The contact section is usually in a separate web page. It
contains the website’s contact information such as phone
numbers, email address, and office address. It is also a
common practice to add a message box in the contact section
so that the user can leave a direct message for the website
owners.
5. Call to Action
A call to action is a message or instruction that urges the users
to do an action. It is typically in the form of a command like
“Click here”, “Sign our petition” or “Watch the trailer here.”
This is important to websites that are created to gather public
response such as advocacies and commercial enterprises.
6. About us
“About us” can be a section or a page that tells the users about
the persons or organization that owns the website. The purpose
of this page is to establish the credibility of the website owner.
It usually contains a biography or history of the owner, their
achievements and their Mission and Vision.
7. Footer
As the name implies, the footer is always at the bottom of the
web page. Its purpose is to display links to important
information. The most common details that can be accessed
through the footer are Terms of Service, Copyright
information, FAQ’s (frequently asked questions) and personal
information about the creators of the site.
MODULE OF INSTRUCTION
Online Search 3
Weebly
It is not surprising to learn that most commercial websites are created
and maintained by skilled and experienced developers. Such skills and
experience are required to come up with unique and groundbreaking
designs and features.
However, there are also ways to design a website even if you are not a
programmer or a designer. There are tools called website builders that
can be used to create websites without having to write code. These
tools can either be native or web-based. For this lesson, we will learn
how to build a website using one of these tools.
We will be creating a website using Weebly. Weebly is a web hosting
service and a website building tool. Weebly relies primarily on its
drag-and-drop feature to place and manipulate design elements.
You can use weebly for free but you can also sign up for a paid
membership to gain access to exclusive features.
Follow these steps to sign up and create your website:
Step 1. In your web browser, go to www.weebly.com
Step 2. Click Sign Up. In the Sign Up window, enter you name, email
address and your preferred password then click the Sign Up button at
the bottom.
X.X Online Search
4
Step 3. Select a theme. The themes are grouped into categories such as
Business, Online Services, Personal, etc.
Step 4. Choose Your Website Domain. Type your preferred domain
name under the “Use a Subdomain of Weebly.com” box. As a free
user, your address will have “.weebly.com”
MODULE OF INSTRUCTION
Online Search 5
Step 5. Get started. Your website has been created. Now you can start
designing it.
Website Design
Explore the following features to come up with your own designs.
Weebly provides tutorial articles in their help center. Check them out
here: https://hc.weebly.com/hc/en-us
Each design element that we will discuss will include a Youtube video.
These videos were created by Weebly as quick reference materials for
first-time users like you:
Dashboard
The dashboard or home page is the first page that you will see after
you log in. From here, you can access the other features like the page
editor. Here, you can also see statistics related to your website.
X.X Online Search
6
Elements
On the left side of the Editor page, you will see Weebly Elements.
Weebly elements is a collection of design elements that you can add to
your website.These include text, image, slideshow and map. To add an
element, click, drag then drop it to the spot where you want to place it.
Check out this video to learn more about elements:
https://youtu.be/CXFZ-0HHO1I
Pages and Navigation
You can add multiple pages in your website through the Pages tab.
Here you can also edit, copy and delete existing web pages.
A navigation feature is automatically included in your website but its
design and location depends on the theme that you use.
For more details, check out Weebly’s how-to video about pages and
navigation: https://youtu.be/a7_LQq1teyo
MODULE OF INSTRUCTION
Online Search 7
Themes
You can change the look of your website in the Theme tab. Here you
can select a different color scheme or change your website’s theme
and fonts
To select a new theme, click Change Theme, which will bring you to
the Theme Gallery. Browse thrugh the categories to find a theme that
you like. Weebly themes work with computers and mobile devices.
To learn more, follow the instructions on this video:
https://youtu.be/4TZqFc5bDhA
Page Layout
Weebly layouts are sets of elements that you can add to your website.
By using a layout, you can immediately fill your pages with matching
elements. You can then edit these elements to add your own details.
To do this click “Choose a Layout” in the middle of a blank page. This
will open the list of layouts grouped by category. Click a layout to see
a preview of it. Click Keep to use this layour or Cancel to go back to
the list.
Video reference: https://youtu.be/Vu4lwfbO6ko
X.X Online Search
8
Activity: Designing your own website
In this activity, you will use everything tht you have learned so far in
designing your own website.
Before we start, you have to think of a purpose for your website. It can
be the official website of an organization, a personal website that
features your portfolio, or a marketing site for selling your products.
For this activity, we will be designing a website for our subject;
Empowerment Technologies.
1. Choose your theme.
By now, you should alreay know how to open the Editor page. To start
building your website, first select a theme. You can use the one that
you selected during signup or if you want to, you can change it in the
THEME tab. Each theme comes with a default image but you can
easily change it.
2. Design your home page
By default, your website has one page. We will turn this page into the
Home page. Change the page name to Home. You may notice that the
lower part of the page is blank. Click “Start with a Layout” and select
a layout that will fill this part. Remember that all Elements can be
customized. You can move or delete elements or add new ones in the
BUILD tab.
MODULE OF INSTRUCTION
Online Search 9
3. Add more pages
You can add and design more pages depending on what your website
needs. For the Empower-Tech website, we will add pages for
Chapters, References, and Activities.
To add a new page, click the + sign in the PAGES tab then click
Standard Page. You can experiment with other types of pages like
Blog and Store but most of the time, Standard is what you’ll need. Add
a name for your page. The name of the page will automatically appear
in the navigation section.
Like what we did in the Home page, you can customize your header
and add elements either by using a layout or by manually adding them
from the BUILD tab.Activities
4. Add an About Us page
As discussed earlier in this chapter, the “About Us” page or section
contains information about the owner of the website. In this case, the
owner is you. Create a new page named “About Us” if you work in a
team or “About the Author” if you work alone. Add some details about
yourself such as your experience in the website’s topic, your career,
and your other projects.
There are Layouts that are designed specially for this purpose. You can
choose one of the “About” layouts and add it to your page.
X.X Online Search
10
5. Add a Contact Us page
As you already know, it is important to give your readers a way to
contact you. This is accomplished by adding a Contact Us page. For
this activity, you don’t have to include your real contact details. Just
add dummy phone numbers, email addresses, etc.
Just like the “About” page, you can use a layout designed for the
Contact page. You can also build it from scratch from the BUILD tab.
There you go. That’s pretty much all the components that your website
will need. It may look generic now but imagine what you can
accomplish if you spend more time adding contents and improving the
design.
To see the website that we created, go to
http://empowertechlessons.weebly.com/. Don’t forget to check out the
mobile version in your phone’s browser
MODULE OF INSTRUCTION
Online Search 1
Presentation Skills
A presentation is the delivery of a topic to an audience using a
combination of speaking and visual aids. In this lesson, we will learn
how to create and deliver presentations with the aid presentation
programs.
Prezi
Introduction:
http://prezi.com/cdntnn993dyb/?utm_campaign=share&utm_mediu
m=copy&rc=ex0share
Prezi is a web-based presentation program. Because it’s web based, it
can be accessed using an Internet browser and does not need to be
installed in your computer. Prezi can be used for free although they
also offer paid services. The main difference between the two is that
presentations created using free accounts can be viewed by anyone
while paying users can make their presentations private. For this
lesson we’ll be using Prezi’s free services.
How to create a Prezi account
Signing up is easy. Follow these steps to create your own prezi
account:
Step 1:
Go to prezi.com and click GET STARTED
X.X Online Search
2
Step 2:
In the pricing page, click CONTINUE FREE to avail of Prezi’s free
services.
Step 3
Enter your first name, last name, email address and preferred password
then click Create your free Public account.
MODULE OF INSTRUCTION
Online Search 3
Step 4
At this point you have successfully created your Prezi account. Click
Get started to view a short tutorial.
Creating your first prezi
Video Tutorial: https://youtu.be/WGckQjH_tMM
Now that you have a account it is now time to log in and start creating
your first prezi. Follow these instructions and watch the video to get
started:
Step 1
Go to prezi.com and log in using your email and password
X.X Online Search
4
Step 2
In your dashboard, click Create a new prezi.
Step 3
There are 2 ways to do this next step. First, you can search for a
template by typing a keyword in the search bar. Once you’ve found
one that you like, click it then click Use template.
You can also choose to start from scratch by clicking Start blank prezi.
MODULE OF INSTRUCTION
Online Search 5
Step 4
Whether you choose to use a template or start from scratch, you will
be directed to the prezi editor. Here you can add your contents and
costumize your prezi. Follow the instructions on this video to get an
idea: https://youtu.be/WGckQjH_tMM
The Prezi Editor
Video tutorial:
https://youtu.be/_kwA4TU-x4Q
Tutorial article:
https://prezi.com/support/article/steps/getting-to-know-the-prezi-editor/
Top menu
The Prezi editor’s top menu contains many essential controls and
information.
The left side contains the title of your prezi, the undo (left arrow) and
redo (right arrow) buttons, the save button and the time when your
prezi was last saved
X.X Online Search
6
On the right side, you will find the insert menu where you can add
content and the customize button.
From the right side, you can play your presentation, share your
presentation, change the screen ratio, and exit the Prezi editor.
Transformation tool
Use the transformation tool to manipulate and customize the objects in
your canvas. With it you can change the frame type, change the color,
resize, rotate, etc.
MODULE OF INSTRUCTION
Online Search 7
Text box
Click anywhere in the screen to add a text box. Use it to add and
customize texts
Zoom buttons
Hover your cursor on the middle-right part of the screen to see the
zoom buttons. Click the + icon to zoom in, the – icon to zoom out, and
the home icon to display the whole canvas.
Left Sidebar
The rectungalar bax on the left side of the screen is the left sidebar.
Use it to add a new frame and edit your path. The path is the order in
which your frames are displayed.
X.X Online Search
8
Navigating your Canvas
Video tutorial: https://youtu.be/rdILh2hOnzc
Panning
To move around the canvas, click and hold anywhere in the screen
using your left mouse button then drag to any direction.
Zooming
There are several ways to zoom in and out of your canvas.
Click Zoom to frame in the transformation tool
Use the zoom buttons on the right side of the page
Scroll using your mouse wheel
To learn more about Prezi, visit their knowledge base at:
prezi.com/support/article
There you will find many tutorials with articles and videos.
Creating an Effective Presentation
Not that you’ve learned the basic and some advanced skills in using
presentation tools, it is now time to focus on how you present your
topic. The following are some of the most common mistakes that
presenters make. After each one is a guideline that you can follow to to
avoid making the same mistakes.
(Source: RBS Empowerment Technologies)
Minimize
The mistake:
It is quite common for inexperienced presenters to use too many slides
or frames. Doing this will make the report unnecessarily long. The
audience may eventually lose focus and get bored.
The solution:
Use as few slides as possible. Include only the most important details
in the slides and deliver the supporting details by speaking. This way,
the audience will have an easier time absorbing the topic.
Clarity
The mistake:
Presentations are almost always designed in computers with small
screens then presented in a bigger monitor or projector. Because of
MODULE OF INSTRUCTION
Online Search 9
this, the scale of the texts can be misjudged. The text can be too small
when viewed from a distance.
The solution:
Consider how your audience will view your presentation. If you will
be speaking to a large audience, use bigger fonts so your report can
still be read from the back of the room.
Simplicity
The mistake
Another common mistake that beginners make is to write the whole
report in the slideshow and just read it to the audience. This defeats the
purpose of using visual aids in your presentation. If what the slideshow
and the speaker say are the same, then the audience can just listen and
not read the slides or read the slides and not listen.
The solution
First of all, do not use your slideshow as a script. The slideshow
should only contain a summary of the report and not the report itself.
Use bullets, numbered lists and short lines instead of paragraphs and
long sentences.
Visuals
The mistake
It’s easy to get over-excited with graphics, colors and fonts. Using too
much animation, bright colors and fancy lettering can distract the
audience from the topic.
The solution
Use simple design elements. It is ok to animate your slides and
customize your texts as long as they are easy to read and not
distracting.
Consistency
This is a mistake that is usually made by those who are just starting to
learn the features of a presentation program. The slides may end up
looking different from each other, with different fonts, different colors
and an assortment of non-uniform graphics.
X.X Online Search
10
The solution
Plan your design right from the beginning and stick to it throughout
your presentation. Most presentation programs allow you to set the
default look of every slide. Use this feature to keep your design
uniform.
Contrast
The mistake
Some colors simply do not match. A mismatched background and font
color can render the text unreadable.
The solution
Make sure that your text has a good contrast with your background.
Use a dark background with light text and vice versa.
It is also important to remember that your slideshow or prezi is only
one part of your presentation. It is a useful part of your presentation
but it is not the most important part. Your main goal is to make the
audience understand your topic and ideas. Coming up with a cool prezi
or slideshow does not ensure that your presentation will be successful.
Here’s a short video about how to give a powerful presentation. Notice
that the speaker didn’t even use a presentation tool. He just used a
white board and a marker as visual aids.
https://youtu.be/i68a6M5FFBc
MODULE OF INSTRUCTION
Online Search 1
Collaboration Tools
Now that you have an idea of how the team setting works, it’s time to
learn about the tools that you will need.
Groupware
Collaborative software or groupware are programs or sets of programs
that people use to achieve a common goal. These tools allow people to
share information and communicate with each other even if they are in
different locations. In the ICT community, it is now a common
practice for people in different countries to work together on a single
project.
Types of Groupware
1. Synchronous groupware
These are groupware or collaborative tools that allow the
sharing of information in real-time. This means that the
recipient can instantly see the information that was sent or
shared. Synchronous groupware include but are not limited to:
a. Online chat
This is a technology that enables two or more people to
send and receive short messages instantly. Messages
sent by all parties are displayed in a chat room or chat
box and can be viewed by all members.
b. VoIP
It is safe to say that VoIP is simply an Internet-powered
telephone service. Short for “voice over Internet
protocol”, this technology allows people to make voice
calls through the Internet.
c. Videoconferencing
Videoconferencing is the collection several ICT
technologies that allow 2 or more people to
communicate through real-time audio and video. The
most popular example is Skype.
X.X Online Search
2
2. Asynchronous groupware
Information shared using asynchronous groupware are not
instantly displayed to other members of the group. Most of the
time, participants are free to choose when they want to view
the shared information. Asynchronous groupware include but
are not limited to:
a. Email
As discussed in a previous chapter, emails are sent and
stored in the receipient’s inbox. The receipient can then
read the email when he logs in.
b. Online forums
Also known as message boards, forums are online
services where people can post messages for others to
read and reply to. Forums are virtually identical to
comment sections in social networking sites.
c. Wiki
By now, you must know what a wiki is. Wikis qualify
as asynchronous collaboration tools because they can
be edited by members of an online community.
d. Shared calendar
A shared calendar is simply an online calendar with
many users. Shared calendars are used by groups to
coordinate time and schadule activities.
What to remember:
Some apps and services have both synchronous and asynchrounous
features. Skype, for example focuses primarily on video conferencing
but also has a feature where users can record and send voice messages.
MODULE OF INSTRUCTION
Online Search 3
Google Drive: Cloud Based Collaboration
As you have learned in the beginning of this course, cloud computing
is currently one of the most powerful and promising ICT technologies.
Now, we will learn the practical applications of cloud computing in a
collaborative environment. In this lesson, we will be exploring Google
Drive.
Google Drive is a cloud-based file storage and sharing service owned
and operated by Google. Google drive is a software suite or a
collection of several programs that allow users communicate and
create, store and share files. Google Drive can be used for free by
anyone with a Google/Gmail account.
My Drive
Video Tutorial: https://youtu.be/jWvKAYKlnnM
My Drive is Google Drive’s home page or main page. Google Drive
productivity apps, which we you will learn about later in this chapter,
can be launched from My Drive. From here, you can also access the
files that you have created as well as the files that other people shared
with you. This is also
How to open My Drive
There are 2 ways to open My Drive. First, in your Gmail account, click
the square icon on the upper right hand of the screen then click the
Drive icon. This will open My Drive in a new browser tab.
X.X Online Search
4
To open My Drive directly, go to drive.google.com. You may have to
log in using your Google (Gmail) account If you haven’t done so
already.
How to upload a file
You can upload any type of file to google drive. There are 2 ways to
do it. The first one is via the “NEW” button:
Step 1. Click the red “NEW” button then click File upload
MODULE OF INSTRUCTION
Online Search 5
Step 2. Select the file that you want to upload.
Step 3. Wait for the upload to finish.
The simpler way to upload a file is by simply dragging and dropping it
to the My Drive page.
X.X Online Search
6
How to share a file
File sharing is one of Google Drive’s primary features. Follow these
steps to share a file that you have uploaded:
Step 1. Right click a file in My Drive then click Share.
Step 2. Enter the name or email address of one or more person whome
you want to share the file with. You can also choose if they will be
allowed to edit the file or if they will be restricted to viewing and
commenting. Once your finished, click Done.
MODULE OF INSTRUCTION
Online Search 7
How to open a file
Files like Word documents, spreadsheets, Powerpoint presentations,
audio, and video can be opened and viewed in Google Drive. If you
doubleclick an uploaded file, Google Drive will analyze it to
determined if it can be opened.
Google Drive Productivity Apps
Source: https://support.google.com/
“Overview of Google Docs, Sheets, and Slides”
Google Docs, Sheets, and Slides are collaborative productivity apps
that are included in Google Drive. They have features and controls that
are very similar to other popular office productivity suites like
Microsoft Office so if you ar familiar with Microsoft Word, Excel, and
Powerpoint then learning Docs, Sheets and Slides will be easy.
Furthermore, Google Drive productivity tools can recognize and open
Microsoft Office file types like doc and xlsx.
There are 2 ways to access these apps. First is by clicking the New
button in My Drive. Doing so will open a list of options that include
Google Docs, Google Sheets, and Google Slides. Simply click one to
get started.
X.X Online Search
8
The second way is to click My Drive then clicking on one of the three
apps.
Real-time collaboration
Google Docs, Sheets, and Slides also allow real-time collaborative
editing, which means that several people can view and edit documents
at the same time. To use this feature, first you have to share your
documents.
Sharing Docs, Sheets, and Slides documents is practically the same as
sharing uploaded files. In all three programs, just click the Share
button on the upper right hand corner. This will open the “Share with
others” window just like the one in My Drive.
MODULE OF INSTRUCTION
Online Search 9
Google Docs
Google Docs is a web-based word processor program. It has features
and controls that are similar to Microsoft Word and LibreOffice
Writer.
Here are some of Google Docs’ features:
Your documents will be stored in the Cloud. You can log in
and edit your files using any computer that is connected to the
Internet.
Your work will be constantly automatically saved as long as
you are connected to the Internet.
Shared documents can be opened and edited by several people
at the same time.
Your documents can be downloaded in different formats like
Microsoft Word, OpenOffice and PDF
For more lessons about how to use Google Docs, you can visit
https://support.google.com/docs/topic/21008
X.X Online Search
10
Google Sheets
Google Sheets is a Google Drive’s spreadsheet app. It works a lot like
other popular spreadsheet programs like Microsoft Excel and
LibreOffice Calc.
Google Sheets’ features include:
Spreadsheet formatting such as font, text color, background
color and text size
Auto-save functionality
Spreadsheet sharing and real-time group editing
Download your spreadsheet as Microsoft excel, PDF, and other
formats
For more instructions on how to use Google Sheets, you can visit
https://support.google.com/docs/topic/20322
MODULE OF INSTRUCTION
Online Search 11
Google Slides
Google Slides is an Google’s presentation app. It looks like and works
a lot like Microsoft Powerpoint. The main difference between the two
is that Slides is cloud based while Powerpoint is native program.
Here are some of its features:
Ready-made presentation templates
Add pictures and videos to your presentations
Import and edit Microsoft Powerpoint presentations
Presentations can be shared to and viewed by others
Presentations can be downloaded as other formats such as
Powerpoint, PDF and jpg
Check out Google’s introduction to Slides here:
https://support.google.com/docs/topic/19431
MODULE OF INSTRUCTION
ICT For Social Change 1
ICT For Social Change
By now, you must already have a clear idea as to how ICT has
changed the way people work, learn, play, and communicate.
In this chapter, you will learn how Information and Communications
Technology helps society as a whole.
ICT and Society
Now, knowing how much ICT can improve your life, imagine how it
can improve society as a whole. Here are some examples of how ICT
was used to help others and influence social change.
Disaster Response
The Internet has proven to be an effective way to collect and share
information during emergency situations. The following are two
examples of online applications that are currently used to deliver
valuable data during natural and man-made disasters:
Google Person Finder
Google Person Finder is an open source web application. Volunteer
engineers from Google created it after the Haiti Earthquake back in
2010. It serves as a center for collection and delivery of information
that can help disaster survivors and relief and rescue operations.
X.X ICT For Social Change
2
People can use this app to search for their loved ones after a disaster.
Google Person Finder collects data from several sources sich as CNN
and The New York Times and makes it available to the public in
several languages, focusing on the native language of the disaster
stricken areas.
It also searves as an information hub where people can see crucial
information such as satellite photographs, locations of evacuation
areas, road conditions, etc.
So far, Google People Finder has been used in the aftermath of dozens
of natural and man-made disasters including:
Haiti Earthquake (2010)
Chile Earthquake (2010)
Pakistan Flood (2010)
Boston Marathon bombing (2011)
Typhoon Haiyan/Yolanda (2013)
For more information, you can visit google.org/personfinder.
Facebook Safety Check
Facebook Safety Check is a Facebook feature that is activated during
and after natural and man-made disasters. It enables Facebook users in
disaster stricken areas to let their friends and family know that they are
safe.
MODULE OF INSTRUCTION
ICT For Social Change 3
Because Facebook can track your current location, they can determine
if you are in an aread affected by a disaster. Facebook then gives you
the option to use the Safety Check feature to mark yourself as “safe”.
It will then make this information available in your contacts’ news
feeds.
Charity
Electronic money transfer is a technology that has revolutionized
commerce in the 21st century. Recently, it has also been used to collect
funds to help people in need.
One great example was the support that came in the aftermath of
Typhoon Yolanda. Several organizations form all over the world such
as the United Nations Children’s Fund (UNICEF) collected donations
through online oney transfer platforms like Paypal.
Social Awareness
Change can start with social awareness. In recent times, ICT has been
used to inform the public about issues that affect people. This
awareness can cause people to act and work together to find a solution.
Youtube video: https://youtu.be/AmesCzIN0uc
You may remember the ALS Ice Bucket Challenge that went viral a
couple of years ago. It is probably the most successful attempt of using
social media to raise awareness and gather donations for a cause. In
this case, the cause was for the research about a disease called
amyotrophic lateral sclerosis or Lou Gehrig's Disease.
The movement has a generated more the 220 million dollars of
donations. (Source: als.net/icebucketchallenge)
Petitions
A petition is basically a request to do something. Traditionally, a
petition is a document signed by concerned persons and is addressed to
a governing body such as school administration or local government.
The aim of a petition is to express the people’s opinion about a certain
issue and to persuade the governing body to take action.
Today, petitions can be created and signed online. This makes it easier
to reach out to the public. There are several websites that host online
petitions.
X.X ICT For Social Change
4
Change.org
Change.org is an online petition site that hosts petitions for free. You
can use it to start a petition or sign petitions created by others.
To sign up, just go to change.org and click log in. It will give you the
options to log in using an existing account or sign up if you don’t have
one. You can manually enter your information or use their “Sign up
with Facebook” feature. This will allow Change.org to connect to your
Facebook account and use your information there to create an account.
This will make it easier to promote petitions via Facebook.
Youtube video: https://youtu.be/UcT1rgZDko4
MODULE OF INSTRUCTION
ICT For Social Change 5
The Team Setting
Before we discuss your final project, let’s talk about the people that
you will be working with. For the next few weeks, you will be a part
of a team and you will work as a team every step of the way.
Traditionally, a team has a leader, who makes the important decisions
and has the power to give orders to the members.
It’s quite obvious why this system is not a good choice in a learning
environment. First of all, it is not fair to give most of the power and
responsibility to just one person. Secondly it denies the members the
opportunity to explore their potential's and to learn leadership skills.
Holacracy
(Source: http://www.holacracy.org/)
So far, this subject has been about new and more efficient ways to do
traditional tasks. Therefore, for your next project, we will be using a
new approach to the team structure. We will be exploring holacracy.
Holacracy is an organizational structure in which decision-making and
leadership responsibilities are distributed to every member of the team.
To better holacracy, say let's compare it to the traditional team
structure. A traditional team can be compared to a triangle or a
pyramid with the leader on top and the members on the lower level.
X.X ICT For Social Change
6
A holacracy on the other hand can be compared to a circle. This circle
is composed of every member of the team. Each member can have the
chance to lead at some point. There can still be a leader but he or she
will be just another part of the circle.
For example, Member 1 or M1 is good at graphics design, so we’ll put
him in charge of graphics. M2 is a student journalist so she’ll be in
charge of documentation. M3 is a good public speaker so he will be in
charge of presentations. In his area of expertise, which is graphics, M1
has authority over M2 and M3 but in other areas, like M2’s
documentions, he still acts as a subordinate.
For your final project, think of an area where you excel and volunteer
to take charge of that area. At the same time, give full cooperation
when working in other areas of your project.
ICT Project for Social Change
In the past chapters, you have learned how to use Information and
Communications Techology for personal gain. You’ve learned how
social media has enabled people from all over the world to
communicate and form social relations with each other. You have also
learned new ways to express your ideas through online publishing,
computer graphics, and online collaboration.
MODULE OF INSTRUCTION
ICT For Social Change 7
It is now time to put all this new knowledge to good use. In this
chapter, you will learn how to execute a project with the goal of
helping your community and society at large.
The Concept Paper
(Source RBS Empowerment Technologies, First Edition 2016)
Before you can start doing some actual work, first you have to prove
why your cause is worthy. In the real world, you will have to convince
people or organizations to sponsor or fund your project. For the
purpose of this lesson, this role will be played by your teacher. To
convince him/her, you will have to submit a concept letter.
A concept letter is a document that aims to persuade a person or a
group to sponsor your project. It is composed of five elements:
1. Introduction
Start by introducing the members of your team. Then give a
brief but clear description of the issue that you wish to
address.
2. Purpose
Give the reasons why you want to take action. Focus on how
your project can make a difference and who will benefit from
it.
3. Description
Explain how you plan to accomplish your goal. Mention what
tools, concepts, and methods you will use and why they are the
best choice. You can also give an estimation of the time it will
take to finish your project.
X.X ICT For Social Change
8
4. Support
This is the part where you tell the potential sponsors what
resources you will need from them. Normally, this includes how
much funding is needed but for the purpose of this lesson, you can
use this part to ask for permission to use school facilities and
equipment such as conference rooms and computers. You may
also take this time to ask for permission if your project will
require you to do some research outside of your campus.
5. Contact Information
This may include the phone numbers and email addresses of your
members. You can also create an email address for the sole
purpose of this project.
Here’s an example:
For years, many students depend on the school’s drinking fountain. Aside
from saving the money, schools drinking fountain has filters to make the
water safe enough to drink. But according to research, the last time the
water was tested was about about three years ago and by using the
drinking fountains arround school, it is highly questionable about the water
is still safe for drinking. Our group has theorized that the natural wear and
tear of the drinking fountain has led to the waters unpleasant taste. Our
group, the Mosaic Alliance aims to create several online sources that will
help promote the awareness of people involved about this problem and
create an online petition with the goal of improving our drinking fountains
here in school.
Our group aims to create a Change.org petition, a Facebook group and a
blog to help achieve our goals. We will be creating infographics and other
related information connected to the dangers of drinking unsafe water
especially at her young age. The scope of our project is to be able to reach
the school’s administration, parents, teachers, and students to sign our
petition.
We will be requiring a week to develop this project project and we will
start our promotion right after we hve uploaded the website. We will also
be using our own resources so the funding for this project will be close to
None. Our expenses will include the printing of campaign materials on the
Internet and computer shop rentals in case we need more time outside
school hours. We will be also using free services already offered by
Facebook, Blogger, and Change.org.
Should you have any questions about our project feel free to contact us at
mosaicalliance@email.com.
MODULE OF INSTRUCTION
ICT For Social Change 9
Simplified IT Project Process
Once you get support and approval for your project, you can start
doing some actual work. We will divide the project process into four
stages. These stages may and should remind you about the web content
lifecycle, which we discussed in Chapter 8.
Stage 1: Planning
Like most endeavors, a successful project has to start with careful
planning. During this stage, you will have to accomplish several tasks
including but not limited to the following:
a. Conceptualizing your project
At this point, you have already delivered a concept paper. Use
the data in it to lay out broader concepts about your project.
This will determine what step you will have to take to
accomplish your goal.
b. Assigning people to various tasks
As we discussed earlier in this chapter, your team will be
devided into several areas or “departments”, which will be led
by different members of your team. At this point you will have
to determine which members will lead the different
departments and what is expected of them
c. Researching about your topic
Here you will have to use the skills and knowledge that you
learned in Chapter 4. You may also have to do some real-world
research like doing interviews and conducting surveys. Be sure
to keep a record of all the information that you gather. It may
be a good idea put someone in charge of research and
recordkeeping.
d. Setting deadlines and scheduling meetings
Because each department should be able to work
independently, it is important to have team meetings so that
everyone will have a clear idea about what the other members
are doing. During meetings, everyone is required to give a
report about the progress of their assigned tasks and to convey
any concern they may have.
e. Finding a web or blog host
A website or blog is where you will publish the progress and
results of your project. You can choose from the apps that we
X.X ICT For Social Change
10
have discussed in the previous chapters like Weebly and
WordPress.
f. Creating a site map for your website
Whichever web or blog host you choose, it is important to
create a site map. A site map is basically a list of web pages in
your blog or website. It is a lot like the navigation section of a
website.
g. Determine what other applications you will need
Other than a website or a blog, you will also have to use other
apps for different purposes such as:
Cloud storage
File sharing
Word processing
Spreadsheet
Presentation
Look back on previous chapters to determine which ones suit
your purpose.
h. Funding (if applicable)
Step 2: Development
This stage will probably take up most of your time. This is the part
where you execute your planned tasks and activities.
Some of the steps can be done simultaneously. If a particular step is
ready, you don’t have to wait for other steps to finish first. For
example, You can start promoting your project in social media while
you are still gathering information. This is an added benefit of
holacracy, your team can accomplish different tasks at once because
each task will be led by a different person.
Step 3: Release and Promotion
This is the point where you present your accomplishments to the
public. While it is advisable to post updates on the progress of your
work and to promote your project even before its entirety is delivered,
it is also important to release the most important details in a single
event.
MODULE OF INSTRUCTION
ICT For Social Change 11
Step 4: Maintenance
Your project doesn’t end at the delivery of your results. After your
grand release, you will probably get feedbacks from your sponsors and
the public. They can be in the form of criticsm, suggestion, or even
praise. To assure the continued success of your project, you have to
take these feedbacks into consideration and respond to them in a
constructive and courteous manner.
MODULE OF INSTRUCTION
ICT For Social Change 1
ICT For Social Change
By now, you must already have a clear idea as to how ICT has
changed the way people work, learn, play, and communicate.
In this chapter, you will learn how Information and Communications
Technology helps society as a whole.
ICT and Society
Now, knowing how much ICT can improve your life, imagine how it
can improve society as a whole. Here are some examples of how ICT
was used to help others and influence social change.
Disaster Response
The Internet has proven to be an effective way to collect and share
information during emergency situations. The following are two
examples of online applications that are currently used to deliver
valuable data during natural and man-made disasters:
Google Person Finder
Google Person Finder is an open source web application. Volunteer
engineers from Google created it after the Haiti Earthquake back in
2010. It serves as a center for collection and delivery of information
that can help disaster survivors and relief and rescue operations.
X.X ICT For Social Change
2
People can use this app to search for their loved ones after a disaster.
Google Person Finder collects data from several sources sich as CNN
and The New York Times and makes it available to the public in
several languages, focusing on the native language of the disaster
stricken areas.
It also searves as an information hub where people can see crucial
information such as satellite photographs, locations of evacuation
areas, road conditions, etc.
So far, Google People Finder has been used in the aftermath of dozens
of natural and man-made disasters including:
Haiti Earthquake (2010)
Chile Earthquake (2010)
Pakistan Flood (2010)
Boston Marathon bombing (2011)
Typhoon Haiyan/Yolanda (2013)
For more information, you can visit google.org/personfinder.
Facebook Safety Check
Facebook Safety Check is a Facebook feature that is activated during
and after natural and man-made disasters. It enables Facebook users in
disaster stricken areas to let their friends and family know that they are
safe.
MODULE OF INSTRUCTION
ICT For Social Change 3
Because Facebook can track your current location, they can determine
if you are in an aread affected by a disaster. Facebook then gives you
the option to use the Safety Check feature to mark yourself as “safe”.
It will then make this information available in your contacts’ news
feeds.
Charity
Electronic money transfer is a technology that has revolutionized
commerce in the 21st century. Recently, it has also been used to collect
funds to help people in need.
One great example was the support that came in the aftermath of
Typhoon Yolanda. Several organizations form all over the world such
as the United Nations Children’s Fund (UNICEF) collected donations
through online oney transfer platforms like Paypal.
Social Awareness
Change can start with social awareness. In recent times, ICT has been
used to inform the public about issues that affect people. This
awareness can cause people to act and work together to find a solution.
Youtube video: https://youtu.be/AmesCzIN0uc
You may remember the ALS Ice Bucket Challenge that went viral a
couple of years ago. It is probably the most successful attempt of using
social media to raise awareness and gather donations for a cause. In
this case, the cause was for the research about a disease called
amyotrophic lateral sclerosis or Lou Gehrig's Disease.
The movement has a generated more the 220 million dollars of
donations. (Source: als.net/icebucketchallenge)
Petitions
A petition is basically a request to do something. Traditionally, a
petition is a document signed by concerned persons and is addressed to
a governing body such as school administration or local government.
The aim of a petition is to express the people’s opinion about a certain
issue and to persuade the governing body to take action.
Today, petitions can be created and signed online. This makes it easier
to reach out to the public. There are several websites that host online
petitions.
X.X ICT For Social Change
4
Change.org
Change.org is an online petition site that hosts petitions for free. You
can use it to start a petition or sign petitions created by others.
To sign up, just go to change.org and click log in. It will give you the
options to log in using an existing account or sign up if you don’t have
one. You can manually enter your information or use their “Sign up
with Facebook” feature. This will allow Change.org to connect to your
Facebook account and use your information there to create an account.
This will make it easier to promote petitions via Facebook.
Youtube video: https://youtu.be/UcT1rgZDko4
MODULE OF INSTRUCTION
ICT For Social Change 5
The Team Setting
Before we discuss your final project, let’s talk about the people that
you will be working with. For the next few weeks, you will be a part
of a team and you will work as a team every step of the way.
Traditionally, a team has a leader, who makes the important decisions
and has the power to give orders to the members.
It’s quite obvious why this system is not a good choice in a learning
environment. First of all, it is not fair to give most of the power and
responsibility to just one person. Secondly it denies the members the
opportunity to explore their potential's and to learn leadership skills.
Holacracy
(Source: http://www.holacracy.org/)
So far, this subject has been about new and more efficient ways to do
traditional tasks. Therefore, for your next project, we will be using a
new approach to the team structure. We will be exploring holacracy.
Holacracy is an organizational structure in which decision-making and
leadership responsibilities are distributed to every member of the team.
To better holacracy, say let's compare it to the traditional team
structure. A traditional team can be compared to a triangle or a
pyramid with the leader on top and the members on the lower level.
X.X ICT For Social Change
6
A holacracy on the other hand can be compared to a circle. This circle
is composed of every member of the team. Each member can have the
chance to lead at some point. There can still be a leader but he or she
will be just another part of the circle.
For example, Member 1 or M1 is good at graphics design, so we’ll put
him in charge of graphics. M2 is a student journalist so she’ll be in
charge of documentation. M3 is a good public speaker so he will be in
charge of presentations. In his area of expertise, which is graphics, M1
has authority over M2 and M3 but in other areas, like M2’s
documentions, he still acts as a subordinate.
For your final project, think of an area where you excel and volunteer
to take charge of that area. At the same time, give full cooperation
when working in other areas of your project.
ICT Project for Social Change
In the past chapters, you have learned how to use Information and
Communications Techology for personal gain. You’ve learned how
social media has enabled people from all over the world to
communicate and form social relations with each other. You have also
learned new ways to express your ideas through online publishing,
computer graphics, and online collaboration.
MODULE OF INSTRUCTION
ICT For Social Change 7
It is now time to put all this new knowledge to good use. In this
chapter, you will learn how to execute a project with the goal of
helping your community and society at large.
The Concept Paper
(Source RBS Empowerment Technologies, First Edition 2016)
Before you can start doing some actual work, first you have to prove
why your cause is worthy. In the real world, you will have to convince
people or organizations to sponsor or fund your project. For the
purpose of this lesson, this role will be played by your teacher. To
convince him/her, you will have to submit a concept letter.
A concept letter is a document that aims to persuade a person or a
group to sponsor your project. It is composed of five elements:
1. Introduction
Start by introducing the members of your team. Then give a
brief but clear description of the issue that you wish to
address.
2. Purpose
Give the reasons why you want to take action. Focus on how
your project can make a difference and who will benefit from
it.
3. Description
Explain how you plan to accomplish your goal. Mention what
tools, concepts, and methods you will use and why they are the
best choice. You can also give an estimation of the time it will
take to finish your project.
X.X ICT For Social Change
8
4. Support
This is the part where you tell the potential sponsors what
resources you will need from them. Normally, this includes how
much funding is needed but for the purpose of this lesson, you can
use this part to ask for permission to use school facilities and
equipment such as conference rooms and computers. You may
also take this time to ask for permission if your project will
require you to do some research outside of your campus.
5. Contact Information
This may include the phone numbers and email addresses of your
members. You can also create an email address for the sole
purpose of this project.
Here’s an example:
For years, many students depend on the school’s drinking fountain. Aside
from saving the money, schools drinking fountain has filters to make the
water safe enough to drink. But according to research, the last time the
water was tested was about about three years ago and by using the
drinking fountains arround school, it is highly questionable about the water
is still safe for drinking. Our group has theorized that the natural wear and
tear of the drinking fountain has led to the waters unpleasant taste. Our
group, the Mosaic Alliance aims to create several online sources that will
help promote the awareness of people involved about this problem and
create an online petition with the goal of improving our drinking fountains
here in school.
Our group aims to create a Change.org petition, a Facebook group and a
blog to help achieve our goals. We will be creating infographics and other
related information connected to the dangers of drinking unsafe water
especially at her young age. The scope of our project is to be able to reach
the school’s administration, parents, teachers, and students to sign our
petition.
We will be requiring a week to develop this project project and we will
start our promotion right after we hve uploaded the website. We will also
be using our own resources so the funding for this project will be close to
None. Our expenses will include the printing of campaign materials on the
Internet and computer shop rentals in case we need more time outside
school hours. We will be also using free services already offered by
Facebook, Blogger, and Change.org.
Should you have any questions about our project feel free to contact us at
mosaicalliance@email.com.
MODULE OF INSTRUCTION
ICT For Social Change 9
Simplified IT Project Process
Once you get support and approval for your project, you can start
doing some actual work. We will divide the project process into four
stages. These stages may and should remind you about the web content
lifecycle, which we discussed in Chapter 8.
Stage 1: Planning
Like most endeavors, a successful project has to start with careful
planning. During this stage, you will have to accomplish several tasks
including but not limited to the following:
a. Conceptualizing your project
At this point, you have already delivered a concept paper. Use
the data in it to lay out broader concepts about your project.
This will determine what step you will have to take to
accomplish your goal.
b. Assigning people to various tasks
As we discussed earlier in this chapter, your team will be
devided into several areas or “departments”, which will be led
by different members of your team. At this point you will have
to determine which members will lead the different
departments and what is expected of them
c. Researching about your topic
Here you will have to use the skills and knowledge that you
learned in Chapter 4. You may also have to do some real-world
research like doing interviews and conducting surveys. Be sure
to keep a record of all the information that you gather. It may
be a good idea put someone in charge of research and
recordkeeping.
d. Setting deadlines and scheduling meetings
Because each department should be able to work
independently, it is important to have team meetings so that
everyone will have a clear idea about what the other members
are doing. During meetings, everyone is required to give a
report about the progress of their assigned tasks and to convey
any concern they may have.
e. Finding a web or blog host
A website or blog is where you will publish the progress and
results of your project. You can choose from the apps that we
X.X ICT For Social Change
10
have discussed in the previous chapters like Weebly and
WordPress.
f. Creating a site map for your website
Whichever web or blog host you choose, it is important to
create a site map. A site map is basically a list of web pages in
your blog or website. It is a lot like the navigation section of a
website.
g. Determine what other applications you will need
Other than a website or a blog, you will also have to use other
apps for different purposes such as:
Cloud storage
File sharing
Word processing
Spreadsheet
Presentation
Look back on previous chapters to determine which ones suit
your purpose.
h. Funding (if applicable)
Step 2: Development
This stage will probably take up most of your time. This is the part
where you execute your planned tasks and activities.
Some of the steps can be done simultaneously. If a particular step is
ready, you don’t have to wait for other steps to finish first. For
example, You can start promoting your project in social media while
you are still gathering information. This is an added benefit of
holacracy, your team can accomplish different tasks at once because
each task will be led by a different person.
Step 3: Release and Promotion
This is the point where you present your accomplishments to the
public. While it is advisable to post updates on the progress of your
work and to promote your project even before its entirety is delivered,
it is also important to release the most important details in a single
event.
MODULE OF INSTRUCTION
ICT For Social Change 11
Step 4: Maintenance
Your project doesn’t end at the delivery of your results. After your
grand release, you will probably get feedbacks from your sponsors and
the public. They can be in the form of criticsm, suggestion, or even
praise. To assure the continued success of your project, you have to
take these feedbacks into consideration and respond to them in a
constructive and courteous manner.