<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Boxes and Arrows &#187; Special topic: Agile/Lean UX</title>
	<atom:link href="http://boxesandarrows.com/category/special-topic-agilelean-ux/feed/" rel="self" type="application/rss+xml" />
	<link>http://boxesandarrows.com</link>
	<description>Boxes and Arrows is devoted to the practice, innovation, and discussion of design; including graphic design, interaction design, information architecture and the design of business.</description>
	<lastBuildDate>Tue, 21 May 2013 13:57:51 +0000</lastBuildDate>
	<language>en-US</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	
		<item>
		<title>Integrating UX into the Product Backlog</title>
		<link>http://boxesandarrows.com/integrating-ux-into-the-product-backlog/</link>
		<comments>http://boxesandarrows.com/integrating-ux-into-the-product-backlog/#comments</comments>
		<pubDate>Fri, 03 Feb 2012 08:48:50 +0000</pubDate>
		<dc:creator>Jon Innes</dc:creator>
				<category><![CDATA[Deliverables and Documentation]]></category>
		<category><![CDATA[Process and Methods]]></category>
		<category><![CDATA[Special topic: Agile/Lean UX]]></category>

		<guid isPermaLink="false">http://boxesandarrows.com/integrating-ux-into-the-product-backlog/</guid>
		<description><![CDATA[Many agile teams can’t develop good user experiences because UX just isn’t integrated well enough. With the UX Integration Matrix, Jon Innes helps involve UX in every possible part of the agile process.]]></description>
				<content:encoded><![CDATA[<p><img src="http://www-boxesandarrows-com.zippykid.netdna-cdn.com/files/banda/integrating-ux-into/debating-team.jpg" width="400" height="364" alt="Integrating UX into the Product Backlog" title="Integrating UX into the Product Backlog" align="right" style="max-width:50%;" />Teams moving to agile often struggle to integrate agile with best practices in user-centered design (UCD) and user experience (UX) in general. Fortunately, using a UX Integration Matrix helps integrate UX and agile by including UX information and requirements right in the product backlog.</p>
<p>While both agile and UX methods share some best practices&#8212;like iteration and defining requirements based on stories about users&#8212;agile and UX methods evolved for different purposes, supporting different values. Agile methods were developed without consideration for UX best practices. Early agile pioneers were working on in-house IT projects (custom software) or enterprise software <sup>[<a href="#footnote1">1</a>, <a href="#footnote2">2</a>]</sup>.</p>
<p>The economics are different in selling consumer products than when developing software for enterprises&#8212;UX matters more for consumer products. Jeff Bezos cares if users know how to click the button that puts money in his pocket more than Larry Ellison cares about any button in Oracle software. Larry makes money even if people can’t use his software. Oracle sells support contracts and professional services to fix things customers don’t like. Amazon and other online businesses can’t operate like that. They have to get the UX right, or they go out of business fast. User experience factors rarely get the same level of consideration when the end-user is not the same person as the paying customer <sup>[<a href="#footnote3">3</a>]</sup>.</p>
<h2>Agile teams and UX problems</h2>
<p>I’ve encountered two problems common among agile teams when helping them improve the user experience of their products or services:</p>
<ol>
<li>UX work is frequently overlooked during the release and sprint planning efforts.</li>
<li>Teams often fail to measure the UX impact of their iterative efforts.</li>
</ol>
<p>These two problems become more serious when combined.</p>
<p>When UX work goes undone and the impact is not measured, the team doing the work has no idea what is going on. The feedback loop is broken. Both agile and UX methods emphasize iteration, but productive iteration requires good feedback loops.</p>
<p>You can conduct development iterations (the focus of agile) or design iterations (the focus of UX), but if you fail to measure the impact of the iteration, you won’t see the real benefits of an iterative process. You will have no real idea if your offering is any closer to meeting the needs of the end user. The <em>User Experience Integration Matrix</em>  (UXI Matrix) addresses these problems by tying UX to the project backlog.</p>
<h2>Integrating UX into the product backlog</h2>
<pullquote>You can conduct development iterations (the focus of agile) or design iterations (the focus of UX), but if you fail to measure the impact of the iteration, you won’t see the real benefits of an iterative process. You will have no real idea if your offering is any closer to meeting the needs of the end user.</pullquote>
<p>Scrum (one of the most popular variants of agile) advocates you create a <em>Product Backlog</em>, a collection of stories that describe user needs. The team iteratively refines the requirements, from rough (and often ill defined) to more specific. This is achieved using stories from a user’s perspective, which have conditions of satisfaction associated with them. This concept is adapted from UCD’s scenario based design methods. In my view, this is far better than other traditional approaches to documenting requirements that are often detached from user’s goals.</p>
<p>Various agile gurus <sup>[<a href="#footnote4">4</a>, <a href="#footnote5">5</a>]</sup> discuss how to break down requirements from high-level stories to user needs targeted at specific users. Even if your team follows Jeff Patton’s story mapping method <sup>[<a href="#footnote6">6</a>]</sup>, (which I highly recommend) to create structured hierarchical representations, you’ll often find you want to analyze the stories by different factors as you groom your backlog.</p>
<p>I’ve worked with teams who want to analyze stories the following ways:</p>
<ol>
<li>Order of dependency or workflow (self-service password reset depends on user registration)</li>
<li>Criticality (which of these stories must be done so customers pay us next month)</li>
<li>How much work will they take to complete (show me all the epics)</li>
<li>What related stories do I have (find requirements with related UI patterns)</li>
<li>By role or persona  (show me all the stories that impact persona X)</li>
<li>What stories have a high impact on the UX, so we can focus on those?</li>
</ol>
<p>If the project is small (both in number of team members and number of stories) you might be able to get away with rearranging story cards on the wall. However, in my experience, things inevitably get more complex. You often want to consider multiple factors when reviewing the backlog. A <abbr title="User Experience Integration">UXI</abbr> Matrix helps you track and view these multiple factors.</p>
<h2>Creating a UX Integration Matrix</h2>
<p>The <abbr title="User Experience Integration">UXI</abbr> Matrix is a simple, flexible, tool that extends the concept of the product backlog to include UX factors normally not tracked by agile teams. To create a UX Integration Matrix, you add several UX-related data points to your user stories:</p>
<table class="data-table">
<thead>
<tr>
<th>Column Name</th>
<th>Possible Values</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<tr>
<td><b>Persona</b></td>
<td>Persona’s name</td>
<td>Identifies the persona a user story applies to</td>
</tr>
<tr>
<td><b>UX&nbsp;complexity</b></td>
<td>1 to 5 (or Fibonacci numbers if you’re into that sort of thing)</td>
<td>Estimates design effort separate from implementation effort</td>
</tr>
<tr>
<td><b>Story&nbsp;verified</b></td>
<td>Y/N</td>
<td>Is this story fiction or fact? Is it based on user research or customer input?</td>
</tr>
<tr>
<td><b>Design&nbsp;complete</b></td>
<td>Y/N</td>
<td>Is the design coherent enough for development to be able to code it (or estimate how long it would take to code)?</td>
</tr>
<tr>
<td><b>Task&nbsp;completion&nbsp;rates</b></td>
<td>0 to 100%</td>
<td>The percentage of users who have been observed to complete the story without any assistance.</td>
</tr>
<tr>
<td><b>Staffing</b></td>
<td>Resource’s name</td>
<td>Who’s owns the design, at whatever level of fidelity is agreed to.</td>
</tr>
</tbody>
</table>
<p>With these columns added, your product backlog begins to look something like the spreadsheet in figure 1.</p>
<p>  ￼<br />
<illustration><br />
<img src="http://www-boxesandarrows-com.zippykid.netdna-cdn.com/files/banda/integrating-ux-into/uxi-matrix-example.png" alt="Figure 1: UX Integration Matrix, a simplified example" title="Figure 1: UX Integration Matrix, a simplified example" style="max-width:100%;" /></p>
<p>Figure 1: UX Integration Matrix, a simplified example</p>
<p></illustration></p>
<h2>Advantages to using the UXI Matrix</h2>
<p>The <abbr title="User Experience Integration">UXI</abbr> Matrix helps teams integrate UX best practices and user-centered design by inserting UX at every level of the agile process.</p>
<h3>Groom the backlog</h3>
<p>During release and sprint planning you can sort, group, and filter user stories in Excel:</p>
<ul>
<li>Group by themes or epics, or anything you want to add via new columns</li>
<li>A primary persona, a set of personas, or number of personas associated (more = higher)</li>
<li>Stories you’ve verified via user research or ones you need to verify</li>
<li>Stories you’ve completed but need to refine based on metrics</li>
<li>Export stories into a format that can be used in information architecture work</li>
<li>Explore related UX deliverables like personas, mockups, and research findings via hyperlinks to them</li>
</ul>
<p>Note the summary rows near the bottom of the example in Figure 1. Those values can help you prioritize new and existing stories based on various UX factors.</p>
<h3>Reduce design overhead</h3>
<p>Perhaps my experience is unusual, but even when I’ve worked on teams as small as seven people, we still had trouble identifying redundant user stories or personas. My heuristic is that if a story shares several personas with another story in a multi-user system, then that story may be a duplicate. Grouping by themes can also help here.</p>
<p>Another useful heuristic is that if a persona shares a large list of user stories with another persona, it’s likely the personas should be merged. Most of the time personas that do the exact same things with a product can use the same design, unless of course they have very different skills or something, which becomes evident when reviewing the personas or conducting user research (which all good personas are based on in my view).</p>
<h3>Facilitate collaboration</h3>
<pullquote>The UX Integration Matrix helps teams integrate UX best practices and user-centered design by inserting UX at every level of the agile process.</pullquote>
<p>Another major benefit of the <abbr title="User Experience Integration">UXI</abbr> Matrix format is you can share it with remote team members.</p>
<p>Listing assigned staff provides visibility into who’s doing what (see the columns under the heading Staffing). Team members can figure out who’s working on related stories and check on what’s complete, especially if you create a hyperlink to the design or research materials right there in the matrix.</p>
<p>For example, if there&#8217;s a Y in the Design Complete column, you can click the hyperlink  on Y to review the design mockup. I’ve worked with teams who like to track review states here: work in progress (WIP), draft (D), reviewed ( R ), etc. (instead of just Y or N).</p>
<h3>Track user involvement and other UX metrics</h3>
<p>The UX Integration Matrix also helps track and share key UX metrics. One key metric to track is team contact with real end users. For example, if you’ve talked to real users to validate a persona, how many did you speak with? Another good metric is, how many users have been involved in testing the design (via usability tests, A/B tests, or otherwise)?</p>
<p>You can also capture objective, quantitative UX metrics like task completion rates, click/conversion rates, and satisfaction rates by persona. It makes it easier to convince the team to revisit previous designs when metrics show users cannot use a proposed design, or are unsatisfied with the current product or service. It can also be useful to track satisfaction by user story (or story specific stats from multivariate testing) in a column right next to the story.</p>
<h3>Review UX metrics during sprint retrospectives</h3>
<p>Scrum-style reviews and retrospectives are critical to improving both the design and team performance. However, few teams consider UX metrics as part of the retrospective. During these meetings, it’s helpful to have UX metrics next to the stories you are reviewing with the team.</p>
<p>I ask the team to answer these UX-related questions during the retrospective:</p>
<ol>
<li>Did we meet our UX goals for the sprint?
<ol style="list-type: alpha;">
<li>Does our user research show that what we built is useful and usable?</li>
<li>Are users satisfied with the new functionality (new stories)?</li>
<li>Are users likely to promote our product or service (overall) to others?</li>
<li>Do we have product usage metrics (via site analytics) that meet our expectations?</li>
</ol>
</li>
<li>Is there existing functionality (stories) that need to be refined before we add new stuff?</li>
<li>What user research should we do to prioritize stories going forward?</li>
<li>Do we have enough staff with UX skills to meet our objectives?</li>
<li>Going forward should we:
<ol style="list-type: alpha;">
<li>Work a sprint ahead to ensure we validate UX assumptions?</li>
<li>Do a spike to refine a critical part of the UX?</li>
<li>Refocus UX work on select user stories or personas?</li>
<li>Improve our feedback mechanisms to capture factors we are missing today?</li>
</ol>
</li>
</ol>
<p><illustration><br />
<img src="http://www-boxesandarrows-com.zippykid.netdna-cdn.com/files/banda/integrating-ux-into/uxi-matrix-example-annotated.png" alt="Annotated example" title="Annotated example" style="max-width:100%"/></p>
<p>Figure 2: The UX Integration Matrix inserts key user experience activities and context adjacent to user stories into the product backlog.</p>
<p></illustration></p>
<h2>Improving your team&#8217;s design decisions</h2>
<p>Once you start tracking in the UX Integration Matrix it becomes easier to have informed discussions during reviews and retrospectives. I use the <abbr title="User Experience Integration">UXI</abbr> Matrix to set UX goals with the team, help prioritize stories in the backlog, track UX work in progress, and to help answer the classic agile problem “what does done mean”; not just for the entire product or service, but for individual stories.</p>
<p>I’d be curious to hear from others who would like to share their experiences with variations of the above or similar methods. On the other hand, if you’re an agile guy that thinks this all is very non-agile, I’ll ask “can you really prove your method creates a better UX without this stuff?”</p>
<p><related-links title="UX Integration Matrix template"></p>
<p>Start using the <abbr title="User Experience Integration">UXI</abbr> Matrix in your next sprint. Download and customize this Excel template to get started:</p>
<ul>
<li><a href="http://www.uxinnovation.com/wordpress/wp-content/uploads/2011/12/uxi-matrix-template.xls">UX Integration Matrix template</a> (33kb Microsoft Excel .xls file)</li>
</ul>
<p></related-links></p>
<p><footnotes></p>
<p><a name="footnote1">[1]</a> Larman, Craig. <em>Agile and Iterative Development: A Manager’s Guide</em>. Pearson Education, 2004.</p>
<p><a name="footnote2">[2]</a> Sutherland, Jeff. <a href="http://www.scrumalliance.org/resources/35">&#8220;Agile Development: Lessons learned from the first scrum&#8221;</a>. Cutter Agile Project Management Advisory Service, Executive Update, Vol. 5, No. 20, 2004:  <a href="http://www.scrumalliance.org/resources/35">http://www.scrumalliance.org/resources/35</a>.</p>
<p><a name="footnote3">[3]</a> Cagan, Martin. <em>Inspired: How To Create Products Customers Love</em>. SVPG Press, 2010.</p>
<p><a name="footnote4">[4]</a> Cohn, Mike. <em>User Stories Applied: For Agile Software Development</em>. Addison-Wesley Professional, 2004.</p>
<p><a name="footnote5">[5]</a> Cockburn, Alistair. <em>Agile Software Development</em>. Addison-Wesley Professional, 2001.</p>
<p><a name="footnote6">[6]</a> Patton, Jeff; &#8220;It’s All In How You Slice It&#8221;, Better Software, January 2005: <a href="http://www.agileproductdesign.com/writing/how_you_slice_it.pdf">http://www.agileproductdesign.com/writing/how_you_slice_it.pdf</a>.</p>
]]></content:encoded>
			<wfw:commentRss>http://boxesandarrows.com/integrating-ux-into-the-product-backlog/feed/</wfw:commentRss>
		<slash:comments>27</slash:comments>
		</item>
		<item>
		<title>Case study of agile and UCD working together</title>
		<link>http://boxesandarrows.com/case-study-of-agile-and-ucd-working-together/</link>
		<comments>http://boxesandarrows.com/case-study-of-agile-and-ucd-working-together/#comments</comments>
		<pubDate>Wed, 31 Mar 2010 05:43:38 +0000</pubDate>
		<dc:creator>James Kelway</dc:creator>
				<category><![CDATA[Case Studies]]></category>
		<category><![CDATA[Learning From Others]]></category>
		<category><![CDATA[Methods]]></category>
		<category><![CDATA[Process and Methods]]></category>
		<category><![CDATA[Special topic: Agile/Lean UX]]></category>
		<category><![CDATA[Usercentric]]></category>

		<guid isPermaLink="false">http://boxesandarrows.com/case-study-of-agile-and-ucd-working-together/</guid>
		<description><![CDATA[How does Agile work effectively when redesigning a site? James Kelway uses case studies as starting points to explore how Agile and UCD can work together during wholesale redesigns.]]></description>
				<content:encoded><![CDATA[<p>Large scale websites require groups of specialists to design and develop a product that will be a commercial success. To develop a completely new site requires several teams to collaborate and this can be difficult. Particularly as different teams may be working with different methods.</p>
<p>This case study shows how the ComputerWeekly user experience team integrated with an agile development group. It&rsquo;s important to note the methods we used  do not guarantee getting the job done. People make or break any project. Finding and retaining good people is the most important ingredient for success.<br />
</p>
<h3>The brief</h3>
<p>In 2008, we were tasked with resurrecting a tired, old, and ineffective site. It was badly out of date, and the information architecture was decrepit to both users and search engines.</p>
<p><img width="450" height="323" src="http://www-boxesandarrows-com.zippykid.netdna-cdn.com/files/banda/case-study-of-agile/cw_screen_old.jpg" alt="The old computerweekly.com" title="The old computerweekly.com" /></p>
<p>Our goals were:</p>
<ol>
<li>Make content visible and easy to find</li>
<li>Create an enjoyable and valuable user experience so users would return</li>
<li>Increase page impressions to bring in ad revenue</li>
<li>Allow site staff to present more rich media content</li>
<li>Give the site more personality and interactivity</li>
</ol>
<p>The UX team created personas from ethnographic studies, online surveys, and in-depth interviews with users. The data gave us a clear idea of the user&rsquo;s needs and wants. We also gleaned data from analytics that told us where users engaged and where the bounce rates were highest.</p>
<p>At this point the development team maintained the site with an agile process.  They created features for the new site in parallel to ongoing site maintenance, but this work was outside the normal maintenance sprints. The new site was considered as an entirely new project with a separate budget and scheduled into longer term.<br />
</p>
<h3>Boundary Spanner</h3>
<p>As the User Experience team gathered data key team members were recruited. The diagram below shows the key team members needed to produce this large scale site, their specific concerns, and their methodologies.</p>
<p><img src="http://www-boxesandarrows-com.zippykid.netdna-cdn.com/files/banda/case-study-of-agile/boundary-spanner.jpg" width="573" height="527" alt="Boundary Spanner" title="Boundary Spanner"/></p>
<p>To bring these teams and disparate elements together requires a launch manager or &lsquo;boundary spanner&rsquo;. Rizal Sebastian wrote about boundary spanners in Design Issues in 2005<sup><a href="#fn1">1</a></sup>. The boundary spanner needs to be aware of the individual issues the project faces. He need not know the detail but needs to know the cultural context of the collaborative environment.</p>
<p>Do people get on with each other? Are communication lines clear? Are there any personality clashes on the team. To throw developers, interface designers, business analysts, <span class="caps">SEO</span> experts, and usability guys together and expect them all to gel is optimistic but unlikely. It also requires those people devote all their time to just one project and that is unrealistic for a large operation where several projects are underway simultaneously.</p>
<p>They are more than a project manager because the user&mdash; and not the project&mdash;is at the heart of their concerns. He is responsible for delivering and continually developing a quality product. He is not just monitoring the features on a checklist. The user is at the center of all decisions on the design and development of the site. This is the only way you can ensure the user will be heard throughout product development &ndash; to employ somebody who listens to user voices and never forgets what they said. They must also ensure that <span class="caps">SEO</span>&nbsp;and business requirements are satisfied, and a well-defined strategy is in place. The boundary spanner owns and clearly communicates the vision until the whole team understands.</p>
<p>The boundary spanner&rsquo;s strength is that they are core to the product and not a department or team known for their skillset (like a UX team for example). In many cases it is a product manager, but in this case it was the website editor who was responsible for synchronizing the teams.<br />
</p>
<h3>Defining a process</h3>
<p>To assist this user focused approach, the IAs produced set of deliverables that ensured the launch manager&rsquo;s vision could be realized and developed.</p>
<p><img src="http://www-boxesandarrows-com.zippykid.netdna-cdn.com/files/banda/case-study-of-agile/definingaprocess_agile.jpg" width="580" height="378" alt="Defining a process" title="Defining a process"/></p>
<p>Diagramming the process using a concept model engaged key stakeholders with the project by communicating the vision of what the UX team would achieve with the speed and clarity of an elevator pitch.<br />
</p>
<h3>Information gathering</h3>
<p>A content audit revealed broken links, redundant content, and poor usability plagued the site. It also revealed how much content became lost the second it moved from the home page. The high value research papers were impossible to find.</p>
<p>30 interviews, 20 ethnographic studies, and 950 responses to an online survey. created six personas. With the content audit, personas, and business objectives (what we wanted them to do on our site), we began creating the taxonomy.<br />
</p>
<h3>Analytics</h3>
<p>During this project we were very fortunate to work alongside the web analytics manager who provided insight into user behavior, including high bounce rates from visitors arriving from search engines. He also provided a scorecard that showed where the site failed in terms of traffic and user engagement. We knew what users were searching for, and pretty quickly could tell why they were not finding content we knew we had.</p>
<p><img src="http://www-boxesandarrows-com.zippykid.netdna-cdn.com/files/banda/case-study-of-agile/analytics.jpg" width="450" height="338" alt="Analytics screen showing overlay on the new website" title="Analytics screen showing overlay on the new website"/></p>
<p>By looking at web metrics we were understood usage patterns and popular and unpopular areas of the site. The depth of information enabled us to quickly formulate a plan.<br />
</p>
<h3>Persona driven taxonomy</h3>
<p>As we knew our user base were industry experts, we also knew their vocabulary was related to specific areas of their markets.</p>
<p>The taxonomy was created by gathering as many industry sources (websites, journals, white papers), breaking these down into unique elements, and clustering these elements together to form categories for our content.</p>
<p><img src="http://www-boxesandarrows-com.zippykid.netdna-cdn.com/files/banda/case-study-of-agile/teragram.jpg" width="450" height="397" alt="The interface used to manage the CW taxonomy" title="The interface used to manage the CW taxonomy"/></p>
<p>The CW taxonomy formed the basis of the navigation, content categorization, and highlighted areas for future development. It also ensured our search results served up related content in context.</p>
<p><img src="http://www-boxesandarrows-com.zippykid.netdna-cdn.com/files/banda/case-study-of-agile/zibb-search-results.jpg" width="450" height="361" alt="Search results displayed contextual related content" title="Search results displayed contextual related content"/></p>
<p>We defined four main areas by looking at the community of users.</p>
<p><img src="http://www-boxesandarrows-com.zippykid.netdna-cdn.com/files/banda/case-study-of-agile/CW_concept.jpg" width="450" height="338" alt="ComputerWeekly Concept" title="ComputerWeekly Concept"/></p>
<p>News was an obvious requirement, defined by their particular area of interest within the sector. The need for knowledge was evident, and we created an in-depth research area where case studies and white papers could be easily accessed. Tools and services, <span class="caps">RSS</span>, email news alerts, and newsletters reflected user needs to be kept up to date and in tune with their specialization.</p>
<p>Finally, although the CW community was secretive and did not divulge information amongst their peers, they were very interested in expert opinions. This need gave rise to much more integrated blog postings.<br />
</p>
<h3>Interface development</h3>
<p>The navigation scheme defined the elements of the page the users would use to move to other areas in the site. It clarified the naming of those items on the page.</p>
<p><img src="http://www-boxesandarrows-com.zippykid.netdna-cdn.com/files/banda/case-study-of-agile/sitemap.jpg" width="450" height="360" alt="Sitemap" title="Sitemap"/></p>
<p>We then considered the prioritization of information and content for each page, and this facilitated the production of wireframes that represented the culmination of all research, showed the interface and interactions for elements on the page, and were a working document that changed as we iterated the design.<br />
</p>
<h3>Core and Paths</h3>
<p>We used Are Halland&rsquo;s method for &lsquo;designing findability inside out.&rsquo;<sup><a href="#fn2">2</a></sup></p>
<ul>
<li>Prioritize and design the core &ndash; Satisfy user goals using prioritized content and functionality.</li>
<li>Design inward paths to the core &ndash; Consider how users will arrive at the page from search engine results, facets, menus, search, <span class="caps">RSS</span>, aggregation, email, etc.</li>
<li>Offer relevant outward paths from the core &ndash; Ensure that the site delivers both user and business goals through clear calls to action and completion of interaction tasks.</li>
</ul>
<p><img src="http://www-boxesandarrows-com.zippykid.netdna-cdn.com/files/banda/case-study-of-agile/corepaths.jpg" width="450" height="325" alt="" title=""/></p>
<p>For CW.com, we focused on the cores for the home page, a channel level homepage, and a news article page and looked at key content such as lead news story and the editor&rsquo;s picks or the best from the web aggregated from external sources. The key functionality and supporting content also had to be included and prioritized on the page. </p>
<p><img src="http://www-boxesandarrows-com.zippykid.netdna-cdn.com/files/banda/case-study-of-agile/core.jpg" width="450" height="290" alt="" title=""/></p>
<p>Next we considered the inward paths, which are the channels that our users are likely to utilize to arrive at the page.</p>
<p><img src="http://www-boxesandarrows-com.zippykid.netdna-cdn.com/files/banda/case-study-of-agile/inward.jpg" width="450" height="290" alt="Inward paths" title="Inward paths"/></p>
<p>Inward paths included search engines, blogs, bookmarks, syndication, aggregators, <span class="caps">RSS</span>, and email subscriptions. Considering inward paths helped us focus on the marketing channels we needed to drive users to the relevant type of page. It also focused on the keywords and themes that users are likely to use and helped us optimize pages for search and online marketing campaigns.</p>
<p>Finally we designed the outward paths that helped users complete online tasks for our business objectives.</p>
<p><img src="http://www-boxesandarrows-com.zippykid.netdna-cdn.com/files/banda/case-study-of-agile/outward.jpg" width="450" height="448" alt="Outward paths" title="Outward paths"/></p>
<p>These outward paths include:</p>
<ul>
<li>Newsletter sign-up</li>
<li>Inline links to related articles to drive page consumption</li>
<li>Sharing, printing or emailing of news articles</li>
<li>Related content types such as video or audio</li>
<li>Stimulating community participation in forums or blogs</li>
<li>Contextual navigation to aggregated content or the editors best bets</li>
<li>Subscription to an <span class="caps">RSS</span> feed</li>
<li>Prioritizing the content</li>
</ul>
<p><img src="http://www-boxesandarrows-com.zippykid.netdna-cdn.com/files/banda/case-study-of-agile/annotation.jpg" width="450" height="437" alt="Prioritizing the Content" title="Prioritizing the Content"/>￼</p>
<p>Once the wireframes had been approved, the content was organized so the most commercially valuable and user focused content was pushed to the top of the page. As the design went through user testing, certain elements changed, as with any iterative process, but through team collaboration, the solution remained true to the initial vision from concept to design delivery.<br />
</p>
<h3>The development cycle</h3>
<p>The wireframes were handed over to creative, and they began designing the interface and graphic elements. The development group released some functional elements to the old website before the relaunch.</p>
<p><img src="http://www-boxesandarrows-com.zippykid.netdna-cdn.com/files/banda/case-study-of-agile/WIDGET.jpg" width="486" height="198" alt="Widget" title="Widget"/></p>
<p>These agile methods allowed the old site to feel the benefits of the new widgets. However, as the site changed so radically in the new design, we still had to release the site in an old style &lsquo;big-bang&rsquo; manner. This is perhaps where agile has its problems as a methodology for new launches. It&rsquo;s focus on many small releases is a great tool to implement incremental changes but not for a completely new site.</p>
<p>As the html flat pages were passed to the team, the <span class="caps">SEO</span> requirements were defined and built into the site. By the time the site launched it, had been through four major pieces of testing.</p>
<p><img src="http://www-boxesandarrows-com.zippykid.netdna-cdn.com/files/banda/case-study-of-agile/devotimeline.jpg" width="650" height="488" alt="Development Timeline" title="Development Timeline"/></p>
<p></p>
<h3>A holistic solution</h3>
<p>Providing user experience deliverables like the concept map and wireframes ensured more comprehensive requirements were delivered to the design and development team. This approach addressed marketing, editorial, sales, and business requirements next to the needs and wants of the user. The vision was aligned with an achievable delivery from the IT team that ensured we delivered the site we wanted to give the user.</p>
<p><img src="http://www-boxesandarrows-com.zippykid.netdna-cdn.com/files/banda/case-study-of-agile/cw_screen_new.jpg" width="450" height="259" alt="The new computerweekly.com" title="The new computerweekly.com"/></p>
<p>The core IA work enabled the new site to be future-focused and versatile. The structure and design of good sites should be able to adapt to change.</p>
<p>User-centered design and agile can work alongside each other but what is more important is having people who can tie all the loose strands of a website design and development cycle together. The concept map, wireframes and the IA strategy document that listed the rationale behind the design decisions helped ensure the product vision was correctly communicated to the development team, so the product that was developed through their agile processes was in line with the overall product vision.</p>
<p id="fn1"><sup>1</sup><a href="http://www.mitpressjournals.org/doi/abs/10.1162/0747936053103020? cookieSet=1&#038;journalCode=desi">http://www.mitpressjournals.org/doi/abs/10.1162/0747936053103020? cookieSet=1&#038;journalCode=desi</a></p>
<p id="fn2"><sup>2</sup><a href="http://www.slideshare.net/aregh/core-and-paths-designing-findability-from-the-inside-and-out">http://www.slideshare.net/aregh/core-and-paths-designing-findability-from-the-inside-and-out</a></p>
]]></content:encoded>
			<wfw:commentRss>http://boxesandarrows.com/case-study-of-agile-and-ucd-working-together/feed/</wfw:commentRss>
		<slash:comments>14</slash:comments>
		</item>
		<item>
		<title>Bringing User Centered Design to the Agile Environment</title>
		<link>http://boxesandarrows.com/bringing-user-centered-design-to-the-agile-environment/</link>
		<comments>http://boxesandarrows.com/bringing-user-centered-design-to-the-agile-environment/#comments</comments>
		<pubDate>Mon, 01 Feb 2010 07:37:08 +0000</pubDate>
		<dc:creator>Anthony Colfelt</dc:creator>
				<category><![CDATA[Methods]]></category>
		<category><![CDATA[Process and Methods]]></category>
		<category><![CDATA[Special topic: Agile/Lean UX]]></category>
		<category><![CDATA[Usercentric]]></category>

		<guid isPermaLink="false">http://boxesandarrows.com/bringing-user-centered-design-to-the-agile-environment/</guid>
		<description><![CDATA[Anthony Colfelt is not anti-Agile, but he believes strongly about how user-centered design can operate in an Agile environment. Here he explains how he came to feel this way, the major pitfalls of Agile, and how he sees Agile and UCD fitting together in harmony.]]></description>
				<content:encoded><![CDATA[<p>When the exciting opportunity to work in a post-bubble dot.com startup arose, I jumped to take it. I had the luxury of doing things exactly as I thought right, and for a while it was truly fantastic. I built a team with a dedicated user researcher; information architect; interaction and visual designers and we even made a guerilla usability lab and had regular test sessions.</p>
<p>Unfortunately, the enthusiasm I had for my new job waned after six months when an executive was appointed Head of Product Development &#8212; who insisted he knew SCRUM<sup>1</sup> better than anybody. As the Creative Director, I deferred authority to him to develop the product as he saw fit. I had worked with SCRUM before, done training with Ken Schwaber (author<sup>1</sup> and co-founder of the Agile Alliance) and knew a few things from experience about how to achieve some success integrating a design team within SCRUM. This required the design team to work a &#8220;Sprint&#8221; (month long iteration) ahead of the development team. But the new executive insisted that SCRUM had to be done by-the-book. Which meant, <i>all</i> activities had to be included within the same sprint, including design.</p>
<p>Requirements came from the imagination of the Head of Product Development; design was rushed and ill-conceived as a result of time pressure; development was equally rushed and hacked together, or worse, unfinished. The end of Sprint debriefing meetings reliably consisted of a dressing down of the entire team by the executives (since nobody had delivered what they&#8217;d committed to i.e. they had tried to do too much, or had not done enough). Each Sprint consisted of trying to fix the mess from the Sprint before or brushing it under the carpet and developing something unstable atop the code-garbage. Morale languished, the product stank, good staff began to leave&hellip; it was horrible.</p>
<p>This is an extreme example of where SCRUM went bad. I am not anti-Agile although I&#8217;ve been bitten a few times and feel trepidation when I hear someone singing its praises without having much experience with it. Over the last eight years, I&#8217;ve seen Agile badly implemented far more often than well (and yes, it can be done well, too). The result of this is mediocre product released in as much time as it would have taken a good team to release great product using a waterfall approach. In this article, I will describe Agile and attempt to illuminate a potential minefield for those who are swept up in the fervor of this development trend and want to jump in headlong. Then I will present how practices within User Centred Design (UCD) can mitigate the inherent risks of Agile and how these may be integrated within Agile development approaches.<br />
</p>
<h3>Where did Agile come from?</h3>
<p>Envisioned by a group of developers, Agile is an iterative development approach that takes small steps toward defining a product or service. At the end of each step, we have something built that we could release to the market if we choose to and therefore it can assure some speed to market where waterfall methods usually fail. Agile prefers to work out how to build something as we go, rather than do a waterfall style deep dive into specification and then finding out we can&#8217;t build parts of the spec for some reason e.g. a misjudgment of feasibility, misjudgment of time to build, or changing requirements.</p>
<p>A group of developers such as Kent Beck, Martin Fowler and Ken Schwaber got together to come up with a way to synthesize what they had discovered was the most effective ways to develop software &#8211; The Agile Alliance was born. It released a manifesto<sup>2</sup> to describe its tenets and how it differs from waterfall methods.</p>
<p>Agile can be thought of as a risk-management strategy. Often developers are approached directly by a client who does not know what a user experience designer, information architect or user interface designer is. Roles such as these usually interpret what clients want and translate it to some kind of specification for developers. Without this role, it&#8217;s down to the developer to work out and build what the customer wants. Because Agile requires a lot of engagement with the client (i.e. at the end of every iteration, which can be as little as a week) it mitigates the risk of going too far toward creating something the client doesn&#8217;t want. As such, it is a coping mechanism for a client&#8217;s shifting requirements during development as they begin to articulate what they want. To quote the Agile Manifesto&rsquo;s principles &ldquo;Welcome changing requirements, even late in development. Agile processes harness change for the customer&#8217;s competitive advantage.<br />
</p>
<h3>Why do people rave about it?</h3>
<p>At the heart of what makes Agile attractive is the possibility of quicker return on investment for development effort, because we can release software earlier than we would have otherwise. In the short term, this is typically borne out. In the long term it can be too, though only when the team hasn&#8217;t fallen victim to temptation (more on that later). &nbsp;Agile is also good at generating momentum because the iterations act as a drumbeat to which the team marches toward manageable deadlines. The regular &quot;push&quot; to finish a sprint ensures that things move along swiftly. Agile is also good at avoiding feature bloat by encouraging developers to do only what is necessary to meet requirements.</p>
<p>Because it emphasizes face to face contact for a multidisciplinary team, Agile tends to encourage contribution from different perspectives. This is generally a positive influence on, pragmatism, innovation and speed of issue resolution. The team is empowered to make decisions as to how requirements should best be met.<br />
</p>
<h3>The Minefield</h3>
<p>In of itself, Agile does a good job of flexing to the winds of change. But one has to ask whether it was devised to treat a symptom of the larger cause: the business doesn&#8217;t know what it wants. While Agile enables the development team to better cope with this, it doesn&rsquo;t solve the problem and in most cases creates new problems.<br />
</p>
<h4>Mine 1: An unclear role for design</h4>
<p>In the best cases of business approaching developers to build some software, some of those developers may have design skills. But that&#8217;s not a particularly common scenario. Many developers have also had bad experiences with designers who don&rsquo;t know what they&rsquo;re doing. It took a long time for the design profession to come to grips with designing for complex systems and there is still a deficit of expertise in this field. &#8220;Business people and developers must work together daily throughout the project&#8221; is another principle of Agile. Where does the designer fit into the frame?<br />
</p>
<h4>Mine 2: The requirements gathering process is not defined</h4>
<p>Agile accommodates design activities from the perspective of a developer. It tends to shoe-horn these activities into their view of the world where requirements fall from the sky (from the business or customer who is assumed to be all-knowing) and takes for granted that they are appropriate.<br />
<br />
According to Ken Schwaber, SCRUM intends to be a holistic management methodology and leaves space for activities other than programming to occur within the framework of iterative cycles. But when organizations adopt SCRUM, too often the good parts of a waterfall process like research and forming a high-level blueprint for the overall design become the proverbial baby thrown out with the documentation bathwater. As the Agile Manifesto says, &#8220;Working software over comprehensive documentation.&#8221;<sup>2</sup> Many latch onto this and don&#8217;t want to do any type of documentation that might outline a vision, even if in a rudimentary sense.<br />
</p>
<h4>Mine 3: Pressure to cut corners</h4>
<p>Implementations of Agile that put design activities within the same iteration as they must be developed, ensure designs are achievable in code. But they also put tremendous pressure on the experience design team to &#8216;feed the development machine&#8217; in time enough for them to implement their vision. This can and does lead to impulsive design. So, what&#8217;s wrong with that? Well, nothing if you&#8217;re not adhering to user centric principles which suggest you should test ideas with end users before committing them to code.</p>
<p>Some assert that there are plenty of examples of best-practice interfaces to copy out there. So, why reinvent the wheel? Surely we can save time that way? Sometimes they&#8217;re right, but how will we know which best-practice interface works best in context with the user&#8217;s goals, with no time to test with the user? How can we innovate by copying what already exists? Before Google reinvented internet search, other search engines assumed a status quo which behooved the user to learn how to form proper search queries. It was institutional knowledge among the other search engines that this is how searching was done and customers simply had to learn to use it. Most people&#8217;s search results were poor at best. Then Google came along and realized what is now obvious. People just want to find what they&#8217;re looking for, not learn how to drive a search engine first. I&#8217;m not suggesting the other search engines could not have done what Google did sooner, but I am pointing the finger at a mentality which meant they missed the opportunity. Interestingly, Google is not known for its designers. It&#8217;s mainly a development house, but lots of those developers can clearly put a design hat on too.</p>
<p>There is absolutely nothing wrong with using Agile to produce results quickly; that is, if you don&#8217;t intend to release them on your poor, unsuspecting user without some usability testing. Just don&#8217;t be fooled that this is going to save you a lot of time if you want your new product to be right, because you will have to iterate to arrive at an appropriate solution. Alan Cooper has argued that this creates a kind of &lsquo;scar tissue&rsquo; where code that has to be changed or modified leaves a &#8216;scar&#8217; that makes the foundations of the program unsound.<sup>4</sup><br />
</p>
<h4>Mine 4: The temptation to call it &#8220;good enough&#8221;</h4>
<p>Invariably when we have release-ready working code at the end of each cycle, even if it&#8217;s sub-optimal, there&#8217;s a strong temptation to release it because we can. Agile condones releasing whatever we have so long as it works. Sometimes, that means doing what we can get away with, not what is ultimately best for the user. Equally, if we do decide that a feature isn&#8217;t right yet, it&#8217;s amendments get fed back into the requirements backlog where temptation strikes again. Should we spend time in our next iteration on a feature that we&#8217;ve already got a version of? Or shall we develop something new instead? Too often, the rework gets left in favor of exciting new stuff. An so on we go building a product full of features that don&#8217;t quite meet the bar.<br />
</p>
<div style="text-align: left;" id="l5ge"><img height="486" width="648" src="http://www-boxesandarrows-com.zippykid.netdna-cdn.com/files/banda/interaction-design/typical_agile.gif" alt="Typical Agile Development" /></div>
<h4>Mine 5: Insufficient risk-free conceptual exploration time</h4>
<p>Iteration &#8220;zero&#8221; (i.e. a planning and design iteration prior to the first development iteration) can be used to do this and other planning activities. However, depending on how long this iteration is, the level of rigor applied to exploration may be insufficient. An argument used by some Agile practitioners asserts that a working example of a solution is the best way to validate whether it is the right one through exposure to the market. This &#8216;suck it and see&#8217; approach bypasses an activity called &#8220;concepting.&#8221; Concept activities dedicate time to sketching different solutions at a high level and validating them in the rough with users before digging into detailed design or code. &#8220;Suck it and see&#8221; would have us just build it, launch it and see if it flies. This way, we&#8217;ve wasted time building something we will probably have to take apart or rebuild. The counter argument is: if it took as long to build as it would have to research and design before laying a line of code, then we break even. This statement is a stretch in practice because development itself usually does take longer than well-managed design research and conceptual exploration. Also, there has to be some level of design regardless&nbsp; of which methodology is used, and this adds days to the timeline.<br />
</p>
<h4>Mine 6: Brand Damage</h4>
<p>Let&#8217;s just say that design and research takes the same amount of time as development for argument&#8217;s sake. In the worst case, we completely miss the mark with the non-researched and designed solution and we have to start all over again. Then we&#8217;re back to the same total duration after developing it a second time, but there&#8217;s no guarantee we&#8217;ll get the solution right the second time either. All the while we&#8217;ve repeatedly foisted a botched product design on our users and adversely affected our brand. Many companies succeed on the back of their reputation for producing consistently appropriate products and services. When a company releases a flawed product or service, then their image in the customers mind (i.e. brand) is tarnished. Brand damage takes far longer to mend than it does to make. Software creators that fall victim to the temptation of &quot;good enough&quot; and fail to innovate through conceptual exploration put their companies revenues at risk. In a competitive market, repeated failure to meet user needs well leads to serious brand and subsequently financial repercussions, as other companies who do get it right take the business.<br />
</p>
<h3>Agile is good for refining, not defining.</h3>
<p>If you have an existing product that you want to develop to the next level, then Agile in its truest sense works because you have a base upon which to improve. This means that if you know what your requirements are and these have been properly informed with user research, comparative analysis, business objectives, and analysis of what content you have and what you can technically achieve, then Agile alone can work well.</p>
<p>But spending money on software development without a plan of what to build is like asking a construction crew to erect a tower with no blueprint. Some level of plan is necessary to avoid a Frankenstein of each individual&rsquo;s perspective on the best design solution.<br />
</p>
<h3>User Centered Design</h3>
<p>UCD requires iteration &#8211; design, test with users, refine, test with users again, refine&#8230; repeat till it&#8217;s right. This is where Agile and UCD can work brilliantly together. Agile really is about presuming you&#8217;ll need to change things, and that&#8217;s a good thing when it comes to refinement.<br />
</p>
<h4>Uncovering requirements to form a strategy</h4>
<p>User Centered Design (UCD) is not about answering requirements alone, but also includes defining requirements. When we practice UCD end-to-end, we pretend we know little. Little about what the solution to a problem should be; little about what the problem actually is because assumptions close us off to new possibilities. We prefer to allow some design research to create a viewpoint and then form a hypothesis as to what we might build. In this regard, we cross into the realm of product managers, producers, program managers, business analysts and the like, trampling toes with gay abandon and meeting resistance all around. Facing confinement to defining the boring old business need (distinct from the user or customer need), these folks would prefer we constrain our UCD work to usability testing on designs meeting the requirements they set out. They&#8217;d prefer we stick to just helping with development&#8230; and if we can do that quicker using Agile? Wahey!<br />
</p>
<div><img height="486" width="648" alt="Typical UCD Waterfall" src="http://www-boxesandarrows-com.zippykid.netdna-cdn.com/files/banda/interaction-design/typical_ucd.gif" /></div>
<p>Is it always appropriate to do extensive research before starting design? That&#8217;s a good question and one that Jared Spool&#8217;s Market Maturity Framework<sup>5</sup>&nbsp;helps answer. Sometimes, just getting something off the ground, regardless of how precisely we meet user&#8217;s needs with it is all we can afford to do. Once we graduate out of this &quot;Raw Iron&quot; stage into &quot;Checklist Battles&quot; focused on getting the right features and then beyond, research is a core ingredient to putting our feet in the right place.</p>
<p>After researching what the user and business requires, we can make the &#8220;Strategy&#8221; tier of Jesse James Garret&#8217;s Elements of User Experience<sup>3</sup>which underpins everything we do during the project. Do this well, and you really shouldn&#8217;t come up with something that&#8217;s fundamentally wrong. Agile doesn&#8217;t account for this beyond a planning phase (i.e. iteration zero), which may well define a strategy of sorts. But does it really define the correct strategy? Surely, that&#8217;s created through careful consideration of three things:</p>
<ol>
<li>Empathetic qualitative research that uncovers the user&#8217;s context, needs, goals and attitudes i.e. user requirements. Cooper suggests that the customer doesn&rsquo;t know what they want and advocates a role of interaction designer as requirements planner.<sup>4</sup> This would avert building to the wrong requirements in the first place, but the time to do this must come into the development lifecycle somewhere. It involves talking to users, preferably visiting with them in their environments to create experience models and user personas.</li>
<li>A thorough appreciation of what else in the big wide world exists in terms of products, features and technology that can be emulated somehow (not necessarily addressing a similar situation to ours).</li>
<li>A clear articulation of the business problem, objectives, success measures and constraints. Business people sat in a room discussing what they think should be done must be informed by all these things if the right strategy is to emerge. Agile doesn&#8217;t preclude that kind of consideration, but it does not mandate it either.</li>
</ol>
<p></p>
<div style="text-align: left;" id="ke2j"><img height="486" width="648" src="http://www-boxesandarrows-com.zippykid.netdna-cdn.com/files/banda/interaction-design/jjg_elements.gif" alt="JJG's Element of UE" /></div>
<p></p>
<h4>Concept Development</h4>
<p>If we manage to built something usable and reasonably intuitive without research or strategy, did we succeed? Most MP3 players fit this bill but none took off like the Apple iPod. Leaving interface usability aside, the iPod had a service concept behind it which included digitizing, replenishing and managing your entire music library with iTunes. This was part of the iPod concept from the outset and in combination with good marketing and design, continues to eclipse the competition over seven years later. But that concept needed to be sketched and iterated at some point. If we don&#8217;t explicitly build this into our Agile methodology, we can miss that thinking time.</p>
<div style="text-align: left;" id="sj0e"><img height="486" width="648" alt="Holistic Design Concept" src="http://www-boxesandarrows-com.zippykid.netdna-cdn.com/files/banda/interaction-design/holistic_concept.gif" /></div>
<p></p>
<h3>The best of both worlds</h3>
<p>UCD can be too documentation-heavy, isolated and risky but Agile needs help with defining requirements and concept development. How can Agile and user centric principles work together? First let&rsquo;s understand what works well with Agile and not so well with user centered design. In this regard, the work that user centered design calls the &lsquo;design&rsquo; phase can produce buckets of documentation which isn&rsquo;t read, describing interfaces specified in isolation which may not be feasibly coded in the time allotted to them. So, doing detailed design is best done in conjunction with the development team and in a way where resulting interfaces can be tweaked as you go.&nbsp;</p></div>
<p></p>
<div style="text-align: left;" id="zbdp"><img height="486" width="648" alt="Best of Both Worlds" src="http://www-boxesandarrows-com.zippykid.netdna-cdn.com/files/banda/interaction-design/best_of_both.gif" /></div>
<p></p>
<h3>A shared vision of the interaction fundamentals</h3>
<p>In good software development, a conceptual interaction model that has been thought through beforehand, outlines how the user navigates the system, performs tasks and uses tools in generic terms, i.e. not each and every navigation label, task or tool but rather the interface and interaction patterns that will persist. This produces something rudimentary to test with users to see if we got the big picture right. Following this roadmap sketched on the back of research and concepting prior to development activity, ensures consistency and cohesiveness when each component is coded separately to each other later. In many cases, the concept will need iterating to accommodate lessons from the journey. But we&#8217;ll at least have some indication of direction at a macro scale. Then, when in the midst of Agile iterations working out the details alongside our developer brethren, a level of expertise and experience is required of the designer because what we design will be built before we&#8217;ve had a chance to second-guess ourselves. Domain knowledge and an understanding of interface paradigms that work is also a big help. But to build new projects from scratch without a shared vision is a mistake.</p>
<p>Risky interfaces that are new or significant improvements on what has been seen before, are best tackled as design-only activities in a sprint prior to when they will be developed (i.e. do involve developers, don&rsquo;t try to produce code). This circumvents the pressure to deliver something before proper thought, reflection and user testing, which ensures you&#8217;re not wasting time and effort. Sometimes most of the product will be done this way and that&#8217;s fine so long as developers and designers are still working together and talking every day. The first development iterations are an important time for the developers to lay the architectural foundations based on the vision. Designers should use this time to get a jump on any high-priority tricky interfaces so the development team isn&#8217;t waiting for something meaty to start on when it comes time to build features.</p>
<p>Most important to success, the business needs to accept that some things won&rsquo;t be right the first time around and commit to iterating them prior to release i.e. not be led into the temptation to release something that&#8217;s not right yet.</p>
<h3>Conclusion</h3>
<p>In summary, dogmatic attitudes about each of these approaches should be avoided if they are to be combined. Remember, Agile does not mandate how to define concepts or overall design direction, but it is a great way to execute on solid design research and well laid plans. UCD needs to be flexible enough to respond to the reality on the ground when the implementation team encounters issues that mandate a different design solution. Document only what is needed to get the message across and co-locate if at all possible, because cross-disciplinary collaboration and face to face communication are vital. Working a sprint ahead of the development team is helpful in allowing the design team enough time to test and iterate. If these rules of engagement are followed, the two approaches can work very well together.</p>
<p>Notes:<br />
1. <a href="http://www.amazon.com/Agile-Software-Development-Scrum/dp/0130676349">Agile Software Development with SCRUM by Ken Schwaber and Mike Beedle</a></p>
<p>2. <a href="http://agilemanifesto.org/">Manifesto for Agile Software Development</a></p>
<p>3. <a href="http://www.jjg.net/elements/">The Elements of User Experience by Jesse James Garrett</a></p>
<p>4. <a href="http://37signals.com/svn/archives2/extreme_programming_vs_interaction_design.php">Extreme Programming Vs. Interaction Design. Interview with Kent Beck and Alan Cooper</a></p>
<p>5. <a href="http://www.uie.com/brainsparks/2007/07/17/the-market-maturity-framework-is-still-important/">The Market Maturity Framework is Still Important – Jared Spool</a><br /></p>
]]></content:encoded>
			<wfw:commentRss>http://boxesandarrows.com/bringing-user-centered-design-to-the-agile-environment/feed/</wfw:commentRss>
		<slash:comments>33</slash:comments>
		</item>
		<item>
		<title>Bringing Holistic Awareness to Your Design</title>
		<link>http://boxesandarrows.com/bringing-holistic-awareness-to-your-design/</link>
		<comments>http://boxesandarrows.com/bringing-holistic-awareness-to-your-design/#comments</comments>
		<pubDate>Wed, 18 Feb 2009 23:55:14 +0000</pubDate>
		<dc:creator>Joseph Selbie</dc:creator>
				<category><![CDATA[Big Ideas]]></category>
		<category><![CDATA[Process and Methods]]></category>
		<category><![CDATA[Professionalism]]></category>
		<category><![CDATA[Special topic: Agile/Lean UX]]></category>

		<guid isPermaLink="false">http://boxesandarrows.com/bringing-holistic-awareness-to-your-design/</guid>
		<description><![CDATA[Web application design teams that have a shared understanding of a project's context and objectives produce better results. Joseph Selbie explains, and gives us tips on how to promote shared, holistic understanding in our own teams.]]></description>
				<content:encoded><![CDATA[<p>Gone, thankfully, are the days when the user experience and the user interface were an afterthought in the website design process, to be added on when programming was nearing completion. As our profession has increasingly gained importance, it also become increasingly specialized: information design, user experience design, interaction design, user research, persona development, ethnographic user research, usability testing&mdash;the list goes on and on. Increased specialization, however, doesn&rsquo;t always translate to increased user satisfaction.</p>
<p>My company conducted a best practice study to examine the development practices of in-house teams designing web applications&mdash;across multiple industries, in companies large and small. Some teams were large and highly specialized, while others were small and required a single team member to perform multiple roles. We identified and validated best practices by measuring user satisfaction levels for the applications each team had designed; the higher the user satisfaction scores for the application, the more value we attributed to the practices of the team that designed it.</p>
<p>We did not find any correlation with user satisfaction and those teams with the most specialized team members, one way or the other: some teams with the most specialization did well, and some teams did poorly. What we did consistently observe among teams that had high user satisfaction scores, was one characteristic that stood out above all the others&mdash;what we began to call shared, holistic understanding. Those teams that achieved the highest degree of shared, holistic understanding consistently designed the best web applications. The more each team member understood the business goals, the user needs, and the capabilities and limitations of the IT environment&mdash;a holistic view&mdash;the more successful the project. In contrast, the more each team member was &ldquo;siloed&rdquo; into knowing just their piece of the whole, the less successful the project.</p>
<p>All of the members of the best teams could tell us, with relative ease, the top five business goals of their application, the top five user types the application was to serve, and the top five platform capabilities and limitations they had to work within. And, when questioned more deeply, each team member revealed an appreciation and understanding of the challenges and goals of their teammates almost as well as their own.</p>
<p>The members of the teams that performed less well not only tended not to understand the application as a whole, they saw no need to understand it as a whole: programmers did not care to know about users, user researchers did not care to know about programming limitations, and stakeholders were uninvolved and were considered &ldquo;clueless&rdquo; by the rest of the development team. These are blunt assessments of unfortunate team member attitudes, but we were surprised how often we found them to be present.</p>
<p>We also observed that the best teams fell into similar organizational patterns&mdash;even though there was a blizzard of differing titles&mdash;in order to explore and understand the information derived from business, users and IT. We summarized the organization pattern in the diagram below. We chose generic/descriptive titles to simplify the picture of what we observed. In many cases there were several people composing a small team such as the &ldquo;UI Developer(s)&rdquo; or the &ldquo;User Representative(s)&rdquo; often with differing titles. Also fairly common were very small teams where the same person performed multiple roles.</p>
<p><img width="365" height="350" alt="Holistic Awareness Fig 1" src="http://www.boxesandarrows.com/files/banda/bringing-holistic/holistic-awareness-fig-1.png" /></p>
<p><em>Fig. 1 &mdash; Teams tend to organize in similar patterns in response to the information domains they need to explore and understand</em></p>
<p>Even this simplified view of the development team reveals the inherent complexity of the development process. The best team leaders managed to not only encourage and manage the flow of good information from each information domain, but they also facilitated thorough communication of quality information across all the team members regardless of their domain. Here&rsquo;s how they did it.</p>
<h3>Five Key Ways to Promote Shared, Holistic Understanding</h3>
<p><strong>1. All team members&mdash;all&mdash;conduct at least some user research</strong></p>
<p>Jared Spool once wrote that having someone conduct user research for you is like having someone take a vacation for you&mdash;it doesn&rsquo;t have the desired effect! On the best teams, everyone, from programmers to stakeholders, participate to some degree in user research. A specialist on the team often organizes and schedules the process, provides scenario scripts or other aids to the process, but everyone on the team participates in the research process and thus has direct contact with actual users. There is no substitute for direct contact with users. Interviewing living breathing users, ideally in their own home or work place, makes a deeper impression than any amount of documentation can duplicate.</p>
<p><strong>2. Team members participate in work and task flow workshops</strong></p>
<p>Designing applications to support the preferred work and task flow of the users&mdash;providing the right information, in the right features, at the right time&mdash;is one of the hallmarks of applications that get high user satisfaction scores. The best teams devote enough whiteboard-style collaborative workshop time to explore work and task flow (including in the sessions actual users when possible), until all team members truly understand all the steps, loops and potential failure paths of their users.</p>
<p><strong>3. Team members share and discuss information as a team</strong></p>
<p>A simple practice, but one which is often overlooked, is taking the time to share and discuss findings and decisions with the entire team. Too often teams communicate information of significant importance to the project through documentation alone or through hurried summaries. Even if it is not possible for the team to participate in all user research or in mapping out all work and task flow on a whiteboard together, at a minimum, the team should go through the results of these processes in sufficient detail and with sufficient time to discuss and understand what has been learned.</p>
<p>Direct participation is the most effective way to learn and understand. Full and relaxed discussion with team members is the second best. Reading documentation only is the least effective way for team members to retain and understand project information.</p>
<p><strong>4. Team members prioritize information as a team</strong></p>
<p>Not only is it important that all team members be familiar with information from all three domains (business goals, user needs, and IT capabilities), but it is especially significant that they understand the relative importance of the information&mdash;its priority.</p>
<p>My company developed what we call a &ldquo;Features and Activity Matrix&rdquo;, based on our own experience designing applications, and from the practices we observed in our study. The features and activity matrix accomplishes two things:</p>
<ol>
<li>It forces teams to translate business goals, user input and IT capabilities into specific proposed features or activities that a user would actually see and use at the interface level. We have found that if an identified user need (for example, the need to know currency conversion values) isn&rsquo;t proposed as a specific feature (say, a pop-up javascript-enabled converter, tied to a 3rd party database) then a potentially important user need either gets lost, or is too vague to design into the application.</li>
<li>The features and activities matrix allows team members to prioritize the proposed features and activities from the perspective of their own domain through a process of numeric ranking. Business ranks according to the importance to the business, IT ranks according to &ldquo;doability&rdquo; (measuring budget, resources and schedule against each proposed feature and activity), and the user representatives rank according to their assessment of what will make users most satisfied.</li>
</ol>
<p>The numeric ranking for each feature or activity, from each domain, is then averaged to arrive at a consensus prioritization of every feature and activity proposed for the application. If, as is usually the case, the team is already aware that they cannot do everything that has been requested or proposed, this is a very effective way to determine which features and activities are not going to make the cut and which ones have the highest importance.</p>
<p><br/></p>
<p><img width="740" height="323" alt="Holistic Awareness Fig 2" src="http://www.boxesandarrows.com/files/banda/bringing-holistic/holistic-awareness-fig-2.png" /></p>
<p><em>Fig.2 &mdash; Features and Activities Matrix. Note that we used a ranking scale of 1-5, 5 being the most important.</em></p>
<p><strong>5. Team members design together in collaborative workshops</strong></p>
<p>Once information from all three domains is gathered, analyzed, shared and prioritized, the remaining&mdash;and most powerful&mdash;practice to promote a shared, holistic understanding is to conduct wireframe-level, whiteboard-style, collaborative design sessions. Your session participants should include a solid representation of users, business and IT but not exceed roughly 12 people. In these workshops teams can work out together the basic layout, features and activities for most of the core screens needed for a project. These sessions can, and should, require multiple days. We have found that between 10 and 20 core screens can be considered, discussed, iterated and designed in 4-5 days of workshops.</p>
<p>Make sure everyone is fully engaged: business cannot be half committed, and IT cannot say that they will determine later if the screen can be built. All team members should be prepared to make real-time decisions in the collaborative design session. Inevitably there will be a few things that simply cannot be decided during the session, but the greater the shared, holistic understanding that already exists, the fewer things that will require processing and final decisions outside the session.</p>
<p>A well prepared collaborative design session both promotes and leverages the team&rsquo;s shared, holistic understanding of the project. Even though they are time consuming, collaborative workshops eventually save time because the team ends up needing less iterations to refine and finish the design. Collaborative workshops also insure higher quality; there are fewer missteps and errors down the line because of the shared understanding of the design. Finally, collaborative workshops create great buy-in from business and IT. It is far less likely that some&mdash;or all&mdash;of the project will undergo unexpected or last minute changes if the goals and priority of features is clearly established during the design process.</p>
<p>Whatever the size and structure of your team, and no matter how many or how few specialists it has, your outcomes will be better if everyone shares a holistic understanding of the work at hand. Taking the extra time as a team to develop a shared holistic understanding pays off in greater efficiency in the long run&mdash;and most importantly&mdash;in greater user satisfaction and overall success!</p>
]]></content:encoded>
			<wfw:commentRss>http://boxesandarrows.com/bringing-holistic-awareness-to-your-design/feed/</wfw:commentRss>
		<slash:comments>15</slash:comments>
		</item>
		<item>
		<title>Collaboration Sessions: How to Lead Multidisciplinary Teams, Generate Buy-In, and Create Unified Design Views in Compressed Timeframes</title>
		<link>http://boxesandarrows.com/collaboration-sessions-how-to-lead-multidisciplinary-teams-generate-buy-in-and-create-unified-design-views-in-compressed-timeframes/</link>
		<comments>http://boxesandarrows.com/collaboration-sessions-how-to-lead-multidisciplinary-teams-generate-buy-in-and-create-unified-design-views-in-compressed-timeframes/#comments</comments>
		<pubDate>Mon, 04 Jul 2005 11:26:17 +0000</pubDate>
		<dc:creator>Sasha Verhage</dc:creator>
				<category><![CDATA[Process and Methods]]></category>
		<category><![CDATA[Professionalism]]></category>
		<category><![CDATA[Special topic: Agile/Lean UX]]></category>

		<guid isPermaLink="false">http://boxesandarrows.com/collaboration-sessions-how-to-lead-multidisciplinary-teams-generate-buy-in-and-create-unified-design-views-in-compressed-timeframes/</guid>
		<description><![CDATA[Collaboration Sessions encourage multidisciplinary collaboration while creating a unified design vision--all within a compressed time frame.]]></description>
				<content:encoded><![CDATA[<pullquote>&#8220;&#8230;The benefits of this tool include increased participation, increased understanding of the value of each discipline, and consequently increased buy-in from the team.&#8221;</pullquote>
<p>I have participated in, led, and suffered major website redesign efforts. Whether at process-heavy consultancies, notable product companies, or design studios, all teams experience the same points of pain: late feedback, lack of common design vision, and complaints that individuals or teams didn&#8217;t have enough input.</p>
<p>No matter what your design process is during the early phases, most interaction designers and IAs complain that requirements aren&#8217;t clear or specific enough. Product managers are anxious to get started and have high hopes&#8211;expecting product innovation, timely delivery, and no negative impact on the site. Engineers are frustrated because they are not solicited for input. Finally, to complicate matters, the approval process becomes mired in team dynamics and politics.</p>
<p>The traditional software development &#8220;waterfall&#8221; process was first described in 1970 in a paper by Winston Royce. He postulated that as the project moved from requirements gathering to implementation, specialized disciplines would create specific deliverables and then pass them off to the next discipline. For example, interface designers would hand off low fidelity schematics to visual designers, who would design the look and feel before delivering to web developers.</p>
<p><img alt="fig1.gif" src="http://www-boxesandarrows-com.zippykid.netdna-cdn.com/files/banda/collaboration_sessions_how_to_lead_multidisciplinary_teams_generate_buy_in_and_create_unified_design_views_in_compressed_timeframes/fig1.gif" width="557" height="250" border="1" /><br />
Figure 1. A frequent and frustrating consequence of the waterfall process is late feedback.</p>
<p>Over the years, I have developed a framework that I call &#8220;Collaboration Sessions.&#8221; Collaboration Sessions encourage multidisciplinary collaboration while creating a unified design vision&#8211;all within a compressed time frame. The benefits of this tool include increased participation, increased understanding of the value of each discipline, and consequently increased buy-in from the team.</p>
<p><img alt="collab.gif" src="http://www-boxesandarrows-com.zippykid.netdna-cdn.com/files/banda/collaboration_sessions_how_to_lead_multidisciplinary_teams_generate_buy_in_and_create_unified_design_views_in_compressed_timeframes/collab.gif" width="605" height="27" /></p>
<h3>What are Collaboration Sessions?</h3>
<p>Collaboration Sessions are highly interactive meetings (or more accurately, work sessions) with representation from each discipline. These meetings address everything from strategic planning to the design of site sections and page details. For example, a team working on the Travel section of our site used this technique to brainstorm a new line of business and then used it to help design page details. This method is most helpful for redesigns, new features, and controversial or strategic sections of a site (e.g. the home page). Typically, an interaction designer or product manager leads the meeting at the beginning of the Design phase.</p>
<p><img alt="fig2.gif" src="http://www-boxesandarrows-com.zippykid.netdna-cdn.com/files/banda/collaboration_sessions_how_to_lead_multidisciplinary_teams_generate_buy_in_and_create_unified_design_views_in_compressed_timeframes/fig2.gif" width="572" height="190" border="1"/><br />
Figure 2: Collaboration Sessions are excellent tools, especially during the design phase of a project.</p>
<p>A project manager is designated as the central point person, responsible for inviting the required and optional representatives from Sales, Marketing, Product Management, Interaction Design, Visual Design, Web Development, and Engineering (or whatever your particular departments/functions are). The meeting request should include an agenda and describe the purpose of the meeting. The request might also encourage the team to send in ideas and innovations or ask them to present their new ideas to the group at the beginning of the meeting. If it makes sense, prior to the Collaboration Session, the interaction designer conducts due diligence and a heuristic evaluation of the current site. For a new feature, the designers might look at competitors or research best practices. </p>
<p>Collaboration Sessions are most effective when attendees understand the project goals, the design problem to be solved, the roles and responsibilities of individual team members, and the business context. The facilitator starts the meeting by explaining the purpose of the meeting, the type of contributions encouraged, the ground rules for the session, and the desired outcome. The facilitator also assigns roles: time keepers, notetakers, final arbiters, and scope police (who call attention to scope creep). It might be helpful to assign these roles before the meeting. The product manager (or participant with the most domain knowledge) should provide the team with the historical, business, and competitive context. Scope boundaries can also be identified. For example, when a page will be completely redesigned and rearchitected, the product manager will state the purpose of the pages and the current design challenges. </p>
<p>With a blank wireframe template pasted on the wall, the facilitator turns the team&#8217;s attention to page level design. The focus is high level, not pixel level. Figure 3 is an example of &#8220;Search Results&#8221; with an accompanying &#8220;Notes&#8221; page. Advertising requirements are identified in pink. The primary focus of the page is the search result set, noted in purple. The secondary call to action, identified in blue, is &#8220;Modify Search.&#8221; The Post-It notes provide general placement for the page components but do not dictate design. However, some design decisions may be requirements; for example, the Sales department may specify that all ad units have to be above the fold.</p>
<p><img alt="fig3.jpg" src="http://www-boxesandarrows-com.zippykid.netdna-cdn.com/files/banda/collaboration_sessions_how_to_lead_multidisciplinary_teams_generate_buy_in_and_create_unified_design_views_in_compressed_timeframes/fig3.jpg" width="180" height="247"align="left" /><img alt="fig4.gif" src="http://www-boxesandarrows-com.zippykid.netdna-cdn.com/files/banda/collaboration_sessions_how_to_lead_multidisciplinary_teams_generate_buy_in_and_create_unified_design_views_in_compressed_timeframes/fig4.gif" width="432" height="228"/></p>
<p>Figure 3: Next to each page or site section, the Notetaker documents issues, to do&#8217;s, questions, assumptions, and major decisions.</p>
<p>As issues and questions arise, they are captured in real time by the notetaker on a &#8220;Notes&#8221; page taped next to the page being designed. At the end of the meeting, the To Do items are assigned to specific people. After the Collaboration Session, the interaction designer distributes the Notes. The team can then use the session output to start working on a more detailed design, creating wireframes that use the accompanying Notes documentation. When answers are found, the Notes page is updated; Notes pages should be living documents, shared by team members. </p>
<table width="80%"  border="1">
<tr>
<td><strong>Before the Meeting</strong></td>
</tr>
<tr>
<td>
<ul>
<li>Identify key constituents from Sales, Marketing, Product Management, Interaction Design,Visual Design, Web Development, and Engineering (you can easily map these functional areas to your company&#8217;s organization)
<li>Send out agenda to participants (assigning any prep work)</li>
<li>Facilitator conducts due diligence</li>
<li>Prep the room with supporting material (e.g. screen shots, marketing research, supplies)</li>
</ul>
</td>
</tr>
<tr>
<td><strong>Collaboration Session Agenda</strong></td>
</tr>
<tr>
<td>
<ul>
<li>Purpose of meeting (facilitator)
<li>Ground rules and roles/responsibilities (facilitator)</li>
<li>Scope boundaries (what&#8217;s in/out of bounds) (product manager)</li>
<li>Walk through pages (facilitator)</li>
<li>State purpose of each page (product manager)
<li>Discuss current design problems or challenges</li>
<li>Brainstorm page solutions. Use Post-It notes to document primary and secondary calls to action and other page elements. (facilitator)</li>
<li>Capture issues, to do&#8217;s (with owners), assumptions, major decisions, and design rationales on &#8220;Notes&quot; page (notetaker)</li>
<li>Document any major product innovations (notetaker)</li>
</ul>
</td>
</tr>
</table>
<h3>What Collaboration Sessions are Not </h3>
<p>The process should not be &#8220;design by committee&#8221; but rather design for common understanding. When the designers provide solutions during the meeting, these are meant to foster discussion, not offer a final solution The focus should not be on granular elements like interface widgets or pixels. If you are debating whether something should be a drop-down or not, then you are wasting people&#8217;s time. Remember, if you have representation from each discipline, these are costly meetings. The facilitator should not try to provide real-time solutions or answers. Collaboration Sessions identify the requirements (i.e. what needs to change, the current design&#8217;s problem areas, current traffic pattern, what competitors are doing). The designers should take this information and ultimately present solutions to the problems. The session output serves as the foundation for design rationales. </p>
<p><strong>Benefits </strong><br />
Collaboration Sessions enable teams to compress the development cycle by accomplishing the following:
<ul>
<li>Establish a common design vision. Encourage early collaboration.</li>
<li>Generate ideas and innovations for release and/or inform product roadmap.</li>
<li>Identify questions, issues, and to do&#8217;s.</li>
<li>Encourage full team contributions and subsequently ensure team buy-in.</li>
<li>Document assumptions, design rationales, and changes.</li>
<li>Enable parallel development (i.e. mobilize each discipline).</li>
<li>Improve scoping, estimating, and planning (e.g. number of impacted pages, new pages).</li>
<li>Inform process flows and page level design.</li>
<li>Can improve credibility (by identifying design problems and having designer recommend solutions). Can change perception of user experience design from &#8220;pair of hands&quot; to more &quot;strategic partner.&quot;</li>
<li>Define the design problem within its historical context. </li>
<li>Establish regular check-in meetings. </li>
<li>Allow User Experience team to present recommendations, design solutions, and design rationale as a unified voice.</li>
<li>Identify opportunities and innovations at a strategic level.</li>
</ul>
<p><strong>Best Practices</strong><br />
After running Collaboration Sessions over the past couple of years, here are some best practices I recommend:
<ul>
<li>Prep the meeting room the day before. </li>
<li>Encourage one representative from each appropriate discipline to attend. Cross-functional representation deepens the understanding of the problems, encourages more holistic solutions, and fosters collaboration across the team.</li>
<li>Start each meeting by allowing the business owner or the person with the most experience to provide context on the competitive landscape, current design, or any useful and relevant information. Also, identify roles: timekeepers, final arbiters, scope police, product manager as hub, design manager as process filter. </li>
<li>Make adaptations or customize the format of Collaboration Session process after each session if needed. Encourage the team to be flexible, nimble, and adaptive.</li>
<li>Summarize, capture, and distribute the notes from each Collaboration Session within 24 hours.</li>
<li>Involve key stakeholders before the session, and have them buy in to the participants, agenda, and meeting objectives. If relevant, send out any homework, such as links to competitors, before the meeting.</li>
<li>Send out &#8220;Issues and To Do&#8217;s&#8221; immediately after meeting.</li>
<li>For major innovations, package ideas and &#8220;sell up&#8221; to key decision makers afterwards.</li>
</ul>
<h3>Testimonials</h3>
<p>After the first one: </p>
<blockquote><p>
&#8220;I just wanted to say I thought the first collaboration session went really well overall. Lots of focused participation from different disciplines. Discussing and agreeing on goals and priorities at a page/template level is really going to help communication throughout the design process. It&#8217;s often a big leap from presenting documents to one another to solving problems together and getting design work done in real time.&#8221;</p>
<p><em>Contract content strategist with 8 years experience.</em></p></blockquote>
<p>After project was done:</p>
<blockquote><p>&#8220;Super proud [of the redesign]. Collaboration sessions were pain in the ass to attend, but extremely valuable to the process&#8221; &#8220;Very proud and pleased with the end result.&#8221; </p>
<p><em>Product Manager.</em></p></blockquote>
<blockquote><p>&#8220;Best process at Yahoo I&#8217;ve seen, in 5 years. Smoothest redesign to date I&#8217;ve worked on.&#8221; </p>
<p><em>Senior Engineer.</em></p></blockquote>
<p>Invitation from another team</p>
<blockquote><p>&#8220;Our goal of this meeting is to have you lead us through a Collaboration Session&hellip;. I remember how helpful this process was in designing pages for our previous product&hellip;.I think our team could really benefit from applying this tool.&#8221;</p>
<p><em>Senior Product Manager </em></p></blockquote>
<p><img src="http://www-boxesandarrows-com.zippykid.netdna-cdn.com/files/banda/art_end.gif" alt="" title="" width="8" height="8" /></p>
<p><biobox> <a href="http://www.boxesandarrows.com/people/archives/sasha_verhage.php">Sasha Verhage</a> is a Senior Design Manager at Yahoo with over 10 years experience in software, internet and professional services industries. He is passionate about leading fast paced and high performing teams to successful outcomes. In his not so spare time, he makes award winning wine under the Eno label.</biobox></p>
]]></content:encoded>
			<wfw:commentRss>http://boxesandarrows.com/collaboration-sessions-how-to-lead-multidisciplinary-teams-generate-buy-in-and-create-unified-design-views-in-compressed-timeframes/feed/</wfw:commentRss>
		<slash:comments>5</slash:comments>
		</item>
		<item>
		<title>Tackling Maintenance Projects</title>
		<link>http://boxesandarrows.com/tackling-maintenance-projects/</link>
		<comments>http://boxesandarrows.com/tackling-maintenance-projects/#comments</comments>
		<pubDate>Mon, 04 Nov 2002 22:02:14 +0000</pubDate>
		<dc:creator>Dan Saffer</dc:creator>
				<category><![CDATA[Methods]]></category>
		<category><![CDATA[Process and Methods]]></category>
		<category><![CDATA[Special topic: Agile/Lean UX]]></category>

		<guid isPermaLink="false">http://boxesandarrows.com/tackling-maintenance-projects/</guid>
		<description><![CDATA[A typical maintenance project goes something like this: someone has a new piece of functionality or content they want to put up on the website. The IA’s job: find the best place for it. ]]></description>
				<content:encoded><![CDATA[<pullquote>&ldquo;Maintenance projects are distinguished by their (relative) brevity: for a majority of them, the design period will be two weeks or less, and very often only a day or two.&rdquo;</pullquote>Most of what one reads about information architecture and interaction design work assumes several things: that you are creating the project from scratch, that you have the ability to alter anything on the screen, and that the project is free of technical or political constraints. None of these assumptions are true when you are dealing with maintenance projects.</p>
<p><span class="subhead">Defining maintenance projects</span><br />
Very soon after the first website went up, the first maintenance project began. </p>
<p>By maintenance project, I&rsquo;m referring to altering an existing website or application, one that you likely had nothing to do with creating that comes loaded with technical and organizational baggage. It can be as small as adding a link to a page, or as large as restructuring the entire site. For in-house IAs like myself, these can make up the majority of work of you do. But more and more, consultants (since the collapse of the New Economy and the dearth of new web projects) are being asked to deal with them as well.</p>
<p>Most maintenance projects involve one of the following:</p>
<ul>
<li>Adding functionality or content.</li>
<li>Removing functionality or content.</li>
<li>Revising architecture &#8212; moving content, pages, or whole sections to a different location.</li>
<li>Changing interaction &#8212; altering the way an existing piece of functionality works.</li>
</ul>
<p>Maintenance projects are distinguished by their (relative) brevity: for a majority of them (excepting major restructuring work), the design period will be two weeks or less, and very often only a day or two. They generally require a quick assessment of the situation and decisive judgment, not to mention immediate action: rapid prototyping, wireframes, and site maps. Few maintenance projects will allow the luxury of a full exploration and design process.</p>
<p>A typical maintenance project goes something like this: someone has a new piece of functionality or content they want to put up on the website. The IA&rsquo;s job: find the best place for it, both in the site overall and on the specific page chosen. </p>
<p>Server logs or a usability test (or common sense) can trigger a maintenance project by revealing that a site or an application has been structured wrong, and users aren&rsquo;t able to complete their tasks (finding information, buying things, etc.). The IA&rsquo;s job: fix it.</p>
<p><span class="subhead">Two types of maintenance projects</span><br />
There are two types of maintenance projects that I&rsquo;ve taken to whimsically calling &ldquo;Atomic&rdquo; and &ldquo;Neutron.&rdquo; Each has pitfalls and challenges. I&rsquo;ll discuss the rarer of the two first: Atomic.</p>
<p><b>Atomic Maintenance Projects</b> (AMPs) are those projects that allow you to completely change how the page, section, site, or application works. AMPs usually occur when a business requirement causes you to rethink the whole &ldquo;environment&rdquo; around the requested change. Like an atomic blast, it can destroy things on all three tiers of development &#8212; front end, middleware, and databases. AMPs are actually regular projects in the guise of maintenance, and if you are lucky enough to convince your team to tackle one, you will likely be able to do a fuller design process than you would have otherwise.</p>
<pullquote>&ldquo;Often, IAs are left to wrestle with decisions that were made long before their involvement with the project; decisions that people in the company may not even like but are stuck with.&rdquo;</pullquote>For example, let&rsquo;s say an existing online form needs to capture some new sort of data (e.g., a phone number). Typically, this might just involve adding another form field. But, on examining the page where the form resides, you discover that the whole thing should be reworked: the format is too confusing, the required fields aren&rsquo;t indicated, and just adding a field would make the visual design even more cramped. </p>
<p>This type of discovery, I should add, is not rare. I guarantee you&rsquo;ll come across all sorts of things that need to be improved when you take a critical look at many web pages. What is rare is being able to convince your clients and the rest of the team that more redesign needs to be done than just adding in a form field, as everyone expected.</p>
<p>This, in project management terms, is called &ldquo;scope creep,&rdquo; and now you are the advocate of it. Sometimes this is welcomed, because a small change can reveal how poorly something is built, or show possibilities no one has thought of. But be prepared for pushback! If time is of the essence (and when is it not?), the rest of the team will want you to just pipe down and make the less-drastic change they were expecting. In other words, they will want you to make the project Neutron.</p>
<p>If Atomic Maintenance Projects level everything and start from scratch, <b>Neutron Maintenance Projects</b> (NMPs) leave the &ldquo;buildings&rdquo; (a.k.a. the three development tiers) mostly intact. These are much more common, because, as we&rsquo;ve seen, even projects that should be Atomic aren&rsquo;t because of the difficulty in convincing people that they need a more thorough treatment. Instead, the IA is left with making the best choice possible <i>given the existing conditions.</i></p>
<p>And there&rsquo;s the rub. Often, IAs are left to wrestle with decisions that were made long before their involvement with the project; decisions that people in the company may not even like but are stuck with. Or decisions they have a vested stake in keeping intact. Or decisions various forces in the company (IT, Marketing, and Legal being typical stakeholders) insist must remain, for reasons the IA may or may not agree with.</p>
<p>To illustrate, let&rsquo;s look at the online form example. The new requirement is to collect a phone number from the user. Since the phone number could be international, you decide to create one long text field. Simple, right? Yes, until the database manager tells you that there are already two fields in the database: one for international phone numbers and one for U.S. phone numbers &#8212; and she&rsquo;s not about to change the whole database structure to combine them. The Java developer doesn&rsquo;t have time to write a script to send U.S. numbers to one field, and international to another. And the graphic designer mentions that by adding two separate fields, it will knock the page &ldquo;below the fold,&rdquo; and that&rsquo;s against company policy. Oy.</p>
<p>It&rsquo;s often frustrating to deal with NMPs, especially when you know they should really be AMPs. But there are ways to cope.</p>
<p><span class="subhead">Maintaining your sanity during maintenance projects</span><br />
Hardly anyone likes to do maintenance projects. They are seemingly unglamorous, janitorial chores to be dealt with in-between the bigger and better projects. And while I am not going to argue otherwise, I can provide some hard-won hints that might make them easier the next time you&rsquo;re handed one.</p>
<blockquote><p><b>Think inside the box.</b> The first thing you need to do is review the requirements and figure out the best place <i>at a high level</i> for the change you are being asked to make. Many requirements are pretty specific about this (&ldquo;We need to capture the phone number on the registration form&rdquo;), others much less so (&ldquo;We need to put the bios of our board members on the site&rdquo;). If you have a map of the site or application, it will be handy. If not, sketch one, briefly. Find (or create) a logical space for the change.</p>
<p><b>Know the page (Part I).</b> Once you&rsquo;ve found a place for the change (if it is an existing page or screen), examine the page closely, click links, push buttons. This may seem basic, but pieces of functionality and content don&rsquo;t often work the way you think they will (or the way they should). Recently, on a Neutron project, I blithely assumed that underlined items were links to related pages of &ldquo;help&rdquo; content. Not so: they revealed a hidden DHTML layer with a brief description of the item. You&rsquo;ll often come across things that make you want to make the project Atomic during this investigation.</p>
<p><b>Know the page (Part II).</b> If you have any technical savvy at all (and you should), find out about how the environment was constructed. Is it part of a content management system? Is any of the content dynamic? What is the application built in, Flash? C++? Java? Look at the source code if you can. Talk to the developers, the people who built it. This will allow you to know what is possible given the technical constraints, as well as alert you to any hidden problems before you start your wireframes.</p>
<p><b>Beware of hidden traps.</b> Often, there are secret conditions and corporate political issues that you may be unaware of. These, of course, won&rsquo;t be written down anywhere. Your clients just <i>know</i> them. The best way for you to know them as well is to cultivate a friendship with the people who know this information: the members of the development team, and especially the project manager. She can tell you that the CEO hates the word &ldquo;corporate&rdquo; or that Marketing is opposed to underlining links.</p>
<p><b>Pick your battles.</b> When you do discover serious problems with a page, pause before sounding the cry to get it changed. Most importantly, consider how much impact there will be <i>for the user</i> and weigh it against the battle you will have to wage to get it fixed. If it will substantially make the user&rsquo;s experience better and only requires you send a nice email to the Visual Basic programmer, then, by all means, proceed. If it will make a slight difference, but requires you to argue your case to the President and CEO for the next month, maybe it isn&rsquo;t worth it. Here, consultants have the edge over in-house IAs. &ldquo;Innies&rdquo; have to measure their own reservoir of corporate goodwill, built up on the projects that have gone before and estimate how much they&rsquo;ll need for projects coming in the future. &ldquo;Outties&rdquo; have less to lose, other than annoying those people who have hired them in the first place (and could get them more work in the future).</p>
<p><b>Down &lsquo;n&rsquo; dirty wireframes.</b> Unless you&rsquo;ve managed to talk your way into an Atomic Maintenance Project or are creating a new page or screen, it rarely makes sense to reconstruct an existing page as a wireframe. You&rsquo;ll waste a lot of time doing that, because typically you are only affecting one area of the screen. Instead, take a screenshot of the existing page, move it to Photoshop or Illustrator and make the changes in the image. Then export it as an image into your wireframe template where you can layer your annotations on top of it. These &ldquo;wireframes&rdquo; will be easier for the developers to understand, too.</p>
<p><b>Be considerate of visual design.</b> On new projects, IAs often have the luxury of doing their work prior to visual design. But on maintenance projects, specifically NMPs, you are often adding things to existing pages, so even more care than usual needs to be paid to the visual design. One large, ugly button, ill-placed, can ruin a look and feel that might have taken weeks to get right and get approved. It may go against what usability gurus have traditionally been screaming at us, but I contend that an ugly solution that is functionally correct is worse than a handsome one with less-than-ideal functionality.</p></blockquote>
<p>While handling maintenance projects are few people&rsquo;s idea of a dream job, they can help sharpen your IA skills. They make you more aware of what happens in development after your designs are approved. They demonstrate how sites evolve over time, and can help you better design things that account for that reality. They make you aware of the business and technical forces that ultimately affect the design. And, best of all, they make you appreciate non-maintenance projects more.
<p><img src="http://www-boxesandarrows-com.zippykid.netdna-cdn.com/files/banda/art_end.gif" alt="" title="" width="8" height="8" /></p>
<p><end></end><biobox><a href="http://www.boxesandarrows.com/people/archives/dan_saffer.php">Dan Saffer</a> is a senior interaction designer at Ameritrade. Over the last seven years of web work, he has worked with a diverse set of clients, from Lucent Technologies to the World Wrestling Federation. He is contractually obligated to say that he won a fellowship in 1998 from the Mid-Atlantic Arts Council. He lives and works in New Jersey and is not writing a book about IA.</p>
<p>His portfolio and blog can be found at <a href="http://www.odannyboy.com">www.odannyboy.com.</a></biobox></p>
]]></content:encoded>
			<wfw:commentRss>http://boxesandarrows.com/tackling-maintenance-projects/feed/</wfw:commentRss>
		<slash:comments>6</slash:comments>
		</item>
	</channel>
</rss>
