You'll learn: - Techniques for designing enterprise UX base on new user expectations. - How to design a consumer-grade enterprise experience - Enterprise UX best practices based on case studies from Asana and Intuit

1. The Future of
Enterprise Design

2. Amanda Linden
Head of Design, Asana

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

4. 2004 2008 20142013
Design Evolution: QuickBooks

5. Design Evolution: Salesforce
2011 2012 20152008

6. Design Evolution: Microsoft Office
2008 2010 20132005

7. Design Evolution: SAP
2008 2010 20142006

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

9. Newer entrants in SAAS space:
2007
Google
Docs, Sheets, Slides
2008
Asana
2009
Slack
2006
Xero

10. Migration from desktop to web.

11. 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%

12. The user has become the decision maker.
0.0
15.0
30.0
45.0
60.0
Self-Service Light Touch Premium
Chose Asana
independently!

13. 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.

14. So where should we invest design
and engineering resources?
3

15. Getting consumer quality UX.
Brand
New User Experience
Simplified Navigation
Great Mobile Experiences
Performance & Offline Mode

16. Brand

18. MARKETING SITE BEFORE:

22. Inconsistent logo treatment
BRANDING

33. 33

34. New User Experience

36. 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

37. Simplified Navigation

42. 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.

43. Great Mobile Experiences

44. Great mobile experiences
WHERE YOU SHOULD INVEST

46. 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.

47. Other important considerations:

48. Offline Mode
WHERE YOU SHOULD INVEST

49. Performance
WHERE YOU SHOULD INVEST

50. Monetization
WHERE YOU SHOULD INVEST

51. Customization:
OTHER THINGS TO CONSIDER

52. Two enterprise redesign case studies:
Asana & QuickBooks
4

53. Asana

55. Asana Brand System

56. Our Competitors

57. Collaborative Exercises

58. The Brand Story

59. 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.

60. Brand Attributes

61. 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.

62. Brand Motif

63. 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.

64. Design Language System

65. Design Language System

66. Design Language System

67. Color System

68. Brand Color: “corange”

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

72. 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

73. Net promoter increase
Rebrand Launch

74. QuickBooks

75. Inconsistent Design Patterns
WHERE WE WERE

76. Inconsistent Design Patterns
WHERE WE WERE

77. Intuit Design Language System
SUCCESS 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:

78. 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

79. Redesign Roadmap
HARMONY

80. Web, Mobile & Tablet Flows
HERO 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

81. HERO FLOWS

82. HERO FLOWS

83. HERO FLOWS

84. DESIGN PATTERNS

85. DESIGN PATTERNS

87. DESIGN PATTERNS

91. DESIGN PATTERNS

92. DESIGN PATTERNS

93. 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

94. How do we go from good to great?
5

95. 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.

101. ?