SlideShare une entreprise Scribd logo
1  sur  47
The UX of User Stories
A UX Approach to Story Development

                     UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
Overview
-   Intro to User Stories
-   Stories and User Research
-   Stories and Personas
-   Stories and UI Design
    Break, somewhere in here

- Stories and the Product Road Map
- Stories and Sprinting
- Q&A/Wrapup




                          UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
What’s one
question you have
about the UX of
User Stories?




          UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
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
         UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
?

    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
                                                                            POs




Many Simultaneous Functions
                           (A Boundary Object)

              UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
Power in Numbers
 UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
Where Stories Fall Short...
 I often order the wrong                                 As an auto sales rep, I
 part, because the part                                  want to search for parts
 numbering system is                                     visually, so I can be sure
 confusing. It wastes time                               I’m ordering the right part.
 and makes me look stupid
 in front of customers!


“What’s the underlying                                 “Tell me what to build.”
problem or goal?”                                      One of many possible solutions.
                                                       Optimized for delivery.
Often emotional, not easily
estimable, testable, etc.




                         UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
Where Stories Fall Short
  Directory                         Purchasing                    Fulfillment                        Support
         As an auto sales rep, I
         want to search for
         parts visually, so I can
         be sure I’m ordering the
         right part.




                                                                                                     Are these all
    How will these stories                                                                         the stories?
   fit together into a
    whole product?



 How will they map to the                                                                          Are they even
user interface?                                                                                   the right stories?




                                    UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
A UX Approach to Stories...
  I often order the wrong                                      As an auto sales rep, I
  part, because the part                                       want to see the 3rd party
  numbering system is                                          mfr # next to the part #,
  confusing. It wastes time
                                                               so I can be sure I’m
  and makes me look stupid
  in front of customers!                                       ordering the right part.


 Experience Stories                                           Dev-Ready Stories
 “What was the source                                         “Let’s collaborate on
 problem or goal?”                                            what to build.”
 Often emotional, not easily                                  Uncovering the most pragmatic
 estimable, testable, etc.                                    solution through intensive collaboration.




                         UX OF USER STORIES   @ANDERSRAMSAY     #AGILEUX   13 AUG 2012
A UX Approach to Stories...



Elicit       Collaboratively                 Generate                       Build,
Experience   Explore                         Dev-Ready                      Evolve,
Stories      Solutions                       Stories                        Validate




              UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
Teams
- 4-6 per team.
- 1 product owner

                    UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
Our Sample Project
A Tablet App for a Children’s Charity
Providing education and shelter for abandoned and orphaned
children around the world.




               UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
Business Goals
 (or Story Boundaries)

- Convince visitors to make a donation.
- Persuade visitors to donate a little more than intended.
- Instill confidence donation is going toward the cause.




                    UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
Donator Tablet App



Elicit       Glue together                   Generate                       Build,
Experience   with UI design                  Dev-Ready                      Evolve,
Stories                                      Stories                        Validate




              UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
Experience Mapping
- Based on the “Speed Boat” Innovation Game.
- Uncover and prioritize user needs and desires.
- Goal: Create an experience backlog.
                       UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
X-Mapping Activity
1.Create the speed boat.
2.Elicit Experience Stories
3.Place cards in pairs.
 - Cards holding you back are
      anchors
  -   Cards pulling you forward are
      propellers.
4.Self-organized chunking.
5.Label chunks.
6.Prioritize if needed
 - eg w/Dot-voting.
7.Create Backlog.

UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
Elicit Experience Stories
- Generate cards through discussion.
- Place cards on experience map in pairs.
                   UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
Convo Starters
-   Got a favorite charity? Why do you like it?
-   Anything frustrate you about donating to charities?
-   Ever wanted to donate but weren’t able to? Why?
-   What would be the perfect donation process?
-   What would motivate you to donate a little more?




                  UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
X-Mapping Activity
1.Create the speed boat.
2.Elicit Experience Stories
3.Place cards in pairs.
 - Cards holding you back are
      anchors
  -   Cards pulling you forward are
      propellers.
4.Self-organized chunking.
5.Label chunks.
6.Prioritize if needed
 - eg w/Dot-voting.
7.Create Backlog.

UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
Experience Backlog

                              Worried they’ll                       How do they correlate
Are any of these              start hounding me
feature stories?                                                    to our business goals?
                              if I make one
                              donation.

    Are there
                             Make a strong case
    conflicting              for the cause, and I’m
    stories?                willing to put up with
                            a lot of UX issues




                              Can’t tell where
                              my $$$ actuall
                                              y
                              goes.




                   UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
Stories and UI

Experience
Stories
                                                                             Dev-Ready
                                                                             Stories
Feature
Stories


How do these
relate to
Personas?           UI is what glues stories together
                    Enables more accurate estimates
                    Enables better story coverage

               UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
Stories and Personas




 UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
As an auto sales rep, I want
        to search for parts visually,
        so I can be sure I’m
        ordering the right part.




Contextualizing the Story
     UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
Giving stories context
                                                                          with photos, videos of
                                                                          the user’s environment.




Personas as the voice of the story...
 Ted says:                        Ted wants wants to search
 As an auto sales rep, I          for parts visually, so I can        As an auto sales rep, I want
 want to search for parts         be sure I’m ordering the            to search for parts visually,
 visually, so I can be sure       right part.                         so I can be sure I’m
 I’m ordering the right part.                                         ordering the right part.



                          UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX    13 AUG 2012
Stories and UI

Experience
stories
                                                                           Dev-Ready
                                                                           Stories
Feature
Stories




             UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
UI Exploration with Design Studio
- Tapping into the whole team’s knowledge and imagination.
- Can be used for research or actual design.
- Three variants: Divergent, Convergent, Ad-Hoc
                     UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
A Design Studio Pattern



Establish    Warmup                               Sketching                 Pitch/
Boundaries                                        Timebox                   Critique




             UX OF USER STORIES   @ANDERSRAMSAY    #AGILEUX   13 AUG 2012
Warmup
- 3-5 minute timebox.
- Each participant writes as many
  features they can think of on
  separate stickies.
- Becomes a feature palette for
  sketching.




UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
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.




UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
Pitch/Critique
- Post the sketches.
- 2m round-robin, then open crit.
- Take careful notes, attach to the
  respective sketches.
- Look for and work to resolve
  vision differences.
- (Optional) Dot-vote to uncover
  trending solutions.




UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
Elicit       Glue together                   Generate                       Build,
Experience   with UI design                  Dev-Ready                      Evolve,
Stories                                      Stories                        Validate




              UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
UI Exploration


                    MVP/                                   Storymapping

                 Product Road
                     Map

Planning & Estimating




        UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
Storymapping 101
Attract   Convert                   Transact                      Upsell      Priority



                                                                           MVP?




           UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
Generate Cards from UI
1. Create the backbone: What’s the top-level flow or structure?
2. Work with “devs” to slice and dice features into cards.

 Attract          Transact                        Upsell                          Share

Static Landing   Process
Page             credit card
                 payments


“Donator-        Make payment
meter”           via SMS




                    UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
Those who need a document should participate in creating it.
                                                                —Ancient Agile Proverb




              UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
Stories and the Product Road Map




        UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
Product Road Map and MVP
- Designing releases, uncovering a Minimum Viable Product (MVP)
- Many ways to slice and dice.
- First release often hardest.
                     UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
MVP Strategies
- Painkiller
  Fastest/Cheapest way to remove
  user pain.
- Fa$t Money
  Fastest path to revenue.
- Go Ugly Early
  Screw the UX, just make it work.
- Fake It ‘til You Make It
  Create fake features to capture
  metrics and validate your idea.

  There is no one right way.




UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
The UX of Estimating
- Attaching a cost to each story.
- Be sure estimate is informed by
  UI Exploration.
- Be present, prepared to speak up
  and negotiate.
- Understand the estimation units
- Understand stories and
  estimation.




UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012   Photo: ryanendres.blogspot.com
Find the thinnest product slice
  Attract          Transact                     Upsell                       Share


                                                                                     MVP?




Static Landing   Process
Page             credit card
                 payments

                 Make payment
“Donator-
                 via SMS
meter”




                   UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
Donator Tablet App



Elicit       Glue together                   Generate                       Build,
Experience   with UI design                  Dev-Ready                      Evolve,
Stories                                      Stories                        Validate




              UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
Experience Backlog

                             Worried they’ll
Did we actually              start hounding me
address these?               if I make one
                             donation.


                            Make a strong case
                           for the cause, and I’m
                           willing to put up with
                           a lot of UX issues




                             Can’t tell where
                             my $$$ actuall
                                             y
                             goes.




                  UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
The Scrumboard
New   UX/Biz         Active                    Ready                 Done    Validated




               UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
Micro-Sprint
- Self-organize into UX/”Dev”/PO
- Create paper prototypes that
  allow for completing a donation
  process.
- I’ll initiate “User Fridays”
  cadences.
- Validate the original Experience
  Stories against your design.




UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
Done vs Validated
Done - a tool for helping teams make decisions and move forward.
Can we decide that this task is done and move on to the next thing?

Validated - a measurement of design value.
Was this idea as good as we thought it was?




                           UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
Q&A




      UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012
Thanks!
@andersramsay
andersramsay.com
designingwithagile.com
http://rosenfeldmedia.com/workshops/




                   UX OF USER STORIES   @ANDERSRAMSAY   #AGILEUX   13 AUG 2012

Contenu connexe

En vedette

User Story Mapping
User Story MappingUser Story Mapping
User Story MappingRaitis Linde
 
IGF2016での論点など(IGF-Japan2017資料)
IGF2016での論点など(IGF-Japan2017資料)IGF2016での論点など(IGF-Japan2017資料)
IGF2016での論点など(IGF-Japan2017資料)Keisuke Katsuki
 
Pretul intruparii advent szeged ro
Pretul intruparii advent szeged roPretul intruparii advent szeged ro
Pretul intruparii advent szeged rochirilaioan
 
The power of mobility
The power of mobilityThe power of mobility
The power of mobilityLin Je-We
 
La metacognicion y las herramientas didacticas.
La metacognicion y las herramientas didacticas.La metacognicion y las herramientas didacticas.
La metacognicion y las herramientas didacticas.Gonza Barrionuevo
 
Tentang PT. Ajinomoto Indonesia
Tentang PT. Ajinomoto IndonesiaTentang PT. Ajinomoto Indonesia
Tentang PT. Ajinomoto IndonesiaFelycia Huang
 
DESIGN: creation of artifacts in society by Karl T. Ulrich
DESIGN: creation of artifacts in society by Karl T. UlrichDESIGN: creation of artifacts in society by Karl T. Ulrich
DESIGN: creation of artifacts in society by Karl T. UlrichMarina Caponera
 

En vedette (11)

User Story Mapping
User Story MappingUser Story Mapping
User Story Mapping
 
Productized 2016
Productized 2016Productized 2016
Productized 2016
 
Ciências
CiênciasCiências
Ciências
 
IGF2016での論点など(IGF-Japan2017資料)
IGF2016での論点など(IGF-Japan2017資料)IGF2016での論点など(IGF-Japan2017資料)
IGF2016での論点など(IGF-Japan2017資料)
 
Pretul intruparii advent szeged ro
Pretul intruparii advent szeged roPretul intruparii advent szeged ro
Pretul intruparii advent szeged ro
 
Metacognicion
MetacognicionMetacognicion
Metacognicion
 
The power of mobility
The power of mobilityThe power of mobility
The power of mobility
 
UX Workshop
UX WorkshopUX Workshop
UX Workshop
 
La metacognicion y las herramientas didacticas.
La metacognicion y las herramientas didacticas.La metacognicion y las herramientas didacticas.
La metacognicion y las herramientas didacticas.
 
Tentang PT. Ajinomoto Indonesia
Tentang PT. Ajinomoto IndonesiaTentang PT. Ajinomoto Indonesia
Tentang PT. Ajinomoto Indonesia
 
DESIGN: creation of artifacts in society by Karl T. Ulrich
DESIGN: creation of artifacts in society by Karl T. UlrichDESIGN: creation of artifacts in society by Karl T. Ulrich
DESIGN: creation of artifacts in society by Karl T. Ulrich
 

Similaire à UX of User Stories Workshop

Designing with Agile Workshop
Designing with Agile WorkshopDesigning with Agile Workshop
Designing with Agile WorkshopAnders Ramsay
 
Top 6 ways developers mess up on User Experience (and how to avoid them) [SF ...
Top 6 ways developers mess up on User Experience (and how to avoid them) [SF ...Top 6 ways developers mess up on User Experience (and how to avoid them) [SF ...
Top 6 ways developers mess up on User Experience (and how to avoid them) [SF ...Kate Rutter
 
Designing Successful Experiences for Bald Apes
Designing Successful Experiences for Bald ApesDesigning Successful Experiences for Bald Apes
Designing Successful Experiences for Bald ApesEva Willis
 
Good design is... a myth - Zoltan Kollin - UX Copenhagen 2017
Good design is... a myth - Zoltan Kollin - UX Copenhagen 2017Good design is... a myth - Zoltan Kollin - UX Copenhagen 2017
Good design is... a myth - Zoltan Kollin - UX Copenhagen 2017Zoltan Kollin
 
Good design is a myth - by Zoltan Kollin | UXRiga 2017
Good design is a myth  - by Zoltan Kollin | UXRiga 2017Good design is a myth  - by Zoltan Kollin | UXRiga 2017
Good design is a myth - by Zoltan Kollin | UXRiga 2017UX Riga
 
Want to Sell UX? Stop Talking UX!
Want to Sell UX? Stop Talking UX!Want to Sell UX? Stop Talking UX!
Want to Sell UX? Stop Talking UX!Lis Hubert
 
Design studio-workshop (short session)
Design studio-workshop (short session)Design studio-workshop (short session)
Design studio-workshop (short session)Anders Ramsay
 
Good design is a myth - Zoltan Kollin @ UX Cambridge 2017 & UX Scotland 2017
Good design is a myth - Zoltan Kollin @ UX Cambridge 2017 & UX Scotland 2017Good design is a myth - Zoltan Kollin @ UX Cambridge 2017 & UX Scotland 2017
Good design is a myth - Zoltan Kollin @ UX Cambridge 2017 & UX Scotland 2017Zoltan Kollin
 
Untangling invisible knots: UX in voice technology products
Untangling invisible knots: UX in voice technology productsUntangling invisible knots: UX in voice technology products
Untangling invisible knots: UX in voice technology productsJessica Kainu
 
The Top 10 things that UX people get obsessed about
The Top 10 things that UX people get obsessed aboutThe Top 10 things that UX people get obsessed about
The Top 10 things that UX people get obsessed aboutAndy Marshall
 
Designing with Agile Workshop (Half Day)
Designing with Agile Workshop (Half Day)Designing with Agile Workshop (Half Day)
Designing with Agile Workshop (Half Day)Anders Ramsay
 
Government Digital Service
Government Digital ServiceGovernment Digital Service
Government Digital ServiceIrina Sherborne
 
Product and UX - are the roles blurring?
Product and UX - are the roles blurring?Product and UX - are the roles blurring?
Product and UX - are the roles blurring?Jesse Gant
 
Beginning UX - UXiD Jogja - March2018
Beginning UX - UXiD Jogja - March2018Beginning UX - UXiD Jogja - March2018
Beginning UX - UXiD Jogja - March2018Yahya , Ahmad M
 
Intro Glass Adobe User Group
Intro Glass Adobe User GroupIntro Glass Adobe User Group
Intro Glass Adobe User GroupInfo.nl
 
Intro Glass Adobe User Group
Intro Glass Adobe User Group Intro Glass Adobe User Group
Intro Glass Adobe User Group Iskander Smit
 
Mob x recap for here sept 2014
Mob x recap for here sept 2014Mob x recap for here sept 2014
Mob x recap for here sept 2014Tracy Rolling
 
UXD / DNA - DesignMap, Inc.
UXD / DNA - DesignMap, Inc.UXD / DNA - DesignMap, Inc.
UXD / DNA - DesignMap, Inc.DesignMap
 

Similaire à UX of User Stories Workshop (20)

Designing with Agile Workshop
Designing with Agile WorkshopDesigning with Agile Workshop
Designing with Agile Workshop
 
Top 6 ways developers mess up on User Experience (and how to avoid them) [SF ...
Top 6 ways developers mess up on User Experience (and how to avoid them) [SF ...Top 6 ways developers mess up on User Experience (and how to avoid them) [SF ...
Top 6 ways developers mess up on User Experience (and how to avoid them) [SF ...
 
Designing Successful Experiences for Bald Apes
Designing Successful Experiences for Bald ApesDesigning Successful Experiences for Bald Apes
Designing Successful Experiences for Bald Apes
 
Good design is... a myth - Zoltan Kollin - UX Copenhagen 2017
Good design is... a myth - Zoltan Kollin - UX Copenhagen 2017Good design is... a myth - Zoltan Kollin - UX Copenhagen 2017
Good design is... a myth - Zoltan Kollin - UX Copenhagen 2017
 
Good design is a myth - by Zoltan Kollin | UXRiga 2017
Good design is a myth  - by Zoltan Kollin | UXRiga 2017Good design is a myth  - by Zoltan Kollin | UXRiga 2017
Good design is a myth - by Zoltan Kollin | UXRiga 2017
 
Want to Sell UX? Stop Talking UX!
Want to Sell UX? Stop Talking UX!Want to Sell UX? Stop Talking UX!
Want to Sell UX? Stop Talking UX!
 
Design studio-workshop (short session)
Design studio-workshop (short session)Design studio-workshop (short session)
Design studio-workshop (short session)
 
Good design is a myth - Zoltan Kollin @ UX Cambridge 2017 & UX Scotland 2017
Good design is a myth - Zoltan Kollin @ UX Cambridge 2017 & UX Scotland 2017Good design is a myth - Zoltan Kollin @ UX Cambridge 2017 & UX Scotland 2017
Good design is a myth - Zoltan Kollin @ UX Cambridge 2017 & UX Scotland 2017
 
Untangling invisible knots: UX in voice technology products
Untangling invisible knots: UX in voice technology productsUntangling invisible knots: UX in voice technology products
Untangling invisible knots: UX in voice technology products
 
The Top 10 things that UX people get obsessed about
The Top 10 things that UX people get obsessed aboutThe Top 10 things that UX people get obsessed about
The Top 10 things that UX people get obsessed about
 
Designing with Agile Workshop (Half Day)
Designing with Agile Workshop (Half Day)Designing with Agile Workshop (Half Day)
Designing with Agile Workshop (Half Day)
 
Lean_UX--TC.220134502
Lean_UX--TC.220134502Lean_UX--TC.220134502
Lean_UX--TC.220134502
 
Government Digital Service
Government Digital ServiceGovernment Digital Service
Government Digital Service
 
Product and UX - are the roles blurring?
Product and UX - are the roles blurring?Product and UX - are the roles blurring?
Product and UX - are the roles blurring?
 
ai-ux-ui
ai-ux-uiai-ux-ui
ai-ux-ui
 
Beginning UX - UXiD Jogja - March2018
Beginning UX - UXiD Jogja - March2018Beginning UX - UXiD Jogja - March2018
Beginning UX - UXiD Jogja - March2018
 
Intro Glass Adobe User Group
Intro Glass Adobe User GroupIntro Glass Adobe User Group
Intro Glass Adobe User Group
 
Intro Glass Adobe User Group
Intro Glass Adobe User Group Intro Glass Adobe User Group
Intro Glass Adobe User Group
 
Mob x recap for here sept 2014
Mob x recap for here sept 2014Mob x recap for here sept 2014
Mob x recap for here sept 2014
 
UXD / DNA - DesignMap, Inc.
UXD / DNA - DesignMap, Inc.UXD / DNA - DesignMap, Inc.
UXD / DNA - DesignMap, Inc.
 

Plus de Anders Ramsay

Dev-Centered UX (UX Week 2014)
Dev-Centered UX (UX Week 2014)Dev-Centered UX (UX Week 2014)
Dev-Centered UX (UX Week 2014)Anders Ramsay
 
The UX of Minimum Viable Products
The UX of Minimum Viable ProductsThe UX of Minimum Viable Products
The UX of Minimum Viable ProductsAnders Ramsay
 
The UX of minimum viable products
The UX of minimum viable productsThe UX of minimum viable products
The UX of minimum viable productsAnders Ramsay
 
Learning to Play UX Rugby - Why your Agile UX adoption is failing and what to...
Learning to Play UX Rugby - Why your Agile UX adoption is failing and what to...Learning to Play UX Rugby - Why your Agile UX adoption is failing and what to...
Learning to Play UX Rugby - Why your Agile UX adoption is failing and what to...Anders Ramsay
 
Cross-Functional Pairing: What it is and why you should be doing it
Cross-Functional Pairing: What it is and why you should be doing itCross-Functional Pairing: What it is and why you should be doing it
Cross-Functional Pairing: What it is and why you should be doing itAnders Ramsay
 
Agile For UX Practitioners
Agile For UX PractitionersAgile For UX Practitioners
Agile For UX PractitionersAnders Ramsay
 
Agile for the rest of us
Agile for the rest of usAgile for the rest of us
Agile for the rest of usAnders Ramsay
 

Plus de Anders Ramsay (8)

Dev-Centered UX (UX Week 2014)
Dev-Centered UX (UX Week 2014)Dev-Centered UX (UX Week 2014)
Dev-Centered UX (UX Week 2014)
 
The UX of Minimum Viable Products
The UX of Minimum Viable ProductsThe UX of Minimum Viable Products
The UX of Minimum Viable Products
 
The UX of minimum viable products
The UX of minimum viable productsThe UX of minimum viable products
The UX of minimum viable products
 
Lean UX Roundtable
Lean UX RoundtableLean UX Roundtable
Lean UX Roundtable
 
Learning to Play UX Rugby - Why your Agile UX adoption is failing and what to...
Learning to Play UX Rugby - Why your Agile UX adoption is failing and what to...Learning to Play UX Rugby - Why your Agile UX adoption is failing and what to...
Learning to Play UX Rugby - Why your Agile UX adoption is failing and what to...
 
Cross-Functional Pairing: What it is and why you should be doing it
Cross-Functional Pairing: What it is and why you should be doing itCross-Functional Pairing: What it is and why you should be doing it
Cross-Functional Pairing: What it is and why you should be doing it
 
Agile For UX Practitioners
Agile For UX PractitionersAgile For UX Practitioners
Agile For UX Practitioners
 
Agile for the rest of us
Agile for the rest of usAgile for the rest of us
Agile for the rest of us
 

Dernier

Making and Unmaking of Chandigarh - A City of Two Plans2-4-24.ppt
Making and Unmaking of Chandigarh - A City of Two Plans2-4-24.pptMaking and Unmaking of Chandigarh - A City of Two Plans2-4-24.ppt
Making and Unmaking of Chandigarh - A City of Two Plans2-4-24.pptJIT KUMAR GUPTA
 
Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025Rndexperts
 
10 Best WordPress Plugins to make the website effective in 2024
10 Best WordPress Plugins to make the website effective in 202410 Best WordPress Plugins to make the website effective in 2024
10 Best WordPress Plugins to make the website effective in 2024digital learning point
 
Niintendo Wii Presentation Template.pptx
Niintendo Wii Presentation Template.pptxNiintendo Wii Presentation Template.pptx
Niintendo Wii Presentation Template.pptxKevinYaelJimnezSanti
 
怎么办理英国Newcastle毕业证纽卡斯尔大学学位证书一手渠道
怎么办理英国Newcastle毕业证纽卡斯尔大学学位证书一手渠道怎么办理英国Newcastle毕业证纽卡斯尔大学学位证书一手渠道
怎么办理英国Newcastle毕业证纽卡斯尔大学学位证书一手渠道yrolcks
 
Map of St. Louis Parks
Map of St. Louis Parks                              Map of St. Louis Parks
Map of St. Louis Parks CharlottePulte
 
Pearl Disrtrict urban analyusis study pptx
Pearl Disrtrict urban analyusis study pptxPearl Disrtrict urban analyusis study pptx
Pearl Disrtrict urban analyusis study pptxDanielTamiru4
 
Karim apartment ideas 01 ppppppppppppppp
Karim apartment ideas 01 pppppppppppppppKarim apartment ideas 01 ppppppppppppppp
Karim apartment ideas 01 pppppppppppppppNadaMohammed714321
 
world health day 2024.pptxgbbvggvbhjjjbbbb
world health day 2024.pptxgbbvggvbhjjjbbbbworld health day 2024.pptxgbbvggvbhjjjbbbb
world health day 2024.pptxgbbvggvbhjjjbbbbpreetirao780
 
Interior Design for Office a cura di RMG Project Studio
Interior Design for Office a cura di RMG Project StudioInterior Design for Office a cura di RMG Project Studio
Interior Design for Office a cura di RMG Project StudioRMG Project Studio
 
10 must-have Chrome extensions for designers
10 must-have Chrome extensions for designers10 must-have Chrome extensions for designers
10 must-have Chrome extensions for designersPixeldarts
 
How to Empower the future of UX Design with Gen AI
How to Empower the future of UX Design with Gen AIHow to Empower the future of UX Design with Gen AI
How to Empower the future of UX Design with Gen AIyuj
 
Iconic Global Solution - web design, Digital Marketing services
Iconic Global Solution - web design, Digital Marketing servicesIconic Global Solution - web design, Digital Marketing services
Iconic Global Solution - web design, Digital Marketing servicesIconic global solution
 
The spirit of digital place - game worlds and architectural phenomenology
The spirit of digital place - game worlds and architectural phenomenologyThe spirit of digital place - game worlds and architectural phenomenology
The spirit of digital place - game worlds and architectural phenomenologyChristopher Totten
 
Piece by Piece Magazine
Piece by Piece Magazine                      Piece by Piece Magazine
Piece by Piece Magazine CharlottePulte
 
cda.pptx critical discourse analysis ppt
cda.pptx critical discourse analysis pptcda.pptx critical discourse analysis ppt
cda.pptx critical discourse analysis pptMaryamAfzal41
 
guest bathroom white and bluesssssssssss
guest bathroom white and bluesssssssssssguest bathroom white and bluesssssssssss
guest bathroom white and bluesssssssssssNadaMohammed714321
 
Karim apartment ideas 02 ppppppppppppppp
Karim apartment ideas 02 pppppppppppppppKarim apartment ideas 02 ppppppppppppppp
Karim apartment ideas 02 pppppppppppppppNadaMohammed714321
 
simpson-lee_house_dt20ajshsjsjsjsjj15.pdf
simpson-lee_house_dt20ajshsjsjsjsjj15.pdfsimpson-lee_house_dt20ajshsjsjsjsjj15.pdf
simpson-lee_house_dt20ajshsjsjsjsjj15.pdfLucyBonelli
 
guest bathroom white and blue ssssssssss
guest bathroom white and blue ssssssssssguest bathroom white and blue ssssssssss
guest bathroom white and blue ssssssssssNadaMohammed714321
 

Dernier (20)

Making and Unmaking of Chandigarh - A City of Two Plans2-4-24.ppt
Making and Unmaking of Chandigarh - A City of Two Plans2-4-24.pptMaking and Unmaking of Chandigarh - A City of Two Plans2-4-24.ppt
Making and Unmaking of Chandigarh - A City of Two Plans2-4-24.ppt
 
Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025
 
10 Best WordPress Plugins to make the website effective in 2024
10 Best WordPress Plugins to make the website effective in 202410 Best WordPress Plugins to make the website effective in 2024
10 Best WordPress Plugins to make the website effective in 2024
 
Niintendo Wii Presentation Template.pptx
Niintendo Wii Presentation Template.pptxNiintendo Wii Presentation Template.pptx
Niintendo Wii Presentation Template.pptx
 
怎么办理英国Newcastle毕业证纽卡斯尔大学学位证书一手渠道
怎么办理英国Newcastle毕业证纽卡斯尔大学学位证书一手渠道怎么办理英国Newcastle毕业证纽卡斯尔大学学位证书一手渠道
怎么办理英国Newcastle毕业证纽卡斯尔大学学位证书一手渠道
 
Map of St. Louis Parks
Map of St. Louis Parks                              Map of St. Louis Parks
Map of St. Louis Parks
 
Pearl Disrtrict urban analyusis study pptx
Pearl Disrtrict urban analyusis study pptxPearl Disrtrict urban analyusis study pptx
Pearl Disrtrict urban analyusis study pptx
 
Karim apartment ideas 01 ppppppppppppppp
Karim apartment ideas 01 pppppppppppppppKarim apartment ideas 01 ppppppppppppppp
Karim apartment ideas 01 ppppppppppppppp
 
world health day 2024.pptxgbbvggvbhjjjbbbb
world health day 2024.pptxgbbvggvbhjjjbbbbworld health day 2024.pptxgbbvggvbhjjjbbbb
world health day 2024.pptxgbbvggvbhjjjbbbb
 
Interior Design for Office a cura di RMG Project Studio
Interior Design for Office a cura di RMG Project StudioInterior Design for Office a cura di RMG Project Studio
Interior Design for Office a cura di RMG Project Studio
 
10 must-have Chrome extensions for designers
10 must-have Chrome extensions for designers10 must-have Chrome extensions for designers
10 must-have Chrome extensions for designers
 
How to Empower the future of UX Design with Gen AI
How to Empower the future of UX Design with Gen AIHow to Empower the future of UX Design with Gen AI
How to Empower the future of UX Design with Gen AI
 
Iconic Global Solution - web design, Digital Marketing services
Iconic Global Solution - web design, Digital Marketing servicesIconic Global Solution - web design, Digital Marketing services
Iconic Global Solution - web design, Digital Marketing services
 
The spirit of digital place - game worlds and architectural phenomenology
The spirit of digital place - game worlds and architectural phenomenologyThe spirit of digital place - game worlds and architectural phenomenology
The spirit of digital place - game worlds and architectural phenomenology
 
Piece by Piece Magazine
Piece by Piece Magazine                      Piece by Piece Magazine
Piece by Piece Magazine
 
cda.pptx critical discourse analysis ppt
cda.pptx critical discourse analysis pptcda.pptx critical discourse analysis ppt
cda.pptx critical discourse analysis ppt
 
guest bathroom white and bluesssssssssss
guest bathroom white and bluesssssssssssguest bathroom white and bluesssssssssss
guest bathroom white and bluesssssssssss
 
Karim apartment ideas 02 ppppppppppppppp
Karim apartment ideas 02 pppppppppppppppKarim apartment ideas 02 ppppppppppppppp
Karim apartment ideas 02 ppppppppppppppp
 
simpson-lee_house_dt20ajshsjsjsjsjj15.pdf
simpson-lee_house_dt20ajshsjsjsjsjj15.pdfsimpson-lee_house_dt20ajshsjsjsjsjj15.pdf
simpson-lee_house_dt20ajshsjsjsjsjj15.pdf
 
guest bathroom white and blue ssssssssss
guest bathroom white and blue ssssssssssguest bathroom white and blue ssssssssss
guest bathroom white and blue ssssssssss
 

UX of User Stories Workshop

  • 1. The UX of User Stories A UX Approach to Story Development UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 2. Overview - Intro to User Stories - Stories and User Research - Stories and Personas - Stories and UI Design Break, somewhere in here - Stories and the Product Road Map - Stories and Sprinting - Q&A/Wrapup UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 3. What’s one question you have about the UX of User Stories? UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 4. 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 UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 5. ? 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 POs Many Simultaneous Functions (A Boundary Object) UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 6. Power in Numbers UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 7. Where Stories Fall Short... I often order the wrong As an auto sales rep, I part, because the part want to search for parts numbering system is visually, so I can be sure confusing. It wastes time I’m ordering the right part. and makes me look stupid in front of customers! “What’s the underlying “Tell me what to build.” problem or goal?” One of many possible solutions. Optimized for delivery. Often emotional, not easily estimable, testable, etc. UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 8. Where Stories Fall Short Directory Purchasing Fulfillment Support As an auto sales rep, I want to search for parts visually, so I can be sure I’m ordering the right part. Are these all How will these stories the stories? fit together into a whole product? How will they map to the Are they even user interface? the right stories? UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 9. A UX Approach to Stories... I often order the wrong As an auto sales rep, I part, because the part want to see the 3rd party numbering system is mfr # next to the part #, confusing. It wastes time so I can be sure I’m and makes me look stupid in front of customers! ordering the right part. Experience Stories Dev-Ready Stories “What was the source “Let’s collaborate on problem or goal?” what to build.” Often emotional, not easily Uncovering the most pragmatic estimable, testable, etc. solution through intensive collaboration. UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 10. A UX Approach to Stories... Elicit Collaboratively Generate Build, Experience Explore Dev-Ready Evolve, Stories Solutions Stories Validate UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 11. Teams - 4-6 per team. - 1 product owner UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 12. Our Sample Project A Tablet App for a Children’s Charity Providing education and shelter for abandoned and orphaned children around the world. UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 13. Business Goals (or Story Boundaries) - Convince visitors to make a donation. - Persuade visitors to donate a little more than intended. - Instill confidence donation is going toward the cause. UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 14. Donator Tablet App Elicit Glue together Generate Build, Experience with UI design Dev-Ready Evolve, Stories Stories Validate UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 15. Experience Mapping - Based on the “Speed Boat” Innovation Game. - Uncover and prioritize user needs and desires. - Goal: Create an experience backlog. UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 16. X-Mapping Activity 1.Create the speed boat. 2.Elicit Experience Stories 3.Place cards in pairs. - Cards holding you back are anchors - Cards pulling you forward are propellers. 4.Self-organized chunking. 5.Label chunks. 6.Prioritize if needed - eg w/Dot-voting. 7.Create Backlog. UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 17. Elicit Experience Stories - Generate cards through discussion. - Place cards on experience map in pairs. UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 18. Convo Starters - Got a favorite charity? Why do you like it? - Anything frustrate you about donating to charities? - Ever wanted to donate but weren’t able to? Why? - What would be the perfect donation process? - What would motivate you to donate a little more? UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 19. X-Mapping Activity 1.Create the speed boat. 2.Elicit Experience Stories 3.Place cards in pairs. - Cards holding you back are anchors - Cards pulling you forward are propellers. 4.Self-organized chunking. 5.Label chunks. 6.Prioritize if needed - eg w/Dot-voting. 7.Create Backlog. UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 20. Experience Backlog Worried they’ll How do they correlate Are any of these start hounding me feature stories? to our business goals? if I make one donation. Are there Make a strong case conflicting for the cause, and I’m stories? willing to put up with a lot of UX issues Can’t tell where my $$$ actuall y goes. UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 21. Stories and UI Experience Stories Dev-Ready Stories Feature Stories How do these relate to Personas? UI is what glues stories together Enables more accurate estimates Enables better story coverage UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 22. Stories and Personas UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 23. As an auto sales rep, I want to search for parts visually, so I can be sure I’m ordering the right part. Contextualizing the Story UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 24. Giving stories context with photos, videos of the user’s environment. Personas as the voice of the story... Ted says: Ted wants wants to search As an auto sales rep, I for parts visually, so I can As an auto sales rep, I want want to search for parts be sure I’m ordering the to search for parts visually, visually, so I can be sure right part. so I can be sure I’m I’m ordering the right part. ordering the right part. UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 25. Stories and UI Experience stories Dev-Ready Stories Feature Stories UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 26. UI Exploration with Design Studio - Tapping into the whole team’s knowledge and imagination. - Can be used for research or actual design. - Three variants: Divergent, Convergent, Ad-Hoc UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 27. A Design Studio Pattern Establish Warmup Sketching Pitch/ Boundaries Timebox Critique UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 28. Warmup - 3-5 minute timebox. - Each participant writes as many features they can think of on separate stickies. - Becomes a feature palette for sketching. UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 29. 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. UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 30. Pitch/Critique - Post the sketches. - 2m round-robin, then open crit. - Take careful notes, attach to the respective sketches. - Look for and work to resolve vision differences. - (Optional) Dot-vote to uncover trending solutions. UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 31. Elicit Glue together Generate Build, Experience with UI design Dev-Ready Evolve, Stories Stories Validate UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 32. UI Exploration MVP/ Storymapping Product Road Map Planning & Estimating UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 33. Storymapping 101 Attract Convert Transact Upsell Priority MVP? UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 34. Generate Cards from UI 1. Create the backbone: What’s the top-level flow or structure? 2. Work with “devs” to slice and dice features into cards. Attract Transact Upsell Share Static Landing Process Page credit card payments “Donator- Make payment meter” via SMS UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 35. Those who need a document should participate in creating it. —Ancient Agile Proverb UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 36. Stories and the Product Road Map UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 37. Product Road Map and MVP - Designing releases, uncovering a Minimum Viable Product (MVP) - Many ways to slice and dice. - First release often hardest. UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 38. MVP Strategies - Painkiller Fastest/Cheapest way to remove user pain. - Fa$t Money Fastest path to revenue. - Go Ugly Early Screw the UX, just make it work. - Fake It ‘til You Make It Create fake features to capture metrics and validate your idea. There is no one right way. UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 39. The UX of Estimating - Attaching a cost to each story. - Be sure estimate is informed by UI Exploration. - Be present, prepared to speak up and negotiate. - Understand the estimation units - Understand stories and estimation. UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012 Photo: ryanendres.blogspot.com
  • 40. Find the thinnest product slice Attract Transact Upsell Share MVP? Static Landing Process Page credit card payments Make payment “Donator- via SMS meter” UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 41. Donator Tablet App Elicit Glue together Generate Build, Experience with UI design Dev-Ready Evolve, Stories Stories Validate UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 42. Experience Backlog Worried they’ll Did we actually start hounding me address these? if I make one donation. Make a strong case for the cause, and I’m willing to put up with a lot of UX issues Can’t tell where my $$$ actuall y goes. UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 43. The Scrumboard New UX/Biz Active Ready Done Validated UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 44. Micro-Sprint - Self-organize into UX/”Dev”/PO - Create paper prototypes that allow for completing a donation process. - I’ll initiate “User Fridays” cadences. - Validate the original Experience Stories against your design. UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 45. Done vs Validated Done - a tool for helping teams make decisions and move forward. Can we decide that this task is done and move on to the next thing? Validated - a measurement of design value. Was this idea as good as we thought it was? UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012
  • 46. Q&A UX OF USER STORIES @ANDERSRAMSAY #AGILEUX 13 AUG 2012