Presentation given at WebVisions Portland 2014, by Dorelle Rabinowitz and Erica Decker. Its about leading with design using a design language. - strategy - design for an ecosystem - connecting people - the tool - making decisions

1. How to revive a design language to get to
AWESOME PRODUCTS
DORELLE RABINOWITZ
ERICA DECKER

2. HELLO.
ERICA DORELLE

3. Our design language took us from this…

4. …to this.

5. 1 Create a design-led strategy
Design for an ecosystem
Connect people
The tool matters, too
Make smart decisions
2
3
4
5

6. Create 1 a design-led strategy

7. OUR VISION
A cohesive, multi-device
user experience
that our customers
love.

8. Be simple, easy to use, and guiding.
Design for the customer and instill
confidence.
Establish modern and iconic ownable
moments.
Celebrate data while respecting user and
device context.

9. We started with design, not features.

10. We used core flows to define basic design
patterns.

11. Then we focused on refining and extending
our design language.

12. We created ownable moments of delight.

13. ECOSYSTEM
PATTERNS
FRAMEWORKS
DESIGN PRINCIPLES
THE ECOSYSTEM is built on a foundation of cohesive patterns, frameworks,
and design principles.
PATTERNS are standardized solutions for common design
problems.
FRAMEWORKS are structured collections of patterns and
best practices that work together to solve common
design problems.
DESIGN PRINCIPLES provide guidance on
decision-making and set the foundation for the
user experience.

14. 1 Create a design-led strategy
Design for an ecosystem
Connect people
The tool matters, too
Make smart decisions
2
3
4
5

15. Design 2 for an ecosystem

18. How the patterns work together

19. How the products work together

20. How new products enter the ecosystem

21. And how the teams work together

22. Designing for an ecosystem means you
can’t work in a silo. You have to
collaborate. With everyone.

23. 1 Create a design-led strategy
Design for an ecosystem
Connect people
The tool matters, too
Make smart decisions
2
3
4
5

24. 3 Connect people

25. Everyone owns the design language

26. We’re roadies, not rockstars.

27. It’s better to solve problems together.
I need to
solve for xyz.
Oh wow,
so do I!

28. It’s better to solve problems together.
We should
solve this
together.
Right-o!

29. It’s betterC too slollaveb pororbaletmes! together.

30. Be fun to work with.

31. As roadies, we encourage the sharing of
ideas, connect teams, and help solve
design problems - all to create a cohesive
ecosystem… but we’re only two people.

32. 1 Create a design-led strategy
Design for an ecosystem
Connect people
The tool matters, too
Make smart decisions
2
3
4
5

33. 4 The tool matters, too

34. You need a tool for your design language.
We call ours a “toolkit”.

35. Ask for forgiveness, not permission.

36. You can’t get to awesome
if you’re always staring at awful.

38. Organize by how your design language is
built.

39. Organize by how your design language is
built.

40. Everyone uses the tool.

41. If everyone is always collaborating… how do
you make decisions about the design
language?

42. 1 Create a design-led strategy
Design for an ecosystem
Connect people
The tool matters, too
Make smart decisions
2
3
4
5

43. 5 Make smart decisions

44. OUR VISION
A cohesive, multi-device
user experience
that our customers
love.

45. Be simple, easy to use, and guiding.
Design for the customer and instill confidence.
Establish modern and iconic ownable
moments.
Celebrate data while respecting user and
device context.
All decisions ladder up to our
shared design principles.

46. Define ambiguous terms.
It needs to be
consistent!
Use purple!
I’m not sure that’s
what they mean
by consistent.

47. FIXED
= stay consistent
FLEXIBLE
= you have some choices
FREE
= roll your own and smoke it

48. VS

49. Know when to consciously deviate from the
design language.
DEVICE
CONVENTION
DESIGN LANGUAGE
CONVENTION

50. Know when to consciously deviate from the
design language.
DEVICE
CONVENTION
DESIGN LANGUAGE
CONVENTION

51. Know when to consciously deviate from the
design language.
DEVICE
CONVENTION
DESIGN LANGUAGE
CONVENTION

52. The design language will evolve.

53. 1 Create a design-led strategy
Design for an ecosystem
Connect people
The tool matters, too
Make smart decisions
2
3
4
5

54. I use it every day. I love having my business numbers at my
fingertips even at the beach.
I love this app. I am a right brained person. This app lets me
enter expenses as they occur and I can invoice right from the
phone! I'm very happy with it!

55. Last fiscal quarter, we added over 45,000
new customers, bringing our total
number of customers to over 600,000.

56. Our design language also inspired the
folks over at TurboTax to launch a similar
initiative.
How many of you did your taxes with us
this year?

57. Remember the world without a design
language?

58. A design language will help you become design-led.
DESIGN-LED PRODUCTS = AWESOME.

59. The end :)
Oh crap. How many times did we say “awesome”?
dorelle_rabinowitz@intuit.com
@dorelvis
erica_decker@intuit.com
@twitterissilly