avoiding disaster: what a successful website redesign looks like

Website Formulas

Avoiding Disaster: What a Successful Website Redesign Looks Like

Webinars

#UTwebinarTodays Guest:Brian MasseyFounder and Conversion ScientistConversion Sciences

@bmasseyNovember, 18 2012http://www.internetretailer.com/2013/01/08/finish-line-loses-3-million-sales-its-new-web-site

2

@bmasseyNovember, 19 2012

3

@bmassey

November, 19 2012

4

@bmasseyNot a happy ending.

5

@bmasseyNot a happy ending.

6

@bmasseyImportant InfoWhy redesigns fail

7

@bmasseyImportant InfoJustifying the risk and effort of a redesign

8

@bmasseyImportant InfoUse your existing site to reduce risks

9

@bmasseyImportant InfoApply a data-driven methods to avoid redesign pitfalls

10

Conversion SciencesA/B Testing ExpertsB2C and B2B EcommerceLead GenerationSaaS

Brian Massey@[email protected](512) 961-6604

11

WHY REDESIGNS FAIL

@bmassey

The things that increase performance+30%

-5%The things that increase performance+30%



+10%The things that increase performance+30%



-5%

12

The things that decrease performance

The things that increase performanceAll Website Changes

13


The things that increase performanceAll Website ChangesGive it more time.

14

@bmasseyThe redesign that was two years in the making started badly leading to an 8% decrease in online sales not to mention countless frustrated and irate customers.

http://www.digital-tonic.co.uk/digital-tonic-blog/went-wrong-marks-spencer-website-redesign-made-lose-sales/

More research would be needed for us to give a thorough UX opinion but our first thoughts are that its a positive redesign.-- ExperienceSolutionsSome customers have had difficulty registering on the siteThere were early reports of crashesCustomers apparently felt that there was too much videoCustomers couldnt find what they wanted-- Web Growth Consulting150 million redesign took two years.

15


The things that increase performanceAll Website ChangesWere geniuses!

16

@bmassey

http://dminc.com/case-study/african-wildlife-foundation/

17

Repeat Visitors are Shocked@bmassey

18

Designed for Wrong Segments@bmassey

19

Your Audience Has Several Local Maxima@bmassey

20

Your Visitors Didnt Go to the Same Design School.Half of your changes will decrease the sites performance.@bmassey

We know this from struggling with our testing process on client after client.21

Reliance on Best Practices@bmassey

22

More Choice is Better, Right?

23

Too Much Emphasis on Look and Feel@bmassey

24

Making the Case for a RedesignPhoto Credit:drinksmachinehttps://www.flickr.com/photos/95457978@N00/3732782275/(cc)

25

Typical Reasons to Redesign

@bmassey








-5%

26

@bmasseyChange in Management Photo Credit:https://www.flickr.com/photos/64636204@N00/2373428173/ (cc)

When the word to redesign comes from the top, it usually means more budgets and more interesting work than day-to-day marketing communications.27

@bmasseyPoor PerformancePhoto Credit: rkleine https://www.flickr.com/photos/47544801@N00/3566407243/ (cc)

28

@bmasseyImprove Mobile ExperiencePhoto Credit:the_steve_coxhttps://www.flickr.com/photos/35468147898@N01/6294412553/(cc)

The feeling is that we need a responsive site to support mobile devices. This a redesign is required.29

@bmasseyWell, Just Look at It!Photo credit: https://www.flickr.com/photos/27904432@N00/6672288949/ (cc)

30

@bmasseyWe Need to be Unique*Photo Credit: https://www.flickr.com/photos/95572727@N00/2065282685/ (cc)

31

Good Reasons to Redesign

@bmassey








-5%

32

@bmasseyPoor Backend System Photo Credit: https://www.flickr.com/photos/108488366@N07/14359994013/ (cc)

33

@bmasseyRebranding or Repositioning*

34

STRATEGIES FOR REDESIGN

@bmassey








-5%

35

@bmassey1Going All InPhoto Credit: https://www.flickr.com/photos/39804614253@N01/1761955352/ (cc)

36

@bmasseyTheres No Such Thing as a Best Practice, Only Best Bets.*Photo Credit: https://www.flickr.com/photos/19365001@N00/123811344/ (cc)

We know this from struggling with our testing process on client after client.37

BetsThe Right Value PropositionThe Right Calls to ActionThe Right Copy and ImagesThe Expected Look and FeelTrust BuildersProofRisk Reversal@bmassey

38

All Website ChangesThe things that increase performance+30%







-10%We see these changes as Bets.

39








-10%

All Website ChangesEvery Audience is Different

40

RESEARCH IS A COLLECTION OF HYPOTHESES, NOT ANSWERS

@bmassey








-5%

41

The Kinds of Information We Use to Make Design Decisions

Informed IntuitionSelf-reported InputBest PracticesExperienceQualitative Behavioral DataQuantitative Behavioral Data

@bmassey

42

Qualitative and Quantitative: Automatic.com@bmassey

@bmassey

OriginalHomePage

UserTesting.com DataFour rounds, eight panelists:Confusion about the product (a hardware device plus application)Difficulty distinguishing between features and apps.Difficulty distinguishing between Automatic app and third party apps@bmassey

Tested a Feature-oriented Home Page@bmassey

Tested a Feature-oriented Home Page@bmassey

37.5% increase in Revenue per Visit

http://conversci.com/udemyux

48

WHAT TO WATCHMetrics that Matter

@bmassey








-5%

49

Returning Users

Are probably in the Consideration Phase or Action Phase@bmassey

Will they have to re-register??50

Lead Generation

Did we make it harder for visitors to take action?@bmassey

51

Lead Quality@bmasseyLead ScoreLead Pipeline Stage

Lead Close Ratio

52

Conversion Rate@bmassey

53

Average Order Value@bmassey

54

Lead Value@bmassey

55

Revenue per Visit@bmassey

56

Conversion by Traffic Source@bmassey

57

Compare

Before and AfterYear-over-year@bmassey

58

@bmassey

2Best Practices Bets

59

B2B Furniture Site@bmassey

60

Reasons for RedesignNew Content Management SystemIncrease Revenue Per VisitBetter Search Engine OptimizationIncrease Mobile Revenue@bmassey

61

DecemberJanuaryMarchAprilJulyAugustNovemberSeptemberThePlanBusy Season

62

DecemberJanuaryMarchAprilJulyAugustNovemberSeptember

TheResult

63

This is TypicalA Website is Software Not Page Design.

@bmassey








-5%

64

DecemberJanuaryMarchAprilJulyAugustNovemberSeptember

TheProcess

Consulted with Conversion Sciences onBest Practices

65

@bmassey

BeforeAfter

66

@bmasseyBeforeAfter

67

No Change in Conversion Rate@bmassey

68


69

No Change in Average Order Value@bmassey

70

Is This a Problem?@bmassey

71

Returning Visitors@bmassey

Returning Visitors

All Visitors

72

Mobile Conversion Rate@bmassey

73

Responsive Mobile Site@bmassey

Significant decrease in Home Page load time

74

Testing has begun to increase conversion rate.@bmassey

75

@bmassey3Test on Current Site

76

Reasons for RedesignIncrease Revenue@bmassey

77

@bmasseyJanuary 1, 2014

78

79

80

Extreme Site MakeoverStatisticallyidentical

81


82

No Change in Average Order@bmassey

83

Things to Test on Current SiteValue Proposition LanguageCalls to ActionRisk ReversalTrust BuildersLanding PagesForm Length@bmassey

84

@bmassey4The Simultaneous Launch

85

Reasons for RedesignIncrease Trials of Pro ServicesIncrease RevenueGet Users to Try More Features@bmassey

86

B2B Applications: MXToolbox@bmassey

87

New Look

BeforeAfter

88

@bmassey

New Application Interface

BeforeAfter

89

Let the Visitor Tell You@bmassey

90

New FeaturesBefore

After

91

ResultsPositive Feedback From PRO Users

Decision to hold off on new interface for free users.

@bmassey

92

@bmassey5Stepwise Redesign

93

B2B Inventory and Asset Tracking Systems@bmassey

94

Reasons for RedesignIncrease Live DemosPresent a Better Brand Impression@bmassey

95

Test New Design and Calls to Action@bmassey

+48.7%Before

After

96

AfterTest Demo Form Page@bmassey

+50.0%Before

97

New Design Influenced by Testing@bmassey

Before

After+30.0%

98

Landing Page

Home Page

CategoryPages

FormPages

Were Still Not Done

99

Why This Crazy Approach?@bmassey

100

Constant Feedback to Designers@bmassey

101

Product 1Start of Redesign ProcessIncrease Leads During Redesign@bmassey

Product 2

Product 3

All Offers

102

DecemberJanuaryMarchAprilJulyAugustNovemberSeptemberTheResult$$$$$$$$$$$$

103

CaveatsWasp Barcode was an outlier. We dont typically triple leads in such a short time.

The intuition of the designers proved to be very good for this audience.

104

Be ready to go back

@bmassey








-5%

105

"We made a strategic decision on December 6 to transition back to our previous site, given the importance of the selling season. As part of our contingency plan, we had kept our previous platform up and running, parallel to the new site, so we were able to swiftly engineer a smooth return to the original site.@bmassey

106

@bmasseyNovember, 18 2012http://www.internetretailer.com/2013/01/08/finish-line-loses-3-million-sales-its-new-web-site

107

@bmasseyNovember, 19 2012

108

@bmasseyDecember 6, 2012http://www.internetretailer.com/2013/01/08/finish-line-loses-3-million-sales-its-new-web-site

109

@bmasseyJune 2014

110

We often redesign for the wrong reasons.@bmassey

111

Without data, redesigns are risky.@bmassey

112

Going All In is the most risky (and most common!)@bmassey

113

Collecting test data on the current site mitigates the risk.@bmassey

114

Testing assumptions on the current site further reduces risk.@bmassey

115

A side-by-side approach allows you to back out poor performing features.@bmassey

116

A stepwise approach eliminates risk while increasing performance immediately.@bmassey

117

Do you need a redesign or an optimization program?@bmassey

118

Free Site Evaluations-First Three-Tweet something nice using #UTWebinar@bmassey

119

Questions?Be sure to check out Conversion Sciences at:ConversionSciences.com

Questions about UserTesting? Email [email protected]

#UTwebinar

CLICK TO EDIT PRESENTER TITLE

avoiding disaster: what a successful website redesign looks like

Business