a make it or break it navigation

37
A MAKE IT or BREAK IT Navigation Aaron Quinn Founder / Creative Director at eHouse Studio @aaronquinn

Upload: aaron-quinn

Post on 27-Jan-2015

118 views

Category:

Design


1 download

DESCRIPTION

When people can't find what they need on your site, they gather the town's people with pitchforks and torches. As designers and information architects we are faced with the challenge that designing a good navigation system can often times be difficult. We have to factor the usability, business strategies, category revenue, ROI, SEO, etc. At times we are working with less than perfect information and short timelines, yet most people see a good navigation as a minimum requirement to having a good experience on your site. During this talk, we will cover setting goals for your website's navigation and share practices, strategies and experiences you can use. This talk is for students, new designers or practicing designers and information architects working on or interested in working on large content and e-commerce sites.

TRANSCRIPT

Page 1: A Make it or Break it Navigation

A MAKE IT or BREAK IT

Navigation

Aaron Quinn Founder / Creative Director at eHouse Studio

@aaronquinn

Page 2: A Make it or Break it Navigation

Let me get to know you.

Page 3: A Make it or Break it Navigation
Page 4: A Make it or Break it Navigation

I AM OBSESSED WITH

Surfing

https://flic.kr/p/eJrmLv

Page 5: A Make it or Break it Navigation

IF YOU DON’T BARF YOUR NOT WORKING

Hard Enough

https://flic.kr/p/eUFAAM

Page 6: A Make it or Break it Navigation

https://flic.kr/p/75KtS9

Page 7: A Make it or Break it Navigation

GUIDE THEM ALONG

Their Way

01

Page 8: A Make it or Break it Navigation

https://www.youtube.com/watch?v=yBxobHGniB4

Page 9: A Make it or Break it Navigation

– Converting Search into Navigation: http://www.nngroup.com/articles/search-navigation/

“probability of success drops from 64% to 28% when we go

from an easy to a difficult search problem”

Page 10: A Make it or Break it Navigation

https://flic.kr/p/aKM3k2 https://flic.kr/p/btDtvW

ROADSIGNS vs. BILLBOARDS

Page 11: A Make it or Break it Navigation

FLAT

DEEP

vs

Page 12: A Make it or Break it Navigation

http://bit.ly/1hI5OdP https://flic.kr/p/av4iPT

AGAIN WITH the ROADSIGNS

Page 13: A Make it or Break it Navigation

GIFT FINDERS ARE BASED on MENTAL MODELS

Page 14: A Make it or Break it Navigation
Page 15: A Make it or Break it Navigation
Page 16: A Make it or Break it Navigation
Page 17: A Make it or Break it Navigation

IMAGES CAN HELP IDENTIFY LABELS and CATEGORIES

Page 18: A Make it or Break it Navigation
Page 19: A Make it or Break it Navigation
Page 20: A Make it or Break it Navigation

LABELS & GROUPINGSGood

02

Page 21: A Make it or Break it Navigation

LESS COMMON SENSE and MORE

Consensus

http://bit.ly/1qp3ivr

Page 22: A Make it or Break it Navigation

SYSTEM 1Cognitive ease

SYSTEM 2Cognitive strain

Thinking, Fast and Slow, Nobel Prize–winning economist Daniel Kahneman - http://amzn.to/1uAEtdC

Page 23: A Make it or Break it Navigation
Page 24: A Make it or Break it Navigation

USER CLASSIFICATION SCHEMES by CARD SORTING

https://flic.kr/p/66skhi

Page 25: A Make it or Break it Navigation

IT WEIRDS PEOPLE OUT and CAUSES

Confusion

Page 26: A Make it or Break it Navigation

Ritz Camera

Page 27: A Make it or Break it Navigation

Ritz Camera

Page 28: A Make it or Break it Navigation

TASK 1 Find Men’s Board Shorts !1. Home

2. Clothing

3. Men Clothing

4. Swimwear

5. Swimsuit Bottoms

6. Filter: Styles: Board Shorts

TASK 2 Find Men’s Rain Coat !1. Home

2. Clothing

3. Men Clothing

4. Coats & Outerwear

5. Filter: Type: Rain Coats

TASK 3 Find Men’s Vans Shoes !1. Home

2. Shoes

3. Men’s

4. Sneaker & Athletic Shoes

5. Filter: Brand: Vans

Page 29: A Make it or Break it Navigation
Page 30: A Make it or Break it Navigation
Page 31: A Make it or Break it Navigation

NAVIGATION INFLUENCED by SEARCH &

Search as Navigation

03

Page 32: A Make it or Break it Navigation
Page 33: A Make it or Break it Navigation
Page 34: A Make it or Break it Navigation
Page 35: A Make it or Break it Navigation

1. Make unambiguous paths

2. Use user classification schemes

3. Let navigation be influenced by search & use search as navigation

Page 36: A Make it or Break it Navigation

If we can marry a user's thought process to a navigation, they can focus

more on the content presented and less on how to find things.

Page 37: A Make it or Break it Navigation

@aaronquinn

Thank You

Illustrations by Rhiannon Bode