LESSON 6:

IMAGING &
DESIGN FOR
ONLINE
ENVIRONMENT
PHOTO EDITING
- encompasses the processes of altering images, whether they
are digital photographs, traditional photo chemical photographs, or
illustrations. Traditional analog image editing is known as photo
retouching, using tools such as an airbrush to modify photographs,
or editing illustrations with any traditional art medium.
Graphic software programs
- which can be broadly grouped into vector graphics editors,
raster graphics editors, and 3D modelers are the primary tools with
which a user may manipulate, enhance, and transform images.
Many image editing programs are also used to render or create
computer art from scratch.

3
BASICS OF IMAGE EDITING
1. RASTER IMAGES  2. VECTOR IMAGES 

stored in a computer in the such as Adobe Illustrator, Inkscape

form of a grid of picture and etc. are used to create and modify
elements or pixels. vector images, which are stored as
descriptions of lines, Bezier curves
and text instead of pixels.

4
BASICS OF IMAGE EDITING

1. RASTER
IMAGES 
Place your screenshot here

stored in a computer in
the form of a grid of
picture elements or
pixels.

5
BASICS OF IMAGE EDITING

2. VECTOR IMAGES 

such as Adobe Illustrator,

Inkscape and etc. are used Place your screenshot here

to create and modify vector

images, which are stored as
descriptions of lines, Bezier
curves and text instead of
pixels.

6
RASTER vs
VECTOR
IMAGES
7
DIFFERENCE BETWEEN
RASTER AND VECTOR
IMAGES
▰ RASTER IMAGES use many
colored pixels or individual
building blocks to form a
complete image JPEGs, GIFs and
PNGs are common raster image
types. Almost all of the photos
found on the web and in print
catalogs are raster images.
▰ · VECTOR IMAGES alternatively,
allow for more flexibility. Constructed
using mathematical formulas rather than
individual colored blocks, vector file
types such as EPS, AI and PDF are
excellent for creating graphics that
frequently require resizing.
8
3. 3D MODELING
(OR MODELLING)
- the process of developing a mathematical
representation of any three dimensional surface of
an object via specialized software. The product is
called a 3D model. It can be displayed as a two-
dimensional image through a process called 3D
rendering or used in a computer simulation or
physical phenomena. The model can also be
physically created using 3D printing devices.

9
IMAGE FORMATS:
JPEG is a commonly used method of GIF a lossless format EPS used in vector-
lossy compression for digital images, for image files that based images in
particularly for those images supports both Adobe Illustrator.
produced by a digital photography. animated and static
images.

PNG (PORTABLE NETWORK BMP is a raster

GRAPHICS) is a raster graphics file graphics image used
format that supports lossless data to store bitmap digital
compression. images

10
FEATURES OF IMAGE EDITORS:
SELECTION LAYERS CLONING
SHARPENING AND
SOFTENING

MARQUEE TOOL IMAGE SIZE

CONTRAST AND PERSPECTIVE
BRIGHTENING
LASSO TOOL
CROPPING

IMAGE
ORIENTATION
MAGIC WAND SATURATION
TOOL
11
FEATURES OF IMAGE EDITORS

SELECTION 
-a method of selecting
part(s) of an image, thus
applying a change Place your screenshot here

selectively without affecting

the entire picture.

12
FEATURES OF IMAGE EDITORS

MARQUEE TOOL

-for selecting Place your screenshot here

rectangular or other regular

polygon-shaped regions.

13
FEATURES OF IMAGE EDITORS

LASSO TOOL

-for freehand selection Place your screenshot here

of a region.

14
FEATURES OF IMAGE EDITORS

MAGIC WAND TOOL

- selects objects or
regions in the image Place your screenshot here

defined by proximity of
color or luminance.

15
FEATURES OF IMAGE EDITORS
LAYERS

▰ - which are analogous

to sheets of transparent
acetate, stacked on top of Place your screenshot here

each other, each capable of

being individually
positioned,
▰ altered,

16
FEATURES OF IMAGE EDITORS

IMAGE SIZE 
-resize images in a process
often called image scaling,
making them larger, or smaller. Place your screenshot here

High image resolution cameras

can produce large images which
are often reduced in size for
Internet use.

17
FEATURES OF IMAGE EDITORS

CROPPING 
-creates a new image by
selecting a desired rectangular
portion from the image being Place your screenshot here

cropped. The unwanted part of

the image is discarded. Image
cropping does not reduce the
resolution of the area cropped.

18
FEATURES OF IMAGE EDITORS

CLONING 
-uses the current brush to
copy from an image or pattern. It Place your screenshot here

has many uses: one of the most

important is to repair problem
areas in digital photos.

19
FEATURES OF IMAGE EDITORS

▰ IMAGE ORIENTATION
○ - Image editors are
capable of altering an Place your screenshot here
image to be rotated in
any direction and to any
degree.

20
FEATURES OF IMAGE EDITORS
▰ PERSPECTIVE
○ - the art of drawing
solid objects on a two-
dimensional surface so
as to give the right Place your screenshot here

impression of their
height, width, depth and
position in relation to
each other when viewed
from a particular point.

21
FEATURES OF IMAGE EDITORS
▰ SHARPENING AND
SOFTENING – Sharpening
makes images clearer. Too
much sharpening causes
grains on the surface of the Place your screenshot here

image. Softening makes

images softer that removes
some of the highly visible
flaws. Too much causes the
image to blur.

22
FEATURES OF IMAGE EDITORS

▰ SATURATION
-  an expression for the
relative bandwidth of the visible
output from a light source. As Place your screenshot here

saturation increase, colors

appear more “pure.’’ As
saturation decreases, colors
appear more ‘’ washed-out.’’

23
FEATURES OF IMAGE EDITORS

▰ CONTRAST AND
BRIGHTENING
○ Contrast of images and
brighten or darken the Place your screenshot here
image. Brightening
lightens the image so
the photo brightens up.
Adjusting contrast
means adjusting
brightness because they
work together to make a
better image.
24
FEATURES OF IMAGE EDITORS
▰ PHOTO
MANIPULATION
-involves transforming or
altering a photograph using
Place your screenshot here
various methods and techniques
to achieve desired results.

25
PHOTO EDITING
vs
PHOTO
MANIPULATION
26
DIFFERENCE BETWEEN PHOTO
EDITING AND PHOTO
MANIPULATION
▰ PHOTO EDITING – signifies
the regular process used to
enhance photos and to create
them ‘’Actual editing simple
process’’. Also includes some of
the regular programs used for
editing and expose how to use
them.
▰ PHOTO MANIPULATION – includes
all simple editing techniques and have
some manipulation techniques like
erasing, adding objects , adding some
graphical effects, background correction,
creating incredible effect, change
elements in an image,  adding styles ,
eliminating blemishes from a  person’s
face and changing the features of a
person’s body.
27
Infographics
• also known as data visualization, information design, and
communication design.
•  It is any graphic that display and explains information, whether
that be data or words. When we use the term ‘’infographics’’,
we’re using it as a general term used to describe data presented
in a visual way.
Infographics
•  important because they change the way people find and
experience stories. Infographics are being used to augment
editorial content on the web, it creates a new way of seeing the
world of data, and they help communicate complex ideas in a
clear and beautiful way.
Infographics
• Infographics make complex
data become more visually
appealing to an average user.
THANKS!
Any questions?
You can find me at
▰ I’m@nowhere
▰ please@dont-mail.me

31