User experience design practitioners have historically been required to synthesize fuzzy concepts like “brand” and “user behavior” into intuitive web and mobile design specifications. Often, this involved taking the time required to deliver high quality user experience design work.
With the widespread adoption of agile software development practices delivering features in a highly responsive “as needed” basis, practitioners of user experience design are reaching a point where they need to adapt, or risk being left behind.
User Experience Design, an Agile Approach
This article outlines a web/mobile user experience design process adapted to agile development environments. But it doesn’t stop there. The agile user experience design process that follows is also intended to allow UX designers to take a leading role in delivering business value.
1: Define the problem
Rather than centering your user experience design process on features you think customers might want, list and discuss the problems they are actually experiencing when interacting with your product.
To help identify these problems, you can use metrics, social media signals, help tickets, and other feedback mechanisms.
Examples problems might include a high bounce rate in a flow on your site, or the lack of information about people using your site.
This problem focused approach helps align your user experience design process on your customers’ actual needs, rather than the ones you think they might have.
2: Set a Measurable Goal
For example, decreasing the bounce rate in a given user flow, or increasing the information collected from site visitors.
Whenever possible, it’s best to have a current metric to measure against as a baseline for later comparison.
Measurable goals help align the user experience design process with the key performance metrics of the overall business.
3. Brainstorm
There are tons of resources available on effective brainstorming. But for our agile user experience design purposes here are some specific tips:
Keep the team small. Under five people is a good rule of thumb.
Send a short email outlining your ideas to the team at least one day before the meeting. This way, everyone is informed and on the same page from the start.
Timebox the brainstorming session. Keep it under 30 minutes. If you’re brave, keep it under fifteen. Focus on getting as many strategies and solutions on the white board as possible in a fixed amount of time.
4. Prioritize
Review the ideas.
Pick the simplest one that can rapidly be implemented in a measurable way.
This decision usually takes less than five minutes. If you’re not sure about some technical aspect of it, now is a good time to ask the developers.
5. Sketch you User Interfaces
Time box the sketching. Sketch for 5 minutes, discuss for 2 minutes. Repeat until the solution starts coming into focus.
Don’t worry about software prototyping tools yet.
At this point, the most high tech equipment you need is a paper and pencil.
6. Flesh Out Your User Flows
Again, use pencil and paper. We like to use a variant on the 37 Signals user flow process.
On the first line of each step in the flow, write what the visitor sees. Underline it.
On the second third and fourth rows, list what the users DO, ranked from top to bottom with the desired action on top.
This reflects the visual hierarchy you will eventually design for the page.
Draw an arrow to the next page in the flow.
If a page has more than three items jockying for hierarchy, cut or combine items to streamline the user experience.
7. Wireframe
User wireframes to document the user flow and microstates.
If you use graphics or prototyping software, now is the time to bring it out.
For this step, use whatever software tool best fits your needs. I prefer OmniGraffle.
8. Usability Testing
One of the most useful ways to validate your user experience design is testing it with real users.
There are software packages like Solidify that let you make interactive visual prototypes from static wireframes.
Paper prototyping however, can often save time and be just as useful.
User testing with 5 users is probably enough to give you some actionable feedback for now.
You’ll get more actionable information from a series of two or three small users tests a different stages in the process rather than just doing one at the end. Smaller tests are also cheaper.
9. Visual Design
For adding texture and detailed graphics to a design, it’s hard to beat Photoshop/Illustrator.
Keep a file of existing styles and interface elements in a “Style Guide” file, to drag and drop as much of your visual design process as possible.
For new elements, feel free to use off the shelf items in your first iteration . For example, instead of designing icons, use icons from pictos, or free icon fonts from Zurb and/or Twitter bootstrap.
If the design actually ends up adding business value, you can always make new custom designed elements later.
10. Deliverables
Make the markup. If you can run some interactive user tests at this point with a live mockup, do it.
Make any necessary changes.
Deliver the markup to the developers.
11. QA and Deploy
Once the developers have worked their magic, do some QA to make sure everything works like it’s supposed to.
If you haven’t done a usability test with the visual design in place yet, now is a good time. Most significant usability issues will likely have been discovered during earlier user tests. But a test with visual design in place can help cover your bases. Here are some affordable usability testing tools even organizations on small budgets can afford.
As for deployment, see if the developerss can:
- deploy in stages
- easily roll back deployed changes
Deploying in stages rolls out updates to a subset of your user base first. This is useful if you have a larger user base. If there are any unexpected problems, a staged roll out effects only 5 or 10 percent of your users instead of the entire user base.
If the problem is significant enough, deploys with easily roll back can come in very handy.
12. Measure
Use Google Analytics to track the performance of your new user experience. It’s free and it keeps getting better and better.
Two weeks after the deploy, review our analytics to see if the original goals have been hit.
If the change isn’t working, you can kill it.
If it is, you can keep it.
If it’s working out great, you can grow it.
If you don’t have enough traffic or user feedback to get a reasonable measure of your initiative’s success… you might want to focus the agile user experience design process described here on marketing initiatives rather than features, until you have the necessary user base.
Once you get sufficient traffic to identify usage problems, you’ll be able to focus your agile user experience design process on issues most relevant to your users.
How Long Does All This Take?
Although time frames differ based on the scope of features being added, one cycle of the agile user experience workflow outlined here takes about a week. This includes:
- Friday planning meeting
- 2-3 days to go from strategy to deliverables
- 2-3 day to go from deliverables to deployed code.
- Push to production once a week. So in a given two week sprint, you’ve pushed twice.
The user experience design you work on in each sprint will be what the developers are working on next, so keep the lines of communication open to make the process as coordinated as possible.
And that’s about it. I hope you found this article useful. And when in doubt, remember: Fail fast. Done is better than perfect, and if any problems are so bad they can’t wait til the next deploy, you can always roll back.
You CAN roll back the changes, right? 