DEPARTMENT OF EDUCATION

DIVISION OF CAMARINES SUR

COLEGIO DELA VIRGEN DEL PILAR (CVP) INC.
COLACLING LUPI, CAMARINES SUR
SCHOOL ID: 433585
S/Y 2021 - 2022

SENIOR HIGH SCHOOL LEARNING MODULES

GRADE 11

MODULE 5
QUARTER 1 – WEEK 5

Prepared by:
Jessie s. Monida
Teacher

MODULE MANIPULATING TEXT, GRAPHICS

5
SENIOR HIGH SCHOOL LEAERNING MODULES
AND IMAGE
1
EMPOWERMENT TECHNOLOGY G-11
 INTRODUCTION
Imaging and Design for Online Environment is an online graphics and layout
that taught many effective things in order for us to use image design and its
advantage. In this lesson you will go to learn the basic principles of graphics and
layout.

LEARNING
COMPTENCIES:
1. Use image manipulation techniques on existing images to change or enhance
their current state to communicate a message for specific purpose.
2. Create an original or derivative ICT content to effectively communicate a
visual message in an online environment to specific professional tracks.

TOPICa. Principles and basic techniques of image manipulation

b. Basic image manipulation using offline or open source software.
c. Uploading, sharing, and image hosting platforms.

d. Combining text, graphics and images.

LESSON 1: PRINCIPLES AND BASIC TECHNIQUES OF IMAGE

MANIPULATIION

IMAGE MANIPULATION
 Is an art that involves transforming or altering an image using different
methods and techniques to achieved desired result.
 Refers to a process of bringing changes to a digitalized image for transforming
it to a desired image. The changes are made possibly by resorting to image

SENIOR HIGH SCHOOL LEAERNING MODULES 2

EMPOWERMENT TECHNOLOGY G-11
 processing. Image manipulation is utilized to create magazine covers and
albums from photographs.

BASIC PRINCIPLES AND TECHNIQUES OF IMAGE MANIPULATION

1. PROPORTION
 Proportion is probably one of the most important things s designer must
possess if he wants to do image manipulations. This will make the image
more realistic if the original design is extremely farfetched.

2. TEXTURE
 Texture is the surface quality of image. It adds to the depth of the image
and blends all the image together evenly.
Note: if you don’t have a background for your photo manipulation, you
should use a texture that will match the words you are trying to set in
your art.

3. COLOR BLENDING
 Not every image you use is going to match your background, your
texture or even other image. That is where the color blending comes in.
Color likes pink, white and orange blends together easily. That is what a

SENIOR HIGH SCHOOL LEAERNING MODULES 3

EMPOWERMENT TECHNOLOGY G-11
 designer should look at first, colors readily blend.

4. EMPHASIS ON DETAILS
 When creating a piece of art, set one area as the main focus. There are
multiple techniques to achieve that. One way is to work on focusing
attention on the most vibrant, colorful or sharp area of the design.

5. COMBINING MULTIPLE IMAGES

 Images are like missing puzzle pieces, without them you can never fully
complete the puzzle. So choose them carefully. You may need to look at
multiple stock images before choosing the right ones for your
composition.

6. SHADOWS
SENIOR HIGH SCHOOL LEAERNING MODULES 4
EMPOWERMENT TECHNOLOGY G-11
  Shadows also make the images more realistic, because they emphasize
the object effectively. It is realistic in a way that every item has its
shadow if it needs one and every item is proportional to everything else.

In accordance in having the good quality of images, we must have the

knowledge on the principles and techniques prior in image manipulation. This will
help us also to improve our artistic side. As of today’s era, designers have a great
impact most especially in the fields of specialization(animators, graphic artist, film
makers, videographers, bloggers and etc.)

MANUAL PHOTO MANIPULATION

 In the days of yore, before the advent of Photoshop, photographers
performed alterations manually using the following methods.

1. Airbrushing
 An air brush is a small, air operated painting tool that sprays dyes and
inks. In the pre- digital era, free hand airbrushing has been employed to
alter photographs by concealing the signs that a photo has been doctored
or retouch.
2. Darkroom Manipulation
 Another non- digital method of altering photographs, darkroom
manipulation involve dodging, burning and masking techniques that are
said similar to digital manipulation with the exception that is everything
is done by hand.
3. Double Exposure
 A skilled photographer employs double exposure for artistic effect but it
can occur accidentally, producing a blurry picture. Some non-
digital ,cameras offer a double exposure option but for those whose
camera don’t have this feature, they can simply use filter, which can be
SENIOR HIGH SCHOOL LEAERNING MODULES 5
EMPOWERMENT TECHNOLOGY G-11
 use to cover part of the lens for the first shot, followed by covering
another part of the lens for the second snapshots.
4. Negative Scratching
 This old photo manipulation technique was introduced by a group of
photographers known as pictorialist during the 19th century. Rather than
producing simple snapshots, pictorialist liked to employ techniques such
as soft focus, exotic printing processes, special filter and lens coating,
and darkroom manipulation to convey personal artistic expression.

LESSON 1.2: BASIC IMAGE MANIPULATION USING OFFLINE

OR OPEN- SOURCE SOFTWARE

Photo editing and design tools allows you to manipulate or edit image, apply
effects, filters, add frame, crop, add text, change background color, make photo
collage and photo album that you would like to do in an image.
Here are some of the usable platforms and application prior to image
manipulation using offline and open-source software:
a. Picasa
b. Paint.net
c. Google Sketch Up
d. Autodesk Pixlr
e. Adobe Photoshop
f. GIMP

PICASA
 Picasa is a discontinued image organizer and image viewer for
organizing and editing digital photos, plus an integrated photo – sharing
website, originally created by a company named Lifescape (which at the
time may have resided at Idealab) in 2002.

 Picasa is a free online photo-sharing tool provided by Google. Once a

user downloads Picasa, it automatically locates photo on the user’s PC
and move them to the Picasa. The program then allows users to edit
photos, compile and organize albums and share photo online.
PAINT.NET

SENIOR HIGH SCHOOL LEAERNING MODULES 6

EMPOWERMENT TECHNOLOGY G-11
  Paint.net (stylized as Paint.Net or paint.net) is a freeware raster graphics
editor program for Microsoft Windows, developed on the .Net
Framework.
AUTODESK PIXLR
 Photographers may already familiar with Pixlr, Autodesk’s browser
based photo editor and its mobile companion Pixlr Express for iOS and
android. Today, Autodesk announced Pixlr in a new format: a desktop
version for Macs and Windows.
 The new desktop edition offers many of the Pixlr extensive collection of
tools such a s fun stylize that turn your photos into sketches, and
watercolor paintings. New entire such double exposure option and
influence mask can be used to correct photos, performed advance edits
or create photo based artworks.
ADOBE PHOTOSHOP
 An image editing software developed and manufactured by Adobe
System Inc. Photoshop is considered as one of the leaders in photo
editing software. The software allows users to manipulate, crop, resize,
and correct color on digital photo.
GIMP
 GIMP (gimp/GHIMP)(GNU Image Manipulation Program) is a free and
open source raster graphic editor used for image retouching and editing,
free from drawing, converting between different image formats, and
more specialized task.
GOOGLE SKETCH UP
 A 3D modeling program from Google is known for its ease of use. Used
the architectural purposes as well as films and game designs.

Photographs are little gems and just like with shaping a rough diamond, it
requires a lot of work as well as skills to reveal the true and full beauty of a simple
snapshot and there are thousand different ways to get there.

SENIOR HIGH SCHOOL LEAERNING MODULES 7

EMPOWERMENT TECHNOLOGY G-11
 LESSON 1.3: COMBINING TEXT, GRAPHICS AND IMAGES

Studies continue to show that humans can be better absorb information

visually over just text, n important fact to consider the next time create your next
piece of content to be it presentation, infographics, or rich graphics.
In order to create a well balanced design, you want to achieve good
relationship between text and images to support it.
1. TRANSPARENT SHAPES
 Add simple shapes with as slight transparency behind your text to
clearly see the text you want to emphasize.
2. FONTS AND SHAPES
 Fonts and shape should complement each other. You can use rounded
shapes with rounded fonts and sharp shapes with sharp 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 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.
6. TEXT OVERLAID ON IMAGE
 When text overlaid on image or a solid background, there must be
sufficient contrast between text and image to make the text readable with
little effort.
7. TEXT WRAPPED AROUND IMAGE
 In the wrap-around, the text follows the shape of an image.
8. TEXT AND IMAGE INTERSECT
 The intersection of text and image can create a dynamic composition.
The visual elements can intersect in several ways.
 Placing text within an image, particularly a hallow vector graphic as
shown in the light bulb above.
 Placing text behind the image so that it partially obscured.
 Placing text so that it resist in the image, using the image as the baseline
for the text.
SENIOR HIGH SCHOOL LEAERNING MODULES 8
EMPOWERMENT TECHNOLOGY G-11
 9. TEXT AND IMAGE ALIGN
 You can achieve an orderly look by aligning visual elements with each
other and placing them in close proximity.

LESSON 1.4: UPLOADING, SHARING, AND IMAGE HOSTING

PLATFORMS

IMAGE HOSTING SERVICE

 Allows you to upload images to an internet service.

A. IMGUR – IMGUR (pronounced as “image-er”) is a free image sharing that

was launched in 2009 by Alan Scaaf. It is the most popular site that’s lets you
upload photos quickly and painlessly. It doesn’t require account to share
photos and there is no storage limit in uploading photos. However, this
website only requires uploading 50 photos every hour per IP address. The
uploaded photo has no expiration but it can be removed if deletion is
requested. In addition to IMGUR is the easiest way to discover spicy memes
and world’s most entertaining and hilarious stuffs.
B. GOOGLE PHOTOS – Google photos is recently one of the best and popular
image hosting website which was developed by Google. The website offers
unlimited storage for photos, videos and other formats such as JPEG, PNG
and GIF. It also has a back up feature and gives you the opportunity to edits
this pictures and organize then according to people, places and things. The
longer you use this app, it acknowledges your habits and later on, it will
automatically tag a people in your pictures when it’s already familiar to them.
C. FLICKR – FLICKR is one of the oldest and well known image hosting
website which was launched in 2004 by Ludicorp, a company founded by
SENIOR HIGH SCHOOL LEAERNING MODULES 9
EMPOWERMENT TECHNOLOGY G-11
 Steward Butterfield and Caterina Fake. It is widely used especially by the
bloggers I sharing and embedding their personal photographs. Album creation
is available and its offer maximum storage with 1 TB (terabytes).
D. IMAGESHACK – Imageshack is a free hosting service that was launched in
2003 by Alexander Levin. It is use to save and organize images online. You
have to create an account to upload photos, organize your photos into albums
and let other users see your works. You can also keep your images private if
you don’t want others to view it. It offers unlimited storage pace as long as it
less than 25 MB (megabytes).
E. DROPBOX – Dropbox is a personal cloud storage which was launched in
2007 by Drew Hashton and Arash Ferdowsi. This website is frequently used
for the file sharing and collaboration. It offers to 2 – 100 GB of storage, while
it provides350 GB storage if you invite friends where you can upload photos
in an album together. Although it doesn’t offer you to change, resize, or reedit
your photos, its great option if you just need to upload the original, unedited
versions of your photos.
F. PHOTOBUCKET – Photobucket is an image hosting and video hosting
website which was launched in 2003 by Alex Wetch and Darren Crystal. It is
used to store photos on internet and it is dedicated to preserve and share the
entire photo and video life cycle. The website is widely used in personal and
business purposes. As of this moment, Photobucket is a unique image host as
you have the option to sell your image as print online. Without paying the
premium accounts, the users are limited into 2 GB storage.

SUMMARY
IMAGE MANIPULATION is an art that involves transforming or altering an
image using different methods and techniques to achieved desired result. This will
make the image more realistic if the original design is extremely far-fetched.
Including images with a complex topic can help make it more digestible for your
audience. If yours is the most understandable explanation of a trending topic, it will
become a much-shared piece of content, serving an important need for readers.
Well-placed graphics can complement your text in an important way.
Images are the main visual hook for websites that appears in logos,
backgrounds, sliders and many more. They draw users into reading the text,
illustrate the information provided in articles and blog posts and sometimes just
entertain. Images are a perfect way to guide the eye through the text information

SENIOR HIGH SCHOOL LEAERNING MODULES 10

EMPOWERMENT TECHNOLOGY G-11
POST ASSESSMENT: COMPLETION TEST
Test 1: Identification
a. 6 Image Hosting Services
1.
2.
3.
4.
5.
6.
b. 6 usable platforms and applications prior to image manipulation using offline
and open source software
1.
2.
3.
4.
5.
6.
c. 6 Basic Principles and Techniques of Image Manipulation
1.
2.
3.
4.
5.
6.

ACTIVITY 1: CREATING PORTRAIT DESIGN

Direction: Using the different open source software discuss in the module. Each
member of the class will going to come up with a creative portrait design where in
you are going to apply the basic principles and techniques in image manipulation
including the usage of text and images. Consider yourself as the main subject of the
portrait. You can use 1/8 size of illustration board or used folders to create your
portraits. This activity will help you to boost your creativity in terms of graphics
designs.

SENIOR HIGH SCHOOL LEAERNING MODULES 11

EMPOWERMENT TECHNOLOGY G-11
REFERENCES:
a. http:/slideshare.net
b. www.google.com
c. Imaging and Design for Online Environment by Angelito Quiambao Tarlas
State University.

SENIOR HIGH SCHOOL LEAERNING MODULES 12

EMPOWERMENT TECHNOLOGY G-11