Beyond the Waterfall — Rethinking How We Work

2bb52f391792060498f920b8f450a378?s=47 Maya Bruck
April 17, 2016

Beyond the Waterfall — Rethinking How We Work

Designing for the web is complicated, and your process shouldn’t make it harder. Learn tools and techniques for engaging the full breadth of your team in the creative process, turning research, prototyping, design and development into a collaborative and highly effective effort.

2bb52f391792060498f920b8f450a378?s=128

Maya Bruck

April 17, 2016
Tweet

Transcript

  1. Beyond 
 the Waterfall RETHINKING HOW WE WORK // mbruck@etsy.com

    // @mayabruck
  2. None
  3. None
  4. None
  5. I working collaboratively.

  6. None
  7. None
  8. SERIOUSLY?

  9. None
  10. The Epic Waterfall Fail.

  11. RESEARCH UX DESIGN DEVELOPMENT QA

  12. Photo via Brad Frost

  13. #WATERFALLFAIL

  14. #WATERFALLFAIL

  15. ABOUT TO #WATERFALLFAIL

  16. None
  17. None
  18. If it was with my dying breath, I would caution

    anyone against attempting the feat... ANNIE EDSON TAYLOR
  19. I would sooner walk up to the mouth of a

    cannon, knowing it was going to blow me to pieces than make another trip over the Fall. ANNIE EDSON TAYLOR
  20. #NEVERAGAIN

  21. The post waterfall workflow.

  22. Icon by Austin Condiff from the Noun Project

  23. Being involved from the beginning gives me a greater sense

    of ownership over a project. I'm not just implementing a drawing someone hands me, I'm helping real people solve real problems… MAT T WONDRA , SENIOR DEVELOPER, APARTMENT THERAPY
  24. …This not only makes me happier in my work, it

    also motivates me to make sure every detail is done just right. MAT T WONDRA , SENIOR DEVELOPER, APARTMENT THERAPY
  25. SKETCH STUDIO TECHNIQUE

  26. None
  27. Include the full team.

  28. UX DESIGN DEV

  29. Keep it focused.

  30. Come prepared.

  31. FEATURE BRIEF

  32. None
  33. A Feature Brief establishes the sketch studio’s priorities FACT

  34. Sketch. Erase. Repeat.

  35. None
  36. None
  37. None
  38. Capture decisions.

  39. None
  40. SKETCH STUDIO • Iterate & test ideas in real-time •

    Build a shared understanding • Create a sense of ownership
  41. CRITIQUE, OFTEN TECHNIQUE

  42. Team-wide critiques.

  43. Review your designs early and often with a broad team

    TIP
  44. None
  45. “Wow, this design looks really nice. You obviously spent a

    lot of time on this. Unfortunately, we can’t build it.”
  46. When the developer is involved in the process, they can

    warn about parts that are harder to implement. BRIAN WALTERS, FRONT-END DEVELOPER, PIXO
  47. Informal critiques.

  48. None
  49. Design critiques.

  50. CRITIQUE, OFTEN • Get feedback from a broad audience •

    Make sure our designs can be built • Push ourselves to innovate
  51. And now, a story.

  52. None
  53. None
  54. None
  55. WORK IN PARALLEL TECHNIQUE

  56. None
  57. RESEARCH UX DESIGN DEVELOPMENT QA

  58. RESEARCH UX DESIGN DEVELOPMENT QA

  59. RESEARCH UX DESIGN DEVELOPMENT QA

  60. RESEARCH UX DESIGN DEVELOPMENT QA

  61. RESEARCH UX DESIGN DEVELOPMENT QA

  62. None
  63. None
  64. None
  65. WORK IN PARALLEL • Gives time to deal with complications

    • Allows you to respond to project needs • Encourages communication • Creates a sense of ownership
  66. TASK BOARDS TECHNIQUE

  67. TO DO IN PROGRESS BLOCKED DONE Task Task Task Task

    Task Task Task Task
  68. None
  69. None
  70. None
  71. None
  72. None
  73. None
  74. Ticket for task

  75. Backlog of tasks

  76. Tasks added to board

  77. TASK BOARDS • Provide transparency • Capture, organize, and prioritize

    the project’s tasks/issues • Help address bottlenecks immediately
  78. TWEAK CODE TECHNIQUE IT’S OK! YOU CAN DO IT!

  79. TWEAK ALL THE CODE!

  80. None
  81. None
  82. I love when designers actively help implement their vision. LEONID

    GRINBERG, DEVELOPER, THE NEW YORK TIME S
  83. None
  84. 1. The right tools

  85. None
  86. None
  87. 2. Version control

  88. None
  89. designer + developer = awesome

  90. TWEAK CODE • Iterating a design in code can be

    hugely valuable • So. much. more. satisfying. • Creates a stronger relationship with developers
  91. The secret sauce.

  92. None
  93. Without empathy, it doesn’t matter what you do with computers.

    Engineering success doesn’t come from technical means. It comes from understanding humans. JOHN ALLSPAW, CTO, ETSY
  94. Beyond the waterfall.

  95. None
  96. Whatever tool or method you use, let it be one

    that empowers your team and allows them to be true partners.
  97. Thank you! // mbruck@etsy.com // @mayabruck