Scribd
Upload
135 views27 pages

Lesson 6 Imaging and Design For Online Environment

This document outlines the learning objectives and content of a lesson on imaging and design for online environments. The lesson will cover basic principles of graphics and layout, creating simple infographics using web tools, and understanding common file formats used on the web like JPG, GIF and PNG. Students will apply these concepts by designing an infographic about themselves using Piktochart.com.

Uploaded by

Pola De Vera
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
135 views27 pages

Lesson 6 Imaging and Design For Online Environment

This document outlines the learning objectives and content of a lesson on imaging and design for online environments. The lesson will cover basic principles of graphics and layout, creating simple infographics using web tools, and understanding common file formats used on the web like JPG, GIF and PNG. Students will apply these concepts by designing an infographic about themselves using Piktochart.com.

Uploaded by

Pola De Vera
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 27

Imaging and

Design for
Online
Environment
LESSON 6
At the end of this lesson, the students
should be able to:

1. understand the basic principles of graphics


and layout;

2. create a simple infographics using web tools;

3. understand and use several file formats used


on the web;

4. easily manipulate images using a simple


Images
could be
2-
Dimensional
3-
Basic
Principles
of Graphics
and Layout
_______________________
___________
Basic Principles of Graphics and Layout

Balance
The visual
weight of
objects, texture,
colors, and
space is evenly
distributed on
Basic Principles of Graphics and Layout

Emphasis
An area in the
design that may
appear different in
size, texture,
shape or color to
attract the
Basic Principles of Graphics and Layout

Movement
Visual elements guide
the viewer’s eyes
around the screen.
Basic Principles of Graphics and Layout

Pattern,
Repetition,
and Rhythm
repeating visual
element on an image or
layout to create a
feeling of organized
Basic Principles of Graphics and Layout

Proportion
Visual elements create
a sense of unity where
they relate well with
one another.
Basic Principles of Graphics and Layout

Variety
This uses several design
elements to draw a
viewer’s attention.
Infographics
also known as data visualization,
information design, and
communication design
Infographics
Information 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
PRINCIPLES IN CREATING AN
EFFECTIVE INFOGRAPHIC

4
5
BEST PRACTICES WHEN
CREATING INFOGRAPHICS
Maintain a structure
Don’t use more than 3 color palletes
Typography matters a lot
4 Include source and references
Assignment

Create an
infographics about
yourself in
piktochart.com
Online Image File Formats

*When inserting text to a web page, you can simply copy a


text to your html editor, or you can upload it on a website as
a PDF file. Most browsers support “add-ons” so that you can
open PDF files without leaving the browser.

You might also like