Your SlideShare is downloading. ×
0
The Secret Of Agile UX         James O’Brien      james@sparrk.co.uk
The Secret Of Agile UX   Or, How to avoid Big Design Up Frontby pretending not to do Big Design Up Front                Ja...
Who is this guy anyway?
Who is this guy anyway?  UX Freelancer for 10 years
Who is this guy anyway?   UX Freelancer for 10 yearsAgile UX practitioner for 5 years
Who is this guy anyway?   UX Freelancer for 10 yearsAgile UX practitioner for 5 years Sideline in Agile Enablement
Who is this guy anyway?   UX Freelancer for 10 yearsAgile UX practitioner for 5 years Sideline in Agile Enablement  I HAVE...
Who is this guy anyway?   UX Freelancer for 10 yearsAgile UX practitioner for 5 years Sideline in Agile Enablement  I HAVE...
๏   No magic bullets contained within
๏   No magic bullets contained within๏   Do not attempt to implement by rote
๏   No magic bullets contained within๏   Do not attempt to implement by rote๏   Not guaranteed to work with Enterprise    ...
๏   No magic bullets contained within๏   Do not attempt to implement by rote๏   Not guaranteed to work with Enterprise    ...
๏   No magic bullets contained within๏   Do not attempt to implement by rote๏   Not guaranteed to work with Enterprise    ...
“No Big Design Up Front”
i1   i2   i3   i4   i5
Design for i1          i1   i2   i3   i4   i5
Design    Design for i1    for i2           i1       i2   i3   i4   i5
Design    Design    Design for i1    for i2    for i3           i1        i2       i3   i4   i5
Design    Design    Design    Design for i1    for i2    for i3    for i4           i1        i2        i3       i4   i5
Design    Design    Design    Design    Design for i1    for i2    for i3    for i4    for i5           i1        i2      ...
Have aDesign    Design    Design    Design    Design                                                  fucking for i1    fo...
Have aDesign    Design    Design    Design    Design                                                  fucking for i1    fo...
i0   i1   i2   i3   i4   i5Agile’s Dirty Secret: i0
i0   i1   i2   i3   i4   i5
Design for i1          i0   i1   i2   i3   i4   i5
DesignDesign           for i1 for i1            & i2           i0       i1   i2   i3   i4   i5
Design    DesignDesign           for i1    for i2 for i1            & i2      & i3           i0        i1       i2   i3   ...
Design    Design    DesignDesign           for i1    for i2    for i3 for i1            & i2      & i3      & i4          ...
Design    Design    Design    DesignDesign           for i1    for i2    for i3    for i4 for i1            & i2      & i3...
Design          Design    Design    Design    DesignDesign                                            for i5,           fo...
Design          Design    Design    Design    Design              Have aDesign                                            ...
Design          Design    Design    Design    Design              Have aDesign                                            ...
Agile’s Other Dirty Secret:  Planning
GatherRequirements Agile’s Other Dirty Secret:   Planning
Gather        AnalyseRequirements   Requirements Agile’s Other Dirty Secret:   Planning
Gather        Analyse      WriteRequirements   Requirements   Epics Agile’s Other Dirty Secret:   Planning
Gather        Analyse      Write   ScopeRequirements   Requirements   Epics     R1 Agile’s Other Dirty Secret:   Planning
Gather        Analyse      Write   Scope    WriteRequirements   Requirements   Epics     R1    Stories Agile’s Other Dirty...
Gather        Analyse      Write   Scope    Write    PlanRequirements   Requirements   Epics     R1    Stories    R1 Agile...
Gather        Analyse      Write   Scope    Write    PlanRequirements   Requirements   Epics     R1    Stories    R1 Agile...
WriteEpics
Wait... isn’t that how   design works?
Wait... isn’t that how          design works?✦   Pair with BAs during analysis
Wait... isn’t that how          design works?✦   Pair with BAs during analysis✦   Wireframe based on requirements and feed...
Wait... isn’t that how          design works?✦   Pair with BAs during analysis✦   Wireframe based on requirements and feed...
Wait... isn’t that how          design works?✦   Pair with BAs during analysis✦   Wireframe based on requirements and feed...
Wait... isn’t that how          design works?✦   Pair with BAs during analysis✦   Wireframe based on requirements and feed...
Wait... isn’t that how          design works?✦   Pair with BAs during analysis✦   Wireframe based on requirements and feed...
Gather        Analyse      Write   Scope    Write    PlanRequirements   Requirements   Epics     R1    Stories    R1
Gather        Analyse      Write   Scope    Write    PlanRequirements   Requirements   Epics     R1    Stories    R1 Ident...
Gather        Analyse        Write   Scope    Write    PlanRequirements   Requirements     Epics     R1    Stories    R1  ...
Gather        Analyse       Write      Scope    Write    PlanRequirements   Requirements    Epics        R1    Stories    ...
Gather        Analyse       Write   Scope       Write    PlanRequirements   Requirements    Epics     R1       Stories    ...
Gather        Analyse      Write   Scope     Write     PlanRequirements   Requirements   Epics     R1     Stories     R1  ...
Gather        Analyse      Write    Scope     Write    PlanRequirements   Requirements   Epics      R1     Stories    R1  ...
Align Your Strategies Early
Align Your Strategies Early✦   Mobile First == Agile Minimum Valuable Product
Align Your Strategies Early✦   Mobile First == Agile Minimum Valuable Product✦   User Testing fits with frequent demos and...
Align Your Strategies Early✦   Mobile First == Agile Minimum Valuable Product✦   User Testing fits with frequent demos and...
Align Your Strategies Early✦   Mobile First == Agile Minimum Valuable Product✦   User Testing fits with frequent demos and...
Align Your Strategies Early✦   Mobile First == Agile Minimum Valuable Product✦   User Testing fits with frequent demos and...
Align Your Strategies Early✦   Mobile First == Agile Minimum Valuable Product✦   User Testing fits with frequent demos and...
Support Story Writing
Support Story Writing✦   Feed Wireframes into stories as functional artefacts
Support Story Writing✦   Feed Wireframes into stories as functional artefacts✦   Develop your personas with BAs so they ca...
Support Story Writing✦   Feed Wireframes into stories as functional artefacts✦   Develop your personas with BAs so they ca...
Support Story Writing✦   Feed Wireframes into stories as functional artefacts✦   Develop your personas with BAs so they ca...
Support Story Writing✦   Feed Wireframes into stories as functional artefacts✦   Develop your personas with BAs so they ca...
During Development
Prepare to Refactor
Prepare to Refactor✦   Organise your files to prepare for change
Prepare to Refactor✦   Organise your files to prepare for change           http://photoshopetiquette.com/
Prepare to Refactor✦   Organise your files to prepare for change
Prepare to Refactor✦   Organise your files to prepare for change✦   Use design/UX patterns wherever possible
Prepare to Refactor✦   Organise your files to prepare for change✦   Use design/UX patterns wherever possible✦   Use stubbe...
Prepare to Refactor✦   Organise your files to prepare for change✦   Use design/UX patterns wherever possible✦   Use stubbe...
Prepare to Refactor✦   Organise your files to prepare for change✦   Use design/UX patterns wherever possible✦   Use stubbe...
Prepare to Refactor✦   Organise your files to prepare for change✦   Use design/UX patterns wherever possible✦   Use stubbe...
Digression:
Digression:
Digression:We Need To Rethink The Way    We Do Deliverables
The web is not flat images       any more
The web is not flat images       any more✦   We need to be able to show multiple states and    animations easily
The web is not flat images       any more✦   We need to be able to show multiple states and    animations easily✦   We nee...
The web is not flat images       any more✦   We need to be able to show multiple states and    animations easily✦   We nee...
The web is not flat images       any more✦   We need to be able to show multiple states and    animations easily✦   We nee...
Hannah Donovan✦   What does our 3/4 view look    like?✦   http://www.webdirections.org/    resources/hannah-donovan-    de...
Jan Srutekhttp://www.slideshare.net/JanSru/communicating-and-           selling-ux-design-deliverables
Project Meteorhttp://projectmeteor.org/
Stubbed Designs?
Stubbed Designs?✦   Stubbed Designs act as placeholders for    features that haven’t been designed yet
Stubbed Designs?✦   Stubbed Designs act as placeholders for    features that haven’t been designed yet✦   They can also be...
Stubbed Designs?✦   Stubbed Designs act as placeholders for    features that haven’t been designed yet✦   They can also be...
You can flag stubs too.stub:before{width : 64px; height : 64px;background : url(/core/images/nodeploy/flag-stub.png)right ...
You can flag stubs too.stub:before{width : 64px; height : 64px;background : url(/core/images/nodeploy/flag-stub.png)right ...
UX Debt?
UX Debt?“Good enough” or “quick fix”solutions that get you past a       problem quickly
UX Debt?“Good enough” or “quick fix”solutions that get you past a       problem quicklyBut too much debt can choke a proje...
UX Debt?“Good enough” or “quick fix”solutions that get you past a       problem quicklyBut too much debt can choke a proje...
Defining “Done”
Defining “Done”✦   Don’t be precious about signoff
Defining “Done”✦   Don’t be precious about signoff✦   If it works well enough, sign it off and raise an    enhancement - l...
Defining “Done”✦   Don’t be precious about signoff✦   If it works well enough, sign it off and raise an    enhancement - l...
Defining “Done”✦   Don’t be precious about signoff✦   If it works well enough, sign it off and raise an    enhancement - l...
Continuous Availability
Continuous Availability✦   Is horrible and makes it difficult to get into the zone    and you can’t listen to music and YO...
Continuous Availability✦   Is horrible and makes it difficult to get into the zone    and you can’t listen to music and YO...
Upcoming SlideShare
Loading in...5
×

Agile UX – How To Avoid Big Design Up Front By Pretending Not To Do Big Design Up Front

16,494

Published on

My talk from UX Camp London 2011, about the lie of "No Big Design Up Front," the opinion that UX people need to be less lazy and feckless, and finding the gap between the two where Agile UX can flourish.

Published in: Technology, Business
4 Comments
78 Likes
Statistics
Notes
No Downloads
Views
Total Views
16,494
On Slideshare
0
From Embeds
0
Number of Embeds
8
Actions
Shares
0
Downloads
340
Comments
4
Likes
78
Embeds 0
No embeds

No notes for slide
  • This talk was going to be called “Why Agile People are liars and UX People are lazy and feckless” but I try and keep getting lynched to once a month so instead I called it...\n
  • \n
  • \n
  • \n
  • \n
  • \n
  • I’m also making one very large assumption here, and that is that your team is the right size to deliver the scope of the project you have. If your team needs two UXers and they only have you, that’s a problem that this talk is not designed to address.\n
  • I’m also making one very large assumption here, and that is that your team is the right size to deliver the scope of the project you have. If your team needs two UXers and they only have you, that’s a problem that this talk is not designed to address.\n
  • I’m also making one very large assumption here, and that is that your team is the right size to deliver the scope of the project you have. If your team needs two UXers and they only have you, that’s a problem that this talk is not designed to address.\n
  • I’m also making one very large assumption here, and that is that your team is the right size to deliver the scope of the project you have. If your team needs two UXers and they only have you, that’s a problem that this talk is not designed to address.\n
  • I’m also making one very large assumption here, and that is that your team is the right size to deliver the scope of the project you have. If your team needs two UXers and they only have you, that’s a problem that this talk is not designed to address.\n
  • No Big Design Up Front – we all know what this means right? No, you’re wrong. “Design” means a lot of things in software development, and it’s easy for PMs, BAs and us to attach this tenet to the wrong sort of design.\n
  • Of course because that short uncomplicated planning period doesn’t leave a lot of time to front-load the design, you may have tried doing something like this. This never works because design effort and development effort can be orthogonal. Something gets planned in for i4 that would take more than one iteration to design, and suddenly you’re swamped. No fucking party for you!\n
  • Of course because that short uncomplicated planning period doesn’t leave a lot of time to front-load the design, you may have tried doing something like this. This never works because design effort and development effort can be orthogonal. Something gets planned in for i4 that would take more than one iteration to design, and suddenly you’re swamped. No fucking party for you!\n
  • Of course because that short uncomplicated planning period doesn’t leave a lot of time to front-load the design, you may have tried doing something like this. This never works because design effort and development effort can be orthogonal. Something gets planned in for i4 that would take more than one iteration to design, and suddenly you’re swamped. No fucking party for you!\n
  • Of course because that short uncomplicated planning period doesn’t leave a lot of time to front-load the design, you may have tried doing something like this. This never works because design effort and development effort can be orthogonal. Something gets planned in for i4 that would take more than one iteration to design, and suddenly you’re swamped. No fucking party for you!\n
  • Of course because that short uncomplicated planning period doesn’t leave a lot of time to front-load the design, you may have tried doing something like this. This never works because design effort and development effort can be orthogonal. Something gets planned in for i4 that would take more than one iteration to design, and suddenly you’re swamped. No fucking party for you!\n
  • Of course because that short uncomplicated planning period doesn’t leave a lot of time to front-load the design, you may have tried doing something like this. This never works because design effort and development effort can be orthogonal. Something gets planned in for i4 that would take more than one iteration to design, and suddenly you’re swamped. No fucking party for you!\n
  • Of course because that short uncomplicated planning period doesn’t leave a lot of time to front-load the design, you may have tried doing something like this. This never works because design effort and development effort can be orthogonal. Something gets planned in for i4 that would take more than one iteration to design, and suddenly you’re swamped. No fucking party for you!\n
  • Oh thank God, you think, this extra iteration gives me a bit more time to front-load the design work! You may have seen this pattern at work, I know Lynn Miller famously wrote a case study around it, and Johanna Kollman has presented it as her research solution: http://www.agileproductdesign.com/useful_papers/miller_customer_input_in_agile_projects.pdf Fortunately Johanna’s not in the room tonight, because...\n
  • Nope, all that happens is the design work expands to fill the time available – only because it never had enough time to be done right in the first place. Design and development can be more orthogonal than this – you need to either front-load as much as you can, or find ways to simplify the design process and make it responsive to changing priorities.\n
  • Nope, all that happens is the design work expands to fill the time available – only because it never had enough time to be done right in the first place. Design and development can be more orthogonal than this – you need to either front-load as much as you can, or find ways to simplify the design process and make it responsive to changing priorities.\n
  • Nope, all that happens is the design work expands to fill the time available – only because it never had enough time to be done right in the first place. Design and development can be more orthogonal than this – you need to either front-load as much as you can, or find ways to simplify the design process and make it responsive to changing priorities.\n
  • Nope, all that happens is the design work expands to fill the time available – only because it never had enough time to be done right in the first place. Design and development can be more orthogonal than this – you need to either front-load as much as you can, or find ways to simplify the design process and make it responsive to changing priorities.\n
  • Nope, all that happens is the design work expands to fill the time available – only because it never had enough time to be done right in the first place. Design and development can be more orthogonal than this – you need to either front-load as much as you can, or find ways to simplify the design process and make it responsive to changing priorities.\n
  • Nope, all that happens is the design work expands to fill the time available – only because it never had enough time to be done right in the first place. Design and development can be more orthogonal than this – you need to either front-load as much as you can, or find ways to simplify the design process and make it responsive to changing priorities.\n
  • Nope, all that happens is the design work expands to fill the time available – only because it never had enough time to be done right in the first place. Design and development can be more orthogonal than this – you need to either front-load as much as you can, or find ways to simplify the design process and make it responsive to changing priorities.\n
  • Nope, all that happens is the design work expands to fill the time available – only because it never had enough time to be done right in the first place. Design and development can be more orthogonal than this – you need to either front-load as much as you can, or find ways to simplify the design process and make it responsive to changing priorities.\n
  • But what happens if you focus on that nice uncomplicated planning? Here’s a typical planning session. Gosh, look at that - you probably know what’s being delivered in R1 a long time before R1 starts development. Note that it’s easier (cheaper) to add time to planning than development, so if you need more time, ask early!\n
  • But what happens if you focus on that nice uncomplicated planning? Here’s a typical planning session. Gosh, look at that - you probably know what’s being delivered in R1 a long time before R1 starts development. Note that it’s easier (cheaper) to add time to planning than development, so if you need more time, ask early!\n
  • But what happens if you focus on that nice uncomplicated planning? Here’s a typical planning session. Gosh, look at that - you probably know what’s being delivered in R1 a long time before R1 starts development. Note that it’s easier (cheaper) to add time to planning than development, so if you need more time, ask early!\n
  • But what happens if you focus on that nice uncomplicated planning? Here’s a typical planning session. Gosh, look at that - you probably know what’s being delivered in R1 a long time before R1 starts development. Note that it’s easier (cheaper) to add time to planning than development, so if you need more time, ask early!\n
  • But what happens if you focus on that nice uncomplicated planning? Here’s a typical planning session. Gosh, look at that - you probably know what’s being delivered in R1 a long time before R1 starts development. Note that it’s easier (cheaper) to add time to planning than development, so if you need more time, ask early!\n
  • But what happens if you focus on that nice uncomplicated planning? Here’s a typical planning session. Gosh, look at that - you probably know what’s being delivered in R1 a long time before R1 starts development. Note that it’s easier (cheaper) to add time to planning than development, so if you need more time, ask early!\n
  • But what happens if you focus on that nice uncomplicated planning? Here’s a typical planning session. Gosh, look at that - you probably know what’s being delivered in R1 a long time before R1 starts development. Note that it’s easier (cheaper) to add time to planning than development, so if you need more time, ask early!\n
  • So what process does a BA go through to turn analysed requirements into epics? Well, it’s another iterative process. Define what you think the behaviour is, validate that with the stakeholders, refine your assumptions based on their response. Wait a minute...\n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • So here are the BA’s high-level tasks and the corresponding UX tasks. Oooh! I see a synergy!\n
  • So here are the BA’s high-level tasks and the corresponding UX tasks. Oooh! I see a synergy!\n
  • So here are the BA’s high-level tasks and the corresponding UX tasks. Oooh! I see a synergy!\n
  • So here are the BA’s high-level tasks and the corresponding UX tasks. Oooh! I see a synergy!\n
  • So here are the BA’s high-level tasks and the corresponding UX tasks. Oooh! I see a synergy!\n
  • So here are the BA’s high-level tasks and the corresponding UX tasks. Oooh! I see a synergy!\n
  • Also, keep the list of stakeholders with UX input as small as possible. I don’t care how many stakeholders you have, only a subset really need input into UX and design - your job is to whittle that subset to the very minimum. Conspire with the BA on this one, believe me they have strategies for doing this sort of thing.\n
  • Also, keep the list of stakeholders with UX input as small as possible. I don’t care how many stakeholders you have, only a subset really need input into UX and design - your job is to whittle that subset to the very minimum. Conspire with the BA on this one, believe me they have strategies for doing this sort of thing.\n
  • Also, keep the list of stakeholders with UX input as small as possible. I don’t care how many stakeholders you have, only a subset really need input into UX and design - your job is to whittle that subset to the very minimum. Conspire with the BA on this one, believe me they have strategies for doing this sort of thing.\n
  • Also, keep the list of stakeholders with UX input as small as possible. I don’t care how many stakeholders you have, only a subset really need input into UX and design - your job is to whittle that subset to the very minimum. Conspire with the BA on this one, believe me they have strategies for doing this sort of thing.\n
  • Also, keep the list of stakeholders with UX input as small as possible. I don’t care how many stakeholders you have, only a subset really need input into UX and design - your job is to whittle that subset to the very minimum. Conspire with the BA on this one, believe me they have strategies for doing this sort of thing.\n
  • Also, keep the list of stakeholders with UX input as small as possible. I don’t care how many stakeholders you have, only a subset really need input into UX and design - your job is to whittle that subset to the very minimum. Conspire with the BA on this one, believe me they have strategies for doing this sort of thing.\n
  • The last point only applies if you’re not being cavalier about your wireframes like I am\n
  • The last point only applies if you’re not being cavalier about your wireframes like I am\n
  • The last point only applies if you’re not being cavalier about your wireframes like I am\n
  • The last point only applies if you’re not being cavalier about your wireframes like I am\n
  • The last point only applies if you’re not being cavalier about your wireframes like I am\n
  • By the time development begins, you’re still not going to have everything ready. But you should know what’s coming, and you should be able to feed a starting point to the developers, and prioritise your own goals for the coming iterations. LIASE WITH THE BAs ON THAT POINT.\n
  • \n\n
  • \n\n
  • We’ll talk about stubbed design and UX debt in a moment\n\n
  • We’ll talk about stubbed design and UX debt in a moment\n\n
  • We’ll talk about stubbed design and UX debt in a moment\n\n
  • We’ll talk about stubbed design and UX debt in a moment\n\n
  • We’ll talk about stubbed design and UX debt in a moment\n\n
  • Change is a fact of life in software development. Agile is a tool designed around that fact, and to make it work, Software Engineers have had to develop strategies and tools. Now it’s our turn to either make those strategies apply to UX or develop our own. Because ultimately Agile will allow us to make better things faster.\n
  • Change is a fact of life in software development. Agile is a tool designed around that fact, and to make it work, Software Engineers have had to develop strategies and tools. Now it’s our turn to either make those strategies apply to UX or develop our own. Because ultimately Agile will allow us to make better things faster.\n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • Stubbed design means that forthcoming requirements don’t need to hold up development in the present. Maybe you have an ugly but functional flow that you can add with minimal branding. Or maybe you have the visual design roughly set but the behaviour is still being refined. Get it to a form where it can be included - maybe that’s just a static image - and get it in there\n
  • Stubbed design means that forthcoming requirements don’t need to hold up development in the present. Maybe you have an ugly but functional flow that you can add with minimal branding. Or maybe you have the visual design roughly set but the behaviour is still being refined. Get it to a form where it can be included - maybe that’s just a static image - and get it in there\n
  • Stubbed design means that forthcoming requirements don’t need to hold up development in the present. Maybe you have an ugly but functional flow that you can add with minimal branding. Or maybe you have the visual design roughly set but the behaviour is still being refined. Get it to a form where it can be included - maybe that’s just a static image - and get it in there\n
  • Flag your stubs so stakeholders in demos clearly know what’s functional and/or final and what isn’t.\nWe use a class to put the stubbed element into pos:rel so that the specificity required to override it is very low - this way we don’t fuck up any prior-positioned elements. Also you can set the nodeploy folder in SVN not to be deployed on releases, so even if the stub class stays in the doc, the image won’t be, and no-one with a life will be any the wiser.\n
  • Here’s an example of one of my stubs - the behaviours weren’t defined, the js wasn’t written but for demos we put this in to stop stakeholders asking why one of the landing pages was so empty.\nNow, this can be a risky strategy. Stakeholders might see a static image and assume it works. Or they may see the ugly but functional flow and assume that’s how it’s always going to look. So it’s important to have been priming stakeholders on your approach as early as possible.\n
  • This isn’t the only strategy for dealing with UX debt – you have to work out what works best for you and your team. You could also work one day a week on UX debt, or use the last iteration as a stability rush. Other suggestions for what might constitute UX debt - Legacy Browser Support, or CSS3 enhancements; give example of MW SecondaryAction buttons\n
  • This isn’t the only strategy for dealing with UX debt – you have to work out what works best for you and your team. You could also work one day a week on UX debt, or use the last iteration as a stability rush. Other suggestions for what might constitute UX debt - Legacy Browser Support, or CSS3 enhancements; give example of MW SecondaryAction buttons\n
  • This isn’t the only strategy for dealing with UX debt – you have to work out what works best for you and your team. You could also work one day a week on UX debt, or use the last iteration as a stability rush. Other suggestions for what might constitute UX debt - Legacy Browser Support, or CSS3 enhancements; give example of MW SecondaryAction buttons\n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • Here are a bunch of things that either don’t have time to talk about tonight or for the most part I don’t have answers for yet. I want to answer all of these, and I hope you’ll help me do that.\n
  • Agile, as a discipline, is 10 years old this year. It’s rapidly becoming THE way that software is built. It’s not going to stop and wait for us to catch up, and it’s going to keep innovating and keep making the process leaner. We can try and keep bending our existing tools and processes around Agile, and watch as the theory and practice become ever more divergent, or we can start running to catch up. I believe we can get it right, and we should get it right, because...\n
  • ...this is what happens if we get it right.\n
  • \n
  • Transcript of "Agile UX – How To Avoid Big Design Up Front By Pretending Not To Do Big Design Up Front"

    1. 1. The Secret Of Agile UX James O’Brien james@sparrk.co.uk
    2. 2. The Secret Of Agile UX Or, How to avoid Big Design Up Frontby pretending not to do Big Design Up Front James O’Brien james@sparrk.co.uk
    3. 3. Who is this guy anyway?
    4. 4. Who is this guy anyway? UX Freelancer for 10 years
    5. 5. Who is this guy anyway? UX Freelancer for 10 yearsAgile UX practitioner for 5 years
    6. 6. Who is this guy anyway? UX Freelancer for 10 yearsAgile UX practitioner for 5 years Sideline in Agile Enablement
    7. 7. Who is this guy anyway? UX Freelancer for 10 yearsAgile UX practitioner for 5 years Sideline in Agile Enablement I HAVE DONE WRONG THINGS
    8. 8. Who is this guy anyway? UX Freelancer for 10 yearsAgile UX practitioner for 5 years Sideline in Agile Enablement I HAVE DONE WRONG THINGS But you can learn from my mistakes
    9. 9. ๏ No magic bullets contained within
    10. 10. ๏ No magic bullets contained within๏ Do not attempt to implement by rote
    11. 11. ๏ No magic bullets contained within๏ Do not attempt to implement by rote๏ Not guaranteed to work with Enterprise Agile, Cargo Cult Agile or Scrumbut
    12. 12. ๏ No magic bullets contained within๏ Do not attempt to implement by rote๏ Not guaranteed to work with Enterprise Agile, Cargo Cult Agile or Scrumbut๏ Requires interaction with BAs and Developers
    13. 13. ๏ No magic bullets contained within๏ Do not attempt to implement by rote๏ Not guaranteed to work with Enterprise Agile, Cargo Cult Agile or Scrumbut๏ Requires interaction with BAs and Developers๏ Risk of improved delivery and morale
    14. 14. “No Big Design Up Front”
    15. 15. i1 i2 i3 i4 i5
    16. 16. Design for i1 i1 i2 i3 i4 i5
    17. 17. Design Design for i1 for i2 i1 i2 i3 i4 i5
    18. 18. Design Design Design for i1 for i2 for i3 i1 i2 i3 i4 i5
    19. 19. Design Design Design Design for i1 for i2 for i3 for i4 i1 i2 i3 i4 i5
    20. 20. Design Design Design Design Design for i1 for i2 for i3 for i4 for i5 i1 i2 i3 i4 i5
    21. 21. Have aDesign Design Design Design Design fucking for i1 for i2 for i3 for i4 for i5 party i1 i2 i3 i4 i5
    22. 22. Have aDesign Design Design Design Design fucking for i1 for i2 for i3 for i4 for i5 party i1 i2 i3 i4 i5 THIS NEVER WORKS
    23. 23. i0 i1 i2 i3 i4 i5Agile’s Dirty Secret: i0
    24. 24. i0 i1 i2 i3 i4 i5
    25. 25. Design for i1 i0 i1 i2 i3 i4 i5
    26. 26. DesignDesign for i1 for i1 & i2 i0 i1 i2 i3 i4 i5
    27. 27. Design DesignDesign for i1 for i2 for i1 & i2 & i3 i0 i1 i2 i3 i4 i5
    28. 28. Design Design DesignDesign for i1 for i2 for i3 for i1 & i2 & i3 & i4 i0 i1 i2 i3 i4 i5
    29. 29. Design Design Design DesignDesign for i1 for i2 for i3 for i4 for i1 & i2 & i3 & i4 & i5 i0 i1 i2 i3 i4 i5
    30. 30. Design Design Design Design DesignDesign for i5, for i1 for i2 for i3 for i4 for i1 & i2 & i3 & i4 & i5 plan fucking party i0 i1 i2 i3 i4 i5
    31. 31. Design Design Design Design Design Have aDesign for i5, for i1 for i2 for i3 for i4 fucking for i1 & i2 & i3 & i4 & i5 plan fucking party party i0 i1 i2 i3 i4 i5
    32. 32. Design Design Design Design Design Have aDesign for i5, for i1 for i2 for i3 for i4 fucking for i1 & i2 & i3 & i4 & i5 plan fucking party party i0 i1 i2 i3 i4 i5 THIS NEVER WORKS
    33. 33. Agile’s Other Dirty Secret: Planning
    34. 34. GatherRequirements Agile’s Other Dirty Secret: Planning
    35. 35. Gather AnalyseRequirements Requirements Agile’s Other Dirty Secret: Planning
    36. 36. Gather Analyse WriteRequirements Requirements Epics Agile’s Other Dirty Secret: Planning
    37. 37. Gather Analyse Write ScopeRequirements Requirements Epics R1 Agile’s Other Dirty Secret: Planning
    38. 38. Gather Analyse Write Scope WriteRequirements Requirements Epics R1 Stories Agile’s Other Dirty Secret: Planning
    39. 39. Gather Analyse Write Scope Write PlanRequirements Requirements Epics R1 Stories R1 Agile’s Other Dirty Secret: Planning
    40. 40. Gather Analyse Write Scope Write PlanRequirements Requirements Epics R1 Stories R1 Agile’s Other Dirty Secret: Planning ~= Design
    41. 41. WriteEpics
    42. 42. Wait... isn’t that how design works?
    43. 43. Wait... isn’t that how design works?✦ Pair with BAs during analysis
    44. 44. Wait... isn’t that how design works?✦ Pair with BAs during analysis✦ Wireframe based on requirements and feed those into epics
    45. 45. Wait... isn’t that how design works?✦ Pair with BAs during analysis✦ Wireframe based on requirements and feed those into epics✦ Refine your wireframes as the epics are validated by the business
    46. 46. Wait... isn’t that how design works?✦ Pair with BAs during analysis✦ Wireframe based on requirements and feed those into epics✦ Refine your wireframes as the epics are validated by the business✦ Some IA and UX artefacts will pop out of this process naturally
    47. 47. Wait... isn’t that how design works?✦ Pair with BAs during analysis✦ Wireframe based on requirements and feed those into epics✦ Refine your wireframes as the epics are validated by the business✦ Some IA and UX artefacts will pop out of this process naturally✦ Develop your modular design language
    48. 48. Wait... isn’t that how design works?✦ Pair with BAs during analysis✦ Wireframe based on requirements and feed those into epics✦ Refine your wireframes as the epics are validated by the business✦ Some IA and UX artefacts will pop out of this process naturally✦ Develop your modular design language✦ Only go hi-fi when the release is scoped
    49. 49. Gather Analyse Write Scope Write PlanRequirements Requirements Epics R1 Stories R1
    50. 50. Gather Analyse Write Scope Write PlanRequirements Requirements Epics R1 Stories R1 Identify UXRequirements
    51. 51. Gather Analyse Write Scope Write PlanRequirements Requirements Epics R1 Stories R1 Define Identify UX large-scale IARequirements (to feed into epics)
    52. 52. Gather Analyse Write Scope Write PlanRequirements Requirements Epics R1 Stories R1 Define Identify UX large-scale IA WireframeRequirements (to feed Epics into epics)
    53. 53. Gather Analyse Write Scope Write PlanRequirements Requirements Epics R1 Stories R1 Define Begin Identify UX large-scale IA Wireframe siteRequirements (to feed Epics design into epics) language
    54. 54. Gather Analyse Write Scope Write PlanRequirements Requirements Epics R1 Stories R1 Define Begin Identify UX large-scale IA Wireframe site WireframeRequirements (to feed Epics design Stories into epics) language
    55. 55. Gather Analyse Write Scope Write PlanRequirements Requirements Epics R1 Stories R1 Define Begin Identify UX large-scale IA Wireframe site Wireframe Hi-FiRequirements (to feed Epics design Stories i1 of R1 into epics) language
    56. 56. Align Your Strategies Early
    57. 57. Align Your Strategies Early✦ Mobile First == Agile Minimum Valuable Product
    58. 58. Align Your Strategies Early✦ Mobile First == Agile Minimum Valuable Product✦ User Testing fits with frequent demos and releases
    59. 59. Align Your Strategies Early✦ Mobile First == Agile Minimum Valuable Product✦ User Testing fits with frequent demos and releases✦ Browser Testing fits with Continuous QA
    60. 60. Align Your Strategies Early✦ Mobile First == Agile Minimum Valuable Product✦ User Testing fits with frequent demos and releases✦ Browser Testing fits with Continuous QA✦ Accessibility exposes a layer that automated testing can exploit
    61. 61. Align Your Strategies Early✦ Mobile First == Agile Minimum Valuable Product✦ User Testing fits with frequent demos and releases✦ Browser Testing fits with Continuous QA✦ Accessibility exposes a layer that automated testing can exploit✦ Feedback from the business validates your design
    62. 62. Align Your Strategies Early✦ Mobile First == Agile Minimum Valuable Product✦ User Testing fits with frequent demos and releases✦ Browser Testing fits with Continuous QA✦ Accessibility exposes a layer that automated testing can exploit✦ Feedback from the business validates your design✦ Share knowledge with BAs wherever possible
    63. 63. Support Story Writing
    64. 64. Support Story Writing✦ Feed Wireframes into stories as functional artefacts
    65. 65. Support Story Writing✦ Feed Wireframes into stories as functional artefacts✦ Develop your personas with BAs so they can frame stories around the personas
    66. 66. Support Story Writing✦ Feed Wireframes into stories as functional artefacts✦ Develop your personas with BAs so they can frame stories around the personas✦ Define your UX principles as NFRs
    67. 67. Support Story Writing✦ Feed Wireframes into stories as functional artefacts✦ Develop your personas with BAs so they can frame stories around the personas✦ Define your UX principles as NFRs✦ Let developers know that the wireframes are canonical
    68. 68. Support Story Writing✦ Feed Wireframes into stories as functional artefacts✦ Develop your personas with BAs so they can frame stories around the personas✦ Define your UX principles as NFRs✦ Let developers know that the wireframes are canonical✦ Feed hi-fis if you have them, but keep the developers focused on the wireframes
    69. 69. During Development
    70. 70. Prepare to Refactor
    71. 71. Prepare to Refactor✦ Organise your files to prepare for change
    72. 72. Prepare to Refactor✦ Organise your files to prepare for change http://photoshopetiquette.com/
    73. 73. Prepare to Refactor✦ Organise your files to prepare for change
    74. 74. Prepare to Refactor✦ Organise your files to prepare for change✦ Use design/UX patterns wherever possible
    75. 75. Prepare to Refactor✦ Organise your files to prepare for change✦ Use design/UX patterns wherever possible✦ Use stubbed design and UX debt
    76. 76. Prepare to Refactor✦ Organise your files to prepare for change✦ Use design/UX patterns wherever possible✦ Use stubbed design and UX debt✦ Build a reusable asset library early on
    77. 77. Prepare to Refactor✦ Organise your files to prepare for change✦ Use design/UX patterns wherever possible✦ Use stubbed design and UX debt✦ Build a reusable asset library early on✦ Use a preprocessor like LESS to ensure your CSS can be quickly refactored
    78. 78. Prepare to Refactor✦ Organise your files to prepare for change✦ Use design/UX patterns wherever possible✦ Use stubbed design and UX debt✦ Build a reusable asset library early on✦ Use a preprocessor like LESS to ensure your CSS can be quickly refactored✦ Focus on high-friction targets first - the UX debt will be less painful for users on the low-friction ones
    79. 79. Digression:
    80. 80. Digression:
    81. 81. Digression:We Need To Rethink The Way We Do Deliverables
    82. 82. The web is not flat images any more
    83. 83. The web is not flat images any more✦ We need to be able to show multiple states and animations easily
    84. 84. The web is not flat images any more✦ We need to be able to show multiple states and animations easily✦ We need the rest of the team to be able to understand the scope of a design unambiguously
    85. 85. The web is not flat images any more✦ We need to be able to show multiple states and animations easily✦ We need the rest of the team to be able to understand the scope of a design unambiguously✦ We need to be able to refactor our deliverables quickly, and have the refactoring cascade through the whole project
    86. 86. The web is not flat images any more✦ We need to be able to show multiple states and animations easily✦ We need the rest of the team to be able to understand the scope of a design unambiguously✦ We need to be able to refactor our deliverables quickly, and have the refactoring cascade through the whole project✦ We need to have a tool that supports patterns and modularity
    87. 87. Hannah Donovan✦ What does our 3/4 view look like?✦ http://www.webdirections.org/ resources/hannah-donovan- designing-without-the-browser/✦ http://www.webdirections.org/ resources/hannah-donovan- telling-stories-through-design/✦ @han
    88. 88. Jan Srutekhttp://www.slideshare.net/JanSru/communicating-and- selling-ux-design-deliverables
    89. 89. Project Meteorhttp://projectmeteor.org/
    90. 90. Stubbed Designs?
    91. 91. Stubbed Designs?✦ Stubbed Designs act as placeholders for features that haven’t been designed yet
    92. 92. Stubbed Designs?✦ Stubbed Designs act as placeholders for features that haven’t been designed yet✦ They can also be your progressive enhancement baseline
    93. 93. Stubbed Designs?✦ Stubbed Designs act as placeholders for features that haven’t been designed yet✦ They can also be your progressive enhancement baseline✦ They should be simple, but they don’t need to be ugly
    94. 94. You can flag stubs too.stub:before{width : 64px; height : 64px;background : url(/core/images/nodeploy/flag-stub.png)right top no-repeat;display : block; content:" ";position : absolute; right : 0; top : 0;}.stub{position : relative;}
    95. 95. You can flag stubs too.stub:before{width : 64px; height : 64px;background : url(/core/images/nodeploy/flag-stub.png)right top no-repeat;display : block; content:" ";position : absolute; right : 0; top : 0;}.stub{position : relative;}
    96. 96. UX Debt?
    97. 97. UX Debt?“Good enough” or “quick fix”solutions that get you past a problem quickly
    98. 98. UX Debt?“Good enough” or “quick fix”solutions that get you past a problem quicklyBut too much debt can choke a project further down the line
    99. 99. UX Debt?“Good enough” or “quick fix”solutions that get you past a problem quicklyBut too much debt can choke a project further down the lineSo you must address UX debtperiodically - during i zero or UAT are good times
    100. 100. Defining “Done”
    101. 101. Defining “Done”✦ Don’t be precious about signoff
    102. 102. Defining “Done”✦ Don’t be precious about signoff✦ If it works well enough, sign it off and raise an enhancement - let the client decide how important design perfection is
    103. 103. Defining “Done”✦ Don’t be precious about signoff✦ If it works well enough, sign it off and raise an enhancement - let the client decide how important design perfection is✦ Or track imperfections as defects or UX debt and raise tasks to fix them
    104. 104. Defining “Done”✦ Don’t be precious about signoff✦ If it works well enough, sign it off and raise an enhancement - let the client decide how important design perfection is✦ Or track imperfections as defects or UX debt and raise tasks to fix them✦ Be open to developers’ suggestions but stand firm on the really important stuff
    105. 105. Continuous Availability
    106. 106. Continuous Availability✦ Is horrible and makes it difficult to get into the zone and you can’t listen to music and YOU HAVE TO DO IT
    107. 107. Continuous Availability✦ Is horrible and makes it difficult to get into the zone and you can’t listen to music and YOU HAVE TO DO IT✦ If developers think you’re unapproachable, they’ll guess at implementation – THIS IS BAD
    108. 108. Continuous Availability✦ Is horrible and makes it difficult to get into the zone and you can’t listen to music and YOU HAVE TO DO IT✦ If developers think you’re unapproachable, they’ll guess at implementation – THIS IS BAD✦ Be available with your body language as well as your speech: “My time is infinite and you can have as much as you want”
    109. 109. Continuous Availability Strategies
    110. 110. Continuous Availability Strategies✦ The Sacrificial Lamb – when there are >1 people in a role, they rotate their availability
    111. 111. Continuous Availability Strategies✦ The Sacrificial Lamb – when there are >1 people in a role, they rotate their availability✦ The Scary Face – a physical flag you can raise when you need to focus, but it requires a lot of discipline
    112. 112. Continuous Availability Strategies✦ The Sacrificial Lamb – when there are >1 people in a role, they rotate their availability✦ The Scary Face – a physical flag you can raise when you need to focus, but it requires a lot of discipline✦ No-meeting Hours – you stay available to the team but no meetings can be booked, reduces the chance of being pulled away
    113. 113. Continuous Availability Strategies✦ The Sacrificial Lamb – when there are >1 people in a role, they rotate their availability✦ The Scary Face – a physical flag you can raise when you need to focus, but it requires a lot of discipline✦ No-meeting Hours – you stay available to the team but no meetings can be booked, reduces the chance of being pulled away✦ Be careful not to overuse these and drive devs away!
    114. 114. Leverage QA and Showcases
    115. 115. Leverage QA and Showcases✦ Don’t let the devs destroy the showcase environment - use it for guerilla user testing!
    116. 116. Leverage QA and Showcases✦ Don’t let the devs destroy the showcase environment - use it for guerilla user testing!✦ Ensure the devs focus on making deployment simple so you can incorporate rapid prototyping (but you probably don’t want to do this on the showcase environment)
    117. 117. Leverage QA and Showcases✦ Don’t let the devs destroy the showcase environment - use it for guerilla user testing!✦ Ensure the devs focus on making deployment simple so you can incorporate rapid prototyping (but you probably don’t want to do this on the showcase environment)✦ You can automate some UI and accessibility testing using Selenium: http://code.google.com/p/web- accessibility-testing/downloads/list
    118. 118. Leverage QA and Showcases✦ Don’t let the devs destroy the showcase environment - use it for guerilla user testing!✦ Ensure the devs focus on making deployment simple so you can incorporate rapid prototyping (but you probably don’t want to do this on the showcase environment)✦ You can automate some UI and accessibility testing using Selenium: http://code.google.com/p/web- accessibility-testing/downloads/list✦ While you’re automating, ensure that test data is structured so as to stress the UI
    119. 119. There’s moreHow do we estimate UX effort? Leveraging Test DataReusable Brainstorming UX and AutomationUX and Spikes Optimising Research with Agile UX on the card wall
    120. 120. Agile Won’t Wait http://www.flickr.com/photos/uriel1998/
    121. 121. Now go and buildincredible things.
    122. 122. Thank You James O’Brienjames@sparrk.co.uk
    1. A particular slide catching your eye?

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

    ×