X U X
eXtreme User eXperience
AOTB2013
Mike Rawling
@hedshot
@Unrulymedia
How one team melded UX with XP
Mike Rawling
@hedshot
@Unrulymedia
Any questions welcome…
…later, please…
Allowed interruptions*
a) A Zombie Apocalypse
b) Nothing.
* Oh, and please set your phones to silent…
Me
Mike Rawling
Senior UX Engineer @Unruly Media, at London
HQ
UX engineering history dates back to 1998…
…Consulting, des...
 Engaging with UX
 Nurturing empathy
 ..What? with a pencil???
kinky!
 Making and keeping it real
 Finding stuff out
...
About Unruly Media
Unrulymedia.com
About Unruly Media
Unrulymedia.com
about Unruly Media
3 development teams:
 each consisting of about about 4 XP, java-
centric, stupidly intelligent programmers
 team has gre...
Unruly Analytics
provides the data
that proves the ROI
o Be inspired. Get real-time access to share of
voice data for your...
Unruly Media
our dev area:
and the real project challenges…
Unruly Analytics
 Offer insight into social media performance
 Teach about social media...
 Committed to XP principles
 Adventurous Spirit
 The CEO said: „Do Lean Start-up‟…
 …I heard „Try Lean UX...‟ 
The pr...
engaging with user
experience
engaging with ux
challenges
There are Classic challenges with UX + Agile…and some
most particular to XP:
 Differences bet...
engaging with ux
posters and evangelism
engaging with ux
engaging with ux
doing intros, tech talks & coaching
engaging with ux
engaging with ux
a UX Wall
engaging with ux
engaging more closely with testing
engaging with ux
user interview script templates for
anyone to use
engaging with ux
nurturing user empathy
nurturing empathy
Challenge: creating a bridge between team and users
Polarised argument: Do I choose personas?
Abso-f-lutely!
nurturing empathy
nurturing empathy
Personas workshops
nurturing empathy
nurturing empathy
Personas: poster-ised
nurturing empathy
Persona-centric / named stories
nurturing empathy
As {persona name} I would
like to…so that…
nurturing empathy
Persona „stickers‟ on story cards
nurturing empathy
“You want me to do what with a pencil?”
or…
Visualising the product
UI, UX & Interaction guidelines
documentation (*gasp*)
Can‟t draw, won‟t draw
(Programmer…)
 “I can‟t draw – let alone „design‟!”
 “design is fluffy!”
 “designers don‟t know ...
Visualising
interfaces
visualising the product
The Dark Secret Of Interaction Design
Enter: Design Charrettes*!!
 Allegedly based regular critiques at
an art academy in Paris – possibly
Beaux arts
(also cal...
Design Charrettes are…
 Select an Epic feature to attack
 Review Personas and each pick
one
 Then…as Pairs we…:
① Brain...
Step one examples:
visualising the product
visualising the product
Design charrettes: amazing results ensue!
visualising the product
Visualising
interfaces
Physical storyboarding…
visualising the product
Visualising
interfaces
New technique: „physical user flows‟:
visualising the product
visualising the product
Physical user flows
making and keeping it real:
new ways of prototyping
Making it real…
…and Keeping It Real
“Prototyping:
where the wheels
touch down on
the tarmac”
Super-Lo-Res Prototyping
making it real…
Lots of sketching > prototyping:
making it real…
Making it real
Functioning wireframes as prototypes
making it real…
Making it real
Good, bad, ugly of this approach…
making it real…
Finding stuff out: research
ux research
The challenges
 I can‟t research all possible (agile) futures
 Fast turn around times!
 I really don‟t want...
Remote, unmoderated user testing tools
ux research
research
Micro surveys and feedback
ux research
research
ux research
working practices
working practices
Challenges…
working practices
working practices
*Humour…*
Super-huddles, Pairing and even Tripling
+
+ +
+ +
+
working practices
UX & project sponsor pairing (e.g. our CEO)
+
+
working practices
UI Squad: UX, Sponsor and Product Manager
+ +
working practices
what really worked? Results??
engaging with ux
 Ongoing! The fun continues…
 tricky to identify and measure success crit...
So! What next???
what next??
Never stop refining
– find what works for you
*Really* magnetic personas!
what next??
Stop Press: it‟s the UX Headlines!
what next??
The Weekly Google Analyst
what next??
MemberVideo Council Whitelisted
Q&A
Winner Best Content
Distribution Service
Any questions?
MemberVideo Council Whitelisted
Thanks for listening!
Still hungry? Contact me…
Winner Best Content
Distribution Service
M...
User Experience & Extreme Programming: An Experience Report
Upcoming SlideShare
Loading in …5
×

User Experience & Extreme Programming: An Experience Report

1,307 views

Published on

eXtreme User Experience: User Experience & Extreme Programming: An Experience Report - how one team melded UX and XP to

Published in: Technology
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,307
On SlideShare
0
From Embeds
0
Number of Embeds
15
Actions
Shares
0
Downloads
16
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide
  • Welcome! Welcome!
  • This is a modest presentation of some ideas, techniques and tools we made our own….
  • I love to answer your questions as we gobut would talk about some topics which may well answer you query…but if not there will be time at the end
  • Experience in UX engineering dates back to 1998I’ve always tried explore ways of more effectively realising the massive potential that software has and that each product starts with. I’ve consulted on, designed, engineered and led teams and initiatives for Tesco, Wiley, Camelot, Konami, LoveFilm and Granada TV and is currently confirmed to talk at Agile On The Beach, UK
  • Experience in UX engineering dates back to 1998I’ve always tried explore ways of more effectively realising the massive potential that software has and that each product starts with. I’ve consulted on, designed, engineered and led teams and initiatives for Tesco, Wiley, Camelot, Konami, LoveFilm and Granada TV and is currently confirmed to talk at Agile On The Beach, UK
  • Here’s a list of topics I’ll be covering to explain how we did it
  • Unruly is a video technology company that works with top brands and their agencies to predict the emotional impact of their videos and get them watched, tracked and shared across paid, owned and earned media. We use our proprietary technology to turn target audiences into engaged viewers and engaged viewers into customers and advocates. In a nutshell, brands use Unruly to join the dots on Facebook, YouTube and the social web.
  • - 4 years ago - 4 people- today - About 150
  • About 150 staff, including a design team of 4/5 and a development team with 3 teams of about 4 XP, Java-centric programmers with less through to medium and experience of customer facing front-end. The team composition has changed over time but we have a team of approximately 5 XP java centric programmers with a new Product manager and a technical development team leader based in LondonOur stakeholder, what we called our Sponsor, was our CEO who was extremely engaged with the project but travelled a lot between London and New York - which is somewhat challenging
  • So – here the blurb we tell our customers…this product benchmarks social media video performance for the top 100 brands
  • It’s an open plan environment with no walls and lots of white boards and walls that we can post which we can stick printouts of competitior UIs, inspiring designs, information graphics and so forth
  • - Offer insight into social media performance- Teach about social media and video - and visual analyticsUser base has a *great* variety of users with Equally varied understanding of statistical analysis…To do so elegantly!
  • - Offer insight into social media performance- Teach about social media and video - and visual analyticsUser base has a *great* variety of users with Equally varied understanding of statistical analysis…To do so elegantly!
  • General thingsWhere does UX fit on kanban/lean boards??Iteration – designing ahead? Iteration -1???As the theme of todays session goes…..read xp/agile issues. What we can to do today is far richer than - Substantial differences exist between agile and UCD approaches which pose challenges to integration attempts.- Although agile methods accentuate testing, and XP involves acceptance and unit testing – and there is an absence of supportive practices for direct support of usability testing- Practices for evaluating systems developed via agile processes for usability and user experience are historically absentXPhas been criticized for being light on the user side of software and apparently is better used with non GUI intensive applicationsRequirements engineering as an activity within XP was not explicitly definedXP has no explicit process for dealing with interaction design
  • Copy from FNAs + Intel presentation on Analytics
  • Used tech lightning talks as opportunities for education and increase awareness of UX concerns
  • It’s an open plan environment with no walls and lots of white boards and walls that we can post which we can stick printouts of competitior UIs, inspiring designs, information graphics and so forth
  • Here I put an A3 sheet below the wall to serve as a place for the team to post questions – these would go straight into the testing scripts, interview scriptsUnderstanding testing by actually taking part – extending a common practice of bringing your employers, team and more behind the observation side of a one way mirror
  • Here I put an A3 sheet below the wall to serve as a place for the team to post questions – these would go straight into the testing scripts, interview scripts or
  • Getting the message from users to the team One key challenge to the process is how best and most efficiently to communicate a users requests and underlying needs into the stories and to developers who are making dozens of decisions a day to get closer to what is needed in the interface? It seems clear that building empathy and instilling the spirit of users’ needs and most tricky – their perspective on things.
  • 4 workshops over several months – each one evolved the personas from a previous edition and then were updated – started with a session *not* including executives or directors or seniors: these members can have a reality warping effect on how people behave –- User interviews – interviewing users in our target markets not just to gather requirements and validate specific issues but also to validate Personas!
  • 4 workshops over several months – each one evolved the personas from a previous edition and then were updated – started with a session *not* including executives or directors or seniors: these members can have a reality warping effect on how people behave –- User interviews – interviewing users in our target markets not just to gather requirements and validate specific issues but also to validate Personas!
  • I printed them out as big as I cold get them, as early as I could in the project, and placed them in a very central location.
  • Story card stickersStories are titledGet new picture of stickers
  • Story card stickersStories are titledGet new picture of stickers
  • Quick referenceCall to action guidelinesAscreen in the applicationthat demonstrates the actual controls
  • I can’t draw???Very interested in idea of UX coach which seems to naturally fit with my recent Successful techniques
  • There’s a simplesecret in interaction design sketching that:If you can draw a circle, square, triangle (and a cross, I suppose) then you can draft some kind of interfaceIn the true spirit of our hand-s on approach I followed this to one logical conclusion with the help of a colleague called John Innes…
  • A technique we used to facilitate collaborative design as a team. - ux’r from san fran - Jon Innes.These are based on the alledged, regular critiques at the Beau Arts Academy in Paris. The story goes that before each critique, a trolley was brought round the art studios to collect the art students work. Students, being what they are, would not quite have finished and sometimes be rushing to finish, and at the last minute would toss their offering on the trolley.
  • - Start by recapping on our personas Using an Epic feature follow a sequence:As Pairs or small groups we :- ideate key features that persona might need and want document on post-itsgather and share – pick top ideas pairs pick their favorite and sketch 5 UI ideas for them in 5 minutes gathers together and picks their favorite idea or emergent idea theme then for 10 minutes groups once again sketch a complete idea separatelyThe whole group chooses best!
  • Example from the first stage
  • Examples from the last stages
  • Success!!!
  • last year in a london back streetrobbiewilliams was filing a music videoReally broken outLess experience with UX storyboards But my understanding Represented much wider general scenarios
  • User flow storycards----------------------------Sometimes devs. were quite quite suspicious Pair on the original idea using familiar tools – cards and some decent sketching pens – sharpies can be usedThen I up the resolution slightly and think through detail in the cards.Stages are easily replacable, or even some can be dropped or tuned in the middle of a story if it’s looks like it’s not MVP enough or too much just to solve the idea.Can easily be broken out into stories – we’ve found some sequences where each cards matches directly to a storySo they almost become like physical user flows, rather than storyboards which in my experience are more like a visual scenario all on one single deliverable.
  • User flow storycards----------------------------Sometimes programmers. were quite quite suspicious of UX artifactsPair on the original idea using familiar tools – cards and some decent sketching pens – sharpies can be usedThen I up the resolution slightly and think through detail in the cards.Stages are easily replacable, or even some can be dropped or tuned in the middle of a story if it’s looks like it’s not MVP enough or too much just to solve the idea.Can easily be broken out into stories – we’ve found some sequences where each cards matches directly to a storySo they almost become like physical user flows, rather than storyboards which in my experience are more like a visual scenario all on one single deliverable.
  • Why do prototypes? I wanted to show things in the easiest but most involving way and I wanted to test some more complex interactions that could not be adequately tested in paper.Sponsor and many stakeholdershas trouble truly understanding ideas, concepts or flows without actually seeing and using themPM helped
  • These were great:QuickDirectEngaging for whole teamDid I mention quick?TestableCould build out the whole experience
  • We were building up lots of sketchesWhat to do with them?
  • So – what were the issues with this approach mainly?- Mixing prod and prototypeCodewiseFor stakeholder – confusion as wireframed (wireframed not mock-ups or ui designs…) elements gained resolution, even experienced stakeholders in turn sometimes confused what was production and what was a prototype elementFor usability test participants - confusion as wireframed (wireframed not mock-ups or ui designs…) elements gained resolution test participants (test users) commonly confused what was production and what was a prototype element
  • I can’t research all possible futuresFast turn around times!I really don’t want to hold anyone upB2B context quite challenging
  • add a screen grab of the demographic selection
  • The response rate for the horrid old fashioned surveys is terrible – I really like these new techniques…although they maybe too subtle and too easy to dismiss – still experimementing
  • Copy from FNAs + Intel presentation on Analytics
  • Classic XP originally excluded other disciplines and advocated pairing We brought in UX and the product sponsor much closer by actually pairing together
  • Humour extremely important – creating products (services) is one of the hardest things in the world and very exciting but can be a little stressful when the team is new, the deadlines are tight and the product is undefinedPics of nerf gunsBeer
  • Copy from FNAs + Intel presentation on Analytics
  • UI squad OK for a short periodReally really productive working and whiteboarding directly with the CEO and project sponsor – who is very open minded and a very creative guy in his own right
  • This is anon going activity. It’s one of the harder aspects to judge in an organisation, I findOne metric might be number of conversations about UX outside of projects? Certainly the CEO has started saying things about and his newly created favourite word last month was Personae….used in presentations quite a few times…
  • Stickygrams are magnetic cards made from pictures you post on the photo sharing site, instagram. I’ve sent off for them and we will be using these on out magnetics whiteboards
  • Copy from FNAs + Intel presentation on Analytics
  • We have found some UX concepts a struggle for some developers to take on board – particularly qualitative research and analysis of results to draw actionable conclusions, despite being extremely willing to offer their opinions after a piece of research has gone on.What is it?One team member takes the role of ‘Google Analyst’ for ½ an iteration. We pair on an activity to analyse the results in Google Analytics but with the programmer ‘driving’ with as little intervention from me as possible. So far this has been really successful - the developer really got into it
  • User Experience & Extreme Programming: An Experience Report

    1. 1. X U X eXtreme User eXperience AOTB2013 Mike Rawling @hedshot @Unrulymedia
    2. 2. How one team melded UX with XP Mike Rawling @hedshot @Unrulymedia
    3. 3. Any questions welcome… …later, please…
    4. 4. Allowed interruptions* a) A Zombie Apocalypse b) Nothing. * Oh, and please set your phones to silent…
    5. 5. Me Mike Rawling Senior UX Engineer @Unruly Media, at London HQ UX engineering history dates back to 1998… …Consulting, designing, engineering, leading, coaching, training…. Teams and initiatives for Tesco, Wiley, Camelot, Konami, LoveFilm and Granada and ITV Also at Agile Cambridge, 25/9/2013
    6. 6.  Engaging with UX  Nurturing empathy  ..What? with a pencil??? kinky!  Making and keeping it real  Finding stuff out  Some other working practices Themes
    7. 7. About Unruly Media Unrulymedia.com
    8. 8. About Unruly Media Unrulymedia.com about Unruly Media
    9. 9. 3 development teams:  each consisting of about about 4 XP, java- centric, stupidly intelligent programmers  team has greatly varying levels of experience and interests  Extremely varied experience of customer facing front-end  1 UX guy Unrulymedia.com Dev@Unruly Media
    10. 10. Unruly Analytics provides the data that proves the ROI o Be inspired. Get real-time access to share of voice data for your video content across the social web. Identify trends and learn about what consumers are sharing. o See the bigger picture. Know the true social reach of your campaign by tracking official, unofficial and derivative copies across social media platforms. o Prove it works. Measure your Social ROI against historical brand performance and benchmarked competitors. about the product
    11. 11. Unruly Media our dev area:
    12. 12. and the real project challenges… Unruly Analytics  Offer insight into social media performance  Teach about social media and video - and visual analytics!  User base has a *great* variety of users with…  …equally varied understanding of statistical analysis  …To do so Elegantly!
    13. 13.  Committed to XP principles  Adventurous Spirit  The CEO said: „Do Lean Start-up‟…  …I heard „Try Lean UX...‟  The project‟s philosophy…
    14. 14. engaging with user experience
    15. 15. engaging with ux challenges There are Classic challenges with UX + Agile…and some most particular to XP:  Differences between Agile and UCD  Agile accentuates acceptance and unit testing – where does usability testing fit in to that?  XP criticised for „being light on user side of software‟ and „best used with non-GUI intensive applications‟  Lacking explicitly defined processes defining requirements engineering, interaction design, etc.
    16. 16. engaging with ux posters and evangelism engaging with ux
    17. 17. engaging with ux doing intros, tech talks & coaching engaging with ux
    18. 18. engaging with ux a UX Wall
    19. 19. engaging with ux engaging more closely with testing engaging with ux
    20. 20. user interview script templates for anyone to use engaging with ux
    21. 21. nurturing user empathy
    22. 22. nurturing empathy Challenge: creating a bridge between team and users
    23. 23. Polarised argument: Do I choose personas? Abso-f-lutely! nurturing empathy
    24. 24. nurturing empathy Personas workshops nurturing empathy
    25. 25. nurturing empathy Personas: poster-ised nurturing empathy
    26. 26. Persona-centric / named stories nurturing empathy As {persona name} I would like to…so that…
    27. 27. nurturing empathy Persona „stickers‟ on story cards nurturing empathy
    28. 28. “You want me to do what with a pencil?” or… Visualising the product
    29. 29. UI, UX & Interaction guidelines documentation (*gasp*)
    30. 30. Can‟t draw, won‟t draw (Programmer…)  “I can‟t draw – let alone „design‟!”  “design is fluffy!”  “designers don‟t know sh*t”  “I‟m not a designer”  “wtf?” Later…  “…but that‟s not the best design”  “..I won‟t do it like that…”  “that‟s just too wacky/unusable/unusual/custom/etc…”  “I could do better…” “I can’t draw” visualising the product
    31. 31. Visualising interfaces visualising the product The Dark Secret Of Interaction Design
    32. 32. Enter: Design Charrettes*!!  Allegedly based regular critiques at an art academy in Paris – possibly Beaux arts (also called „Design Studio‟)  About regular „Critiques‟  Students race to finish…  Useful and effect urgency in the process! *Since then documented in Lean UX, by Jeff Gotthelf visualising the product
    33. 33. Design Charrettes are…  Select an Epic feature to attack  Review Personas and each pick one  Then…as Pairs we…: ① Brainstorm single, key features that persona might need and want ② gather and share – pick top results ③ then pairs pick a favorite ideas and sketch 5 UI ideas for them in 5 minutes ④ gather and share – pick our favorite sketches ⑤ then pairs pick a favorite sketch and sketch a complete UI or wider flow ⑥ gather and share – The whole group chooses result! visualising the product
    34. 34. Step one examples: visualising the product
    35. 35. visualising the product
    36. 36. Design charrettes: amazing results ensue! visualising the product
    37. 37. Visualising interfaces Physical storyboarding… visualising the product
    38. 38. Visualising interfaces New technique: „physical user flows‟: visualising the product
    39. 39. visualising the product Physical user flows
    40. 40. making and keeping it real: new ways of prototyping
    41. 41. Making it real… …and Keeping It Real “Prototyping: where the wheels touch down on the tarmac”
    42. 42. Super-Lo-Res Prototyping making it real…
    43. 43. Lots of sketching > prototyping: making it real…
    44. 44. Making it real Functioning wireframes as prototypes making it real…
    45. 45. Making it real Good, bad, ugly of this approach… making it real…
    46. 46. Finding stuff out: research
    47. 47. ux research The challenges  I can‟t research all possible (agile) futures  Fast turn around times!  I really don‟t want to hold anyone up / be a blocker  B2B context is uniquely challenging
    48. 48. Remote, unmoderated user testing tools ux research
    49. 49. research Micro surveys and feedback ux research
    50. 50. research ux research
    51. 51. working practices
    52. 52. working practices Challenges… working practices
    53. 53. working practices *Humour…*
    54. 54. Super-huddles, Pairing and even Tripling + + + + + + working practices
    55. 55. UX & project sponsor pairing (e.g. our CEO) + + working practices
    56. 56. UI Squad: UX, Sponsor and Product Manager + + working practices
    57. 57. what really worked? Results?? engaging with ux  Ongoing! The fun continues…  tricky to identify and measure success criteria?  There is much discussion about UX now  The CEO refers to personae in slide shows!  UX even crept into team members LinkedIn CVs…!  Conclusion: we‟ve started on quite a long journey together with clear momentum but still much unlearning and new skills to pick up  “CEO refers to „customer related stuff‟ using the term „personae‟ now!”
    58. 58. So! What next???
    59. 59. what next?? Never stop refining – find what works for you
    60. 60. *Really* magnetic personas! what next??
    61. 61. Stop Press: it‟s the UX Headlines! what next??
    62. 62. The Weekly Google Analyst what next??
    63. 63. MemberVideo Council Whitelisted Q&A Winner Best Content Distribution Service Any questions?
    64. 64. MemberVideo Council Whitelisted Thanks for listening! Still hungry? Contact me… Winner Best Content Distribution Service Michael.rawling@unrulymedia.com @hedshot

    ×