EMPOWERMENT TECHNOLOGIES

BASIC PRINCIPLES IN GRAPHIC AND LAYOUT • Owned and controlled by individuals or

1. Layout: It is the process of planning and arranging graphics
or text in a page or book.
2. Symmetrical: There
3. should be equal weights or elements on both sides of the
page.
4. Asymmetrical: It may be asymmetrical when there is an
artistic and different intensity on one side of the page.
5. Text - The text type should be legible, appropriate font
face, left justified, right justified, or centered, and the flow
of text should be easy to read.
6. Image - The image should be proportionate, sharp in color,
with high resolution, and with appropriate captions
7. Proximity and Harmony: The elements should be close
together and scattered and arranged apart from each
other. Elements should not be cluttered and not compete
with each other.
8. Consistency: There should be uniformity of theme on each
page.
9. Color and Shape: Use color to create interest by providing
variety in the design (color contrast and shapes).
10. Emphasis: There should be one point of interest in a page.
The elements to be emphasized should have a different
size, color, shape, or background.
SOURCES OF PHOTOS AND GRAPHICS
1. Personal and Professional Photos:
• Taken by amateur or professional photographers.
• Downloaded and stored in the computer.
2. Scanned Images:
• Photos transferred from printed photos and graphics
using scanning devices to your computer.
3. Stock Photo Library:
Photographs and created images that are available for
sale, Comes in CDs or DVDs, and Royalty-free
4. Online Stock Photos:
• Found in the World Wide Web (most dominant
source)
• May be subjected to copyright and fees.
Online Digital File Formats
FILE FORMAT
• It is a ways of encoding and storing information to
storage.
• Uses suffixes that are added to the end of the
filename File Name Extensions.
• File Name Extensions. = It is a means of identifying
the format of the file with a period before it after the
file name.
Digital File Formats
1. Proprietary Formats
Types of RASTER Image Formats
File Name Extension Description
corporations.
• File format specifications are not available to the
public
• Usually covered by copyrights.
2. Open Formats
• AKA Free File Formats
• Free and can be used by the public.
• Does not have copyrights or patents.
• Sustained and maintained by a group of
individuals or organizations.
Digital File Formats Major Groups
1. Uncompressed or Raw Format: It is used for storing
original file format. It is a flexible form but needs
bigger memory to store.
2. Lossless File Format: It is a file format that was
compressed to replicate the original quality but at a
reduced file size. It is ideal for storing important files
(images, audio, or video).
3. Lossy File Format – It is a file format that was
compressed as an approximation of the original file
but is good enough. It has better compression rate
requiring the least memory.
Image File Formats
These are means of storing and organizing digital
images, photos, and illustrations.
It can be classified into two types:
1. Raster/Bitmap Image Files
 AKA Bitmap Image
 It is representing digital images in bits of information
for storage, which translates to PIXELS when viewed
on screen.
 Majority of raster images are LOSSY.
 It is the common format you will encounter in the
internet.
 Pixels
 Pix = Picture; El = Element
 It is the smallest information of an image.
 It is represented by dots or squares that are
arranged and added together to form a picture.
2. Vector Graphics Files
 AKA Vector Forma or Graphic
 These are lossless files created using mathematical
geometric equations to represent images in digital
computer graphics.
 It retains the quality of the images in any desired
image size. t
 It is the preferred format for those who desire
quality prints and display of images.

.bmp (.dib) • Bitmap Image File

• Developed and used on Microsoft Windows environment.
• It is stored in the graphic file format called Device-independent Bitmap (DIB).
• Not common in www since it has a large file size.
.gif • Graphic Interchange Format File
• It is very popular in www because of its portability (Small file size) and support for animation.
• It is ideal for images with large areas of uniform color, small images, images with text, navigation buttons.
• It supports only a small 8-bits per pixel color scheme.

• Standardized by Joint Photographic Experts Group (JPEG).

• It is a common method for photographic images as well as transmission of photos on the www.
.jpg
• It supports 24-bit per pixel color scheme.
• Not ideal use on line art.
• Portable Network Graphic (PNG)
• It is a free, open-source bitmap image format made to improve on GIF.
.png • It supports 24-bit per pixel color and true color (16 million colors).
• It does not support animation.
• Employs lossless compression.
.psd • Photoshop Document (PSD)
• It is a native file format for Adobe Photoshop.
• Photoshop has the ability to read all of the other formats and edit them.
EMPOWERMENT TECHNOLOGIES
Types of VECTOR Image Formats
File Name Description
Extension
.ai • Adobe Illustrator File
• It is the file extension for graphics created using Adobe Illustrator.
• It is created using paths and lines connected by points instead of bitmaps (objects, color, and text).
.dr • Drawing File
w • It is a generic drawing created and stored in a vector format that uses lines or paths to represent images.
• Apple Appleworks, Microsoft Picture It, CorelDraw, & Corel Paint Shop Pro.

• Drawing Exchange Format File

.dxf • It is a drawing format developed and introduced by Autodesk, the maker of AutoCAD.
• It is used for computer-aided design (CAD) vector images.
• PostScript
• It is a Page Description Language (PDL) developed by Adobe.
.ps
• It is a language for printing documents on laser printers and image setters used to produce camera ready copies.
• Can be changed in size without image quality loss.
• Scalable Vector Graphics (SVG)
• Most common vector graphic format in the internet.
.svg
• It was developed by The World Wide Web Consortium (W3C).
• It can be opened by Adobe, Corel, etc.

Basic Techniques of Image Manipulation
1. BACKGROUND COLOR
You can change the background if it does not match the
image or the totality of the presentation.
You can also add effects to the background.
2. MULTIPLE IMAGES
You can combine multiple images to make a point or use
to highlight your message.
3. SHADOW
Using shadow effect will make the image realistic.
4. PROPORTION
When combining images, resize the image to make it
proportionate and realistic.
5. BLENDING COLOR
You can use color blending to match the background with
other elements in the page.
6. EMPHASIS
There should be a focal point to a page that will attract
viewers. The element you want to emphasize should be sharp, big,
and most vibrant in your design.
Combining Text, Graphics, and Images
1. TRANSPARENT SHAPES
Add simple shapes with a slight transparency behind your
text to clearly see the text you want to emphasize.
2. FONTS AND SHAPES
Fonts and shapes should complement each other. You can
use rounded shapes with rounded fonts and sharp shapes with
sharps fonts.
3. TEXT AND BACKGROUND
Text and background should be aligned to have an
organized look. You can align text with shapes or geometric figures
in the image.
4. CLEAN AND CLEAR BACKGROUND
Use a clean and clear background for the message to be
readable. Background should not washout your message.
5. PROPORTION
When combining images, resize the image to make it
proportionate and realistic.
Online Platforms for ICT Content Development
What is an Online Platform?
• are technologies that are grouped to be used as a base upon which
other applications processes or technologies are developed.
a. Presentation / Visualization
• communicates information clearly and efficiently via statistical
graphics, plots and information graphics
Examples of Presentation / Visualization
• Prezi – helping to reinvent the art of presentation
• Zoho – an online project management app that helps you plan
your work and keep track of your progress
• SlideShare – to build quickly from concise, wellpresented content
from top experts
• MindMeister – an online mind-mapping tool that lets you capture,
develop and share ideas visually
b. Cloud Computing
• the practice of using a network of remote servers hosted on the
internet to store, manage, and process data, rather than a local
server or a personal computer
Examples of Cloud Computing:
• Google Drive – keep all work in one secure place with online file
storage
• Dropbox – keeps your files safe, synced, and easy to share
c. Social Media
• are computer-mediated tools that allow people, companies and
other organizations to create, share, or exchange information,
career interests, ideas, and pictures/videos in virtual communities
and networks
Examples of Social Media
• Twitter – online social networking service that enables users to
send and read short 140- character messages called “tweets”
Examples of Social Media
• Facebook – is for-profit corporation and online social networking
service
• Tumblr – a micro-blogging platform and social networking website
d. Web Page Creation
• encompasses a number of important elements including color,
layout, and overall graphical appearance.
Examples Web Page Creation
• Wix – a cloud-based web development platform that
allows users to create HTML5 websites and mobile sites
through the use of their online drag and drop tools
 Weebly – a web-hosting service featuring a dragand-drop
website builder.
e. File Management
• is the storing, naming, sorting and handling computer files
Examples of File Management
• Zamzar – web application to convert files
• word2pdf – convert Word files to PDF (Portable Document Format)
with this online tool
f. Mapping
• a transformation taking the points of one space into the points of
the same or another space
Examples of Mapping
• Google Maps – a desktop web mapping service developed by
Google
EMPOWERMENT TECHNOLOGIES
Content Management System (CMS)
• is a computer application (sometimes online or browserbased) that
allows you to publish, edit and manipulate, organize and delete web
content. CMS is used in blogs, news websites, and shopping
Blogs
• is a discussion or informational website published on the web
consisting of discrete, often informal diary-style text entries
("posts"). Posts are typically displayed in reverse chronological
order, so that the most recent post appears first, at the top of the
web page
Website Template
• or web template, is a predesigned webpage, simply by adding your
text and customization to create your desired web page. It is usually
built with HTML and CSS code.
WYSIWYG
• the acronym for “What You See Is What You Get”
• this means that whatever you type, insert, draw, place, rearrange,
and everything you do on a page is what the audience will see. It
shows and prints whatever you type on the screen.
COLLABORATIVE ICT DEVELOPMENT
1. Facebook Groups
• allows you to create a group page that will allow
people in your group to communicate your ideas
2. WordPress
• allows you to multiple contributors for a single
blog
3. G Suite
• is a brand of cloud computing, productivity and
collaboration tools, software and products
developed by Google. It comprises Gmail,
Hangouts, Calendar, and Google+ for
communication
4. Google Docs, Sheets, and Slides
• are a word processor, a spreadsheet and a
presentation program respectively, all part of a
free, web-based software office suite offered by
Google within its Google Drive service
5. Microsoft Office Online
• allows multiple people to work on different
office files
6. MICROSOFT’S YAMMER
• offers companies to have their own social
network that allows sharing and managing
content
7. TRELLO
• offer an online to-do checklist for your entire
team
8. WEB PORTAL
• is a website that contains information from
different sources and places them in one location
in a uniform way.
9. Yahoo.com
• offers a web portal a web portal where news,
email, weather, etc. are found in one page
INTERACTIVE MULTIMEDIA
Interactive Multimedia
• any computer-delivered electronic system that allows the user to
control, combine, and manipulate different types of media, such as
text, sound, video, computer graphics, and animation
(Britannica.com)
Uses of Interactive Multimedia:
1. Videos - Through video hosting sites, you can take a video
and show it to the entire world (e.g. YouTube)
2. Sound, Music or Audio - If videos are too much for you,
you can always record sounds. You can share your sound
bites to the entire world (e.g. SoundCloud).
3. Online Games - Game developers now create what is
called “browser-based games.” You do not need to install
these games to your computer as they run in most
updated web browsers (AdventureQuest, Farmville, Candy
Crush)
4. Online Tests - Online survey forms and tests that
automatically display the results when finished (Online IQ
and Personality Tests).
5. Courseware - Online courses that simulate the classroom
online (e.g., E-learning Courses using a Learning
Management System)
6. Podcasts - An episodic series of audio or text files
streamed online (e.g., Stuff You Should Know, TED Talks,
The Starters, Ear Biscuits).
7. Vodcasts - An episodic series of video streamed online (e.g.
YouTube series/shows like Video Game High School,
Good Mythical Morning).
ICT as PLATFORM for CHANGE
What is an Advocacy?
• is a process of supporting and enabling people to : express their
views and concerns, access information and services, defend and
promote their rights and responsibilities
Global Digital Divide
• describes the unequal distribution of information and
communication technology across nations, commonly described as
the “gap between information haves and havenots”
The Role of ICT in the Recent History
EDSA (People Power Revolution)
• A major protest that took place along EDSA from February 22 to
25, 1986 involving 2 million Filipinos from different sectors EDSA
(People Power Revolution)
• Cardinal Sin encouraged the Filipinos to help end the regime of the
former President Ferdinand Marcos through Radyo Veritas which
helped change the course of history.
EDSA Dos
• Also known as 2001 EDSA Revolution
• Happened during Jan 17-21, 2001
• It was fueled after 11 prosecutors of then President Joseph Estrada
walked out of the impeachment trial. As a result, the people in EDSA
grew over the course of a few days through text brigades
Yolanda People Finder
• Recent storms in the Philippines gave birth to the People Finder
database powered by Google. During typhoon Yolanda, the People
Finder was a vital tool for people across the globe to track the
situation of their relatives. This proved to be successful and is now
adapted by more organizations to help people track relatives during
calamities.
Million People March
• a series of protests that mainly took place in Luneta Park from Aug
22 to 26, 2013. There were several demonstrations that happened
around the key cities in the Philippines and some locations overseas.
It was to condemn the misuse of the Priority Development
Assistance Fund (PDAF)
Million People March
• Though dubbed as the Million People March, the number of total
attendees was only around
400,000. The organizers and promoters of the protest used
Facebook and Change.org as their mediums.
ICT as Medium for Advocacy
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
• It gives access to more people by allowing the online community to
affix their digital signatures on a petition.
• Its mission is to help people from around the world create the
change they want to see.
Digital Citizenship
• refers to the utilization of information technology (IT) in order to
engage in society, politics, and government.
• K. Mossberger, et al. define digital citizens as "those who use the
Internet regularly and effectively".
Digital Citizenship Principles:
1. Engage Positively:
• respect the rights of others to participate and have an opinion
• don't respond to hurtful or nasty comments — block and report
cyberbullying
2. Know your Online World:
• learn how new skills will help you explore the online world
EMPOWERMENT TECHNOLOGIES
3. Choose Consciously:
• choose privacy and security settings carefully and check them
regularly
• choose friends wisely online — not everybody online is who they
claim to be, regularly review your connections and remove people
Nine Elements of Digital Citizenship
1. Digital Access: This is perhaps one of the most fundamental blocks
to being a digital citizen. However, due to socioeconomic status,
location, and other disabilities some individuals may not have digital
access. Digital access is available in many remote countries via cyber
cafés and small coffee shops.
2. Digital Commerce: This is the ability for users to recognize that
much of the economy is regulated online. It also deals with the
understanding of the dangers and benefits of online buying, using
credit cards online, and so forth. As with the advantages and legal
activities- there is also dangerous activities such as illegal
downloads, gambling, drug deals, pornography, plagiarism, and so
forth.
3. Digital Communication: This element deals with understanding
the variety of online communication mediums such as email, instant
messaging, FB messenger, the variety of apps, and so forth. There is
a standard of etiquette associated with each medium.
4. Digital Literacy: This deals with the understanding of how to use
various digital devices. It is ability and knowledge needed to learn
and teach using technology tools
5. Digital Etiquette: This is the expectation that various mediums
require a variety of etiquette. Certain mediums demand more
appropriate behavior and language than others
6. Digital Law: This is where enforcement occurs for illegal
downloads, plagiarizing, hacking, creating viruses, sending spams,
identity theft, cyberbullying, and so forth
7. Digital Rights and Responsibilities: This is the set of rights that
digital citizens have such as privacy, speech, and so forth.
8. Digital Health: Digital citizens must be aware of the physical stress
placed on their bodies by internet usage. They must be aware to not
become overly dependent on the internet causing eye strain,
headaches, stress problems, and so on.
9. Digital Security: This simply means that citizens must take
measures to be safe by practicing using difficult passwords, virus
protection, backing up data, and so forth.
ICT Project for Social Change
Planning a Social Campaign:
• Before starting a project or campaign, you should be able to do the
necessary paperwork better known as a Concept Paper. This allows
experts to see if your project is doable over the time frame that was
given and if it is significant enough to be made into reality.
Concept Paper
• It is a document used to convince a panel of potential funders to
help a product, program, or service become a reality
Five Elements of a Concept Paper:
1. Introduction - This includes your mission and vision and a brief
introduction of your project / campaign.
2. Purpose - This includes the reason why the project / campaign is
worth your sponsor’s time, effort and money.
3. Description -This includes all the necessary information about the
project. It involves the website/s or page you are going to produce
and the purpose of each and how they work in unison.
4. Support - This contains the budget needed for the project, though
some concept papers do not specify any amount requested from the
sponsor.
5. Contact Information - This includes information on how the group
can be contacted.
ICT Project Process
1. Planning
This involves the following tasks:
• Conceptualizing your project
• Researching on available data about your
topic
• Setting deadlines and meetings
• Assigning people to various tasks
• Finding a web or blog host
• Creating a site map for your website
• Listing down all applications that you need
including web apps
• Funding (if applicable)
2. Development
It involves the actual creation of the website(s) / page, this
involves the production of images, infographics and etc.
3. Release and Promotion
It involves that actual release of the website / page for
public view and promotion. Promotion typically starts before the
actual release.
4. Maintenance
It involves responding to feedback of your website / page
visitors and continuing to improve the website/page.
12 Different Behaviors in Social Media
1. The Ultras – check feeds dozens of times a day. Happily, admit
their obsession. (14% of Facebook users spend at least 2 hours a day
on the network)
2. The Deniers – social media do not control their lives, but gets
anxious when unable to access networks. (20% of Facebook users
would feel anxious or isolated if they had to deactivate their
accounts.
3. The Virgins – taking first tentative steps in social media (19% of
British people don’t use any social networks)
4. The Peacocks – popularity contest, high numbers of followers,
fans, likes and retweets. (1 out of 10 Twitter users want more
followers than friends.)
5. The Lurkers – hiding in the shadows of cyberspace. Watches what
others are saying, but rarely (if ever) participate themselves. (45% of
Facebook users described themselves as “observers”)
6. The Ranters – mock and mid in face-to-face conversations. Highly
opinionated online.
7. The Changelings – adopt completely new personality online so no
one knows their real identities.
8. The Ghosts – create anonymous profiles, for fear of giving out
personal information to strangers.
9. The Informers – seek admiration by being the first to share the
latest trends with audiences.
10. The Approval Seekers – constantly check feeds and timelines
after posting. Worry until people respond.
11. The Quizzers – asking questions allow them to start
conversations.
12. The Dippers – access their pages infrequently, often going days,
of even weeks without posting.
-fcljr
EMPOWERMENT TECHNOLOGIES
EMPOWERMENT TECHNOLOGIES

Sample Concept Paper

• Project Name : Education on Wheels
• Introduction:
Education On Wheels is a project with the motto to literate out of school children also children attending the government schools but
dwelling in slums. We bring teachers to the door steps of these educationally deprived children.
Our main aim is to literate the children who are deprived of education living below poverty line in slum areas.
 To confer the education at the doorstep of deprived children.
 To raise the literacy ratio of an area
 To introduce modern & informal education to deprived children
 To introduce modern study aids, materials to the children going corporation schools.
• Purpose :
The main motive of this project is to literate the children who are deprive of education, dwelling in slum areas.
The project is worth sponsoring for it will enable out-of-school youth develop their skills and intellect. This will also help less fortunate families to
have children participate in the free lectures, seminars and trainings to be conducted by the proponents and invited speakers.
• Description :
The project will gather children (out of school youth) & conduct the class inside the bus. The project will be happening in 5 different
barangays in Panabo City every Saturdays of March 2018 from 8:00 am to 12:00 noon. Attendees will be given free snacks. Leaflets / books will also
be available during the discussion proper. Topics to be included on the seminar will be:
- English, Math, Science, Media and Information Literacy, Computer Literacy, Cyberspace and Digital Security
• Support :
The project will also launch a website (educationonwheels.org) and a Facebook page at @educationonwheels
The estimated budget needed for the project is ranging from 75,000 to 100,000. This includes the fare, snacks, papers and other related fees.
• Contact Information :
The proponents can be contacted on the following:
- Phone : 0909-123-4987
- Email : edonwheels@gmail.com
- FB : @educationonwheels