the london underground. your 100 year old guide to website navigation

40
The London Underground Your 100 year old guide to website navigation @hello_im_peter

Upload: peter-winchester

Post on 06-Apr-2017

419 views

Category:

Design


0 download

TRANSCRIPT

Page 1: The London Underground. Your 100 year old guide to website navigation

The London UndergroundYour 100 year old guide to website navigation

@hello_im_peter

Page 2: The London Underground. Your 100 year old guide to website navigation
Page 3: The London Underground. Your 100 year old guide to website navigation
Page 4: The London Underground. Your 100 year old guide to website navigation
Page 5: The London Underground. Your 100 year old guide to website navigation

LocationAlphabetTimeCategoryHierarchy

- Saul Wurman, Information Anxiety (1976)

There are five ways to organise information:

Page 6: The London Underground. Your 100 year old guide to website navigation
Page 7: The London Underground. Your 100 year old guide to website navigation
Page 8: The London Underground. Your 100 year old guide to website navigation
Page 9: The London Underground. Your 100 year old guide to website navigation
Page 10: The London Underground. Your 100 year old guide to website navigation
Page 11: The London Underground. Your 100 year old guide to website navigation
Page 12: The London Underground. Your 100 year old guide to website navigation

Wayfinding

“Better wayfinding means improving the ease with which people can navigate themselves to, from and within an interchange facility or zone.”

Transport for London

Page 13: The London Underground. Your 100 year old guide to website navigation

Wayfinding

“Core principle(s) of effective wayfinding include adopting principles of progressive disclosure…

- Selective supply of information when and where passengers need it.”

Transport for London

Page 14: The London Underground. Your 100 year old guide to website navigation
Page 15: The London Underground. Your 100 year old guide to website navigation
Page 16: The London Underground. Your 100 year old guide to website navigation
Page 17: The London Underground. Your 100 year old guide to website navigation
Page 18: The London Underground. Your 100 year old guide to website navigation

Quote

Marketing

Research

Check Policy

Change

Renew

Claim

Contact Details

Cancel

Complain

Proof of NCD

Payment

30%

5%

1%

22%

12%

7%

6%

2%

2%

1%

1%

1%

New Customers

Current Customers

Page 19: The London Underground. Your 100 year old guide to website navigation

New Customers

Current Customers

Page 20: The London Underground. Your 100 year old guide to website navigation
Page 21: The London Underground. Your 100 year old guide to website navigation
Page 22: The London Underground. Your 100 year old guide to website navigation
Page 23: The London Underground. Your 100 year old guide to website navigation
Page 24: The London Underground. Your 100 year old guide to website navigation

Lost / Missing / Confused slide

Page 25: The London Underground. Your 100 year old guide to website navigation

The myth of discoverability

“Things that most people do, most often, should be prioritized first. Things that some people do, somewhat often, should come second. Things that few people do, infrequently, should come last.”

Scott Berkun

Page 26: The London Underground. Your 100 year old guide to website navigation
Page 27: The London Underground. Your 100 year old guide to website navigation
Page 28: The London Underground. Your 100 year old guide to website navigation

What can we group, sort, hide & displace to a more appropriate stage of the journey?

How do we design this to suit both customer types?

Page 29: The London Underground. Your 100 year old guide to website navigation

Underground

Line(s)

Victoria

Direction(s)

North

Station(s) & connections

Finsbury Park[Piccadilly]

Transport type

Page 30: The London Underground. Your 100 year old guide to website navigation

Progressive Disclosure

“Progressive disclosure defers advanced or rarely used features to a secondary screen, making applications easier to learn and less error-prone.”

Jakob Nielsen

Page 31: The London Underground. Your 100 year old guide to website navigation

Progressive Disclosure

“Initially, show users only a few of the most important options. Offer a larger set of specialised options upon request.

Disclose these secondary features only if a user asks for them, meaning that most users can proceed with their tasks without worrying about this added complexity.”

Jakob Nielsen

Page 32: The London Underground. Your 100 year old guide to website navigation
Page 33: The London Underground. Your 100 year old guide to website navigation

Products

Product Hub

Get a quote Learn More Manage Policy Claim Current Cust. Promos

View, amend, cancel, renew etc FNOL journey Amended QuotePartner pages, News etc.Quote & buy journey

Page 34: The London Underground. Your 100 year old guide to website navigation
Page 35: The London Underground. Your 100 year old guide to website navigation
Page 36: The London Underground. Your 100 year old guide to website navigation
Page 37: The London Underground. Your 100 year old guide to website navigation
Page 38: The London Underground. Your 100 year old guide to website navigation

Results so far

Sales conversionPet X% uplift VTS

Home X% uplift VTSMotor X% uplift VTS

Online adoption for claimsPet X% uplift

Home X% uplift

Online account log inMotor X% uplift

Page 39: The London Underground. Your 100 year old guide to website navigation

“Things that most people do, most often, should be prioritized first. Things that some people do, somewhat often, should come second. Things that few people do, infrequently, should come last.”

“Selective supply of information when and where passengers need it.”

“There are five ways to organise information”

Conclusion

Page 40: The London Underground. Your 100 year old guide to website navigation

@hello_im_peter