Designing with AgileFast, Effective Methods that Work                   @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
Workshop Overview- Agile + UX = ?- Kick-Off- Personas- Stories- UI Design- Minimum Viable Products- Sprinting- Retrospecti...
What’s a topquestion you hopeto get answeredtoday?        @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
Agile + UX = ?Kick-OffPersonasStoriesUI DesignMinimum Viable ProductsSprintingRetrospective           @ANDERSRAMSAY / DESI...
@ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
Experience                                 Delivery    @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
@ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
@ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
Agile + UX = ?Methods like Scrum and XP...are optimized for this…                     ...but insufficient for this.       ...
Agile UX PAINFeeding the beast“There’s a whole team of developers and I’m the only UX designer.They’re building features f...
@ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
Traditional Relay Race- Team members mostly run alone.- Communication occurs mainly through document hand-offs.- One big c...
PM                        GD                                   Dev         BA                                             ...
Our top goal is to…but what’s                        most important is that we…tho what                        we really m...
A Rugby Game Meeting Workshop- An intensive passing game across roles/perspectives.- Rapidly iterating toward shared under...
A UX Rugby Toolkit...- Cardstorming- Collaborative Chartering- Design Studio- Dotvoting- Ideation Clearinghouse- Paired In...
Transforming UX Practice...                                            ...and beyond.                                     ...
Putting Agile UX in Context                     Traditional UX                      Design, Usability                    W...
Agile + UX = ?Kick-OffPersonasStoriesUI DesignMinimum Viable ProductsSprintingRetrospective           @ANDERSRAMSAY / DESI...
Source: David HussmanCollaborative Chartering: An Agile Kick-Off- At-a-glance view of the project.- Big visible open docum...
@ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
@ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
Teams- 4-6 per team.- 1 product owner                    @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
Our Sample ProjectDesign a Tablet App for a Children’s CharityProviding education and shelter for abandonedand orphaned ch...
Collaborative Chartering Activity 1.Business sponsor presents   project goals. 2.Team crowd-sources shared   understanding...
“Sunshine App”               Start / End DatesBusiness Goal(s)Success metricsUsers/PersonasDesign VisionCadenceTeam Next M...
The Business Owner’s Pitch“We’ve just received funding from an anonymous donor to update our digital presence. Ourcurrent ...
Business Goals1. Convince visitors to make a donation.2. Persuade visitors to donate a little more than intended.3. Instil...
Agile + UX = ?Kick-OffPersonasStoriesUI DesignMinimum Viable ProductsSprintingRetrospective           @ANDERSRAMSAY / DESI...
Agile and Research- A shift to more outcome-driven and continuous research.- Made possible due to light-weight, team-orien...
@ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
Source: Lane HalleyProvisional Personas- Team participation facilitates user empathy.- Continue to evolve with our underst...
Persona Activity1. Send two people from one team to the   next team.2. Conduct 5-minute interviews.3. Collect as many card...
Agile + UX = ?Kick-OffPersonasStoriesUI DesignMinimum Viable ProductsSprintingRetrospective           @ANDERSRAMSAY / DESI...
As an auto sales rep, I want             to search for parts visually,             so I can be sure I’m             orderi...
?     Testers                                                                   PMs                      As an auto sales ...
A Type of Lean Document As an auto sales rep, I want to search for parts visually, so I can be sure I’m ordering the right...
Power in Numbers@ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
StorymappingJill is attracted Jill is persuaded   Jill makes a        Jill donates ato the site       to donate           ...
Storymapping Activity 1. Use Biz goals, Personas as a    foundation. 2. Create cards from research,    cardstorming. 3. Ch...
Create Cards with Cardstorming - 3m timebox. - Write down as many scenarios or   feature ideas you can think of. - One per...
Agile + UX = ?Kick-OffPersonasStoriesUI DesignMinimum Viable ProductsSprintingRetrospective           @ANDERSRAMSAY / DESI...
Storymapping                                          UI Exploration                    MVP/                  Road MapSizi...
Stories and UI DesignFeature                                                                Dev-ReadyStories              ...
Design Studio- Tapping into the whole team’s knowledge and imagination.- Can be used for research or actual design.       ...
@ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
A Design Studio PatternDefine area of       (Warmup/ Raw            Sketchingfocus.              Materials)              Ti...
Sketching Timebox - 5m timebox. - Everyone sketches. - No rules. - If conducting with general   stakeholders, clarify that...
Critique- Post the sketches.- 2-minute round-robin, then open  critique.- Take careful notes, attach to the  respective sk...
Dot-voting - Quickly captures trending   opinions. - How many dots? About half of   qty items to vote on, rounded   up. - ...
Generate Cards from UI/Storymap Refresh1.Revisit the storymap backbone and feature set. Still accurate?2. Work with “devs”...
Agile + UX = ?Kick-OffPersonasStoriesUI DesignMinimum Viable ProductsSprintingRetrospective           @ANDERSRAMSAY / DESI...
The Hudson Bay StartFur-trappers in Canada predicting what they will need to survive forweeks or months in the Northern Te...
MVP Design   Hypothesis: - This is my prediction of what I’ll   need to survive for 2 months in   the middle of nowhere.  ...
MVPs and UX- Designing MVPs should be core to modern UX Practice.- Light-weight prototypes can be your first experiment, bu...
PainkillerStrategy: Find the biggest pain point that can be removed with theleast amount of effort.Great for: Enterprise s...
Fa$t MoneyStrategy: Remove features/content the customer is not directly paying for.Great for: Consumer products, esp. wit...
Turk ItStrategy: Manually simulate system operations.Great for: Products with complex algorithms, back-endoperations.     ...
Go Ugly EarlyStrategy: Build the functionality first, with just a bare-bones UI.Great for: Products in which the selling po...
Fake it ‘til you make it             (Archetypal Lean Startup Landing page)Strategy: Once a final product is imagined, mar...
What’s your MVP?Attract        Convert           Transact             Upsell           What is the cost of these features?...
The UX of Estimating- Be sure estimate is informed by UI Exploration- Be present, prepared to speak up and negotiate- Unde...
Agile + UX = ?Kick-OffPersonasStoriesUI DesignMinimum Viable ProductsSprintingRetrospective           @ANDERSRAMSAY / DESI...
An Agile Project Lifecycle(Three UX Dynamics of Agile Projects)         Opening Game                     Short, intensive ...
Designing while Building - Supporting the current sprint - Preparing for the next sprint - Learning from the previous   sp...
Automating Collaboration with Cadences- Apply Agile approach to planning to ensure that whole team is designing together.-...
Automating design reviews with Style Guides/Trailing Docs- Document after initial implementation.- Testers, developers par...
The Scrum/Kanban BoardNew   UX/Biz       Active             Ready         Done                Validated                   ...
Micro-Sprints - Self-organize into UX/”Dev”/PO - Create paper prototypes that   allow for completing the   donation proces...
Showcase     @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
Outcome-Driven Research- Measuring interest in the envisioning product.- “Is this user-friendly?” vs “Would you pay for th...
Agile + UX = ?Kick-OffPersonasStoriesUI DesignMinimum Viable ProductsSprinting, ValidatingRetrospective           @ANDERSR...
Retrospective- Enabling continual learning and improvement.- Start with action items from previous retrospective.- What wo...
Book/Software GiveawayThanks to our Sponsors!              @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
Thanks!@andersramsayandersramsay.comdesigningwithagile.com                @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
Upcoming SlideShare
Loading in...5
×

Designing with Agile Workshop

28,220

Published on

This is a full day workshop on applying Agile thinking to UX practice and integrating UX into Agile projects. The workshop is part of the Rosenfeld Media workshop series.

Published in: Technology
2 Comments
41 Likes
Statistics
Notes
  • Potentially a great presentation but I'm seeing really weird issues with spacing which make it really hard work to read, e.g. stuff like 'Please dividein to teams, preferablype ople' throughout the presentation. Perhaps it's a SlidesShare issue? And download is disabled so can't view original...

    UPDATE: oddly enough this is only an issue in Chrome (I'm running the latest v16), I can view the presentation fine in IE & Firefox so that's my workaround...
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Great presentation, and good to meet you at Etre Get-together.
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
No Downloads
Views
Total Views
28,220
On Slideshare
0
From Embeds
0
Number of Embeds
32
Actions
Shares
0
Downloads
3
Comments
2
Likes
41
Embeds 0
No embeds

No notes for slide
  • A learning by doing day.Logistics: sorry you are all somewhat cramped in here but we will eventually be spreading out into the adjacent roomAlso, after my initial intro you’ll mostly be doing activities, so won’t need to be turned around in your seats.
  • Start by offering a big picture view of our session today.We’ll divide into team and also talk a bit about how Agile teams are different.Then, walking through mini-versions of activities that would be part of an Agile project lifecycle, with a particular focus on the UX perspective. At the end, each team will do a brief showcase of their work and then we’ll use another Agile technique, a retro, to also double as a kind of Q&A and group discussion about what we learned or not in today’s workshop.And, of course, we want to fit a raffle/book give-away in at the end
  • Ask 1-2 members in the audience at extreme points to share a little more about themselves.Anyone else who feels they come from a completely different background?This is an example of Agile thinking, and is a kind of microcosm of the thinking behind the work we’ll be doing today.Light-weight/lean artifactFast to createCreated collectively rather than individuallyAnd it has actual value, particularly in relationship to the time and effort involved.This is a fundamentally different approach to creating documents, compared to a traditional model.Imagine if we’d created a doc like this in a traditional way – gather info from each of us and then entering all the data in excelBUT – THIS IS A MICROCOSM, WE NEED TO ALSO UNDERSTAND HOW AGILE AND TRADITIONAL IS DIFFERENT ON A MACRO LEVEL
  • http://www.infoq.com/resource/articles/japan-agile-whats-happening/en/resources/image3%20large.jpgWho here is familiar with this? This was published in Harvard Business Review, Jan 1. – 1986 but remains IMO the best metaphor for explaining how waterfall is different from Agile.Cockburn – A cooperative game of invention.Schwaber/Beedle – Scrum (a core Rugby play)
  • Walk up to screen and point out that each of these are different team members, each carrying the ball or helping whoever has it.
  • Active CollaborationRapid Feedback LoopsUltimately…Change how you think about UX workCredit William Pietri for inspiring this.But what does all this mean on a practical level?The purpose of our workshop today is to explain exactly that.What we will be doing today is to learn to play the project game in an Agile way.Thinking of a project as a game is a great way to understand how an Agile process is different from that of a traditional process.These are some methods for doing what you do now, but doing it smaller, faster, and continuously.Rapid Minimal ResearchRapid Minimal DesignRapid Minimal PlanningMaster Fast CommunicationCollaborate ActivelyWork Across DisciplinesThink Whole Product, Design in SlicesThese are of course just one of any number of possible instantiations of Agile thinking, but I think they are great for understanding Agile UX mindset
  • Active CollaborationRapid Feedback LoopsUltimately…Change how you think about UX workCredit William Pietri for inspiring this.But what does all this mean on a practical level?The purpose of our workshop today is to explain exactly that.What we will be doing today is to learn to play the project game in an Agile way.Thinking of a project as a game is a great way to understand how an Agile process is different from that of a traditional process.These are some methods for doing what you do now, but doing it smaller, faster, and continuously.Rapid Minimal ResearchRapid Minimal DesignRapid Minimal PlanningMaster Fast CommunicationCollaborate ActivelyWork Across DisciplinesThink Whole Product, Design in SlicesThese are of course just one of any number of possible instantiations of Agile thinking, but I think they are great for understanding Agile UX mindset
  • ORWorking in rapid small cycles.Design as facilitation.Reaching the finish line and winning the game.There is a lot here. We’re going to work through many of these very quickly, just to give you a taste or in some cases do several of these at onceIn some cases, I may just talk through them. No set of activities will be right for every project, but these have been shown to be very useful across a range of projects, and my hope is that you will be able to go start applying some of these immediately in your work.AS PART OF TEAM DISCUSSIONWill wear different hatsWill play different roles in the teamWill sometimes play the role of the userGoal is for you to be able to go back and facilitate many of these activities.
  • Source: http://rugbyspace.wikispaces.com/file/view/A_SAS_var_rugby_squad_pic_07.jpg/33324509/A_SAS_var_rugby_squad_pic_07.jpg
  • Not much to see in terms of our workspace yet, that is because the team shapes its own workspace.Want to talk a little about Agile teams and dynamics. As we go thru the activities, you will get a better feel for these dynamics.The workspace is generated by the team and their needs. It is not some separate thing.No one right type of team room.Co-location: a factor of team experience, skill level. Less skilled at Agile, less experienced, more in need of co-loc.Wallspace: information radiator, a true living document, documentation wallpaper.Knowledge dist, eg pair stairsThere is only us mindset – team/rugby mindsetBut in order to work on this, we need to divide into teams.
  • From Ian/Paul Culling - Not traditional kick off meeting: 1 way discussion (talked to) where you’re told what will be built, by whom and by when.Not massive document that is often never read, created by few without feedback from the larger project communityAn example of Agile planning.Small effort, lots of valueCuts across disciplinesWhat it is:Not about shelfware, it’s about big visible PURPOSE. The WHY.collaborative (lightweight0) chartering involves the appropriate members of the project community and the appropriate level of ceremony. Collaborative chartering aims to create a session filled with discussion from all points of view.describe what project community meanstalking about test driving your projectFrom David Hussman:Name and Timeframe Elevator Pitch / Value Statement Goals - Success Measures Community Mapping Working Agreements Strengths - Constraints Cadence - Logistics Image source: Paul.Culling@VersionOne.comPaul CullingIan CullingIan.Culling@VersionOne.comGet Buy-in, Motivation, ExcitementTimeframe, Cadence, CommunityElevator Pitch
  • HANDOUT – biz pitchNot standard Agile enterprise appA charity tends to be very effective, since easy to understand and care about.Provide education and shelter for abandoned, orphaned children around the world.(A real charity I’ve worked with.)HANDOUT
  • People who don’t design in the digital domain often have a hard time expressing what they want. We need to do a lot of parsing.This is actually not too far from the actual conversation, based on memory, with a business sponsor. What is the top business goal here? What is our measurements of success?Rarely will the marching order be clear.Too many times we start a fictional project with fictionally clear goals.Please take this and, as a team, work together to suss out what you think are the actual top goals and measurements for success and then I will walk around with each of you to offer help.
  • Charter will evolve with the project, e.g. adding personas as we go.Also, would normally do Ideation Clearinghouse as part of this kick-offFrom Ian/Paul Culling - Not traditional kick off meeting: 1 way discussion (talked to) where you’re told what will be built, by whom and by when.Not massive document that is often never read, created by few without feedback from the larger project communityAn example of Agile planning.Small effort, lots of valueCuts across disciplinesWhat it is:Not about shelfware, it’s about big visible PURPOSE. The WHY.collaborative (lightweight0) chartering involves the appropriate members of the project community and the appropriate level of ceremony. Collaborative chartering aims to create a session filled with discussion from all points of view.describe what project community meanstalking about test driving your projectFrom David Hussman:Name and Timeframe Elevator Pitch / Value Statement Goals - Success Measures Community Mapping Working Agreements Strengths - Constraints Cadence - Logistics Image source: Paul.Culling@VersionOne.comPaul CullingIan CullingIan.Culling@VersionOne.comGet Buy-in, Motivation, ExcitementTimeframe, Cadence, CommunityElevator Pitch
  • As a team, capture this on your board. Make sure everyone on the team understands and agrees with this.You may be thinking, why do we need to create this stupid document but you will (hopefully) see its value as the project progresses.Someone new to a project should be able to look at it and understand the project at a high level.PLEASE CONSIDER PLACING STUFF ON POST-ITS TO MAKE IT MORE FLEXIBLECAN USE TAPE FOR THE LINES
  • DO A Q&A with audience at this point. Maybe at that point, point out that the top goal is to increase overall donation revenue.
  • Now that we’ve understood the business goals, we want understand the users they want to reach.This is an area where Classic Agile is weakA classic Agile approach expects to be told what to do.This is where applingAgisle thinking to UX practice can really up the game.
  • Present the handoutDo some Q&A with the entire group.Warm up your brain and your handsMODERATOR: keeps convo going, ensures it stays on topic, pushes participant to state everything they can think of.GOAL IS TO CAPTURE AS MANY CARDS AS POSSIBLE. This is raw material for everything else.BE SURE BOTH USER GET A CHANCE TO SHARE THEIR THOUGHTSFOR OUR PURPOSES OK TO NOT HAVE A MODERATOR SINCE, ONCE YOU HAVE EXPERIENCED, YOU SHOULD BE ABLE TO MODERATE AN INTERVIEWA very rich research activity.Applying thinking behind pair programming to interviews.Normally, you would moderate many pairs of users.Start with persona discussion, then product context discussion.5min timeboxGenerate as many cards as possible. (explain how to write a card.)PART 1: Tell me about yourself.PART 2: Charity needs/desires.How did that go?What were Johanna’s objections? How do you prevent two users from getting into an argument or trying to push their ideas onto another------OLD-----GOAL IS TO CAPTURE AS MANY CARDS AS POSSIBLE.USING PAIRING MODEL FOR THIS. RATHER THAN INDIVIDUALS BEING INTERVIEWED, HAVE IT BE A CONVERSATION THAT YOU OBSERVE AND MODERATE.Capture everWant fresh ideas. Want to completely replace very outdated current site.Discuss issue of subjective goals, more common with consumer-facing.BE SURE BOTH USER GET A CHANCE TO SHARE THEIR THOUGHTSHave them ask one another, what would persuade you to make a donation?Users jot down cards, moderator jots down anything that maybe users didn’t catch due to being engrossed in convo.Moderator pushes users to convey all ideas they can think of.THIS IS AN IDEA CLEARINGHOUSEPaired interviews – this is an example of rapid but rich Agile research. We’ll use this method to capture the raw materials that we’ll use for the other activities.The first of those will be Agile personas. We’ll create a very basic persona from the info gathered during the interviews, and discuss the idea of a barely sufficient artifact and some ways in which an Agile persona is different from a traditional persona.Then, we’ll take the cards we created and chunk and prioritize them, basically some quick story mapping, in order to then create story flows, which is the work of decomposing one or more story into a series of user activities or steps that will support the delivery of that story.This story flow and our persona will become the basis for our design studio, which is a structured collaborative sketching activity, that allows us to rapidly iterate on ideas and develop consensus.We’ll use the UI concept that emerges from the design studio to create an MVP candidate. We’ll discuss MVPs and UX and how it relates to creating a product road map.Any q’s before we get started?
  • Persona activity:5m timeboxAs a team, look at your own persona quotes, cluster and look for pull quotesPick a name – one that is representative of who you are as a group.Optional – draw a sketchYour persona will go up on your team wall*Once persona is created, your team should replace talking about an abstract user with “what would Barb do?”(Use handout?)Ask teams to share personas they have created.
  • Persona activity:5m timeboxAs a team, look at your own persona quotes, cluster and look for pull quotesPick a name – one that is representative of who you are as a group.Optional – draw a sketchYour persona will go up on your team wall*Once persona is created, your team should replace talking about an abstract user with “what would Barb do?”(Use handout?)Ask teams to share personas they have created.
  • Why Agile and Personas are an odd coupleWhy the name is more important than the picture---OLD----Personas are the voice of the storyHow you actually create personas will vary from project to project, but these are some pointers.IMO, a set of normalized stickies like this, in large print, so that they can be read when up on a wall, in combination with a set of good photos is the most powerful personaDESCRIBE THE PHOTO – this is a picture of the context of some users I worked with on a project. While their work actually demands lots of collaboration, they’ve been sectioned off in these high-wall cubicles. This picture, for me, is a reminder for the team, of their frustration and hardship they face due to THEIR ENVIRONMENT. THE CONTEXT IS JUST AS IMPORTANT, AND SHOULD THERFORE ALSO BE PART OF THE PERSONA
  • Ask someone to pick up a card and talk about what is being described.The card is not the whole story.It’s content triggers the real story, which exists in a self-maintaining, continually updating data store: the collective memory of the project team.Ok, but don’t we need to create actual documents at some point?Yes, but try to wait until the Last Responsible Moment.
  • NOT THE SAME AS THE OVERAL PROJECT LIFECYCLE. MANY LITTLE STORY
  • “How do we work together?”
  • Prod backbone: can be core product flow, journey, e.g. turbotax, or can be product chunks, eg word or photoshop.Did everyone complete a backbone? Please share.Write stories on 4x6 cards. Will make them more versatile than post-its (good for quick capture), forces you to do a quick refresh too)But are they complete? Can be hard to determine coverage from just looking at a story wall.What will the UI look like? Are all features represented here?We need to iterative with UI exploration, using design studio
  • Ask someone to pick up a card and talk about what is being described.The card is not the whole story.It’s content triggers the real story, which exists in a self-maintaining, continually updating data store: the collective memory of the project team.Ok, but don’t we need to create actual documents at some point?Yes, but try to wait until the Last Responsible Moment.
  • Is our product map complete?What will the product look like?Tapping the knowledge, energy, imagination of the whole team in exploring and evolving UI concepts.
  • Tapping the knowledge, energy, imagination of the whole team in exploring and evolving UI concepts.Doing this slightly out of order.Would normally do a divergent (“Ideation Clearinghouse”) model during project kick-off w project sponsors.Here, we’ll do a combination of divergent, convergent (and you may have time/an opportunity to do an ad-hoc variant during your sprintsDelaying because you are now in a similar mindset to a project sponsor. You’ve spent some time thinking about the product and some images of what the product might look like have likely begun to form in your mind.
  • No rulesCapture the big picture concept, IOW look at your story map as a whole and sketch out what you think might be a complete user journey5m timebox (you can sketch a lot more than you think in 5m)CRITIQUE ENDS WHEN YOU HEAR BELL TOWER SOUNDAfter sketching, place what you sketched on a wall.Go around and present to one another. Max 2m per presenter.Dot-vote on the sketches to see which concept is trending.Practical considerations, e.g. be sure you understand what other people have sketched, esp sponsors, clients you may not be able to follow up with.
  • Create design studio infrastructureDon’t over-engineerWhat new cards emerged out of the design studio?What cards are UI-specific?Use Breadcrumbs example.
  • Have the team select a core feature to focus on. What Team-based detailed UI explorationEveryone in the team gets a voiceGreat for sprint preparationEveryone in the team gets a voiceFind MVP? Please choose to do thinnest possible horizontal slice, ie what is most bare-bones way to support top priority?Or choose cards which are highest priority/most challenging? NEED TO PRIORITIZE/ESTIMATE.
  • No rulesCapture the big picture concept, IOW look at your story map as a whole and sketch out what you think might be a complete user journey5m timebox (you can sketch a lot more than you think in 5m)CRITIQUE ENDS WHEN YOU HEAR BELL TOWER SOUNDAfter sketching, place what you sketched on a wall.Go around and present to one another. Max 2m per presenter.Dot-vote on the sketches to see which concept is trending.Practical considerations, e.g. be sure you understand what other people have sketched, esp sponsors, clients you may not be able to follow up with.
  • No rulesCapture the big picture concept, IOW look at your story map as a whole and sketch out what you think might be a complete user journey5m timebox (you can sketch a lot more than you think in 5m)CRITIQUE ENDS WHEN YOU HEAR BELL TOWER SOUNDAfter sketching, place what you sketched on a wall.Go around and present to one another. Max 2m per presenter.Dot-vote on the sketches to see which concept is trending.Practical considerations, e.g. be sure you understand what other people have sketched, esp sponsors, clients you may not be able to follow up with.
  • Want to start doing a few different things at the same time here.First, reconcile your sketches against your cards. Are there new stories that have been uncovered? Second, update
  • Take your cards and decide if they are in our out, above or below the line.What is point total of features above the line?Figure of blue line with arrows for cards above or below – or just *SHOW THIS PHYSICALLY* show this by example physicallyTake estimated cards and move above or below the line. Iterate with sketching as needed.Look for the absolute bare-bones first release which you can launch and start to use as a basis for real metrics.Use Ad-hoc DS to check your MVP if needed
  • Validate quickly and cheaply, first with prototypes, then with real software.GOOB, get it in front of users
  • Activity:Grab a few stories that have been produced, role-play estimation interview in front of entire group (I can play role of dev – find a card that)Describe planning poker.Discuss decomposing cards into smaller pieces if they are difficult to estimate or won’t fit into a sprint.Show adding points to an estimate.What you’ve created should be a map of the product.Are the stories INVEST?Source: http://2.bp.blogspot.com/-q82LJ2XICak/TWFNLipOP0I/AAAAAAAAAIo/muwPbLFfIRo/s1600/planning+poker+cards.jpg
  • As we prepare to go into a sprint, we’ll want to set up some kind of workflow system. This swim-lane structure has been shown to be very effective.It can be used both in a sprint or kanban model, in which in the Kanban there is just continuous flow and capacity limits for each column.You can look at the board and see who is working on what, such as for UX/Product, or who defined something as ready or done.You will also likely find ways to customize this for your particular situation.Discuss done vs validated.Discuss story aging.
  • Work on your own in 20-minute sprintsSelf-organize into doing the detailed speccing, then creating prototypesGOAL: create a paper prototype that will convince a user to make a donation and allow them to actually make a donation.Part of your success metric is how much your users will donate.One person from each team will serve as the user for another team – when I announce “User Friday” you’ll present to them whatever you have at that point.I will walk around at this point and work with each of you individually and talk about things like cross-functional pairing and answer any questions you have.PICTURE: Lean Specs
  • Each team presents theirprotos and metrics.2m timebox for each.
  • Ask some people to volunteer to help with clustering the post-its after we all put them up on a wall.
  • Designing with Agile Workshop

    1. 1. Designing with AgileFast, Effective Methods that Work @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    2. 2. Workshop Overview- Agile + UX = ?- Kick-Off- Personas- Stories- UI Design- Minimum Viable Products- Sprinting- Retrospective- Book/Software Give-Away! @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    3. 3. What’s a topquestion you hopeto get answeredtoday? @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    4. 4. Agile + UX = ?Kick-OffPersonasStoriesUI DesignMinimum Viable ProductsSprintingRetrospective @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    5. 5. @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    6. 6. Experience Delivery @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    7. 7. @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    8. 8. @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    9. 9. Agile + UX = ?Methods like Scrum and XP...are optimized for this… ...but insufficient for this. @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    10. 10. Agile UX PAINFeeding the beast“There’s a whole team of developers and I’m the only UX designer.They’re building features faster than I can design them. I can’t keep up!”Half-Baked UX“Our PO’s under pressure to deliver the next release and signing offon features despite crap-ass usability. Help!”Sprint Tunnel-Vision“Yes, we technically delivered all the features this sprint, butlooking at the big picture, the design’s an incoherent mess!”AGILEFALL“Our developers are a fine-tuned Agile machine, but our design dept.can’t figure out how to fit in what we do, so we’re basically still just continuingto create big-ass spec docs and handing them to the devs.” @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    11. 11. @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    12. 12. Traditional Relay Race- Team members mostly run alone.- Communication occurs mainly through document hand-offs.- One big crossing of the finish line. @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    13. 13. PM GD Dev BA Biz UXAgile Rugby Game- Intensive and continuous collaboration.- Communication through direct collaboration.- Reach the finish line early and often to win the game. @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    14. 14. Our top goal is to…but what’s most important is that we…tho what we really must do is to… But I thought… Whaa…? What about…?A Relay Race Meeting- Not designed for collaboration.- Slow debugging of issues, differences in understanding. @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    15. 15. A Rugby Game Meeting Workshop- An intensive passing game across roles/perspectives.- Rapidly iterating toward shared understanding. @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    16. 16. A UX Rugby Toolkit...- Cardstorming- Collaborative Chartering- Design Studio- Dotvoting- Ideation Clearinghouse- Paired Interviews- Product Box- Provisional Personas- Speed Boat- Story Mapping and many more... @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    17. 17. Transforming UX Practice... ...and beyond. - Org. Structure - Biz Dev - SalesCollaboration-centered Design - Marketing - Facilities - Human Resources - IT DepartmentOpen, Lean Documents @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    18. 18. Putting Agile UX in Context Traditional UX Design, Usability What are we making? Startup Lean UX Agile UX Measuring,validating Collaboration, product/market fit. Delivery Are we making How do we the right thing? make it? @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    19. 19. Agile + UX = ?Kick-OffPersonasStoriesUI DesignMinimum Viable ProductsSprintingRetrospective @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    20. 20. Source: David HussmanCollaborative Chartering: An Agile Kick-Off- At-a-glance view of the project.- Big visible open document, created through active team involvement. @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    21. 21. @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    22. 22. @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    23. 23. Teams- 4-6 per team.- 1 product owner @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    24. 24. Our Sample ProjectDesign a Tablet App for a Children’s CharityProviding education and shelter for abandonedand orphaned children around the world.(a real charity I’ve worked with) @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    25. 25. Collaborative Chartering Activity 1.Business sponsor presents project goals. 2.Team crowd-sources shared understanding. 3.Start creating your collaborative charter project document. 4.Iterate with Biz Sponsor. 5.Distill down to top goals. 6.Next: Continue populating, updating the charter with additional activities... Source: David Hussman@ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    26. 26. “Sunshine App” Start / End DatesBusiness Goal(s)Success metricsUsers/PersonasDesign VisionCadenceTeam Next Milestone @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    27. 27. The Business Owner’s Pitch“We’ve just received funding from an anonymous donor to update our digital presence. Ourcurrent website is very outdated. We think we can better reach our target demographicthrough mobile media and social networking, so we’d like to create a tablet app. We think thatwill be an effective way to increase overall donation revenue, with all the social networking andwhat-not out there. We know we have a good cause and we want to make sure visitors agreeand we’d like them to be confident their donation is going toward the actual cause. And yet,what really matters are the donations. We’ve also been struggling on the upsell front. This isslightly less important. Well, actually, it’s really a top priority come to think of it, since it willlead to higher overall revenue. Though what really is important is to attract users to the site.And just as important is that they make a donation and that it is easy to make a donation.Usability is a must. Also, the payment part must be easy. Should be completely seamless.And we want lots of social networking and Facebook and Twitter in there too.” @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    28. 28. Business Goals1. Convince visitors to make a donation.2. Persuade visitors to donate a little more than intended.3. Instill confidence donation is going toward cause.4. Motivate visitors to tell others to donate. @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    29. 29. Agile + UX = ?Kick-OffPersonasStoriesUI DesignMinimum Viable ProductsSprintingRetrospective @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    30. 30. Agile and Research- A shift to more outcome-driven and continuous research.- Made possible due to light-weight, team-oriented methods. @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    31. 31. @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    32. 32. Source: Lane HalleyProvisional Personas- Team participation facilitates user empathy.- Continue to evolve with our understanding of our users. @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    33. 33. Persona Activity1. Send two people from one team to the next team.2. Conduct 5-minute interviews.3. Collect as many cards as possible.4. Chunk and prioritize cards.5. Create a Persona as a team. @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    34. 34. Agile + UX = ?Kick-OffPersonasStoriesUI DesignMinimum Viable ProductsSprintingRetrospective @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    35. 35. As an auto sales rep, I want to search for parts visually, so I can be sure I’m ordering the right part.The (whole) story is not on the card @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    36. 36. ? Testers PMs As an auto sales rep, I want to search for parts visually, Developers so I can be sure I’m Users ordering the right part. UEDs POsMany Simultaneous Functions (A Boundary Object) @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    37. 37. A Type of Lean Document As an auto sales rep, I want to search for parts visually, so I can be sure I’m ordering the right part.Placeholders (Future) Supporters (Now)Words/Content needed to trigger Words/Content needed to support adetails in a future conversation or current conversation or collaboration.collaboration. @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    38. 38. Power in Numbers@ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    39. 39. StorymappingJill is attracted Jill is persuaded Jill makes a Jill donates ato the site to donate donation little more Priority MVP? @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    40. 40. Storymapping Activity 1. Use Biz goals, Personas as a foundation. 2. Create cards from research, cardstorming. 3. Chunk, prioritize cards. 4. Create storymap backbone. 5. Populate map. 6. Iterate, as needed.@ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    41. 41. Create Cards with Cardstorming - 3m timebox. - Write down as many scenarios or feature ideas you can think of. - One per sticky. - After the timebox, start chunking cards. - Transition to self-organized storymapping as a team.@ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    42. 42. Agile + UX = ?Kick-OffPersonasStoriesUI DesignMinimum Viable ProductsSprintingRetrospective @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    43. 43. Storymapping UI Exploration MVP/ Road MapSizing/Estimating @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    44. 44. Stories and UI DesignFeature Dev-ReadyStories StoriesWritten by Independentusers, business Negotiable Valuable Estimable Story Glue Small More Accurate Estimates Testable Better Story Coverage @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    45. 45. Design Studio- Tapping into the whole team’s knowledge and imagination.- Can be used for research or actual design. @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    46. 46. @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    47. 47. A Design Studio PatternDefine area of (Warmup/ Raw Sketchingfocus. Materials) Timebox Critique Iterate? @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    48. 48. Sketching Timebox - 5m timebox. - Everyone sketches. - No rules. - If conducting with general stakeholders, clarify that this is research, not design. - If conducting with the internal team, the UI concepts can be the basis for the actual design.@ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    49. 49. Critique- Post the sketches.- 2-minute round-robin, then open critique.- Take careful notes, attach to the respective sketches.- Look for and work to resolve vision differences.- (Optional) Dot-vote to uncover trending solutions. @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    50. 50. Dot-voting - Quickly captures trending opinions. - How many dots? About half of qty items to vote on, rounded up. - Use markers or stickie dots. - Everyone votes at once. - Voters can distribute dots any way they want.@ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    51. 51. Generate Cards from UI/Storymap Refresh1.Revisit the storymap backbone and feature set. Still accurate?2. Work with “devs” to generate card from UI.3. Attach/Map feature cards to “dev-cards” (optional)Jill is attracted Jill is persuaded Jill makes a Jill donates ato the site to donate donation little moreStatic Landing ProcessPage credit card payments“Donator- Make paymentmeter” via SMS @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    52. 52. Agile + UX = ?Kick-OffPersonasStoriesUI DesignMinimum Viable ProductsSprintingRetrospective @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    53. 53. The Hudson Bay StartFur-trappers in Canada predicting what they will need to survive forweeks or months in the Northern Territories. @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    54. 54. MVP Design Hypothesis: - This is my prediction of what I’ll need to survive for 2 months in the middle of nowhere. UX: How do we Experiment: design effective - Trek into nearby woods and camp out for a few days. experiments? Measurement/Learning: - Did I use more/less food than I expected in 3 days? Did I discover gear I needed but didn’t have with me? etc.@ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    55. 55. MVPs and UX- Designing MVPs should be core to modern UX Practice.- Light-weight prototypes can be your first experiment, but good to quickly follow with a code-based experiment.- MVP design usually draws on a combination of strategies. @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    56. 56. PainkillerStrategy: Find the biggest pain point that can be removed with theleast amount of effort.Great for: Enterprise systems, esp. when replacing a legacy system. @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    57. 57. Fa$t MoneyStrategy: Remove features/content the customer is not directly paying for.Great for: Consumer products, esp. with domain-specific content/features. Image source: http://www.creativedreamincubator.com/images/products/buynow50.jpg @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    58. 58. Turk ItStrategy: Manually simulate system operations.Great for: Products with complex algorithms, back-endoperations. Image source: http://en.wikipedia.org/wiki/File:Tuerkischer_schachspieler_racknitz3.jpg @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    59. 59. Go Ugly EarlyStrategy: Build the functionality first, with just a bare-bones UI.Great for: Products in which the selling point is a technicalspecial sauce. @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    60. 60. Fake it ‘til you make it (Archetypal Lean Startup Landing page)Strategy: Once a final product is imagined, market it, measureinterest, and adjust based on market response.Great for: Any product with a high degree of uncertainty aboutcustomer interest. @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    61. 61. What’s your MVP?Attract Convert Transact Upsell What is the cost of these features? MVP? What is the team’s delivery capacity? @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    62. 62. The UX of Estimating- Be sure estimate is informed by UI Exploration- Be present, prepared to speak up and negotiate- Understand the estimation units (e.g. points) @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    63. 63. Agile + UX = ?Kick-OffPersonasStoriesUI DesignMinimum Viable ProductsSprintingRetrospective @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    64. 64. An Agile Project Lifecycle(Three UX Dynamics of Agile Projects) Opening Game Short, intensive Mid Game Alien territory for many UX designers End Game Validate, reflect, adapt. @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    65. 65. Designing while Building - Supporting the current sprint - Preparing for the next sprint - Learning from the previous sprint. More about logistics than design.@ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    66. 66. Automating Collaboration with Cadences- Apply Agile approach to planning to ensure that whole team is designing together.- Can also be applied to field research, usability testing and other UX activities. @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    67. 67. Automating design reviews with Style Guides/Trailing Docs- Document after initial implementation.- Testers, developers participate in doc production.- Reduces “chase-down” churn. @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    68. 68. The Scrum/Kanban BoardNew UX/Biz Active Ready Done Validated Am I going to have them do this? Also just as much a kanban board @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    69. 69. Micro-Sprints - Self-organize into UX/”Dev”/PO - Create paper prototypes that allow for completing the donation process. - I’ll initiate “User Fridays” cadences. - Ask users how much they’d be willing to donate and track your donation and upsell totals.@ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    70. 70. Showcase @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    71. 71. Outcome-Driven Research- Measuring interest in the envisioning product.- “Is this user-friendly?” vs “Would you pay for this?”- Enables integrating with Agile methods through continuous rather than up-front research. @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    72. 72. Agile + UX = ?Kick-OffPersonasStoriesUI DesignMinimum Viable ProductsSprinting, ValidatingRetrospective @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    73. 73. Retrospective- Enabling continual learning and improvement.- Start with action items from previous retrospective.- What worked? Didn’t work? What questions do you have? @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    74. 74. Book/Software GiveawayThanks to our Sponsors! @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX
    75. 75. Thanks!@andersramsayandersramsay.comdesigningwithagile.com @ANDERSRAMSAY / DESIGNINGWITHAGILE.COM / #AGILEUX

    ×