The 8 Principles

of Design
How to Leverage the Power of
Design and Turn Consumers
Into Customers
Josh Levine
Co-founder, CXO Alexander Interactive (Ai)
IRCE Web Design & Mobile Conference, Orlando Feb 2014

Hi, Im Josh
Co-founder, CXO

Digital Design, Strategy

& Development Agency
Founded 2002, Independent
Transactional Expertise
Manhattan based
IMA Top 10 Agency of Year
www.alexanderinteractive.com
(My Bob Ross phase)

So,
What is Design?

But what is it really?

Design is a plan for

arranging elements in such
a way as best to accomplish
a particular purpose.
Charles Eames

Great design
establishes:

Clear communication
Emotional connection
Ease of use

To
design
is
to

communicate clearly
by whatever means
To
design
is to communicate
you
can control

clearly
by
whatever
means
or master.
you can control or master.

Milton Glaser Milton Glaser

How they see

Great design
enables you
to control:

How they listen

How they feel
How they think
How they act

World Domination
world domination?

perhaps?

Leverage the power of design

to meet human needs and turn
consumers into customers

ho

Design is always having an

effect on your customers
whether you are in control
of it or not

lingscars.com

It is not a question
of whether youre
getting on the
design bus or not
you are already on it

Take control
and make
design work
for you

With great power comes

great responsibility
Uncle Ben

And now

The 8 essential
principles you
need to learn
and follow

01

Typography

Leverage the power to

Convey meaning
Increase legibility
Establish tone
Embody personality

Choose a typeface that is

aligned with the way you
want to be understood
and perceived

Typography shifts the

focus from what we write
to how we write it
and how others read it

Create visual hierarchy

and increase readability
by using simple variations
within one type family

hey
you!

boom!

yo!

honk

bang!
woot!
omg

over
here!

shh

02

Color

Leverage the power to

Elicit emotion
Indicate meaning
Attract attention
Invite exploration

Choose a color scheme

that fits the desired mood,
and your brand

as background/wash.
invites scroll. delights

While color is important,

its how it interacts with
surrounding elements
that has a bigger impact

Which wins?

Add to Cart

Add to Cart

03

Contrast

Leverage the power to

Set priorities
Control energy
Maintain engagement
Strengthen accessibility

Draw attention and

interest to specific areas

04

Composition

Leverage the power to

!

Control rhythm
Provide structure
Create order & flow
Reduce cognitive load
!

Position elements within

page to make it easy for
customers to organize and
categorize them

Law of Proximity

Law of Similarity

s
w

free willy!

Improve hierarchy and

readability by providing
ability to direct (and pause)
peoples attention within
the flow of a page

1a

2a

sony.com

Create a connection
between all elements
by implementing and
adhering to a grid

05

Whitespace

Leverage the power to

!

Control the eye

Imply Importance
Apply stability
Control chaos
!

Use negative space

to showcase and elevate
your product or content

made.com

olukai.com

Manipulate empty space to

give your interface more
clarity and organization

2012

This
week

gilt.com

apple storeolukai.com
- ipad app

Before

target.com

After?

holy crap
batman

06

Consistency

Leverage the power to

!

Enhance learnability
Breed familiarity
Reinforce brand
Instill calmness

Create a consistent
system to establish
familiarity and remove
the need to relearn things

Create a holistic design

language in order to
retain consistency and
design integrity

07

Imagery

Leverage the power to

!

Set the story

Humanize the experience
Makes product tangible
Captivate an audience

Harness the power of a

well cropped photograph

nixon.com

sugoi.com

08

Movement

Leverage the power to

!

Encourage action
Enhance mood
Convey fluidity
Provide feedback
!

Include subtle motion

to enhance the story
and introduce an
element of surprise

jcrew.com

Key takeaways

n
Typography
Color

Take control
and make
design work
for you

Contrast
Composition
Whitespace
Consistency
Imagery
Movement

Thank you
Josh Levine
jl@alexanderinteractive.com
www.alexanderinteractive.com
slideshare.net/joshpacelevine