PREPARED BY: MARK JHON C. OXILLO

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 3-dimensional, such as a statue or hologram. They may be captured by optical devices – such as cameras, mirrors, lenses, telescopes, microscopes, etc. and natural objects and phenomena, such as the human eye or water.

are visual images or designs on some

surface, such as a wall, canvas, screen, paper,

or stone to inform, illustrate, or entertain

-Photographs

-Drawings

-Line art

-Graphs

-Diagrams

-Typography

-Numbers

-Symbols

-Geometric designs

-Maps

-Computer Graphics

-Engineering drawings, or other images

is part of graphic design that deals in the arrangement of visual elements on a page

Basic Principles of Graphics

and Layout :

1. Balance. The visual

weight of objects,

texture, colors, and

space is evenly

distributed on the

screen.

Basic Principles of Graphics

and Layout :

2. Emphasis. An area in

the design that may

appear different in size,

texture, shape or color to

attract the viewer’s

attention.

Basic Principles of Graphics

and Layout :

3. Movement. Visual

elements guide the

viewer’s eyes around

the screen.

4. Pattern, Repetition, and

Rhythm. These are the

repeating visual element on an

image or layout to create unity

in the layout or image. Rhythm

is achieved when visual

elements create a sense of

organized movement.

5. Proportion. Visual

elements create a

sense of unity where

they relate well with

one another.

6. Variety. This uses

several design

elements to draw a

viewer’s attention.

INFOGRAPHICSInformation graphics or

infographics are used to

represent information, statistical

data, or knowledge in a

graphical manner usually done

in a creative way to attract the

viewer’s attention.

5 Principles in Making an

Effective Infographic Design

1. Be Unique

2. Make It Simple

3. Be Creative and Bold

4. Less is More

5. The Importance of Getting

it Across

1. Joint Photographic Experts Group (JPEG) – does not support transparency and animation (.jpeg or jpg)

2. Graphics Interchange Format (GIF) – supports transparency and animation (.gif)

3. Portable Networks Graphics (PNG) –supports transparency but not in animation (.png)

Image Manipulation

Principles

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.

Image Manipulation

Principles

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.

Image Manipulation

Principles

3. Caption it. Remember to

put a caption on images

whenever possible. If it is not

related to the web page, then

remove it.

Image Manipulation

Techniques

1. Cropping. Cutting parts

away to remove distracting

or irrelevant elements.

Image Manipulation

Techniques

2. Color Balance. The

ambience and the tone of

light of the picture (ex. Warm

or cool light)

Image Manipulation

Techniques

3. Brightness and Contrast.

One of the most basic

techniques in image editing,

making the image darker or

lighter.

Image Manipulation

Techniques

4. Compression and

Resizing. The higher the

quality and the larger the

photo is, the bigger the file

size of the picture is.

Image Manipulation

Techniques

5. 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.

Image Manipulation

Techniques

6. Cloning. Copying or

duplicating a part of an

image.

Image Manipulation

Techniques

7. Changing the

Background. Adding

background to make your

image stand out

Image Manipulation

Techniques

8. Removing the Color.

Removing certain colors in

your image or desaturating

the color of the image.

Image Manipulation

Techniques

9. Combining Text,

Graphics and Image. Adding

multiple elements in your

layout

- Google+ Photos

- Flickr

- Smugmug

- Imgur

- 500px

- Photobucket

- Amazon Prime Photos

- DropBox

- Chevereto

- Imageshack

END