Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

How to Revive a Design Language to Get to Awesome Products

1,054 views

Published on

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

Published in: Design

How to Revive a Design Language to Get to Awesome Products

  1. 1. How to revive a design language to get to AWESOME PRODUCTS DORELLE RABINOWITZ ERICA DECKER
  2. 2. HELLO. ERICA DORELLE
  3. 3. Our design language took us from this…
  4. 4. …to this.
  5. 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. 6. Create 1 a design-led strategy
  7. 7. OUR VISION A cohesive, multi-device user experience that our customers love.
  8. 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. 9. We started with design, not features.
  10. 10. We used core flows to define basic design patterns.
  11. 11. Then we focused on refining and extending our design language.
  12. 12. We created ownable moments of delight.
  13. 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. 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. 15. Design 2 for an ecosystem
  16. 16. How the patterns work together
  17. 17. How the products work together
  18. 18. How new products enter the ecosystem
  19. 19. And how the teams work together
  20. 20. Designing for an ecosystem means you can’t work in a silo. You have to collaborate. With everyone.
  21. 21. 1 Create a design-led strategy Design for an ecosystem Connect people The tool matters, too Make smart decisions 2 3 4 5
  22. 22. 3 Connect people
  23. 23. Everyone owns the design language
  24. 24. We’re roadies, not rockstars.
  25. 25. It’s better to solve problems together. I need to solve for xyz. Oh wow, so do I!
  26. 26. It’s better to solve problems together. We should solve this together. Right-o!
  27. 27. It’s betterC too slollaveb pororbaletmes! together.
  28. 28. Be fun to work with.
  29. 29. 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.
  30. 30. 1 Create a design-led strategy Design for an ecosystem Connect people The tool matters, too Make smart decisions 2 3 4 5
  31. 31. 4 The tool matters, too
  32. 32. You need a tool for your design language. We call ours a “toolkit”.
  33. 33. Ask for forgiveness, not permission.
  34. 34. You can’t get to awesome if you’re always staring at awful.
  35. 35. Organize by how your design language is built.
  36. 36. Organize by how your design language is built.
  37. 37. Everyone uses the tool.
  38. 38. If everyone is always collaborating… how do you make decisions about the design language?
  39. 39. 1 Create a design-led strategy Design for an ecosystem Connect people The tool matters, too Make smart decisions 2 3 4 5
  40. 40. 5 Make smart decisions
  41. 41. OUR VISION A cohesive, multi-device user experience that our customers love.
  42. 42. 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.
  43. 43. Define ambiguous terms. It needs to be consistent! Use purple! I’m not sure that’s what they mean by consistent.
  44. 44. FIXED = stay consistent FLEXIBLE = you have some choices FREE = roll your own and smoke it
  45. 45. VS
  46. 46. Know when to consciously deviate from the design language. DEVICE CONVENTION DESIGN LANGUAGE CONVENTION
  47. 47. Know when to consciously deviate from the design language. DEVICE CONVENTION DESIGN LANGUAGE CONVENTION
  48. 48. Know when to consciously deviate from the design language. DEVICE CONVENTION DESIGN LANGUAGE CONVENTION
  49. 49. The design language will evolve.
  50. 50. 1 Create a design-led strategy Design for an ecosystem Connect people The tool matters, too Make smart decisions 2 3 4 5
  51. 51. 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!
  52. 52. Last fiscal quarter, we added over 45,000 new customers, bringing our total number of customers to over 600,000.
  53. 53. 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?
  54. 54. Remember the world without a design language?
  55. 55. A design language will help you become design-led. DESIGN-LED PRODUCTS = AWESOME.
  56. 56. The end :) Oh crap. How many times did we say “awesome”? dorelle_rabinowitz@intuit.com @dorelvis erica_decker@intuit.com @twitterissilly

×