Menu
Home
People
Places
Arts
History
Plants & Animals
Science
Life & Culture
Technology
Reference.org
Contextual design
open-in-new
<h2 id="process-overview">Process overview</h2> <p>The contextual design process consists of the following top-level steps: contextual inquiry, interpretation, data consolidation, visioning, storyboarding, user environment design, and prototyping. </p> <h3>Collecting data – contextual inquiry</h3> <p class="note">Main article: <a href="/facts/Contextual_inquiry/XHyAX6C6">Contextual inquiry</a></p> <p>Contextual inquiry is a field data collection technique used to capture detailed information about how users of a product interact with the product in their normal work environment. This information is captured by both observations of user behavior and conversations with the user while she or he works. A key aspect of the technique is to partner with the user, letting their work and the issues they encounter guide the interview. Key takeaways from the technique are to learn what users actually do, why they do it that way, latent needs, desires, and core values.<a class="footnote-ref" id="fnref:2" href="#fn:2"><sup>2</sup></a> </p> <h3>Interpretation</h3> <p>Data from each interview is analyzed and key issues and insights are captured. Detailed work models are also created in order to understand the different aspects of the work that matter for design. Contextual design consists of five work models which are used to model the work tasks and details of the working environment. These work models are:<a class="footnote-ref" id="fnref:3" href="#fn:3"><sup>3</sup></a> </p> <ul><li>Flow model – represents the coordination, communication, interaction, roles, and responsibilities of the people in a certain work practice</li> <li>Sequence model – represents the steps users go through to accomplish a certain activity, including breakdowns</li> <li>Cultural model – represents the norms, influences, and pressures that are present in the work environment</li> <li>Artifact model – represents the documents or other physical things that are created while working or are used to support the work. Artifacts often have a structure or styling that could represent the user's way of structuring the work</li> <li>Physical model – represents the physical environment where the work tasks are accomplished; often, there are multiple physical models representing, e.g., office layout, network topology, or the layout of tools on a computer display.</li></ul> <h3>Data consolidation</h3> <p>Data from individual customer interviews are analyzed in order to reveal patterns and the structure across distinct interviews. Models of the same type can be consolidated together (but not generalized—detail must be maintained). Another method of processing the observations is making an affinity diagram ("wall"), as described by Beyer & Holtzblatt:<a class="footnote-ref" id="fnref:4" href="#fn:4"><sup>4</sup></a> </p> <ul><li>A single observation is written on each piece of paper.</li> <li>Individual notes are grouped according to the similarity of their contents.</li> <li>These groups are labeled with colored Post-it notes, each color representing a distinct level in the hierarchy.</li> <li>Then the groups are combined with other groups to get the final construct of observations in a hierarchy of up to three levels.</li></ul> <p>Beyer & Holtzblatt propose the following color-coding convention for grouping the notes, from lowest to highest level in the hierarchy:<a class="footnote-ref" id="fnref:5" href="#fn:5"><sup>5</sup></a> </p> <ul><li>White notes – individual notes captured during interpretation, also known as "affinity notes"</li> <li>Blue notes – summaries of groups of white notes that convey all the relevant details</li> <li>Pink notes – summaries of groups of blue notes that reveal key issues in the data</li> <li>Green notes – labels identifying an area of concern indicated by pink notes</li></ul> <p>Beyer & Holtzblatt emphasize the importance of building the entire affinity diagram in one or two sessions rather than building smaller affinity diagrams over many sessions. This immersion in the data for an extended period of time helps teams see the broad scope of a problem quickly and encourages a paradigm shift of thought rather than assimilation of ideas.<a class="footnote-ref" id="fnref:6" href="#fn:6"><sup>6</sup></a> </p><p>The design ideas and relevant issues that arise during the process should be included in the affinity diagram. Any holes in the data and areas that need more information should also be labeled. After completing the wall, participants "walk" the affinity diagram to stimulate new ideas and identify any remaining issues or holes in data. The affinity diagram is a bottom-up method. Consolidated data may also be used to create a <a href="/facts/Cause-and-effect_diagram/vHFlT4dk">cause-and-effect diagram</a> or a set of <a href="/facts/Persona_(marketing)/djFbrnxD">personas</a> describing typical users of the proposed system. </p> <h3>Visioning</h3> <p>In visioning, a cross-functional team comes together to create stories of how new product concepts, services, and technology can better support the user work practice. The visioning team starts by reviewing the data to identify key issues and opportunities. The data walking session is followed by a group visioning session during which the visioning team generates a variety of new product concepts by telling stories of different usage scenarios based on the data collected. A vision includes the system, its delivery, and support structures to make the new work practice successful, but is told from the user's point of view. </p> <h3>Storyboarding</h3> <p>After visioning, the team develops the vision in <a href="/facts/Storyboards/mTPt4P3m">storyboards</a>, capturing scenarios of how people will work with the new system. Understanding the current way of working, its structure and the complete <a href="/facts/Workflow/Ig8zvxF2">workflow</a> helps the design team address the problems and design the new workflow. Storyboards work out the details of the vision, guided by the consolidated data, using pictures and text in a series of hand-drawn cells. </p> <h3>User Environment Design</h3> <p>The User Environment Design captures the floor plan of the new system. It shows each part of the system, how it supports the user's work, exactly what function is available in that part, and how the user gets to and from other parts of the system. Contextual design uses the User Environment Design (UED) diagram, which displays the focus areas, i.e., areas which are visible to the user or which are relevant to the user. Focus areas can be defined further as functions in a system that support a certain type or part of the work. The UED also presents how the focus areas relate to each other and shows the links between focus areas.<a class="footnote-ref" id="fnref:7" href="#fn:7"><sup>7</sup></a> </p> <h3>Prototyping</h3> <p>Testing the design ideas with <a href="/facts/Paper_prototypes/fCy8zWRk">paper prototypes</a> or even with more sophisticated interactive prototypes before the implementation phase helps the designers communicate with users about the new system and develop the design further. Prototypes test the structure of a User Environment Design and initial user interface ideas, as well as the understanding of the work, before the implementation phase.<a class="footnote-ref" id="fnref:8" href="#fn:8"><sup>8</sup></a> Depending on the results of the prototype test, more iterations or alternative designs may be needed. </p> <h2 id="uses-and-adaptations">Uses and adaptations</h2> <p>Contextual design has primarily been used for the design of computer information systems, including hardware,<a class="footnote-ref" id="fnref:9" href="#fn:9"><sup>9</sup></a> software.<a class="footnote-ref" id="fnref:10" href="#fn:10"><sup>10</sup></a> Parts of contextual design have been adapted for use as a <a href="/facts/Usability/zuAnqu9Q">usability</a> evaluation method<a class="footnote-ref" id="fnref:11" href="#fn:11"><sup>11</sup></a> and for contextual application design. Contextual design has also been applied to the design of digital libraries and other learning technologies,<a class="footnote-ref" id="fnref:12" href="#fn:12"><sup>12</sup></a><a class="footnote-ref" id="fnref:13" href="#fn:13"><sup>13</sup></a> </p><p>Contextual design has also been used as a means of teaching <a href="/facts/User-centered_design/1qLwIbSw">user-centered design</a>/<a href="/facts/Human%25E2%2580%2593computer_interaction/EkmIxGCx">Human–computer interaction</a> at the university level.<a class="footnote-ref" id="fnref:14" href="#fn:14"><sup>14</sup></a><a class="footnote-ref" id="fnref:15" href="#fn:15"><sup>15</sup></a> </p><p>A more lightweight approach to contextual design has been developed by its originators to address an oft-heard criticism that the method is too labor-intensive or lengthy for some needs.<a class="footnote-ref" id="fnref:16" href="#fn:16"><sup>16</sup></a> Yet others find the designer/user engagement promoted by contextual design to be too brief.<a class="footnote-ref" id="fnref:17" href="#fn:17"><sup>17</sup></a> </p> <h2 id="external-links">External links</h2> <ul><li>Karen Holtzblatt and Hugh Beyer: "<a href="http://www.interaction-design.org/encyclopedia/contextual_design.html">Contextual Design</a>", in: Soegaard, Mads and Dam, Rikke Friis (eds.). <i>The Encyclopedia of Human–Computer Interaction</i>, 2nd Ed. Aarhus, Denmark: The Interaction Design Foundation, 2014.</li> <li>InContext: "<a href="http://incontextdesign.com/contextual-design/">Contextual Design</a>" (InContext was <a href="http://incontextdesign.com/about/">founded by Karen Holtzblatt and Hugh Beyer</a>).</li> <li>"<a href="http://www.usabilitynet.org/tools/contextualinquiry.htm">Contextual inquiry</a>" on UsabilityNet.</li> <li>Hostrings: <a href="http://blog.hostrings.com/2011/11/contextual-design-and-development-is.html">Contextual Design and Development is the Driving Force Behind all Successful Mobile Applications</a>.</li></ul> <h2 id="references">References</h2> <ol> <li id="fn:1"><p>Beyer, H. & Holtzblatt, K. (1998). Contextual Design: Defining Customer-Centered Systems. San Francisco: Morgan Kaufmann. ISBN 1-55860-411-1 <a href="/wiki/ISBN_(identifier)" target="_blank">/wiki/ISBN_(identifier)</a> <a href="#fnref:1" class="footnote-back-ref">↩</a></p></li> <li id="fn:2"><p>Beyer, H. & Holtzblatt, K. (1998). Contextual Design: Defining Customer-Centered Systems. San Francisco: Morgan Kaufmann. ISBN 1-55860-411-1 <a href="/wiki/ISBN_(identifier)" target="_blank">/wiki/ISBN_(identifier)</a> <a href="#fnref:2" class="footnote-back-ref">↩</a></p></li> <li id="fn:3"><p>Holtzblatt, K: Contextual Design: Experience in Real Life. Mensch & Computer 2001. (online "Archived copy" (PDF). Archived from the original (PDF) on 2005-08-16. Retrieved 2007-01-11.{{cite web}}: CS1 maint: archived copy as title (link)) <a href="https://web.archive.org/web/20050816180340/http://mc.informatik.uni-hamburg.de/konferenzbaende/mc2001/Holtzblatt.pdf" target="_blank">https://web.archive.org/web/20050816180340/http://mc.informatik.uni-hamburg.de/konferenzbaende/mc2001/Holtzblatt.pdf</a> <a href="#fnref:3" class="footnote-back-ref">↩</a></p></li> <li id="fn:4"><p>Beyer, H. & Holtzblatt, K. (1998). Contextual Design: Defining Customer-Centered Systems. San Francisco: Morgan Kaufmann. ISBN 1-55860-411-1 <a href="/wiki/ISBN_(identifier)" target="_blank">/wiki/ISBN_(identifier)</a> <a href="#fnref:4" class="footnote-back-ref">↩</a></p></li> <li id="fn:5"><p>Beyer, H. & Holtzblatt, K. (1998). Contextual Design: Defining Customer-Centered Systems. San Francisco: Morgan Kaufmann. ISBN 1-55860-411-1 <a href="/wiki/ISBN_(identifier)" target="_blank">/wiki/ISBN_(identifier)</a> <a href="#fnref:5" class="footnote-back-ref">↩</a></p></li> <li id="fn:6"><p>Beyer, H. & Holtzblatt, K. (1998). Contextual Design: Defining Customer-Centered Systems. San Francisco: Morgan Kaufmann. ISBN 1-55860-411-1 <a href="/wiki/ISBN_(identifier)" target="_blank">/wiki/ISBN_(identifier)</a> <a href="#fnref:6" class="footnote-back-ref">↩</a></p></li> <li id="fn:7"><p>Beyer, H. & Holtzblatt, K. (1998). Contextual Design: Defining Customer-Centered Systems. San Francisco: Morgan Kaufmann. ISBN 1-55860-411-1 <a href="/wiki/ISBN_(identifier)" target="_blank">/wiki/ISBN_(identifier)</a> <a href="#fnref:7" class="footnote-back-ref">↩</a></p></li> <li id="fn:8"><p>Holtzblatt, K: Contextual Design: Experience in Real Life. Mensch & Computer 2001. (online "Archived copy" (PDF). Archived from the original (PDF) on 2005-08-16. Retrieved 2007-01-11.{{cite web}}: CS1 maint: archived copy as title (link)) <a href="https://web.archive.org/web/20050816180340/http://mc.informatik.uni-hamburg.de/konferenzbaende/mc2001/Holtzblatt.pdf" target="_blank">https://web.archive.org/web/20050816180340/http://mc.informatik.uni-hamburg.de/konferenzbaende/mc2001/Holtzblatt.pdf</a> <a href="#fnref:8" class="footnote-back-ref">↩</a></p></li> <li id="fn:9"><p>Curtis, P., Heiserman, T., Jobusch, D., Notess, M., & Webb, J. (1999). Customer-focused design data in a large, multi-site organization. In Proceedings of the SIGCHI Conference on Human Factors in Computing Systems: the CHI Is the Limit (Pittsburgh, Pennsylvania, United States, May 15–20, 1999). CHI '99. ACM Press, New York, NY, pp. 608–615. <a href="#fnref:9" class="footnote-back-ref">↩</a></p></li> <li id="fn:10"><p>Rockwell, C. 1999. Customer connection creates a winning product: building success with contextual techniques. interactions 6, 1 (Jan. 1999), pp. 50–57. <a href="#fnref:10" class="footnote-back-ref">↩</a></p></li> <li id="fn:11"><p>McDonald, S., Monahan, K., and Cockton, G. 2006. Modified contextual design as a field evaluation method. In Proceedings of the 4th Nordic Conference on Human–Computer interaction: Changing Roles (Oslo, Norway, October 14–18, 2006). A. Mørch, K. Morgan, T. Bratteteig, G. Ghosh, and D. Svanaes, Eds. NordiCHI '06, vol. 189. ACM Press, New York, NY, 437-440. <a href="#fnref:11" class="footnote-back-ref">↩</a></p></li> <li id="fn:12"><p>Notess, M. 2005. "Using Contextual Design for Digital Library Field Studies." Position paper presented at the JCDL 2005 workshop, "Studying Digital Library Users In the Wild: Theories, Methods, and Analytical Approaches" in Denver, June 10–11. Workshop report, including position papers, subsequently published in July/August 2005 D-Lib Magazine. <a href="http://www.dlib.org/dlib/july05/khoo/07_notess.pdf" target="_blank">http://www.dlib.org/dlib/july05/khoo/07_notess.pdf</a> <a href="#fnref:12" class="footnote-back-ref">↩</a></p></li> <li id="fn:13"><p>Notess, M. 2004. "Applying Contextual Design to Educational Software Development." In Instructional Design in the Real World: A View from the Trenches, Anne-Marie Armstrong, ed. Hershey, PA: Idea Group Publishers. <a href="#fnref:13" class="footnote-back-ref">↩</a></p></li> <li id="fn:14"><p>Lárusdóttir, M. K. "Using Rapid Contextual Design at Reykjavik University", accepted paper for the workshop named "HCIEd.2006-1 inventivity: Teaching theory, design and innovation in HCI" held by British Computer Society HCI Group (BHCIG), the International Federation of Information Processing (IFIP) WG13.1 Education, and the Irish Computer Society" in Limerick in Ireland, 23–24 March 2006. <a href="#fnref:14" class="footnote-back-ref">↩</a></p></li> <li id="fn:15"><p>Weinberg, J. B. and Stephen, M. L. 2002. Participatory design in a human–computer interaction course: teaching ethnography methods to computer scientists. In Proceedings of the 33rd SIGCSE Technical Symposium on Computer Science Education (Cincinnati, Kentucky, February 27 – March 3, 2002). SIGCSE '02. ACM Press, New York, NY, pp. 237–241. <a href="/wiki/Participatory_design" target="_blank">/wiki/Participatory_design</a> <a href="#fnref:15" class="footnote-back-ref">↩</a></p></li> <li id="fn:16"><p>Holtzblatt, K., Wendell, J.B., & Wood, S. 2005. Rapid Contextual Design: A How-to guide to key techniques for user-centered design. San Francisco: Morgan-Kaufmann. <a href="#fnref:16" class="footnote-back-ref">↩</a></p></li> <li id="fn:17"><p>Hartswood, M., Procter, R., Slack, R., Soutter, J., Voß, A., and Rouncefield, M. 2002. The benefits of a long engagement: from contextual design to the co-realisation of work affording artefacts. In Proceedings of the Second Nordic Conference on Human–Computer interaction (Aarhus, Denmark, October 19–23, 2002). NordiCHI '02, vol. 31. ACM Press, New York, NY, 283–286. <a href="#fnref:17" class="footnote-back-ref">↩</a></p></li> </ol>