Empowerment Technologies: Quarter 1 - Module 8: Imaging and Design For The Online Environment

11/12
Empowerment
Technologies
Quarter 1 – Module 8:
Imaging and Design for the
Online Environment
Part II
What’s In
From the previous lesson, we’ve learned the following:
• Balance, movement, unity, repetition, proximity, contrast and emphasis

composed the basic principle of graphics and design.
• Balance deals with the visual weight of objects.
• Emphasis is the area designed to attract the viewer’s attention.
• Movement guides the viewer’s eye around the screen.
• Contrast is the combination of opposing characteristics of an element like
color, size, thickness, to allow emphasis on key elements.
• Infographic is also known as data visualization.
• For infographic to be effective, it must have the following: thesis, well-
organized data, simplicity in color, style and vivid illustrations. It must
contain reliable sources and must be creative for public sharing.
• Common image file formats that are used for the web are JPG, GIF, TIFF,
and PNG.
• JPEG is best used for photographs.
• GIF is best used for diagrams, cartoons, logos and animated graphics. It also
limited with online 256 colors.
• TIFF is considered a high-quality image format, where all color and data
information are stored.
• PNG is best with line art, text, and logo.
2
What’s New
List down what’s wrong with this poster in terms of design. Use a separate sheet of
paper for your answer.
3
What is It
PhotoScape
There are plenty of image manipulation program but if you are going to create a
website, you have to use the one which is efficient. PhotoScape is a good tool
because it is feasible for beginners and advanced users alike.
Features of PhotoScape:
1. Viewer – as the name implies, is a picture viewer with features the same
with the 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 a single one; similar to 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 batch of photos
13. Paper Print – useful tool for printing your own calendars, sheets, lined
paper, graph paper, etc.
You can download PhotoScape from this link:
• http://www.photoscape.org/ps/main/download.php
4
Principles and Basic Techniques of Image Manipulation
Whether you are using a free image manipulation program or purchased one, there
are basic techniques common to all image editing programs.
1. Cropping – It is a process of removing unwanted parts of the image, focusing

only on the subject. When cropping, one must always follow the Rule of
Thirds to organize the image composition.
2. Color Balance – In any image manipulating program, this command will

allow you to make changes in the mixture of colors in an image.
5
3. Adjusting Brightness and Contrast – This command is the most basic
technique when adjusting the image tone (highlights, shadows, and
midtones).
4. Compression and Resizing – Compressing and Resizing an image is an

important aspect in image manipulation. Images to be uploaded on the web
must be pf the standard resolution of 72 dpi (dots per inch) to maintain its
image file size of 30-50 KB. If the image is for printing, set the maximum
resolution to 300 dpi at set its physical printing size in inches.
6
5. Color Blending – Use the different special effects buttons available in the
different image editing software. You can combine colors and commands that
will give you a more dynamic image result.
Image Source: https://photoshopcafe.com/combine-blend-photos-photoshop-night-sky/
6. Combining Multiple Images – Compositions must be planned and

conceptualized first so that you will be able to render the best image
and message possible.
Image Source: https://www.themoviedb.org/tv/77743-encantadia
Online Graphics Software

There are a lot of image editing sites on the internet that also offer basic and
advanced techniques that we can do with other professional software.
Based on TechRadar, the following are the list of websites that you can try as
beginners in the field or for professionals who would like to try other software.
7
1. BeFunky. With BeFunky's photo editor, you can play with hundreds of
amazing photo effects that you can't find anywhere else, like our world-
famous Cartoonizer®, oil painting, and pop art effects.
2. Fotor. It is a multiplatform photo editing website. It offers a wide range of

effects and tools for editing images.
3. Pixlr. It is also a multiplatform image editing program. You can choose

between the editor for editing images or creating an original image right
through the browser.
Other image editing suite that can be downloaded for free:

• Serif PhotoPlus Starter Edition
• GIMP
• Paint.Net
8
Image Hosting Sites
Images also can be shared online through different web hosting sites that are free.
You just need to create a free account, and you will be able to post, organize, and
share your photos. The following is a list of different hosting sites you can try.
1. Imgur – It is a free image hosting site wherein you can

upload images from your computer. You can also edit
your images befire posting it online.
2. Flickr – It is an image social networking site. You can
save and manage your photos for it offers a 1 TB storage
capacity in your account.
3. Photobucket – It has almost similar features with Flickr

as you can upload and share your images over the
internet through your account.
4. SlickPic – It is an online image-hosting service that
allows you to upload and store an unlimited number of
photos online. You can create as many albums, and it
also offers professional editing of images.
5. Zenfolio – It is an online image-hosting site that does

not only allow you to upload image but also lets you
create an online image website for your images.
What’s More
Activity 1
Suppose you are a dedicated member of an animal activist group, you are tasked to
create a poster of the pet show that will be sponsored by you group. The poster
should contain adorable images of typical pets and should entice participants.
Basic information of the event should be written clearly. The name of the organizers
and their contact information should be placed also. Use any image manipulation
you are comfortable with and upload your poster to any image hosting site and
write the link here.
Rubrics: Attractiveness - 20pts. Originality - 10pts.

Grammar - 10 pts. Required Elements - 10 pts.
9
What I Have Learned
Answer the following questions and write your answer on a separate sheet
of paper.
1. Why is PhotoScape efficient to use and when is the time we need to

manipulate an image?
2. What could be the necessary features of an image hosting site?
What I Can Do
Answer the following questions and write your answer on a separate sheet of paper.
The different institutions of our society have already benefited from the
advantages that they offer be it in education, entertainment, news, social media,
science, or military. However, many issues have also come along with the
technology where image manipulation skills are used to exaggerate images,
spread false publicity, and perpetuate gender stereotyping.
As part of the consumer community, how can you make use of the knowledge
you have learned in promoting ethics in image manipulation?
10
Assessment
True or False: Write true if the statement is correct and False if it is incorrect. Write
your answer on a separate sheet of paper.
1. When cropping an image, one must follow the rule of
thirds.
2. Accurate compression of an image will help you save

memory space.
3. BeFunky, Pixlr, and Photobucket are examples of image

hosting sites.
4. One must follow the rules that govern a website when

uploading an image.
5. People who work on computer graphics and image

manipulation are called graphic artists.
6. You can resize the picture in PhotoScape on the Viewer’s

tab.
7. You can create an animated GIF using PhotoScape.
8. You are tasked to enhance an image captured in lowlight

therefore you must manipulate its shadows.
9. If there is too much red in a picture, you will adjust its

brightness to balance the color.
10. Resizing is a process of removing unwanted parts of the

image.
11. Photobucket is an image manipulation program.
12. You can use Pixlr without installing it to your computer.
13. PhotoScape has a feature that can batch edit photos.
14. If the image is for printing, set the resolution to 300 dpi.
15. Imgur is an image manipulation program.
11

Empowerment Technologies: Quarter 1 - Module 8: Imaging and Design For The Online Environment

Uploaded by

Copyright:

Available Formats

Empowerment Technologies: Quarter 1 - Module 8: Imaging and Design For The Online Environment

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Empowerment Technologies: Quarter 1 - Module 8: Imaging and Design For The Online Environment

Uploaded by

Copyright:

Available Formats

11/12

From the previous lesson, we’ve learned the following:

• Balance, movement, unity, repetition, proximity, contrast and emphasis

1. Cropping – It is a process of removing unwanted parts of the image, focusing

2. Color Balance – In any image manipulating program, this command will

4. Compression and Resizing – Compressing and Resizing an image is an

Image Source: https://photoshopcafe.com/combine-blend-photos-photoshop-night-sky/

6. Combining Multiple Images – Compositions must be planned and

Image Source: https://www.themoviedb.org/tv/77743-encantadia

Online Graphics Software

2. Fotor. It is a multiplatform photo editing website. It offers a wide range of

3. Pixlr. It is also a multiplatform image editing program. You can choose

Other image editing suite that can be downloaded for free:

1. Imgur – It is a free image hosting site wherein you can

3. Photobucket – It has almost similar features with Flickr

5. Zenfolio – It is an online image-hosting site that does

Rubrics: Attractiveness - 20pts. Originality - 10pts.

1. Why is PhotoScape efficient to use and when is the time we need to

2. What could be the necessary features of an image hosting site?

2. Accurate compression of an image will help you save

3. BeFunky, Pixlr, and Photobucket are examples of image

4. One must follow the rules that govern a website when

5. People who work on computer graphics and image

6. You can resize the picture in PhotoScape on the Viewer’s

7. You can create an animated GIF using PhotoScape.

8. You are tasked to enhance an image captured in lowlight

9. If there is too much red in a picture, you will adjust its

10. Resizing is a process of removing unwanted parts of the

11. Photobucket is an image manipulation program.

12. You can use Pixlr without installing it to your computer.

13. PhotoScape has a feature that can batch edit photos.

15. Imgur is an image manipulation program.

You might also like