SlideShare a Scribd company logo
1 of 43
Download to read offline
How to design an award winning
website
Webcredible/Brompton
18 November 2015
2
3
Re-platform & re-design the
global online proposition;
creating a scalable world class
customer experience to support
the brand growth for prospective
and existing end-user consumers
and trade customers.
4
1.  Research approach
2. Design decisions
3. Verification and results
5
1.  Research approach
2. Design decisions
3. Verification and results
6
Stakeholder workshops
7
Learning the product
8
Guerrilla research
9
“I don’t get the train, so I don’t
need a folding bike”
- Everyone
International research
11
International research
12
International research
13
International research
14
Made for cities?
15
Audience types/personas
16
Audience types/personas
17
Audience types/personas
18
Issues to address
1.  Multi-channel customer journey
2.  Fragmented digital presence
3.  Different users require different content
4.  People don’t understand product benefits
5.  16,982,784 options are too many
19
1.  Research approach
2. Design decisions
3. Verification and results
20
Multi-channel customer journey
21
Developing process
23
Developing process
24
Home
Discover
Bikes
Bike chooser Product hero Bike builder
Information gathering Test ride Decision time Purchase
Find dealer
Hire
Data capture
Email CR Ref
CR Ref
Enter email/
Facebook
connect
Email
Search: Bike
type (eBike)
Benefits of use
Heritage
How people use it
Costs
Fold
Handmade in London
Customisable
Colours
The fold
Price
Gears
Handlebars
Colour/s
Accessories
Weight
Tech specs
Features
Design
Tech
Gallery
Save/
Share
Near me
Recommended
Where
How much
Process
Get started
What is it?
How does it work?
How much does it
cost?
Store
Bike chooser Bike builder
Featured
PDP
Saved config
CR Ref
Find dealer
Check stock
Check out
online
Purchse
Check out
funnel
Account
Email
Register bike
Update account
Check progress
Delivey/
collection
Capture/
share
Brompton: Purchase journey
Browse > Build > Try > Buy
25
26
Provide clarity of process
Fragmented digital presence
27
Amalgamating the existing sites
28
Customer focus groups
29
Different users require different
content
30
31
Personalising the content
People don’t understand
product benefits
32
Coherent content strategy
33
Analytics/SEO research
34
35
Amplified product offering with clear benefits
36
Amplified product offering with clear benefits
16,982,784 options are too many
37
38
Designing the chooser
39
#myBrompton
1.  Research approach
2. Design decisions
3. Verification and results
40
3 Rounds UT
41
46% increase in traffic.
291% increase in subscribers.
103% increase in bike builds
45% increase in dealer searches.
122% increase in sales.
42
Creating people-centred, efficient and
delightful digital experiences since 2003
020 7423 6320
133 Park Street
London SE1 9ED webcredible.com

More Related Content

Similar to Ux crunch how to build an award winning website

Green Girl Recycling Final Presentation
Green Girl Recycling Final PresentationGreen Girl Recycling Final Presentation
Green Girl Recycling Final PresentationClark Salamie
 
Uc14 chap11
Uc14 chap11Uc14 chap11
Uc14 chap11ayahye
 
Identifying customer digital needs and new business areas for an automotive b...
Identifying customer digital needs and new business areas for an automotive b...Identifying customer digital needs and new business areas for an automotive b...
Identifying customer digital needs and new business areas for an automotive b...Marco De Cesaris
 
A STUDY ON CUSTOMER’S PURCHASE BEHAVIOUR TOWARDS NON-GEAR TWO-WHEELERS
A STUDY ON CUSTOMER’S PURCHASE BEHAVIOUR TOWARDS NON-GEAR TWO-WHEELERSA STUDY ON CUSTOMER’S PURCHASE BEHAVIOUR TOWARDS NON-GEAR TWO-WHEELERS
A STUDY ON CUSTOMER’S PURCHASE BEHAVIOUR TOWARDS NON-GEAR TWO-WHEELERSPrem Prem
 
week 6-Study mobile sales app.pptx
week 6-Study mobile sales app.pptxweek 6-Study mobile sales app.pptx
week 6-Study mobile sales app.pptxMichaelaKravkov
 
Triumph digital media presentation
Triumph digital media presentationTriumph digital media presentation
Triumph digital media presentationRalph Paglia
 
UX Research by Lisandra Maioli
UX Research by Lisandra MaioliUX Research by Lisandra Maioli
UX Research by Lisandra MaioliLisandra Maioli
 
B2B Digital Transformation - Case Study
B2B Digital Transformation - Case StudyB2B Digital Transformation - Case Study
B2B Digital Transformation - Case StudyDivante
 
Goodyear: Digital Marketing Case Study
Goodyear: Digital Marketing Case StudyGoodyear: Digital Marketing Case Study
Goodyear: Digital Marketing Case StudyShack Co.
 
Decoding Digital Week 3: Understanding Your Customer
Decoding Digital Week 3: Understanding Your CustomerDecoding Digital Week 3: Understanding Your Customer
Decoding Digital Week 3: Understanding Your CustomerSymphony3
 
Internet Retailer Web Design 2014 - Product Page
Internet Retailer Web Design 2014 - Product PageInternet Retailer Web Design 2014 - Product Page
Internet Retailer Web Design 2014 - Product Pagesweiskircher
 
Workshop innovation management using the lean canvas by Amr Noman
Workshop innovation management using the lean canvas by Amr NomanWorkshop innovation management using the lean canvas by Amr Noman
Workshop innovation management using the lean canvas by Amr NomanAgile ME
 
Creating a Winning Internet Strategy
Creating a Winning Internet StrategyCreating a Winning Internet Strategy
Creating a Winning Internet StrategyDave Chaffey
 
S aris quick_intro_25_4_18
S aris quick_intro_25_4_18S aris quick_intro_25_4_18
S aris quick_intro_25_4_18pm2120600
 
Susina--The Rise of B2B eCommerce
Susina--The Rise of B2B eCommerceSusina--The Rise of B2B eCommerce
Susina--The Rise of B2B eCommerceSteve Susina
 
7 tips to Market your Travel Offer on the Web
7 tips to Market your Travel Offer on the Web 7 tips to Market your Travel Offer on the Web
7 tips to Market your Travel Offer on the Web Karine Miron
 
ExploreExport 2014 - eCommerce Seminar
ExploreExport 2014 - eCommerce SeminarExploreExport 2014 - eCommerce Seminar
ExploreExport 2014 - eCommerce SeminarScottish Enterprise
 

Similar to Ux crunch how to build an award winning website (20)

Green Girl Recycling Final Presentation
Green Girl Recycling Final PresentationGreen Girl Recycling Final Presentation
Green Girl Recycling Final Presentation
 
Uc14 chap11
Uc14 chap11Uc14 chap11
Uc14 chap11
 
Uc14 chap11
Uc14 chap11Uc14 chap11
Uc14 chap11
 
Identifying customer digital needs and new business areas for an automotive b...
Identifying customer digital needs and new business areas for an automotive b...Identifying customer digital needs and new business areas for an automotive b...
Identifying customer digital needs and new business areas for an automotive b...
 
A STUDY ON CUSTOMER’S PURCHASE BEHAVIOUR TOWARDS NON-GEAR TWO-WHEELERS
A STUDY ON CUSTOMER’S PURCHASE BEHAVIOUR TOWARDS NON-GEAR TWO-WHEELERSA STUDY ON CUSTOMER’S PURCHASE BEHAVIOUR TOWARDS NON-GEAR TWO-WHEELERS
A STUDY ON CUSTOMER’S PURCHASE BEHAVIOUR TOWARDS NON-GEAR TWO-WHEELERS
 
week 6-Study mobile sales app.pptx
week 6-Study mobile sales app.pptxweek 6-Study mobile sales app.pptx
week 6-Study mobile sales app.pptx
 
Triumph digital media presentation
Triumph digital media presentationTriumph digital media presentation
Triumph digital media presentation
 
UX Research by Lisandra Maioli
UX Research by Lisandra MaioliUX Research by Lisandra Maioli
UX Research by Lisandra Maioli
 
B2B Digital Transformation - Case Study
B2B Digital Transformation - Case StudyB2B Digital Transformation - Case Study
B2B Digital Transformation - Case Study
 
Goodyear: Digital Marketing Case Study
Goodyear: Digital Marketing Case StudyGoodyear: Digital Marketing Case Study
Goodyear: Digital Marketing Case Study
 
Decoding Digital Week 3: Understanding Your Customer
Decoding Digital Week 3: Understanding Your CustomerDecoding Digital Week 3: Understanding Your Customer
Decoding Digital Week 3: Understanding Your Customer
 
Internet Retailer Web Design 2014 - Product Page
Internet Retailer Web Design 2014 - Product PageInternet Retailer Web Design 2014 - Product Page
Internet Retailer Web Design 2014 - Product Page
 
report
reportreport
report
 
Workshop innovation management using the lean canvas by Amr Noman
Workshop innovation management using the lean canvas by Amr NomanWorkshop innovation management using the lean canvas by Amr Noman
Workshop innovation management using the lean canvas by Amr Noman
 
Creating a Winning Internet Strategy
Creating a Winning Internet StrategyCreating a Winning Internet Strategy
Creating a Winning Internet Strategy
 
S aris quick_intro_25_4_18
S aris quick_intro_25_4_18S aris quick_intro_25_4_18
S aris quick_intro_25_4_18
 
Susina--The Rise of B2B eCommerce
Susina--The Rise of B2B eCommerceSusina--The Rise of B2B eCommerce
Susina--The Rise of B2B eCommerce
 
7 tips to Market your Travel Offer on the Web
7 tips to Market your Travel Offer on the Web 7 tips to Market your Travel Offer on the Web
7 tips to Market your Travel Offer on the Web
 
ExploreExport 2014 - eCommerce Seminar
ExploreExport 2014 - eCommerce SeminarExploreExport 2014 - eCommerce Seminar
ExploreExport 2014 - eCommerce Seminar
 
Consumer Decision Journeys
Consumer Decision JourneysConsumer Decision Journeys
Consumer Decision Journeys
 

More from Marcelo Graciolli

More from Marcelo Graciolli (20)

The logo design_checklist_-_canny
The logo design_checklist_-_cannyThe logo design_checklist_-_canny
The logo design_checklist_-_canny
 
2017 state of_email_report
2017 state of_email_report2017 state of_email_report
2017 state of_email_report
 
The guide to wireframing
The guide to wireframingThe guide to wireframing
The guide to wireframing
 
The ultimate guide to prototyping
The ultimate guide to prototypingThe ultimate guide to prototyping
The ultimate guide to prototyping
 
Email planning workbook
Email planning workbookEmail planning workbook
Email planning workbook
 
Canon tc-80 n3
Canon tc-80 n3Canon tc-80 n3
Canon tc-80 n3
 
Hero3 plus black_um_por_reve
Hero3 plus black_um_por_reveHero3 plus black_um_por_reve
Hero3 plus black_um_por_reve
 
Praticas recomendadas - Anuncios Facebook
Praticas recomendadas - Anuncios FacebookPraticas recomendadas - Anuncios Facebook
Praticas recomendadas - Anuncios Facebook
 
Manual 580 ex-canon
Manual 580 ex-canonManual 580 ex-canon
Manual 580 ex-canon
 
Manual po dxt user manual - pre version 2 - english
Manual po dxt user manual - pre version 2 - englishManual po dxt user manual - pre version 2 - english
Manual po dxt user manual - pre version 2 - english
 
Logo guidelines
Logo guidelinesLogo guidelines
Logo guidelines
 
En gxm mac_user_guide
En gxm mac_user_guideEn gxm mac_user_guide
En gxm mac_user_guide
 
Empreendedoriamo digital
Empreendedoriamo digitalEmpreendedoriamo digital
Empreendedoriamo digital
 
Canon ef-8-15mm-f-4-l-usm-fisheye-lens
Canon ef-8-15mm-f-4-l-usm-fisheye-lensCanon ef-8-15mm-f-4-l-usm-fisheye-lens
Canon ef-8-15mm-f-4-l-usm-fisheye-lens
 
Manual minolta auto meter vf
Manual minolta auto meter vfManual minolta auto meter vf
Manual minolta auto meter vf
 
Manual canon eos-5d-mark-ii-pt1
Manual canon eos-5d-mark-ii-pt1Manual canon eos-5d-mark-ii-pt1
Manual canon eos-5d-mark-ii-pt1
 
Mac logo gdlns
Mac logo gdlnsMac logo gdlns
Mac logo gdlns
 
Manual meter amvf_om_sp
Manual meter amvf_om_spManual meter amvf_om_sp
Manual meter amvf_om_sp
 
Manual - Canon tc-80 n3
Manual - Canon tc-80 n3Manual - Canon tc-80 n3
Manual - Canon tc-80 n3
 
Hero3 plus black_um_por_reve
Hero3 plus black_um_por_reveHero3 plus black_um_por_reve
Hero3 plus black_um_por_reve
 

Recently uploaded

Organic Name Reactions for the students and aspirants of Chemistry12th.pptx
Organic Name Reactions  for the students and aspirants of Chemistry12th.pptxOrganic Name Reactions  for the students and aspirants of Chemistry12th.pptx
Organic Name Reactions for the students and aspirants of Chemistry12th.pptxVS Mahajan Coaching Centre
 
Russian Call Girls in Andheri Airport Mumbai WhatsApp 9167673311 💞 Full Nigh...
Russian Call Girls in Andheri Airport Mumbai WhatsApp  9167673311 💞 Full Nigh...Russian Call Girls in Andheri Airport Mumbai WhatsApp  9167673311 💞 Full Nigh...
Russian Call Girls in Andheri Airport Mumbai WhatsApp 9167673311 💞 Full Nigh...Pooja Nehwal
 
JAPAN: ORGANISATION OF PMDA, PHARMACEUTICAL LAWS & REGULATIONS, TYPES OF REGI...
JAPAN: ORGANISATION OF PMDA, PHARMACEUTICAL LAWS & REGULATIONS, TYPES OF REGI...JAPAN: ORGANISATION OF PMDA, PHARMACEUTICAL LAWS & REGULATIONS, TYPES OF REGI...
JAPAN: ORGANISATION OF PMDA, PHARMACEUTICAL LAWS & REGULATIONS, TYPES OF REGI...anjaliyadav012327
 
The basics of sentences session 2pptx copy.pptx
The basics of sentences session 2pptx copy.pptxThe basics of sentences session 2pptx copy.pptx
The basics of sentences session 2pptx copy.pptxheathfieldcps1
 
Student login on Anyboli platform.helpin
Student login on Anyboli platform.helpinStudent login on Anyboli platform.helpin
Student login on Anyboli platform.helpinRaunakKeshri1
 
1029 - Danh muc Sach Giao Khoa 10 . pdf
1029 -  Danh muc Sach Giao Khoa 10 . pdf1029 -  Danh muc Sach Giao Khoa 10 . pdf
1029 - Danh muc Sach Giao Khoa 10 . pdfQucHHunhnh
 
social pharmacy d-pharm 1st year by Pragati K. Mahajan
social pharmacy d-pharm 1st year by Pragati K. Mahajansocial pharmacy d-pharm 1st year by Pragati K. Mahajan
social pharmacy d-pharm 1st year by Pragati K. Mahajanpragatimahajan3
 
Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...
Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...
Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...EduSkills OECD
 
Z Score,T Score, Percential Rank and Box Plot Graph
Z Score,T Score, Percential Rank and Box Plot GraphZ Score,T Score, Percential Rank and Box Plot Graph
Z Score,T Score, Percential Rank and Box Plot GraphThiyagu K
 
Measures of Central Tendency: Mean, Median and Mode
Measures of Central Tendency: Mean, Median and ModeMeasures of Central Tendency: Mean, Median and Mode
Measures of Central Tendency: Mean, Median and ModeThiyagu K
 
Nutritional Needs Presentation - HLTH 104
Nutritional Needs Presentation - HLTH 104Nutritional Needs Presentation - HLTH 104
Nutritional Needs Presentation - HLTH 104misteraugie
 
The byproduct of sericulture in different industries.pptx
The byproduct of sericulture in different industries.pptxThe byproduct of sericulture in different industries.pptx
The byproduct of sericulture in different industries.pptxShobhayan Kirtania
 
9548086042 for call girls in Indira Nagar with room service
9548086042  for call girls in Indira Nagar  with room service9548086042  for call girls in Indira Nagar  with room service
9548086042 for call girls in Indira Nagar with room servicediscovermytutordmt
 
Introduction to Nonprofit Accounting: The Basics
Introduction to Nonprofit Accounting: The BasicsIntroduction to Nonprofit Accounting: The Basics
Introduction to Nonprofit Accounting: The BasicsTechSoup
 
Measures of Dispersion and Variability: Range, QD, AD and SD
Measures of Dispersion and Variability: Range, QD, AD and SDMeasures of Dispersion and Variability: Range, QD, AD and SD
Measures of Dispersion and Variability: Range, QD, AD and SDThiyagu K
 
microwave assisted reaction. General introduction
microwave assisted reaction. General introductionmicrowave assisted reaction. General introduction
microwave assisted reaction. General introductionMaksud Ahmed
 
A Critique of the Proposed National Education Policy Reform
A Critique of the Proposed National Education Policy ReformA Critique of the Proposed National Education Policy Reform
A Critique of the Proposed National Education Policy ReformChameera Dedduwage
 

Recently uploaded (20)

Organic Name Reactions for the students and aspirants of Chemistry12th.pptx
Organic Name Reactions  for the students and aspirants of Chemistry12th.pptxOrganic Name Reactions  for the students and aspirants of Chemistry12th.pptx
Organic Name Reactions for the students and aspirants of Chemistry12th.pptx
 
Russian Call Girls in Andheri Airport Mumbai WhatsApp 9167673311 💞 Full Nigh...
Russian Call Girls in Andheri Airport Mumbai WhatsApp  9167673311 💞 Full Nigh...Russian Call Girls in Andheri Airport Mumbai WhatsApp  9167673311 💞 Full Nigh...
Russian Call Girls in Andheri Airport Mumbai WhatsApp 9167673311 💞 Full Nigh...
 
JAPAN: ORGANISATION OF PMDA, PHARMACEUTICAL LAWS & REGULATIONS, TYPES OF REGI...
JAPAN: ORGANISATION OF PMDA, PHARMACEUTICAL LAWS & REGULATIONS, TYPES OF REGI...JAPAN: ORGANISATION OF PMDA, PHARMACEUTICAL LAWS & REGULATIONS, TYPES OF REGI...
JAPAN: ORGANISATION OF PMDA, PHARMACEUTICAL LAWS & REGULATIONS, TYPES OF REGI...
 
The basics of sentences session 2pptx copy.pptx
The basics of sentences session 2pptx copy.pptxThe basics of sentences session 2pptx copy.pptx
The basics of sentences session 2pptx copy.pptx
 
Student login on Anyboli platform.helpin
Student login on Anyboli platform.helpinStudent login on Anyboli platform.helpin
Student login on Anyboli platform.helpin
 
Advance Mobile Application Development class 07
Advance Mobile Application Development class 07Advance Mobile Application Development class 07
Advance Mobile Application Development class 07
 
Mattingly "AI & Prompt Design: The Basics of Prompt Design"
Mattingly "AI & Prompt Design: The Basics of Prompt Design"Mattingly "AI & Prompt Design: The Basics of Prompt Design"
Mattingly "AI & Prompt Design: The Basics of Prompt Design"
 
1029 - Danh muc Sach Giao Khoa 10 . pdf
1029 -  Danh muc Sach Giao Khoa 10 . pdf1029 -  Danh muc Sach Giao Khoa 10 . pdf
1029 - Danh muc Sach Giao Khoa 10 . pdf
 
social pharmacy d-pharm 1st year by Pragati K. Mahajan
social pharmacy d-pharm 1st year by Pragati K. Mahajansocial pharmacy d-pharm 1st year by Pragati K. Mahajan
social pharmacy d-pharm 1st year by Pragati K. Mahajan
 
Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...
Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...
Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...
 
Z Score,T Score, Percential Rank and Box Plot Graph
Z Score,T Score, Percential Rank and Box Plot GraphZ Score,T Score, Percential Rank and Box Plot Graph
Z Score,T Score, Percential Rank and Box Plot Graph
 
Measures of Central Tendency: Mean, Median and Mode
Measures of Central Tendency: Mean, Median and ModeMeasures of Central Tendency: Mean, Median and Mode
Measures of Central Tendency: Mean, Median and Mode
 
Mattingly "AI & Prompt Design: Structured Data, Assistants, & RAG"
Mattingly "AI & Prompt Design: Structured Data, Assistants, & RAG"Mattingly "AI & Prompt Design: Structured Data, Assistants, & RAG"
Mattingly "AI & Prompt Design: Structured Data, Assistants, & RAG"
 
Nutritional Needs Presentation - HLTH 104
Nutritional Needs Presentation - HLTH 104Nutritional Needs Presentation - HLTH 104
Nutritional Needs Presentation - HLTH 104
 
The byproduct of sericulture in different industries.pptx
The byproduct of sericulture in different industries.pptxThe byproduct of sericulture in different industries.pptx
The byproduct of sericulture in different industries.pptx
 
9548086042 for call girls in Indira Nagar with room service
9548086042  for call girls in Indira Nagar  with room service9548086042  for call girls in Indira Nagar  with room service
9548086042 for call girls in Indira Nagar with room service
 
Introduction to Nonprofit Accounting: The Basics
Introduction to Nonprofit Accounting: The BasicsIntroduction to Nonprofit Accounting: The Basics
Introduction to Nonprofit Accounting: The Basics
 
Measures of Dispersion and Variability: Range, QD, AD and SD
Measures of Dispersion and Variability: Range, QD, AD and SDMeasures of Dispersion and Variability: Range, QD, AD and SD
Measures of Dispersion and Variability: Range, QD, AD and SD
 
microwave assisted reaction. General introduction
microwave assisted reaction. General introductionmicrowave assisted reaction. General introduction
microwave assisted reaction. General introduction
 
A Critique of the Proposed National Education Policy Reform
A Critique of the Proposed National Education Policy ReformA Critique of the Proposed National Education Policy Reform
A Critique of the Proposed National Education Policy Reform
 

Ux crunch how to build an award winning website