Introduction To Visual Design

Introduction to Visual Design

Ever wonder how to think like a Designer?
This presentation introduces the fundamentals of visual design with examples from art history to pop culture, then explains how they translate to best practices in designing graphic user interfaces.
We polish it off with a demonstration of how to implement some of these concepts using Expression Studio.
Whether you have a designer-developer workflow or you ARE the designer-developer workflow, this presentation aims to simplify the mystery of why things “look good.”

This is me:
Twitter: dianeleeper
www.dianeleeper.com
www.42stars.com

This is me:
Twitter: dianeleeper
www.dianeleeper.com
www.42stars.com
This is also me.

Lin Bolin
Seeing the Invisible

What is Art&Why is it Important?

Don’t worry.
We are not(really) going there.

Don’t worry.
We are not(really) going there.
But we do need to mention two things which art can do really well.

Some art is
“just decorative”
Some art is created
to match your sofa
Some art is created
to make people say
“oh how pretty!”

In my opinion, the best “Art”
makes you ask a question.

Computers are useless. They can only give you answers.
Pablo Picasso

1977

1977 (pong)

Cecin’est pas un pipe.

But if
EVERYTHING IS ART

Then
NOTHING IS ART

So what can you
talk about?

Intention &Success

Design is Art with objectives.
Art does not need set goalsto be Art. It’s ok with experimentation.
Design favors set goals and restraints. It resides in the realm of the measurable.

There is overlap between art and design.
It’s not really necessary to define how much.

Thereis overlap between Art and Design.
It’s not really necessary to define how much.

Design favors set goals and restraints. It resides in the realm of the measurable.

Design brings order.

Design solves problems.

Design solves problems.
How do we design an advertisement that makes people read our copy?

Design creates empathy.

Design creates empathy.
Better yet, Design is about visually telling your story to someone else.

Design is creative.

A Design Process

A Design Process
Get an Idea
Decide on the Form it should take
Decide what Methods to use
Create the Structure
Craft it
Polish

A Design Process
Observe and Collect
Brainstorm and Sketch
Edit and Refine
Produce

Observe & Collect
Be a Pirate.

Brainstorm &Sketch

Edit &Refine

Produce

DEBORAH ADLER

Visual Tools of the Trade

Color
Texture
Image
Type
Look and Feel

Color

Warm

Cool

Some Good Color Resources

Color
Texture
Image
Type
Look and Feel

Texture creates the
illusion of space

Some Good Texture Resources

Color
Texture
Image
Type
Look and Feel

And then she saw it…
Oh, you get the idea.

Some Good Type Resources

Whitespace is not wasted space.

Consider the alternative.

Negative space is not wasted space.

Use a Grid Give your design some room to relax.

5% to 8%
of men are
color blind
1%
of women are
color blind

Color should not be your only visual clue in a design.

Browser Inconsistency

The Fold
The term “fold” comes from newspaper design and refers to any content that is not visible when a viewer first comes to the screen.

The Fold
I’m going to let you finish, but…

Web Design has it’s own rules.
But it’s a fun game.
A few good resources:

What is Skill &Why is it Important?

Spark Your Creativity

Observe and Collect

Check out local art!

Take Photos

Take a class

Sketch

Learn Typography

Just do it.

Introduction To Visual Design

0 comments

Notes on slide 1

Favorites, Groups & Events