Empowerment
Technologies
Image
Manipulation
Techniques
Multiple Choice: Write the letter of your answer on a separate sheet of
paper.
1. Which of the following is a free image manipulation tool that has
batch edit, viewer, and paper print features?
A. GIMP B. IrfanView C. PhotoScape
D. Picasa
2. What process of editing multiple pictures at once that uses one
setting?
A. animation C.
collage making
B. batch editing D. paper
printing
3. Which of the following is a useful tool for printing your own
calendars, sheets, lined paper, graph paper, etc?
A. paper print B. print editor C. print
D. viewer
4. Which of the following features of PhotoScape grabs a pixel from
your screen to be used in editing?
A. color picker B. page C. screen capture
6. What feature of PhotoScape alters the appearance of
multiple images?
A. batch editor B. editor C. combine D. viewer
7. What program that is freely distributed for such tasks as
photo retouching, image composition, and image authoring?
A. BMP B. GIF C. GIMP D. JPEG
8. Where can various tools be found to properly crop an image
to a desirable size?
A. Crop B. Home Tab C. Objects Tab D. Tools
9. Where can you place a wide variety of images like texts,
shapes, and symbols?
A. Crop B. Home Tab C. Objects Tab D. Tools
10. Where can you add a frame, resize, sharpen, and add
filters and effects to your image?
A. Crop B. Home Tab C. Objects Tab D. Tools
This module helps you to demonstrate your
ability to use digital tools to edit, create,
and manipulate images with the aid of an
image manipulation tool, PhotoScape.
Moreover, it aids you to produce materials
for printing, posting, and at some later
point, uploading images online using a free
image hosting site particularly,
Photobucket.
The module comprises five lessons, namely:
• Lesson1: Principles and basic techniques of image
manipulation
• Lesson 2: Basic image manipulation using offline or
open-source software
• Lesson 3: Combining text, graphics, and images
• Lesson 4: Uploading, sharing, and image hosting
platforms
• Lesson 5: Usable platforms/applications currently
include but are not limited to Google Sketch Up and
GIMP.
I know that you are excited to learn new concepts, so
let’s get started.
Creating a web is like designing or
crafting something new. There are
certain things that you need to consider
in order to get your message across. In
the previous lesson, you learned the
basic principles of graphics and layout
which can be applied in manipulating
an image. What are these basic
principles?
What do this line mean? “A picture is worth a
thousand words”.
We are used to do “selfie” or capture an image
and later upload it on our Facebook account.
Do you know that from then, Facebook does
the rest by formatting our image to best fit its
standards? Yes, true but once you have created
your own website, there is a need for you to
edit your images. It appears a simple task, but
you need to strike the balance between the
right image quality and the time for the page
to load these images.
Principles and Basic
Techniques of Image
Manipulation
Personal websites do not necessarily have
to downsize the file size of the images.
There is a need to make necessary
changes of your images especially if you
targeted a wider audience.
Tips to help you edit images for your website:
1. Choose the right file format. Try to make a real-life
photograph into GIF to see the difference between PNG, GIF, and
JPEG. Knowing the purpose is the key to finding out the best file
format.
2. Choose the right image size. A camera with 12 megapixels
constitutes to a bigger image size. Monitors have a resolution
limit, so even if you have a million megapixels, it will not display
everything. Thus, it is not always a wise to make our image big,
most especially in a website. Know how much space you want
image to consume. Or have a “preview” image where the
audience has the option to “see full size”.
3. Caption it. Place a caption on images whenever possible.
Delete if not related to the web page.
Creating and Manipulating
Images Using PhotoScape
There are plenty of image manipulation tools
like GIMP, (GNU Image Manipulation Program). It is
a freely distributed program for such tasks as
photo retouching, image composition and image
authoring. But if you are to create a website, you
must use the one which is the most efficient.
PhotoScape is a good tool because it is feasible for
beginners and advanced users alike. It is a free
image manipulation tool that contains many
features to help you in creating images for
websites.
On PhotoScape’s main screen, you will
see its many features that you can use
for creating web content as follows:
1. Viewer – is a picture viewer with
features the same with most image
viewers like changing image
orientation.
2. Editor – alters the appearance of a
single image.
3. Batch Editor – alters the
appearance of multiple images.
4. Page – arranges several photos to
create one; like a mosaic.
5. Combine – links several images
together to form a bigger image.
6. Animated GIF – allows you to create an animated GIF
from several pictures.
7. Print – readies pictures for printing.
8. Splitter – divides a single photo into multiple parts.
9. Screen Capture – captures the screen and saves it.
10. Color Picker – grabs a pixel from your screen to be
used in editing.
11. Raw Converter – converts RAW images
(uncompressed images usually from digital camera) to
JPEG.
12. Rename – allows you to rename a batch of photos.
13. Paper Print – useful tool for printing your own
calendars, sheets, lined paper, graph paper, etc.
For this lesson, we will only focus on the ones that we can
use for our future website project: The Editor and Batch
I. Editor Edit
Choose any photo from your camera. Make sure you have chosen the one
which is worth spending your time with editing. Transfer and save it in your
computer in a directory most convenient to you.
1) Open PhotoScape. Then, choose editor.
2) Choose the folder where the image you want to manipulate is
located using the file explorer on the upper left.
3) Once you have selected the folder, A preview of all the images
found on that folder appears at the bottom of the file explorer.
4. Select the image you want to use. The image will now be
shown on a much bigger preview inside your work area like
what is shown below.
5. Observe the properties of the image like the file
name, the image size (in pixels), and the file size
found on the bottom of the preview.
6. Manipulate the image using the tools on the
bottom.
a. Home tab – this is where you can add a frame,
resize, sharpen, and add filters and effects to your
image.
b. Objects tab – this is where you can
place a wide variety of images like texts, shapes, and
symbols.
c. Crop – this is where various tools can be
found in order to properly crop an image to a
desirable size.
d. Tools – includes other tools like red
eye correction, mole removal, mosaic effect,
and brush tools.
7. Click Save located on the
lower right of the program. The
Save As dialog box will appear.
Save it in your activities folder
with the file name
editorexer.jpg. check the file
size and see how much space you
saved.
II. Batch Edit
Batch editing is one of the most useful tools when manipulating all images at the
same time. This is most useful when you create a gallery of photos for a website. You
can make their sizes uniform to what you have specified. For this exercise, you will
need to take at least ten pictures and save in your desired folder. It is highly
recommended that your photos share the same orientation (portrait or landscape).
1. Select the folder where your photos are located. On the
Preview window, drag the photos you want to be part of
the batch edit to the work area (center).
2. Use the tools on the right to edit your photo. This is like
the options in edit except the Crop and Tools tab which
replaced by the Filters tab. The filters tab is used to add a
certain filter that will apply to all your photos.
3. Resize the pictures so that they do not exceed 800
pixels in width. Add filters if you want.
4. Click on Convert All button found on the upper right.
5. The Save dialog box will appear that will allow you
to change the location, the name of the images, and
the file type. Since we are working on photographs, we
are going to keep it as JPEG. For this exercise, save the
batch images in a new folder labeled as “batch” inside
your resources folder.
Inserting, Uploading, and
Sharing Photos over the
Internet.
Taking your photos and sharing them over the
internet has never been easier using social media.
However, it is highly recommended that social media
photos should be set private and are separated from
those posted over the internet. In that way, you need
an image host. Image hosts are websites
concentrating in storing photographs which are
easily be embedded to a web page or website.
There are plenty of image hosting
sites out there; some of them have
fee while others are free where
you can pay for more storage
space or bandwidth. Storage space
is straightforward, it is like having
a 16GB flash drive where it limits
you to just 16 GB. Bandwidth limits
hinders an access to your image
once a certain bandwidth quota is
reached (measured by megabytes
or gigabytes). This quota is
reached when a lot of people have
loaded the image using their own
computers on a certain amount of
time (usually by a monthly basis).
Sharing Photos with Photobucket
There are plenty of free image hosting sites out
there and Photobucket is one of the oldest. It is a
free image hosting site that allows you to share
photos over the internet.
1. First, sign up for a Photobucket account on
photobucket.com. Just like Piktochart, you
may use your Google+ or Facebook account to
automatically sign up.
2. Once your account is set up and you are
already logged in, click the upload images
button.
3. A new page will load allowing you to drag and
drop your photos or to choose them manually or the
entire folder to upload. Select a folder, add a
password (optional), then feel free to upload any
photos you have right then.
4. Once selected, a progress bar will appear indicating that the
image is uploading. This may take a moment and will depend on
your internet connection.
5. Once you are done, you will see indicators:
a. View Uploads – views photos you just uploaded which also
grants you options to share and edit them individually.
b. Share Album – shares everything you just uploaded plus the
other contents of your specified folder.
c. Edit Photos – uses Photobucket’s photo editing tools to
manipulate your image.
6. Let us assume you will share a photo individually. To do this,
click the photo you want to share, then click share.
7. You will see the following options:
Shares your photo directly to social media
and blogging platforms: Facebook, Twitter,
Pinterest, or even via email.
8. You may choose to share your photo to
your friends on Facebook. If you are done
sharing, log off and close the browser.
Use the Venn
Diagram to
compare between
PhotoScape and
Photobucket.
Write your answer
on a separate
sheet of paper.
Recall your initial plan from Module 1, Lesson 1-What I Can Do:
Identifying the Correct Web Platform for Social Change (i.e.,
identify a problem in your community, example: littering,
garbage disposal, blocked drainages, water shortage, teenage
pregnancy, cyber bullying, increasing number of COVID cases,
etc.).
For learners with gadgets and internet connection, do the
following:
1. Set up your website. You can choose any platform you are
familiar with, but an easy task would be to create a Facebook
page.
2. Use the principles of design when layouting and adding
content for your page.
3. Try adding content like photographs once set up. Use
PhotoScape to edit these photos.
4. Use Photobucket to share these photos to your page.
Read the clues below and write the correct answer on a
separate sheet of paper.
Across
2. readies pictures for printing
5. alters the appearance of multiple images
6. like a mosaic
8. has feature to change image orientation
9. links several images together to form a larger
image
10. change the appearance of many images
Down
1. divides a photo into many parts
3. for printing calendars, sheets, lined paper,
graph paper, etc…
4. allows you to rename a batch of photos
5.crop an image to a desirable size
