0
Beyond staggered sprints<br />How TheLadders.com integrated UX into Agile<br />
Who is this guy?<br />With a hat like that, he must know his shit.<br />Jeff Gothelf<br />Currently: <br />Director of UX ...
Job site for professionals earning $100k or more and the recruiters/employers looking to hire them.<br />
Execution team made up of product managers, developers and user experience folks. <br />
UX team made up of Interaction Designers, Visual Designers and Copywriters.<br />Work spans both pre-paywall acquisition  ...
User Experience is a shared service<br />Biz Line<br />Biz Line<br />Biz Line<br />Biz Line<br />
Everything was butterflies and rainbows in our waterfall world<br />I couldn’t find a pic of a waterfall, a rainbow AND bu...
 Thick functional specs
 In-depth wireframe decks
 Long visual design cycles
 Late-stage user validation and testing
 Explicit hand-offs</li></ul>http://www.niagarafallscanadapics.net/Niagara-falls-Canada-rainbow-pdam2.jpg<br />
We didn’t land on Plymouth Rock…<br />In fact, we had no idea we were going for a ride.<br /><ul><li> Bottom-up decision
 No heads-up or discussion with UX</li></ul>http://www.fieldmuseum.org/museum_info/press/images/nature1_lg.jpg<br />
We were told tales of glamour and victory!<br />Improvements galore!<br /><ul><li> Better!
 Faster!
 Tighter!
 Nimbler (is that a word?)</li></ul>http://membres.multimania.fr/frodon9/hpbimg/oliphant.jpg<br />
But instead were treated like Hobbits.<br />We can come along, but figure out your own way.<br /><ul><li> Many stories of ...
 No existing experience
 No clear path to success
 But The Precious was out there….we were sure of it</li></ul>http://quizilla.teennick.com/user_images/T/tohrupenguin/11123...
So we set out on a quest to find the unicorn!<br />And this was no ordinary unicorn.<br />Preliminary research made it cle...
We had some very thorny issues to tackle.<br />These became clear very early.<br /><ul><li> What to do with Big Upfront De...
 How do you maintain focus on a bigger vision?
 Can we maintain product quality?
 How do you produce creative work faster?
 How do you keep the engineering teams busy each iteration?
 Will lighter product iterations be accepted by the business?
 Will we be blamed if they don’t?</li></ul>http://www.africandreamadventuresafaris.com/thornbush-arusha-national-park.JPG<...
The journey of 1000 miles starts with one step.<br />Our first step was research.<br />Agile and user experience<br />http...
And more research…<br />This time with humans.<br />
We even sought out The Oracle…<br />He was very oracle-ish.<br />http://www.xqa.com.ar/visualmanagement/wp-content/uploads...
Add up all the research to get…..ideas!<br />An idea and $.75 and you’re on your way to that cup of coffee.<br />http://le...
Our first attempt:<br />Just get it all done in 2 weeks.<br />
We took our 9-month waterfall process…<br />Which was mighty and massive<br />http://www.julia-mathewson.com/photos/usa_20...
And jammed it into a 2-week timeframe.<br />We kept all the pieces and processes the same.<br />http://www6.worldisround.c...
We became chairmen of the boards.<br />It got a little silly, actually.<br />“The whiteboards do not help organize the UX ...
Functional specs were now banned.<br />The story card had taken the spec’s place. And it multiplied.<br />
The boards took on multiple purposes.<br />Functional spec. Project plan. Resource allocation. And status indication.<br />
The boards took on multiple purposes.<br />Functional spec. Project plan. Resource allocation. And status indication.<br />
But, hey, the UX team got its own board.<br />Which is nice.<br />
Wireframes picked up the heavy lifting specs had left behind.<br />Annotations galore!<br />
Dreams of a “vision” document never materialized.<br />You can dream in one hand and poop in the other. See which one fill...
Learnings from our first attempt:<br />UX morale in the crapper<br />Feeling of “going for the bronze”<br />Perceived qual...
Our second attempt:<br />Introduce two secret weapons<br />
Secret weapon #1: Style guides<br />The cause of, and solution to, all of UX’s problems.<br /><ul><li>Re-usable components...
Housed in centralized, accessible KM system
Asset library for designers and developers
Reduced number of design cycles
Reduced dev time</li></li></ul><li>Secret weapon #1: Style guides<br />The cause of, and solution to, all of UX’s problems...
Secret weapon #1: Style guides<br />The cause of, and solution to, all of UX’s problems.<br />
Secret weapon #1: Style guides<br />The cause of, and solution to, all of UX’s problems.<br />
Secret weapon #1: Style guides<br />The cause of, and solution to, all of UX’s problems.<br />
Secret weapon #1: Style guides<br />Now, everyone’s a designer. Yay?<br />http://iyokobat.files.wordpress.com/2009/04/vill...
Secret weapon #2: Prototyping<br />Show me. Don’t tell me.<br />
Secret weapon #2: Prototyping<br />Show me. Don’t tell me.<br />
Learnings from our second attempt:<br />Style guides make life easier<br />Re-usable components FTW!<br />“Everyone is a d...
Our third attempt:<br />Put everything in-line.<br />
Wait! You forgot usability testing!<br />How else will we know how awesome we are?<br /><ul><li> Every other week (2 weeks...
Upcoming SlideShare
Loading in...5
×

Beyond Staggered Sprints: Integrating User Experience and Agile

29,321

Published on

This is the talk I gave at Agile 2010 detailing how TheLadders.com UX team has been integrating UX practice into a new Agile environment.

Published in: Design
5 Comments
81 Likes
Statistics
Notes
No Downloads
Views
Total Views
29,321
On Slideshare
0
From Embeds
0
Number of Embeds
12
Actions
Shares
0
Downloads
486
Comments
5
Likes
81
Embeds 0
No embeds

No notes for slide
  • Using the style guide leveled the playing field between visual design and interaction design. Now everyone on the team could put together a production-ready prototype of most features on the site. This freed up time and allowed folks to get more work done in the two week timeframe. But the quality of the designs and the thinking behind them started to drop…….putting puzzles together is not quite the same thing as design.
  • Prototyping allows us to show the rest of the team what the final app should look like and how it should behave before code is committed and without writing specs – essentially these took the place of our specs. Initially our prototypes were as functional as the one in the picture (delicious but not functional)…..
  • By showing the team the protoype in a meeting, together we surfaced the requirements and the issues with the current approach. Initial goal was to cut out specs. Next goal is to deliver functional code so we’re not throwing away valuable hours……
  • Transcript of "Beyond Staggered Sprints: Integrating User Experience and Agile"

    1. 1. Beyond staggered sprints<br />How TheLadders.com integrated UX into Agile<br />
    2. 2. Who is this guy?<br />With a hat like that, he must know his shit.<br />Jeff Gothelf<br />Currently: <br />Director of UX at TheLadders.com<br />Previously: <br />Publicis Modem, Webtrends, AOL, Fidelity and an assortment of startups<br />Blog: <br />www.jeffgothelf.com/blog<br />Twitter: <br />@jboogie<br />Email: <br />jgothelf@theladders.com<br />
    3. 3. Job site for professionals earning $100k or more and the recruiters/employers looking to hire them.<br />
    4. 4. Execution team made up of product managers, developers and user experience folks. <br />
    5. 5. UX team made up of Interaction Designers, Visual Designers and Copywriters.<br />Work spans both pre-paywall acquisition and conversion marketing as well as post-paywall product design.<br />
    6. 6. User Experience is a shared service<br />Biz Line<br />Biz Line<br />Biz Line<br />Biz Line<br />
    7. 7. Everything was butterflies and rainbows in our waterfall world<br />I couldn’t find a pic of a waterfall, a rainbow AND butterflies….sorry.<br /><ul><li> 3-9 month release cycles
    8. 8. Thick functional specs
    9. 9. In-depth wireframe decks
    10. 10. Long visual design cycles
    11. 11. Late-stage user validation and testing
    12. 12. Explicit hand-offs</li></ul>http://www.niagarafallscanadapics.net/Niagara-falls-Canada-rainbow-pdam2.jpg<br />
    13. 13. We didn’t land on Plymouth Rock…<br />In fact, we had no idea we were going for a ride.<br /><ul><li> Bottom-up decision
    14. 14. No heads-up or discussion with UX</li></ul>http://www.fieldmuseum.org/museum_info/press/images/nature1_lg.jpg<br />
    15. 15. We were told tales of glamour and victory!<br />Improvements galore!<br /><ul><li> Better!
    16. 16. Faster!
    17. 17. Tighter!
    18. 18. Nimbler (is that a word?)</li></ul>http://membres.multimania.fr/frodon9/hpbimg/oliphant.jpg<br />
    19. 19. But instead were treated like Hobbits.<br />We can come along, but figure out your own way.<br /><ul><li> Many stories of failure
    20. 20. No existing experience
    21. 21. No clear path to success
    22. 22. But The Precious was out there….we were sure of it</li></ul>http://quizilla.teennick.com/user_images/T/tohrupenguin/1112394240_ryfrodosam.jpg<br />
    23. 23. So we set out on a quest to find the unicorn!<br />And this was no ordinary unicorn.<br />Preliminary research made it clear that no one had really nailed this problem.<br />http://www.boingboing.net/gimages/patrick.jpg<br />
    24. 24. We had some very thorny issues to tackle.<br />These became clear very early.<br /><ul><li> What to do with Big Upfront Design?
    25. 25. How do you maintain focus on a bigger vision?
    26. 26. Can we maintain product quality?
    27. 27. How do you produce creative work faster?
    28. 28. How do you keep the engineering teams busy each iteration?
    29. 29. Will lighter product iterations be accepted by the business?
    30. 30. Will we be blamed if they don’t?</li></ul>http://www.africandreamadventuresafaris.com/thornbush-arusha-national-park.JPG<br />
    31. 31. The journey of 1000 miles starts with one step.<br />Our first step was research.<br />Agile and user experience<br />http://www.africandreamadventuresafaris.com/thornbush-arusha-national-park.JPG<br />
    32. 32. And more research…<br />This time with humans.<br />
    33. 33. We even sought out The Oracle…<br />He was very oracle-ish.<br />http://www.xqa.com.ar/visualmanagement/wp-content/uploads/XQA_9437.JPG<br />
    34. 34. Add up all the research to get…..ideas!<br />An idea and $.75 and you’re on your way to that cup of coffee.<br />http://legacy.lclark.edu/faculty/jsmiller/objects/idea_bulb.jpg<br />
    35. 35. Our first attempt:<br />Just get it all done in 2 weeks.<br />
    36. 36. We took our 9-month waterfall process…<br />Which was mighty and massive<br />http://www.julia-mathewson.com/photos/usa_2005_photos/8niagara1.jpg<br />
    37. 37. And jammed it into a 2-week timeframe.<br />We kept all the pieces and processes the same.<br />http://www6.worldisround.com/photos/29/323/524_o.jpg<br />
    38. 38. We became chairmen of the boards.<br />It got a little silly, actually.<br />“The whiteboards do not help organize the UX team’s work at all. Instead, they block out natural light from the windows and create a harsh and uncreative visual environment.”<br />- Internal survey respondent <br />
    39. 39. Functional specs were now banned.<br />The story card had taken the spec’s place. And it multiplied.<br />
    40. 40. The boards took on multiple purposes.<br />Functional spec. Project plan. Resource allocation. And status indication.<br />
    41. 41. The boards took on multiple purposes.<br />Functional spec. Project plan. Resource allocation. And status indication.<br />
    42. 42. But, hey, the UX team got its own board.<br />Which is nice.<br />
    43. 43. Wireframes picked up the heavy lifting specs had left behind.<br />Annotations galore!<br />
    44. 44. Dreams of a “vision” document never materialized.<br />You can dream in one hand and poop in the other. See which one fills first.<br />
    45. 45.
    46. 46. Learnings from our first attempt:<br />UX morale in the crapper<br />Feeling of “going for the bronze”<br />Perceived quality of work was much lower<br />No time to design<br />No ownership or pride in the work<br />Summary: FAIL<br />
    47. 47. Our second attempt:<br />Introduce two secret weapons<br />
    48. 48. Secret weapon #1: Style guides<br />The cause of, and solution to, all of UX’s problems.<br /><ul><li>Re-usable components defined once
    49. 49. Housed in centralized, accessible KM system
    50. 50. Asset library for designers and developers
    51. 51. Reduced number of design cycles
    52. 52. Reduced dev time</li></li></ul><li>Secret weapon #1: Style guides<br />The cause of, and solution to, all of UX’s problems.<br />
    53. 53. Secret weapon #1: Style guides<br />The cause of, and solution to, all of UX’s problems.<br />
    54. 54. Secret weapon #1: Style guides<br />The cause of, and solution to, all of UX’s problems.<br />
    55. 55. Secret weapon #1: Style guides<br />The cause of, and solution to, all of UX’s problems.<br />
    56. 56. Secret weapon #1: Style guides<br />Now, everyone’s a designer. Yay?<br />http://iyokobat.files.wordpress.com/2009/04/village-of-the-damned.jpg<br />
    57. 57. Secret weapon #2: Prototyping<br />Show me. Don’t tell me.<br />
    58. 58. Secret weapon #2: Prototyping<br />Show me. Don’t tell me.<br />
    59. 59. Learnings from our second attempt:<br />Style guides make life easier<br />Re-usable components FTW!<br />“Everyone is a designer” buys more UX time<br />Prototyping reduces the need for most documentation<br />Summary: We’re making progress<br />
    60. 60. Our third attempt:<br />Put everything in-line.<br />
    61. 61. Wait! You forgot usability testing!<br />How else will we know how awesome we are?<br /><ul><li> Every other week (2 weeks sprints)
    62. 62. Mid-way through the sprint
    63. 63. Enough time to reach
    64. 64. Show whatever you have ready
    65. 65. No more than 3 participants
    66. 66. Clear the boulders
    67. 67. Validate and iterate</li></ul>http://stevejencks.files.wordpress.com/2008/07/usability.jpg<br />
    68. 68. Great, the customer likes it. What about the product owner?<br />Opinions are like belly buttons. Belly buttons on cats.<br /><ul><li> Design reviews
    69. 69. 2 reviews per iteration
    70. 70. Initial review mid-way in the sprint, directional alignment
    71. 71. Second review is final – 95% done
    72. 72. Ad hoc reviews in between
    73. 73. Decision at second review is made to move forward or spend another iteration designing</li></ul>http://www.flickr.com/photos/janekeeler/4677093058/sizes/l/<br />
    74. 74. Great, the customer likes it. What about the product owner?<br />Opinions are like belly buttons. Belly buttons on cats.<br />“Design reviews have made the biggest difference. Having all the decision makers in one room has been crucial to getting projects approved on time.”<br />- Internal survey respondent <br />“Design reviews have helped reduce the “endless email thread” reviews we used to have.”<br />- Another internal survey respondent <br />http://www.flickr.com/photos/janekeeler/4677093058/sizes/l/<br />
    75. 75. Learnings from our third attempt:<br />In-sprint user testing provides continuous user feedback in advance of coding<br />Lightweight and cost-effective testing<br />Formal, fixed design reviews provide mileposts for everyone to strive toward<br />Unified approval processes buy more UX time<br />Summary: Win!<br />
    76. 76. Our fourth attempt:<br />Bring everyone together and then separate<br />
    77. 77. Can you guess who sketched this?<br />The answer will shock you!<br />http://www.flickr.com/photos/janekeeler/4677093058/sizes/l/<br />
    78. 78. Can you guess who sketched this?<br />The answer will shock you!<br />http://www.flickr.com/photos/janekeeler/4677093058/sizes/l/<br />
    79. 79. Can you guess who sketched this?<br />The answer will shock you!<br />http://www.flickr.com/photos/janekeeler/4677093058/sizes/l/<br />
    80. 80. The whole execution team did in a modified “design studio.”<br />You can also call it collaborative sketching.<br />Design studios<br /><ul><li> Cross-functional team
    81. 81. Everybody draws, presents and critiques
    82. 82. Refine ideas through 3 rounds
    83. 83. Generate tons of raw ideas
    84. 84. Huge headstart for UX
    85. 85. Early team-wide alignment
    86. 86. Team-wide feeling of ownership</li></li></ul><li>Start small.<br />6 of your best ideas as fast as possible.<br />
    87. 87. Refine to 3 or 4 better ideas.<br />Add detail.<br />
    88. 88. And once more to one, final, detailed idea.<br />Let your one best idea shine.<br />
    89. 89. User Experience is a shared service<br />Biz Line<br />Biz Line<br />Biz Line<br />Biz Line<br />
    90. 90. UX<br />UX<br />UX<br />UX<br />Biz Line<br />Biz Line<br />Biz Line<br />Biz Line<br />
    91. 91. Learnings from our fourth attempt:<br />Collaboration works<br />Anyone can contribute ideas<br />Focusing teams on one workstream proves effective<br />Camaraderie, communication benefit from aligned teams<br />Summary: Win! (that’s two, but I’m not counting)<br />
    92. 92. Where we are today:<br />We’re changing our mind. Slowly.<br />
    93. 93. Designers love ritual.<br />Trying to pull them out of established ruts is a Herculean task.<br />http://www.strongcopssavelives.com/images/Air%20Plane%20Pull%202009.jpg<br />
    94. 94. Designers are used to being heroes. <br />Agile is distinctly, anti-hero.<br />http://www.abegoodman.com/Images/greatest-american-hero.jpg<br />
    95. 95. What about estimates?<br />Deadlines or points?<br />http://1.bp.blogspot.com/_FfetiF7C9vo/SEeOU0ew8KI/AAAAAAAAILU/CE_tq46wDYM/S600/Washington+DC+auto+mechanic,+1942.JPG<br />
    96. 96. Is it viable?<br />Yes, but does anybody actually want it?<br />Minimally viable<br />Minimally desirable<br />
    97. 97. Evolution continues through the breaking of old norms.<br />Moving towards parallel pathing development and design.<br />http://www.greatoutdoors.com/files/imagecache/display/files/images/articles/Wong%20leading%20a%20Powder%208%20win%20%20photo%20-%20Wong%20Collection.jpg<br />
    98. 98. Thanks!<br />Ask me some questions. Here. Now. Or later: jgothelf@theladders.com / @jboogie<br />
    1. A particular slide catching your eye?

      Clipping is a handy way to collect important slides you want to go back to later.

    ×