Don’t Redesign your Website in the Dark Ashley Kemper

Website Program Lead, AsanaSteph RobothamVP Corporate Marketing, Optimizely

Meet our SpeakersSteph Robotham, VP Corporate Marketing. Optimizely• Owner of Optimizely’s website and

marketing technology stack.• Passionate about Optimizely-on-Optimizely• Responsible for bringing our ABM strategy

to life• Measured on marketing generated &

marketing influenced pipeline• Previously, spent 10 years at Salesforce in

demand generation and digital marketing roles

Ashley Kemper, Asana• Website program lead, responsible for

launches, A/B testing, and SEO across Asana’s marketing website

• Led 2015 website redesign as part of rebranding initiative

• Previously a Website Strategist at a boutique agency in NYC

• Passionate about creating rich online experiences

Meet our Speakers

• Yes, we are recording today’s webinar!

• Slides and recording will be sent to all registrants later today.

• Save your questions for Q&A with our speaker after the interview—use the GotoWebinar panel.

Webinar FAQ

Agenda

• Why we’re here: the risks of a redesign

• How to navigate your redesign with confidence

• Asana’s redesign story • Assembling a cross-functional

redesign team• Q&A

Why We’re HereWebsite redesigns are high-stakes, resource-constrained, emotional projects where everyone has an opinion.

“Have you ever felt you could lose your job because of a redesign? I did. It’s a lonely place; just you, and the data, aggressive revenue targets, tight timelines, limited resources. How do you know when it’s time to make that leap?”

- Tiffany Early, Director of Digital Branding, Apperian

Risks of a Redesign

• Interdisciplinary project• Stakeholders from marketing,

development, design, analytics, agency partners, and the C-Suite.

• Lots of new elements at play• Could be new architecture, new

goals, a new brand, shift in your company positioning, an acquisition.

• High visibility, high stakes• Big budget = higher risk if the new

website fails.• Small budget = risk of not enough

resources to meet timeline and scope.

There’s a Better Way: Testing your RedesignYou can execute a redesign in a way that increases your confidence and the likelihood you’ll see positive results—even before you launch.

5 Guiding Principles for Your Redesign1.Define scope and stick to it2.Agree on how you’ll measure success3.Get in the weeds with your data before you

hit GO4.Be thoughtful5.Test before, during, and after launch

1. Define Scope and Stick To It• Start with the goals of the project.• Ask yourself: will redesigning this

page, flow, product help us meet our goals?

• Delivering on time builds confidence.

• Be clear about what you’re not going to do.

2. Know How You’ll Measure Success

• How will you answer the question: “Was our redesign a success?”

• Measurements can be both quantitative and qualitative.

• Frame success in terms your audience will understand.

• Learn from test failures.

3. Get in the Weeds with Your Data• Have good data before you start

- know your baseline metrics inside and out.• Understand performance of key

visitor audiences & segments• Always have a hypothesis for

your A/B tests based on your data.• Be prepared to offer thoughts

on results when you introduce changes.

4. Be Thoughtful

If you’re an executive:• Learn to control your inner HiPPO

• You might love it, but will your customers respond the same way?

• Be prepared to question your assumptions

If you’re managing the project:• Tell your executives “we’re testing” or

“we’re iterating”

• Support your decisions with tests and data

5. Test Before, During, and After Launch• You can—and should—test

during your redesign!• Launch your new site as a test.• Test after the launch to continue

refining and learning.• Be Brave!

Redesigning Optimizely.com: Prior TestingDozens of user tests, CTA copy, navigation testing, introduced key solutions pages

• +1.5% improvement engagement

• +113% improvement views of Solutions page• +117% improvementclicks on secondary CTA

Redesigning Optimizely’s Homepage: Launched as a TestWould a longer page with more content decrease conversions?

B

A

Asana’s Redesign StoryHow iterative testing led to our successful product & website redesign—and the team we assembled to make it all happen.

Asana, Pre-Rebrand

• Make the same Asana feel more simple and intuitive to use.

• Set up the product for future growth.

• Offer more clarity to our users about the value and benefit of Asana.

• Launch a new website that could convey our new brand while meeting or exceeding our old conversion rate.

Goals of Asana’s Rebrand

How We Approached the Website & Product Redesign with TestingProduct team broke work into functionality and visual/brand

updates.

Functionality updates• Launched on a rolling, iterative basis to ensure that our users

would respond positively to changes.

Visual updates• Only released once the core features were all live with a

segment of test users and performing well.• Official brand "relaunch" was released last, including updates

to website.

Goal: Learn the best way to express our new brand in a way that would be well-received by visitors.

Before rolling out rebrand:• Explored new layouts, structures, and formats for website

content• Ran several tests on those layouts with our existing styles,

including: • Rebranded messaging• Homepage organization• Sign up flows

At the time of the total relaunch with new branding, new website had already been 50% tested in some way.

Website Redesign Process

Before

After

Pre-Launch Test: New Product NavigationControl – No Navigation

Variation – New Top Navigation

Pulled My Tasks, My Inbox, Quick Add, and Search out of left pane navigation to make common tasks easier to access.

New Brand Rollout Test #1Would a centered CTA impact sign up rates?

1.6%Increase in

Signups

Control – Right-Aligned Sign Up Box

Variation – CenteredSign Up Box

New Brand Rollout Test #2Tested 12+ combinations of headlines and subheads introducing new positioning

Control – “Teamwork without email”

Variation – “Easiest way for teams to track their work”

Variation 1 – “Move work forward”

15%Conversion

increase

Higher quality signups

Control – Google and Email Signup Options

Variation – No Google Signup Option

New Brand Rollout Test #3Will removing the Google sign up option reduce friction and generate higher-quality signups?

Old website New website with customer-tested improvements

New Brand Rollout: Launch!Implemented learnings: centered CTA, updated messaging, no Google sign up option

Asana’s Redesign TeamHow we managed a simultaneous rebrand, product relaunch, and website redesign.

Website Lead

Product Designers PMs Engs

Brand Consistency Lead

Product

Comms Designers

DesignWebsite Team

Web devs

Asana’s Redesign Team

Tips for Assembling and Working with your Redesign Team• Convene a temporary, cross-

functional group.• Resolve philosophical differences

by picking up from main pain points.

• Make sure everyone on the team is bought into the vision and understands the goals.

• Empower everyone to make decisions on their share of the work.

“A website redesign is the type of project prone to strong emotions and deeply-held opinions. Having data-backed insights about our audience and their behaviors enabled us to stay on track and ensure a successful launch.”

- Ashley Kemper, Website Manager, Asana

TakeawaysHow should you approach your next redesign differently to increase your chance of success?

Takeaways

• Define your scope and always ask “why?”

• Make sure everyone on the team is bought into the vision and understands the goals.

• Testing gives you the data and the confidence to introduce changes pre-launch and know that they will work.

• Work with your executive and cross-functional team to iterate and learn quickly.

Questions?Enter them into your GoToMeeting panel.

Try Optimizely Free for 30 Days

http://www.optimizely.com/get-started

Don’t Redesign your Website in the Dark Ashley Kemper

Website Program Lead, AsanaSteph RobothamVP Corporate Marketing, Optimizely

www.optimize.ly/thrive-webinar Standing Out in A Saturated Market8/24 with Earnest and Hotwire