designing for new media

22
How to Recognize Good and Bad Design Designing for New Media

Upload: reed

Post on 18-Feb-2016

40 views

Category:

Documents


0 download

DESCRIPTION

Designing for New Media. How to Recognize Good and Bad Design. New Media Design Vocabulary. In her excerpt, Robin Williams writes about how to recognize (and avoid) bad web design. . New Media Design Vocabulary. - PowerPoint PPT Presentation

TRANSCRIPT

Page 1: Designing for New Media

How to Recognize Good and Bad Design

Designing for New Media

Page 2: Designing for New Media

New Media Design

VocabularyIn her excerpt, Robin

Williams writes about how to recognize (and avoid)

bad web design.

Page 3: Designing for New Media

New Media Design

VocabularyIn her excerpt, Robin

Williams writes about how to recognize (and avoid)

bad web design. She identifies four

principles: Contrast, Repetition, Alignment,

and Proximity.

Page 4: Designing for New Media

New Media Design

VocabularyAs a memory aid, a better way to remember these four principles, might be:

Page 5: Designing for New Media

New Media Design

VocabularyAs a memory aid, a better way to remember these four principles, might be:

CRAP.

Page 6: Designing for New Media

New Media Design Vocabulary

Page 7: Designing for New Media

New Media Design

VocabularyContrast is, of course, “contrasting elements”

that are designed to help “guide your eyes around

the page, create a hierarchy of information, and enable you to skim

through the vast array of information and pick out

what you need.”

Page 8: Designing for New Media

New Media Design

VocabularyRepetition aims to “repeat certain elements that tie all

the disparate parts together.” Each page in a web site should look like it

belongs to the same website, company,

concept.

Page 9: Designing for New Media

New Media Design

VocabularyAlignment, simply

enough, means that “items on the page are lined up

with each other.”

Page 10: Designing for New Media

New Media Design

VocabularyProximity refers to “the relationships that items develop when they are close together, in close

proximity.”

Page 11: Designing for New Media

New Media Design

VocabularyWilliams uses lots of

examples to demonstrate when these principles are

working well and are working not so well.

Page 12: Designing for New Media

New Media Design

VocabularyWilliams uses lots of

examples to demonstrate when these principles are

working well and are working not so well.

It’s always a good place to start by observing when

things go horribly, horribly wrong.

Page 13: Designing for New Media

New Media Design

VocabularyLet’s start off with this outrageous example.

Check this out.

In terms of the four principles, what isn’t

working here?

Page 14: Designing for New Media

New Media Design

VocabularyUnfortunately (or

fortunately) often web design issues are a bit

more subtle.Let’s look at the Twitter

home page today.

Page 15: Designing for New Media

New Media Design

VocabularyNow, we’re going to

continue putting these terms and skills into

practice by seeking out other websites that do (or don’t) use these principles

successfully.

Page 16: Designing for New Media

New Media Design

VocabularyI would like each group to

seek out a series of different websites—sites

that demonstrate the successful use of a design principle and a less-than-successful use of a design

principle.

Page 17: Designing for New Media

New Media Design

VocabularySince Williams identifies four key principles, you’ll

need to find eight examples.

I’d like each group find examples of sites that both

successfully and unsuccessfully employ Williams’ four design

principles: alignment, proximity, repetition,

contrast

Page 18: Designing for New Media

New Media Design

VocabularyMore importantly, I’m going

to ask you to articulate WHY these websites are (or

are not) successful.The better your are able to

write about what constitutes good or bad

design, the better you’ll be able to apply that to your own work, especially for

Project Two.

Page 19: Designing for New Media

New Media Design

VocabularyI’d like to you then write a

few sentences for each example, explaining why your group thought that

this was successful or not.

Page 20: Designing for New Media

New Media Design

VocabularyWhen your group has found, discussed and

written about your websites, I’d like each group to share your

findings with the class.

Page 21: Designing for New Media

New Media Design

Vocabulary

Good luck and have fun!

Page 22: Designing for New Media

How to Recognize Good and Bad Design

Designing for New Media