VCD 357 Marketing Communication

Download Report

Transcript VCD 357 Marketing Communication

JRN 440
Adv. Online Journalism
Infographics
Wednesday, 2/29/12
Class Objectives
 Drop Ex, 4 and 5
 Lecture


Infographics
Introduce Project 2
 Homework


Project 2 due by 2:05 pm 3/21/12
Reading: Rubel, 2011
Informational Graphics/
Infographics
 Information graphics are visual
representations of information, data or
knowledge. used where complex information
needs to be explained quickly and clearly.
 Examples


http://actualobjects.com/collections/
http://www.webdesigndev.com/inspiration/15beautiful-examples-of-infographics-for-yourinspiration
Informational Graphics/
Infographics
 Examples


http://www.noupe.com/how-tos/creativeexamples-of-infographics.html
http://www.smashingmagazine.com/2011/10/1
4/the-dos-and-donts-of-infographic-design/
Alignment
 Goal is to NOT place anything arbitrarily on
the page

Every item should have a visual connection
with something else on the page

Can do with forced visual alignment (such as with
text) or with invisible alignment (the viewer fills in
the alignment on his/her own… enough design
elements present that allow this)
Alignment in an infographic is very important!
Alignment within AI
 To create guides




Show your rulers (<View <Show Rulers)
Pull guides from them
To make the guides editable, <View <Guides
< Lock Guides
To snap to the guides, Ctrl + U
 Move objects with black arrow/selection tool
 To align objects to each other, select
<Window <Align
Proximity
 Position related items together
 Make them appear as a cohesive group
rather than fighting for individual attention
 Implies closeness or relationship of items
 Also allows for easier understanding of
items
 Think of a menu- all appetizers are in one
area, all entrees in another
 Is a tool that let’s you control where the eye
goes and the stopping and starting of the
reading
Proximity
 Don’t create relationships with elements that don't belong
together. If they're not related, move them apart from each
other.
 Avoid even a split second of confusion over whether a
headline, a subhead, a caption, a graphic, etc., belongs with its
related material.
Proximity within infographics
 Because of unique shape of images, proximity teaches the
viewer which elements are related to each other
(http://www.newsdesigner.com/archives/002197.php)
Shape
 Definition of Shape = any element used to give or
determine form
 Shapes have meaning

Whether you consciously think about this or not
 An icon is a shape that is somewhat known on a
global level
 Wing Ding font 4zsd


A box is a shape that means formality more so
than an oval or circle
A product may brand itself by a unique shape
 Think about Absolut Vodka Advertisements
 http://www.absolutad.org/
Shapes in infographics
Balance
 Symmetry= Equal number of elements
Draw a visual line down the middle of your design
and put the same number of elements to left right/
above and below
 Static/Inactive Balance = centering on all sides
Creates a sense of stability and calmness
 Keeps eye in a general location

Balance
 Asymmetry= Non-equal number of elements
 Dynamic Balance = Off center alignment

How to get?


Can be non-equal in number
Or two equivalent but different subjects
 Forces your eye around and through a
composition; Creates tension in image
Stable balance within infographics
 Strong central visual focus on one dominant image
Balance within AI
 Determine what kind of balance and
symmetry you want
 Use guides to divide your design into thirds,
or quads

For central point, draw one vertical guide and
one horizontal guide; use the alignment box
and select your guides and align to artboard,
and then horizontally and vertically align them