the future of enterprise ux design: an asana & quickbooks case study

The Future of Enterprise Design

Amanda Linden Head of Design, Asana

It’s a great time to be building enterprise products.

1

2004 2008 20142013

Design Evolution: QuickBooks

Design Evolution: Salesforce

2011 2012 20152008

Design Evolution: Microsoft Office

2008 2010 20132005

Design Evolution: SAP

2008 2010 20142006

Why are so many enterprise software companies investing in better product design?

2

Newer entrants in SAAS space:

2007 Google

Docs, Sheets, Slides

2008 Asana

2009 Slack

2006 Xero

Migration from desktop to web.

Increase in mobile use for enterprise tasks.

0.0

0.3

0.5

0.8

1.0

Mobile Usage Web Usage

2013 2015

97%

66%

3%33%

The user has become the decision maker.

0.0

15.0

30.0

45.0

60.0

Self-Service Light Touch PremiumChose Asana

independently!

And lots of other reasons:

• Need to reduce support costs.

• Customer expectations are rising

• Stickiness is a thing of the past.

• Lifetime value comes over time.

So where should we invest design and engineering resources?

3

Getting consumer quality UX.

Brand

New User Experience

Simplified Navigation

Great Mobile Experiences

Performance & Offline Mode

MARKETING SITE BEFORE:

Inconsistent logo treatmentBRANDING

New User Experience

Tips for creating a great first use experience:

66%

33%

• Avoid lengthy tours • Ensure that your user can complete a

core task in their first visit • Give your users an “ah ha” moment, that

communicates the core value of your product

• Ensure that your first use experience supports your brand.

• Don’t ask for information you don’t need • Give clear next steps

Simplified Navigation

Tips for simplifying navigation:

66%

• Think about how best to structure the information in your application.

• Provide a homepage that can act as a navigation hub for your product.

• Use the top/global navigation to access key “views” of information across categories.

• Also provide access to “create new”, search, help, & settings in the global nav, so that users have access to them in any context.

• Use the left navigation to identify groups or “folders” of information.

Great Mobile Experiences

Great mobile experiencesWHERE YOU SHOULD INVEST

Tips for developing great mobile experiences:

66%

• Don’t feel the need to duplicate full product functionality in the mobile app.

• Ensure visual patterns, iconography, animation, etc. are consistent.

• Don’t feel the need to launch features on both mobile and web in parallel.

• Leverage device advantages like contact list, location, camera, etc. to reinvent traditional web interactions

• Think carefully about how to infuse your brand into mobile as well.

• Design with the assumption that some of your users will only use your mobile app.

Other important considerations:

Offline ModeWHERE YOU SHOULD INVEST

PerformanceWHERE YOU SHOULD INVEST

MonetizationWHERE YOU SHOULD INVEST

Customization:OTHER THINGS TO CONSIDER

Two enterprise redesign case studies: Asana & QuickBooks

4

Asana Brand System

Our Competitors

Collaborative Exercises

The Brand Story

Think back to the last time you were deep in the zone—time flew by and the work flowed through you almost effortlessly. Now imagine a place where entire teams work in that fully-immersive state of flow on any project they can imagine.

That’s how working together should be, but it is rarely the case. As organizations grow, so does the complexity of our work. Information is scattered; responsibilities unclear. We try to cut through the chaos with endless meetings and micromanagement, but we end up with less time and not much more clarity.

The way we’re working isn’t working.

It’s time for that to change. At Asana, we’re building a place where teams align their energies towards common goals. Where there is no work about work. There is only total clarity, energized focus, and frictionless collaboration. Everything from the most immediate details to the big picture are organized and at your fingertips. In every moment, each person knows what they should be doing and why they’re doing it.

That’s when it gets fun. People love what they do and feel appreciated for what they’re doing. That visceral feeling of being in the zone every day empowers teams to work better, smarter, faster. Organization is as effortless between people as it is between our own brains and bodies.

By empowering all teams to achieve their most ambitious goals, we help humanity thrive.

Do great things together.

Do great things together.

Brand Attributes

Purposeful Passionate, Intentional, Effective

Asana exists to help humanity thrive. Our mission is audaciously large and motivates every step we take. Instead of acting impulsively, we take each step with deliberate planning, craftsmanship, and focus. And then we get the job done.

Empowering Motivating, Encouraging, Enabling

Asana helps people do what they love. We provide invaluable support for teams that are benefiting the world,

whether they’re working on moonshot visions or more down-to-earth ambitions. We aren’t the hero of our story—they are.

Quirky Playful, Unconventional, Whimsical

Asana doesn’t take itself too seriously. We love all the delightful moments that make us smile unexpectedly, so we create those

moments for our customers too. By letting ourselves have fun, we

make countless workplaces a lot less boring. •‿-

Approachable Genuine, Unpretentious, Loving

Asana keeps it real. We’re open and honest, avoiding aloof corporate language and phony marketing spin. We see

ourselves less as a company and more as a team of humans helping other humans, so being friendly and sincere

comes naturally.

Brand Motif

Clarity A clean white canvas that gives an undistracted picture of our team’s work, and the serenity to approach it with ease.

Energy A burst of vibrancy and color, helping us to focus on our most important work, and celebrating the progress that we make.

Design Language System

Color System

Brand Color: “corange”

1. sketch 2. prototype 3. user test 4. beta program 5. A/B test 6. incremental rollout 7. repeat

72

• Less than 2% of existing users opt out of the new design.

• Increase of ~10% on adoption funnel metrics.

• Collaboration rate for new domains has increased ~15%.

• Won some design awards.

• Scaled team to 20 incredibly talented designers.

Results

Net promoter increase

Rebrand Launch

QuickBooks

Inconsistent Design PatternsWHERE WE WERE

Intuit Design Language SystemSUCCESS CRITERIA

• Is extensible, scalable, and flexible across all small business products • Represents one identifiable and cohesive small business brand experience • Is consistent in a way that embraces the commonalities, but allows for the differences across products and platforms • Establishes an ecosystem that delivers customer value quickly • Simplifies accounting tasks while providing contextual content and experiences • Is perceived as professional and trustworthy, while also guiding and instilling confidence in our customers • Exhibits personality and character while highlighting ownable, iconic moments that delight and wow our customers • Is accessible via a toolkit that is scalable and supports the needs of designers and developers • Gives us pride in our products and our work • Is embraced by stakeholders

This program will be deemed successful when the design team presents a human, easy to learn, cross-product and platform design language system that:

Design Principles PROJECT HARMONY

Be simple, easy to use, and guiding.

Design for the customer and instill confidence.

Establish modern and iconic moments.

Celebrate data while respecting user and device context.

1

2

4

3

Redesign RoadmapHARMONY

Web, Mobile & Tablet FlowsHERO FLOWS

First use experience

Managing customers & employees

Create an invoice and collect a payment

Run a P&L report

Run payroll

Installing, and managing apps

Help & support

Payroll

Accounting

Accountant

Payments

HERO FLOWS

DESIGN PATTERNS

BUSINESS RESULTS

•From ~250k to over 700k users in one year.

•8% increase in conversion to paid in US.

•35% increase in conversion to paid globally.

•23% increase in first visit task completion.

•NPS (new users) +9 over original product.

•33% increase in attach on payments

•Call volume down 27%

MOBILE WEB

How do we go from good to great?

5

In a nutshell, it won’t be enough to be a tool that works. You need to be a tool that

makes it feel better to be working.