SENIOR HIGH SCHOOL

EMPOWERMENT
TECHNOLOGY
Quarter 1 – Module 3 & 4 Productivity
Tools

This instructional material is collaboratively developed and reviewed by educators from public and private
schools, colleges, and/or universities. We encourage teachers and other education stakeholders to email their
feedback, comments, and recommendation to the Department of Education at action@deped.gov.ph

We value your feedback and recommendations.

Department of Education • Republic of the Philippine

 WHAT I NEED TO KNOW: Overview
dear learners! Welcome to this module on Empowerment Technology. This module will help you explore
the different technologies and online platforms and how they can be used effectively. It contains activities
Hell that will let you create your own ICT contents and evaluate existing online creation tools, platforms, and
applications. The module is self – instructional and allows you to learn in your own space, at your own pace. So, relax
and enjoy learning.

Module Content

First Quarter Module 1: ICT in the Context of Global Communication will give you an introduction into ICT and the
different online platforms that may be used for its specific purpose. It will also tackle on online safety, security, and
online etiquette. You will be able to get tips on how to maximize the power of the Internet to assist you in your research
work through discussing research tools and evaluating relevant and reliable websites.

Module 2: Productivity Tools will help you on using advanced knowledge in Word, PowerPoint, and Excel
applications. This module will also allow you to critic on good qualities of web design.

To get the most of this module, here are some reminders for you:

1. Take your time in reading the lessons.

2. Write down points for clarification and discuss this with your teacher.
3. Perform all activities and answer all worksheets.
4. Answer all tests in this module and check against the answer key to measure how well you have understood
the lesson.
5. Answer all activities in a separate sheet of paper or in your notebook.
6. Have fun while learning with this module. It will totally be of great use which ever strand you may belong
because ICT is for everybody.

WHAT I NEED TO KNOW

LESSON 2: Imaging and Design for Online Environment
Graphic design uses visual compositions to solve problems and communicate ideas through typography, imagery,
color and form (Cann, 2018). It can be used by companies to promote and sell products through advertising, by
websites to convey complicated information in a digestible way through infographics, or by businesses to develop an
identity through branding, among other things (Malvik, 2020).

What are my goals?

By the end of this lesson, you are expected to:

1. Evaluate existing websites and online resources based on the principles of layout, graphic, and visual
message design.
2. Use image manipulation techniques on existing images to change or enhance their current state to
communicate a message for a specific purpose
3. Create an original or derivative ICT content to effectively communicate a visual message in an online
environment.

WHAT I KNOW
You must be excited to flip over the pages and begin with the lessons. But first, please answer the pre-test to
measure what topics have you known so far.
Direction: Read each item carefully and choose the letter of the correct answer. Write your answers on a separate
sheet of paper or in your notebook.
1. A graphic image with a central figure is an example of this type of composition:
A. Balance C. Contrast
B. Alignment D. Symmetry

2. Which statement best defines the principles of graphic design?

 A. These are a set of rules only followed by designers.
B. These are outline of ways designers can use elements in a composition.
C. It provides the set of rules on how the graphic design started.
D. It is the art and practice of planning and projecting ideas and experiences with visual and textual content.

3. Why do designers use contrast?

A. To show difference between elements of art.
B. To cause controversy in the design world.
C. To create harmony and bring elements together.
D. To make bright colored compositions.
4. Which type of balance has two sides that are balanced but different?
A. Symmetrical C. Asymmetrical
B. Radial D. Centered

5. What is created when hue is combined with white?

A. Hue B. Shade C. Tint D. Tone

WHAT’S
Look at the numbered images below and answer the questions that follow.

7 8
 Answer the following in your answer sheet:
1. What is the story in this graphic novel?
____________________________________________________________________
________________
2. Who is the main character in the story? How did you know?
_______________________________
_______________________________
3. What do you think is the profession of the main character? How did you
know it? _______________________________
_______________________________

WHAT’S NEW

Lesson 2.1: Graphics and Layout Images

An Image is a representation of the external form of a person or thing in art.
Images may be 2-dimensional, such as a photograph or screen display, or 3dimensional, such as a statue or
hologram. They may be captured by optical devices such as cameras, mirrors, lenses, telescopes, microscopes, and
natural objects and phenomena, such as the human eye or water.

Graphics
Graphics are visual images or designs on some surface, such as a wall, canvas, screen, paper, or stone to
inform, illustrate, or entertain. It can be a photograph, a drawing, a line art, graphical representations, and
typography.

Basic Principles of Graphic Design

Principles of graphic design are set of guidelines that help a design achieve effective composition. These basic
principles aid in creating balance and stability for the piece of work.

COLOR is used for emphasis or may elicit emotions from viewers. Determined by its hue (name of color),
intensity (purity of the hue), and value (lightness or darkness of hue).
Image source: https://graphicdesign.stackexchange.com/questions/20044/is-there-a-worldwide-applicable-
color-emotion-chart
BALANCE means the equal distribution of weight. In layout, visual weight is determined by the darkness
or lightness, thickness of lines, and size. Balance is crucial to the success of design. There are two kinds of
balance:
Symmetrical Balance. The visual weight is distributed evenly, either vertically or horizontally. You can draw
a line straight through the middle of the design, and the visual balance would be evenly distributed.
Asymmetrical Balance. There is an artistic and different intensity on one side of the page.
PROXIMITY is simply the process of ensuring related design elements are placed together. Any unrelated
items should be spaced apart. Close proximity indicates that items are connected or have a relationship to
each other and become one visual unit which helps to organize or give structure to a layout (Smith, 2017).
White Space is the art of nothing. It is also known as the negative space. It is the portion of a page left
unmarked: margins, gutters, and space between columns, lines of type, graphics, figures, or objects drawn or
depicted.

ALIGNMENT is simply the way visual elements are arranged so that they line up in some way. There are two
basic kinds of alignment; edge and center.
Edge alignment determines the placement of elements in relation to the edge of the page or canvas. This can
mean the elements are aligned to the left side or right side, but it can also mean they are aligned to the top or bottom
of the page, so long as it uses an edge to organize everything.
Center alignment aligns all the elements so that an invisible, central line on the page will always be in the center of
the elements.
 Image source: https://blog.thepapermillstore.com/design-principles-alignment/edge-alignment/

Image source:

https://blog.thepapermillstore.com/design-
principlesalignment/center-alignment/

REPETITION. The process of repeating elements

throughout a design to give a unified look. Repetition
goes with consistency of your design on font, font size,
patterns, and colors.
Image source: https://www.pinterest.ph/pin/500532946059674099/

CONTRAST is the divergence of opposing elements (opposite colors on the color wheel, or
value light / dark, or direction – horizontal / vertical). Contrast allows us to emphasize or
highlight key elements in your design.

WHAT CAN I DO
ACTIVITY 2.1: CoViD-19 Infographic

DIRECTIONS: In this time of the CoViD – 19 pandemic, there is a need to fully inform the public on how to keep
ourselves safe even when we are outside our homes. As a graphic designer of the National Government, you are
tasked to create an infographic material to be distributed to the people. This will be placed in a shortsized bond paper.
You must be guided by the different principles of graphic design while making your infographic material. Print your
work and be guided with the rubric below:

CRITERIA 3: Exceeds 2: Meets 1: Needs Work

Expectation Expectation
Topic/ The topic/purpose The topic/purpose The topic/purpose
Purpose of the infographic was somewhat broad of the infographic
was clear and and did not allow was not clear and
concise. viewer to understand concise.
the purpose.
Data Data of the Data of the Data of the
infographic was infographic was infographic was
accurate and somewhat accurate not accurate and
relevant to topic and relevant to topic. was not relevant
to topic.
Layout The infographic The graphics were The graphics had
had a great layout, somewhat applicable nothing to do with
with applicable to the infographic, the topic and had
graphics. creating an average a poor layout.
layout. There was an
overload of text.
Color/Font The font was The font was The font was not
 legible, and the somewhat legible, legible, and the
color scheme and the color scheme color scheme
enhanced the didn't affect the detracted from
infographic. infographic. the infographic.
Sourcing Citations for the Citations for some of No citations of the
infographic's the sources used infographic's
sources were were included. sources were
included. included.

WHAT’S NEW Lesson 2.2: Image Manipulation

Image Manipulation refers to a process of bringing changes to a digitized image for transforming it to a
desired image. The changes are made possible by resorting to image processing. Image manipulation is utilized to
create magazine covers and albums from photographs. A single photograph may be modified to suit the requirement,
or several photographs can be combined to form a collage. Currently, there are numerous software applications
ranging from professional applications to basic imaging software (https://www.yundle.com/termsdefinitions/i/image-
manipulation).

Principles and Basic Techniques of Image Manipulation

CROPPING. Cutting parts away to remove distracting or irrelevant elements.

I
Image source: https://photo-works.net/photo-cropping-techniques.php

COLOR BALANCE. The ambience and the tone of light of the picture (ex. Warm or cool light)

Image source: https://dragon-roost-island.weebly.com/photo-vocabulary.html

BRIGHTNESS AND CONTRAST. One of the most basic techniques in image editing, making the image darker
or lighter.

Image source: https://pippin.gimp.org/image-processing/chap_point.html

FILTERS. Making the image look sketched, grainy, classic black and white or even let it have neon colors.
This gives your image a twist from its original look.
 CHANGING THE BACKGROUND. Adding background to make your image
stand out.

Image source: http://photoshopcctutorial.com/adobe-photoshop-7-0-tutorial-how-to-change-or-removebackground/

REMOVING THE COLOR. Removing certain colors in your image or

desaturating the color of the image.

Image source: http://www.digitalcamerareview.com/review/photoshop-elements-11-premiere-elements-11-review/

COMBINING TEXT, GRAPHICS AND IMAGE. Adding multiple elements in

your layout.
SAMPLE OF IMAGE MANIPULATION

Original Image Manipulated Image

WHAT CAN I DO
Activity 2.2: Let’s Do Magic!
Directions: Take a photo of a landscape and a portrait – be it of yourself, a family member, a friend or a pet. Create
a photo collage where both pictures are edited. Print your work in a short-sized photo paper. Check
the rubric for grading. The following things shall be done on the picture:
1. Cropping
2. Adjusting brightness and contras
3. Color balancing
4. Combining text with images preferably positive quotes. Don’t forget to cite the
original writer!
5. Changing background for portraits only.

Rubric: 20 points
Criteria 4 3 2 1
Creativity The work The work The work The work
and demonstrate demonstrate demonstrate demonstrate
Originality s superior s good use s s little
creativity of creativity average use evidence of
Weight: (x2) and and of creativity creativity and
originality in originality in and originality in
the selection the selection originality in the selection
of the of the the selection of the
visuals. visuals. of the visuals.
visuals.
Compositio Artwork Artwork Composition Ideas are
n exhibits exhibits demonstrate expressed
and Design masterful good s limited with no unity
execution of composition knowledge in
Weight: (x1) balance, and of design composition.
emphasis, elements.
pattern, design
unity, color, elements.
and
contrast.
Required All required 4 of the Only 2 of Only 1 of the
elements elements requirements the requirements
are present are met. requirement is met.
Weight: (x2) s is met. Project is
unacceptabl
e.
WHAT I HAVE LEARNED
You have learned that image editing is an enjoyable activity, but it entails a lot of patience
and creativity. As a photo editor, you must have an eye for art. Bear in mind that the pictures you
will come up with support the idea that you wish to convey.

Direction: Read each item carefully and choose the letter of the correct answer. Write your
answers on a separate sheet of paper or in your notebook.

1. How many types of balance are in graphic design??

A. 2 B. 4 C. 6 D. 8
2. Which principle of design is seen by the shapes on the right?
A. Balance C. Color
B. Contrast D. Proximity

3. Which design principle is seen below?

A.Alignment C. Contrast
B.Asymmetrical balance D. Proximity

4. Which of the following is NOT a way to use contrast in a composition?

A. Placing shapes around a central axis.

B. Pairing different typefaces together.
C. Changing the color values.
D. Using various textures.

5. Which best describes the image on the right?

A. Alignment C.Contrast
B. Balance
D. Repetition