View
114
Download
0
Category
Preview:
DESCRIPTION
Citation preview
Hugh Beyer, CTO 978.823.0100
beyer@incontextdesign.com
www.incontextdesign.comwww.innovationincool.com
Twitter: @hughrbeyer
Adopting Agile: Successful UX in an Agile World
Hugh R. BeyerCTOInContext DesignConcord, Massachusetts, USAhugh.beyer@incontextdesign.com
Waterfall development
Agile says development in steps – and iterate
UX says work with users to create value – and iterate
UX and Agile: The promise
The “ideal” product
User Test
What users really need
How could Agile development work without UX?
Agile principles Satisfy the customer with early and continuous delivery of value Welcome changing requirements Deliver working software frequently Communicate through face-to-face conversation, not heavy
documentation Reflect on process regularly
Agile in practice Goal is to deliver working software quickly Short iterations permit management visibility into team progress Up-front planning is minimized or nonexistent Any work that doesn’t involve coding is downplayed
What is Agile development?
Processes Short sprints Plan each sprint at the start Plans based on story cards Each sprint delivers useful
value Daily standup meetings Validation of sprint and
re-evaluation of direction at end of sprint
Reflection on process at the end of sprint
Core Agile processes
Development Practices Co-located teams No code ownership Test-driven design Continuous build Pair programming
Phase 0
Issue: Getting trustworthy user insight Customers, stakeholders, surrogates, product owners are not users
• They can’t tell you what users need
Even users can’t tell you what users need
Even with a demo, users can’t tell you what they need or what to change
Users are hard to get to and rarely can be put on the team
User-centered techniques to find out how users work, invent appropriate solutions, validate and iterate those solutions
UX people on the team
Issue: figuring out what’s useful The frame for a design comes from somewhere
Significant new functionality needs “think time”
The release planning session is not the right place for design
Even the customer/user doesn’t know what the right thing is
Even a concept needs to be tested
Driving Phase 0
Leverage the Agile value: The customer defines the stories
Phase 0 brings it together User research, visioning, conceptual design with iteration
Key skill: Driving Phase 0
Concept Iteration User Research Agile Development
Build understanding
with users
Iterate concept with
users
Iterate SW with users
Phase 0
User-centered Agile Compressed into a short
Phase 0
• For constrained project focus only!
Example schedule of CD Agile Phase 0
Week 1 – Gather data from 8-10 users
Week 2 – Consolidate data
Week 3 – Vision and storyboard
Week 4 – UED and UI
Week 5 – Release planning & validation (2-4 users)
Week 6 – Validation & redesign
Phase 0 sprintsusing Scrum as a process framework
Spr
int
Spr
int
Spr
int
Development Sprint 1
Spr
in t
User Stories
Why user stories Convenient structuring technique for development Small stories enable short iterations “User value” as opposed to features – fights feature creep
What they are Short descriptions of functionality Each provides user value Rated by business value Business value incorporates user value from Phase 0
But… Chopping the design into small stories makes it easy to lose coherence
User stories
Each story captures one element of user value Written to describe what is done for the user by the system Collects features that aren’t useful on their own into one story Splits features that can be partially or more simply implemented
• Build up complex functionality over several stories
• Break large stories – “epics” – into smaller stories
A guide for story format As a <role or persona> I want to <do something supported by the
system> so that I <achieve something of value> “So that” clause may not be needed if working from a design
Engineering tasks are not user stories Keep the focus on value to the user
Writing user stories
Good As a traveler, I want to see all the trips I have scheduled so I can orient to
the upcoming weeks• No indication of UI at this point
As a traveler, I want to see key flight information at a glance so I can glance at it while in a hurry• Including what? Airline, flight number, departure time? Gate? Details may not be
captured in the story.
As a traveler, I want to see if the flight is delayed and the current departure time so I can tell if I’m going to miss a connection• Implies lots of back-end work, so it’s split into its own story
As an admin or spouse I want to see the traveler’s itinerary so I can coordinate with them • Stories can support different user types
Examples of good user stories
Bad As a traveler, I want to see upcoming trips so I can know my upcoming
trips• Rewritten functional requirement – do you understand the user need?
As a traveler, I want a list of all the events in my trip with an icon showing what the event is, the title of the event, its location, and key information specific to the event• Writing the design into the story
As the system, I want to collect flight information from airlines so I can present it to the user• Technical requirement masquerading as a user story
As a traveler, I want the app to be highly usable so I don’t waste my time• Non-functional requirement with no tangible deliverable
Common errors in user stories
Fitting stories into sprints
UI
Presentation layer
DB access layer
Step 3
Step 1
Step 2
Traditional division by layer
Story 1
Fitting stories into sprints
UI
Presentation
DB access
Sprint1: Minimal UI, get data to the
screen
Completed UI (TripIt)
7:45am London to Chicago
11:00am The Drake Hotel
Thu, Sep 8
Wed, Sep 7
Chicago, IL
8:30am Meeting
As a traveler I can see the main events of my itinerary to give an overview of the trip
Story 2
Fitting stories into sprints
UI
Presentation
DB access
Story 1: Minimal UI, get data to the
screen
Story 2: UI structures information, provides
more info
7:45am London to Chicago(air, AA 99)
11:00am Directions to theDrake Hotel
11:00am The Drake Hotel
▼Thu, Sep 8
▼ Wed, Sep 7
Chicago, IL
8:30am Meeting
As a traveler the main events of my itinerary are shown in a collapsible view so I can focus on the part of the trip that matters
Completed UI (TripIt)
Story 3
Fitting stories into sprints
UI
Presentation
DB access
Story 1: Minimal UI, get data to the
screen
Story 2: UI structures information, provides
more info
Story 3: Fully rendered UI, full
data access
As a traveler the main events of my itinerary are shown with icons and key information so I get quick details
Completed UI (TripIt)
Fitting into a sprint
Integrating UX and development
Work out the interface for a story before development starts Detailed UI design
Final iteration with users
Work with development during the iteration Communicate design to developer
Consult on detailed behavior
Test implementation with users in the following iteration
UX team consults
on story 1
UX team designs story 1
Dev team builds story 1
UX team tests
story 1
UX team designs story 2
Dev team builds story 2
Dev team builds story 3
UX team tests
story 2
UX team consults
on story 2
UX team designs story 3 UX team
consults on story 3
Sprint 1 Sprint 2 Sprint 3 Sprint 4
Buffers mediate between work steps Buffers control flow—maximum size limits work in progress
Kanban view of work-in-progress
Work Step 1 Buffer
Max size = n
Work Step 2 Buffer
Max size = m
Kanban view of 1-ahead/1behind
DevelopmentLimit = velocity
Development Buffer
In progress
UX Design
Buffer(Release backlog)
In progress
• Stories ready to start development
• Number must be = velocity by start of sprint
• UX works 1 ahead to fill buffer
Sprint nSprint n-1
Test
Test Buffer
In progress
Sprint n+1
• No need to wait for next sprint to start testing
• Release backlog acts as initial buffer
• Stories defined but not in progress = waste
Take out the slack
User-centered techniques within the sprint Targeted interviews to understand specific tasks Paper prototypes to work out designs and alternatives
• Use rough prototypes in situ to explore options and define low-level requirements
Online prototypes and skeleton code to test user interaction• Remote testing with screen sharing can be used
• Test details of appearance, layout, and behavior
User tests of running builds
All supporting Fast iteration of design before coding starts Quick check of design as implemented Close collaboration between UX designers and developers
In-sprint user feedback
Maintain a coherent UI
Develop in small chunks; think in coherent units
Engineering breaks everything into parts Short timeframe of a sprint Small functionality of a story
Design has to keep things coherent One large view of the user experience UI and behavior consistency across the interface Tasks supported coherently, end-to-end
UX activities maintain coherence Start with a real Phase 0 User interviews focused on work practice UI track to look across sprints and teams UI representations to show the coherence
• User Environment Design from Contextual Design
• Site maps from web development
Maintain a coherent UI
Maintain a coherent UI
Strategic design phase to define roadmap
Parallel development streams for each component Each stream starts with a Phase 0 for that component
Parallel UX stream to maintain system coherence
SprintSprintSprintSprintSprintSprintRelease planningRelease planning
Strategic design: Initial user research, ideation,
concept testing
Strategic design: Initial user research, ideation,
concept testing
Phase 0 for componentPhase 0 for component
Ongoing UX stream for cross-system coherenceOngoing UX stream for cross-system coherenceInteraction
Architecture planning
Interaction Architecture
planning
SprintSprintSprintSprintSprintSprintRelease planningRelease planning
Phase 0 for componentPhase 0 for component
Scope development
effort; plan parallel
streams; define roadmap
Scope development
effort; plan parallel
streams; define roadmap
Be a team member
You are a part of the team Your problems are the team’s problems
• Borrow and co-opt people
The team’s problems are your problems• Support team priorities. Be there at team meetings.
Your tasks are the team’s tasks• Track them as team tasks
UX as a team member
Defined roles and tasks throughout the process
The UX roles on an Agile project
Phase 0: Set direction & project goals
Phase 0: Set direction & project goals
User research: field interviews
Concepting: high-level design
Validation: prototyping
User research: field interviews
Concepting: high-level design
Validation: prototyping
Release planningRelease planningPrioritization: customer value for release
User story generation
Prioritization: customer value for release
User story generation
Sprint planningSprint planningPrioritization: customer value for the sprint
UX task generation and estimation
Prioritization: customer value for the sprint
UX task generation and estimation
Sprint implementationSprint implementation
UI design and detailed behavior for each user story
Prototyping with users for detailed behavior and look
Validation testing of completed code
UI design and detailed behavior for each user story
Prototyping with users for detailed behavior and look
Validation testing of completed code
Agile activity UX role
www.incontextdesign.com
www.innovationincool.com
Put the customer at the centerof Agile
Karen Holtzblatt, CEO
karen@incontextdesign.com
Hugh Beyer, CTO
hugh.beyer@incontextdesign.com
Recommended