design zen presentation, rfs, fall 2012

33
DESIGN ZEN: ATTRACTIVE AND FUNCTIONAL WEBSITES Graham Garner • E-Business Practicum BA/CA 388-01 Wartburg College • Fall 2012 Tuesday, October 16, 12

Upload: graham-garner

Post on 16-May-2015

258 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Design zen presentation, rfs, fall 2012

DESIGN ZEN:ATTRACTIVE AND FUNCTIONAL WEBSITES

Graham Garner • E-Business Practicum BA/CA 388-01Wartburg College • Fall 2012

Tuesday, October 16, 12

Page 2: Design zen presentation, rfs, fall 2012

INFORMATION ARCHITECTURE (IA)

• Structural design of information environments

• Combination of organization, labeling, search, and navigation systems

• Making web sites usable and findable

• Focused on design and architecture on the Web; it’s an art and a science

Tuesday, October 16, 12

Page 3: Design zen presentation, rfs, fall 2012

WHY IA MATTERS

• The cost of finding information is lost productivity.

• The cost of not finding information is that bad decisions come from bad information.

• It costs more to fix a problem twice than it does once.

• The cost of maintenance is clear.

• Building a brand costs money and time.

Tuesday, October 16, 12

Page 4: Design zen presentation, rfs, fall 2012

BUILDING BLOCKS OF IA: USERS

Do you know who's using your web site?

Do you know how they're using it?

And perhaps most importantly, do you know what information they want from your site?

Tuesday, October 16, 12

Page 5: Design zen presentation, rfs, fall 2012

BUILDING BLOCKS OF IA: CONTENT

Think about all the stuff that makes up a web site. Think about Ownership, Format, Structure, Metadata, Volume and Dynamism.

Tuesday, October 16, 12

Page 6: Design zen presentation, rfs, fall 2012

BUILDING BLOCKS OF IA: CONTEXT

What makes your business unique? Then, find ways to align the information architecture with the goals, strategy and culture of your business.

Tuesday, October 16, 12

Page 7: Design zen presentation, rfs, fall 2012

ORGANIZATION SYSTEMS

Present the site's information to us in a variety of ways, such as content categories or specific audiences

Tuesday, October 16, 12

Page 8: Design zen presentation, rfs, fall 2012

NAVIGATION SYSTEMS

Help users move through the content

Tuesday, October 16, 12

Page 9: Design zen presentation, rfs, fall 2012

SEARCH SYSTEMS

Allow users to search the content

Tuesday, October 16, 12

Page 10: Design zen presentation, rfs, fall 2012

LABELING SYSTEMS

Describe categories, options, and links in language that (hopefully) is meaningful to users

Tuesday, October 16, 12

Page 11: Design zen presentation, rfs, fall 2012

QUESTIONS USERS ASK

1. Where am I?

2. I know what I'm looking for ; how do I search for it?

3. How do I get around this site?

4. What's important and unique about this organization?

5. What's available on this site?

6. What's happening there?

7. Do they want my opinion about their site?

8. How can I contact a human?

9. What's their physical and mailing address?

Tuesday, October 16, 12

Page 12: Design zen presentation, rfs, fall 2012

ZEN OF WEB DESIGNClear your mind.

Relax and meditate. Observe and learn from the masters.

Obtain clarity. Become one with the web.

Tuesday, October 16, 12

Page 13: Design zen presentation, rfs, fall 2012

With nearly 70 categories, Website entries make up the majority of Webby Awards Winners, Nominees and Honorees. Some are beautiful to look at and interact with. Others are a testament to usability and functionality. And a handful excel across the board. To be selected among the best is an

incredible achievement worthy of praise -- and perhaps a little bragging.

Tuesday, October 16, 12

Page 14: Design zen presentation, rfs, fall 2012

COUNTERSPILL.ORGActivism • Green

Tuesday, October 16, 12

Page 15: Design zen presentation, rfs, fall 2012

BEETLE.COMAutomotive • Best Navigation/Structure

Best Visual Design - Function

Tuesday, October 16, 12

Page 16: Design zen presentation, rfs, fall 2012

MANILLA.COMBanking/Bill Paying

Tuesday, October 16, 12

Page 17: Design zen presentation, rfs, fall 2012

VISITNORWAY.COMBest Home/Welcome Page

Tuesday, October 16, 12

Page 18: Design zen presentation, rfs, fall 2012

KINETIC.COMBest Visual Design - Aesthetic

Tuesday, October 16, 12

Page 19: Design zen presentation, rfs, fall 2012

MASHABLE.COMBlog - Business

Tuesday, October 16, 12

Page 20: Design zen presentation, rfs, fall 2012

PINERIDGESIOUX.COMCharitable Organizations/Nonprofit

Tuesday, October 16, 12

Page 21: Design zen presentation, rfs, fall 2012

URBANEARS.COMConsumer Electronics

Tuesday, October 16, 12

Page 22: Design zen presentation, rfs, fall 2012

GOOGLE MUSICCorporate Communications

Tuesday, October 16, 12

Page 23: Design zen presentation, rfs, fall 2012

MINT.COMFinancial Services

Tuesday, October 16, 12

Page 24: Design zen presentation, rfs, fall 2012

ALLSTATETEENDRIVER.COMInsurance

Tuesday, October 16, 12

Page 25: Design zen presentation, rfs, fall 2012

EPICURIOUS.COMLifestyle

Tuesday, October 16, 12

Page 26: Design zen presentation, rfs, fall 2012

PITCHFORK.COMMusic

Tuesday, October 16, 12

Page 27: Design zen presentation, rfs, fall 2012

ASKAPATIENT.COMPharmaceuticals

Tuesday, October 16, 12

Page 28: Design zen presentation, rfs, fall 2012

PADMAPPER.COMReal Estate

Tuesday, October 16, 12

Page 29: Design zen presentation, rfs, fall 2012

FERVR.NETReligion and Spirituality

Tuesday, October 16, 12

Page 30: Design zen presentation, rfs, fall 2012

BEASTANDTHEHARE.COMRestaurant

Tuesday, October 16, 12

Page 31: Design zen presentation, rfs, fall 2012

ASOS.COMRetail

Tuesday, October 16, 12

Page 32: Design zen presentation, rfs, fall 2012

ESPN.COMSports

Tuesday, October 16, 12

Page 33: Design zen presentation, rfs, fall 2012

SESAMESTREET.ORG/MUPPETSYouth

Tuesday, October 16, 12