<?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>NET Lab Research - Affordance &#187; Phil</title>
	<atom:link href="http://mediadesignprogram.net/affordance/author/admin/feed/" rel="self" type="application/rss+xml" />
	<link>http://mediadesignprogram.net/affordance</link>
	<description>Research Project of the Media Design Program</description>
	<lastBuildDate>Wed, 01 Jul 2009 02:02:21 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.8.2</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>First Presentation</title>
		<link>http://mediadesignprogram.net/affordance/2009/06/16/first-presentation/</link>
		<comments>http://mediadesignprogram.net/affordance/2009/06/16/first-presentation/#comments</comments>
		<pubDate>Wed, 17 Jun 2009 02:28:50 +0000</pubDate>
		<dc:creator>Phil</dc:creator>
				<category><![CDATA[big ideas]]></category>
		<category><![CDATA[homepage]]></category>

		<guid isPermaLink="false">http://mediadesignprogram.net/affordance/?p=352</guid>
		<description><![CDATA[This presentation was given on June 9th to Anne Burdick.
]]></description>
			<content:encoded><![CDATA[<p>This presentation was given on June 9th to Anne Burdick.</p>

<div class="ngg-galleryoverview" id="ngg-gallery-10-352">


	<!-- Piclense link -->
	<div class="piclenselink">
		<a class="piclenselink" href="javascript:PicLensLite.start({feedUrl:'http://mediadesignprogram.net/affordance/wp-content/plugins/nextgen-gallery/xml/media-rss.php?gid=10&amp;mode=gallery'});">
			[View with PicLens]		</a>
	</div>
	
	<!-- Thumbnails -->
		
	<div id="ngg-image-22" class="ngg-gallery-thumbnail-box"  >
		<div class="ngg-gallery-thumbnail" >
			<a href="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/summer-first-recap-affordance001.jpg" title=" " class="shutterset_firstpresentation" >
				<img title="summer-first-recap-affordance001.jpg" alt="summer-first-recap-affordance001.jpg" src="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/thumbs/thumbs_summer-first-recap-affordance001.jpg" width="100" height="75" />
			</a>
		</div>
	</div>
	 		
	<div id="ngg-image-23" class="ngg-gallery-thumbnail-box"  >
		<div class="ngg-gallery-thumbnail" >
			<a href="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/summer-first-recap-affordance002.jpg" title=" " class="shutterset_firstpresentation" >
				<img title="summer-first-recap-affordance002.jpg" alt="summer-first-recap-affordance002.jpg" src="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/thumbs/thumbs_summer-first-recap-affordance002.jpg" width="100" height="75" />
			</a>
		</div>
	</div>
	 		
	<div id="ngg-image-24" class="ngg-gallery-thumbnail-box"  >
		<div class="ngg-gallery-thumbnail" >
			<a href="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/summer-first-recap-affordance003.jpg" title=" " class="shutterset_firstpresentation" >
				<img title="summer-first-recap-affordance003.jpg" alt="summer-first-recap-affordance003.jpg" src="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/thumbs/thumbs_summer-first-recap-affordance003.jpg" width="100" height="75" />
			</a>
		</div>
	</div>
	 		
	<div id="ngg-image-25" class="ngg-gallery-thumbnail-box"  >
		<div class="ngg-gallery-thumbnail" >
			<a href="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/summer-first-recap-affordance004.jpg" title=" " class="shutterset_firstpresentation" >
				<img title="summer-first-recap-affordance004.jpg" alt="summer-first-recap-affordance004.jpg" src="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/thumbs/thumbs_summer-first-recap-affordance004.jpg" width="100" height="75" />
			</a>
		</div>
	</div>
	 		
	<div id="ngg-image-26" class="ngg-gallery-thumbnail-box"  >
		<div class="ngg-gallery-thumbnail" >
			<a href="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/summer-first-recap-affordance005.jpg" title=" " class="shutterset_firstpresentation" >
				<img title="summer-first-recap-affordance005.jpg" alt="summer-first-recap-affordance005.jpg" src="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/thumbs/thumbs_summer-first-recap-affordance005.jpg" width="100" height="75" />
			</a>
		</div>
	</div>
	 		
	<div id="ngg-image-27" class="ngg-gallery-thumbnail-box"  >
		<div class="ngg-gallery-thumbnail" >
			<a href="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/summer-first-recap-affordance006.jpg" title=" " class="shutterset_firstpresentation" >
				<img title="summer-first-recap-affordance006.jpg" alt="summer-first-recap-affordance006.jpg" src="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/thumbs/thumbs_summer-first-recap-affordance006.jpg" width="100" height="75" />
			</a>
		</div>
	</div>
	 		
	<div id="ngg-image-28" class="ngg-gallery-thumbnail-box"  >
		<div class="ngg-gallery-thumbnail" >
			<a href="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/summer-first-recap-affordance007.jpg" title=" " class="shutterset_firstpresentation" >
				<img title="summer-first-recap-affordance007.jpg" alt="summer-first-recap-affordance007.jpg" src="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/thumbs/thumbs_summer-first-recap-affordance007.jpg" width="100" height="75" />
			</a>
		</div>
	</div>
	 		
	<div id="ngg-image-29" class="ngg-gallery-thumbnail-box"  >
		<div class="ngg-gallery-thumbnail" >
			<a href="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/summer-first-recap-affordance008.jpg" title=" " class="shutterset_firstpresentation" >
				<img title="summer-first-recap-affordance008.jpg" alt="summer-first-recap-affordance008.jpg" src="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/thumbs/thumbs_summer-first-recap-affordance008.jpg" width="100" height="75" />
			</a>
		</div>
	</div>
	 		
	<div id="ngg-image-30" class="ngg-gallery-thumbnail-box"  >
		<div class="ngg-gallery-thumbnail" >
			<a href="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/summer-first-recap-affordance009.jpg" title=" " class="shutterset_firstpresentation" >
				<img title="summer-first-recap-affordance009.jpg" alt="summer-first-recap-affordance009.jpg" src="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/thumbs/thumbs_summer-first-recap-affordance009.jpg" width="100" height="75" />
			</a>
		</div>
	</div>
	 		
	<div id="ngg-image-31" class="ngg-gallery-thumbnail-box"  >
		<div class="ngg-gallery-thumbnail" >
			<a href="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/summer-first-recap-affordance010.jpg" title=" " class="shutterset_firstpresentation" >
				<img title="summer-first-recap-affordance010.jpg" alt="summer-first-recap-affordance010.jpg" src="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/thumbs/thumbs_summer-first-recap-affordance010.jpg" width="100" height="75" />
			</a>
		</div>
	</div>
	 		
	<div id="ngg-image-32" class="ngg-gallery-thumbnail-box"  >
		<div class="ngg-gallery-thumbnail" >
			<a href="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/summer-first-recap-affordance011.jpg" title=" " class="shutterset_firstpresentation" >
				<img title="summer-first-recap-affordance011.jpg" alt="summer-first-recap-affordance011.jpg" src="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/thumbs/thumbs_summer-first-recap-affordance011.jpg" width="100" height="75" />
			</a>
		</div>
	</div>
	 		
	<div id="ngg-image-33" class="ngg-gallery-thumbnail-box"  >
		<div class="ngg-gallery-thumbnail" >
			<a href="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/summer-first-recap-affordance012.jpg" title=" " class="shutterset_firstpresentation" >
				<img title="summer-first-recap-affordance012.jpg" alt="summer-first-recap-affordance012.jpg" src="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/thumbs/thumbs_summer-first-recap-affordance012.jpg" width="100" height="75" />
			</a>
		</div>
	</div>
	 		
	<div id="ngg-image-34" class="ngg-gallery-thumbnail-box"  >
		<div class="ngg-gallery-thumbnail" >
			<a href="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/summer-first-recap-affordance013.jpg" title=" " class="shutterset_firstpresentation" >
				<img title="summer-first-recap-affordance013.jpg" alt="summer-first-recap-affordance013.jpg" src="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/thumbs/thumbs_summer-first-recap-affordance013.jpg" width="100" height="75" />
			</a>
		</div>
	</div>
	 		
	<div id="ngg-image-35" class="ngg-gallery-thumbnail-box"  >
		<div class="ngg-gallery-thumbnail" >
			<a href="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/summer-first-recap-affordance014.jpg" title=" " class="shutterset_firstpresentation" >
				<img title="summer-first-recap-affordance014.jpg" alt="summer-first-recap-affordance014.jpg" src="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/thumbs/thumbs_summer-first-recap-affordance014.jpg" width="100" height="75" />
			</a>
		</div>
	</div>
	 		
	<div id="ngg-image-36" class="ngg-gallery-thumbnail-box"  >
		<div class="ngg-gallery-thumbnail" >
			<a href="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/summer-first-recap-affordance015.jpg" title=" " class="shutterset_firstpresentation" >
				<img title="summer-first-recap-affordance015.jpg" alt="summer-first-recap-affordance015.jpg" src="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/thumbs/thumbs_summer-first-recap-affordance015.jpg" width="100" height="75" />
			</a>
		</div>
	</div>
	 		
	<div id="ngg-image-37" class="ngg-gallery-thumbnail-box"  >
		<div class="ngg-gallery-thumbnail" >
			<a href="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/summer-first-recap-affordance016.jpg" title=" " class="shutterset_firstpresentation" >
				<img title="summer-first-recap-affordance016.jpg" alt="summer-first-recap-affordance016.jpg" src="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/thumbs/thumbs_summer-first-recap-affordance016.jpg" width="100" height="75" />
			</a>
		</div>
	</div>
	 		
	<div id="ngg-image-38" class="ngg-gallery-thumbnail-box"  >
		<div class="ngg-gallery-thumbnail" >
			<a href="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/summer-first-recap-affordance017.jpg" title=" " class="shutterset_firstpresentation" >
				<img title="summer-first-recap-affordance017.jpg" alt="summer-first-recap-affordance017.jpg" src="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/thumbs/thumbs_summer-first-recap-affordance017.jpg" width="100" height="75" />
			</a>
		</div>
	</div>
	 		
	<div id="ngg-image-39" class="ngg-gallery-thumbnail-box"  >
		<div class="ngg-gallery-thumbnail" >
			<a href="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/summer-first-recap-affordance018.jpg" title=" " class="shutterset_firstpresentation" >
				<img title="summer-first-recap-affordance018.jpg" alt="summer-first-recap-affordance018.jpg" src="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/thumbs/thumbs_summer-first-recap-affordance018.jpg" width="100" height="75" />
			</a>
		</div>
	</div>
	 		
	<div id="ngg-image-40" class="ngg-gallery-thumbnail-box"  >
		<div class="ngg-gallery-thumbnail" >
			<a href="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/summer-first-recap-affordance019.jpg" title=" " class="shutterset_firstpresentation" >
				<img title="summer-first-recap-affordance019.jpg" alt="summer-first-recap-affordance019.jpg" src="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/thumbs/thumbs_summer-first-recap-affordance019.jpg" width="100" height="75" />
			</a>
		</div>
	</div>
	 		
	<div id="ngg-image-41" class="ngg-gallery-thumbnail-box"  >
		<div class="ngg-gallery-thumbnail" >
			<a href="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/summer-first-recap-affordance020.jpg" title=" " class="shutterset_firstpresentation" >
				<img title="summer-first-recap-affordance020.jpg" alt="summer-first-recap-affordance020.jpg" src="http://mediadesignprogram.net/affordance/wp-content/gallery/firstpresentation/thumbs/thumbs_summer-first-recap-affordance020.jpg" width="100" height="75" />
			</a>
		</div>
	</div>
	 	 	
	<!-- Pagination -->
 	<div class='ngg-navigation'><span>1</span><a class="page-numbers" href="http://mediadesignprogram.net/affordance/2009/06/16/first-presentation/?nggpage=2">2</a><a class="next" id="ngg-next-2" href="http://mediadesignprogram.net/affordance/2009/06/16/first-presentation/?nggpage=2">&#9658;</a></div> 	
</div>


]]></content:encoded>
			<wfw:commentRss>http://mediadesignprogram.net/affordance/2009/06/16/first-presentation/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Tagging applications</title>
		<link>http://mediadesignprogram.net/affordance/2009/05/28/tagging-applications/</link>
		<comments>http://mediadesignprogram.net/affordance/2009/05/28/tagging-applications/#comments</comments>
		<pubDate>Thu, 28 May 2009 22:31:32 +0000</pubDate>
		<dc:creator>Phil</dc:creator>
				<category><![CDATA[affordance]]></category>
		<category><![CDATA[tools]]></category>
		<category><![CDATA[tags]]></category>

		<guid isPermaLink="false">http://mediadesignprogram.net/affordance/?p=274</guid>
		<description><![CDATA[Mac applications for tagging.

Tag Folders: http://web.me.com/jonstovell/Tag_Folders/Tag_Folders_Home.html
Punakea: http://www.nudgenudge.eu/punakea
TagBot: http://bigrobotsoftware.com/
Tags: http://gravityapps.com/tags/overview/
Leap: http://www.ironicsoftware.com/leap/

Info about tagging

CommonTag &#8211; a new standard for tagging that includes metadata and semantic organization for tags

]]></description>
			<content:encoded><![CDATA[<p>Mac applications for tagging.</p>
<ul>
<li>Tag Folders: <a href="http://web.me.com/jonstovell/Tag_Folders/Tag_Folders_Home.html" target="_blank">http://web.me.com/jonstovell/Tag_Folders/Tag_Folders_Home.html</a></li>
<li>Punakea: <a href="http://www.nudgenudge.eu/punakea" target="_blank">http://www.nudgenudge.eu/punakea</a></li>
<li>TagBot: <a href="http://bigrobotsoftware.com/" target="_blank">http://bigrobotsoftware.com/</a></li>
<li>Tags: <a href="http://gravityapps.com/tags/overview/" target="_blank">http://gravityapps.com/tags/overview/</a></li>
<li>Leap: <a href="http://www.ironicsoftware.com/leap/" target="_blank">http://www.ironicsoftware.com/leap/</a></li>
</ul>
<p>Info about tagging</p>
<ul>
<li><a href="http://www.readwriteweb.com/archives/common_tag_brings_standards_to_metadata.php" target="_blank">CommonTag</a> &#8211; a new standard for tagging that includes metadata and semantic organization for tags</li>
</ul>
]]></content:encoded>
			<wfw:commentRss>http://mediadesignprogram.net/affordance/2009/05/28/tagging-applications/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Excerpt from Productive Interaction Paper</title>
		<link>http://mediadesignprogram.net/affordance/2009/05/28/excerpt-from-productive-interaction-paper/</link>
		<comments>http://mediadesignprogram.net/affordance/2009/05/28/excerpt-from-productive-interaction-paper/#comments</comments>
		<pubDate>Thu, 28 May 2009 17:36:44 +0000</pubDate>
		<dc:creator>Phil</dc:creator>
				<category><![CDATA[Related Research]]></category>
		<category><![CDATA[affordance]]></category>

		<guid isPermaLink="false">http://mediadesignprogram.net/affordance/?p=235</guid>
		<description><![CDATA[Excerpt from Phil&#8217;s Productive Interaction paper. Original Paper: productive_interaction.pdf
Principles and techniques
Productive interaction requires a different approach to design, and a different view of the audience. To help frame these differences, we can look at the development of productive interaction systems through four major vectors:

Content: Information, narrative elements, meanings and sensations as communicated in text, image, video, sound, tactile and other [...]]]></description>
			<content:encoded><![CDATA[<p>Excerpt from Phil&#8217;s Productive Interaction paper. Original Paper: <a href="http://mediadesignprogram.net/affordance/wp-content/uploads/2009/05/productive_interaction.pdf">productive_interaction.pdf</a></p>
<h2><strong>Principles and techniques</strong></h2>
<p>Productive interaction requires a different approach to design, and a different view of the audience. To help frame these differences, we can look at the development of productive interaction systems through four major vectors:</p>
<ul>
<li><em>Content</em>: Information, narrative elements, meanings and sensations as communicated in text, image, video, sound, tactile and other modes.</li>
<li><em>Context</em>: The integrated presentation of content in form, decoration, attitude, organization, selection, values, and experiences.</li>
<li><em>Affordance</em>: The handles that enable the audience to work with and manipulate the content and context.</li>
<li><em>Audience</em>: The users as integral elements of the total system, who operate it through the affordances, and who create the final expressions.</li>
</ul>
<p><span id="more-235"></span></p>
<p>In this framework, design is a radically non-linear process of engagement and making, spinning a complex and recursive relationship between the domains of content, context, affordance and audience. Here, each element influences the design of the other as the designer builds up a full, yet flexible and open work that relies on the user as an active collaborator.</p>
<p>With the vectors of content, context, affordance, and audience, what approaches are available to the designer? The following is a selected taxonomy of design principles and techniques for productive interaction. Note that the categorizations are somewhat arbitrary, because each of the four is tightly interwoven and interdependent.</p>
<h3><em><strong><span style="font-style: normal;"><span style="color: #ff0000;">Content</span></span></strong> </em><em>Context Affordance Audience</em></h3>
<p>Information, narrative elements, meanings and sensations as communicated in text, image, video, sound, tactile and other modes.</p>
<ul>
<li><strong>not &#8211; linear</strong> – Interactive content elements are designed from the beginning to work by themselves, in combination and juxtaposition, or in dynamically constructed linearities. This is a break from the linear design of content, where things can be predetermined to work well together. In not-liner design, content will often be recombined in ways the designer did not anticipate. As a consequence, each content element needs to have a greater integrity on its own, yet also have an openness that allows it to be connected up with, or juxtaposed against other content elements. For example, in the Physical Music project, musical elements like the bass and drum parts are composed so they will combine with a variety of other elements. This is a very different composition approach than writing for a traditional song, because the composer has to think in a multi-layered way to successfully anticipate the many different combinations. At the same time, there are certain combinations in Physical Music that technically work, but are “bad” sounding. This is okay, and even beneficial to the overall effectiveness of the work because the user needs to have the flexibility of failure to fully explore the music. In addition, what may sound “bad” to the composer may well fit into a “good” composition by the user. This productive misuse of a system often indicates a truly successful interactive design, and is an important design goal.</li>
<li><strong>smart </strong>– Interactive content can be enhanced with attached metadata to give it machine-actionable semantics. Software can then manipulate the content based on that metadata, providing multiple, rich views and handles on it. For example, in Topic Explorer the body text has selected phrases tagged as interesting pull-quotes, these quotes can be separately displayed as appropriate to provide interesting gateways into the body text. Similarly, if text facets are tagged with different keywords, the software can organize and present the content and summaries based on the explicit or implicit actions of the user. XML is an obvious system for implementing this approach, and is how Topic Explorer tags author identified pull quotes and excerptable headings. A more sophisticated way to look at content is to think of each element as a smart object that behaves through its own set of designer imposed rules and behaviors. A kind of artificial-life version of text, image, and data, where meaning and behavior emerge from the collective actions of the media elements as choreographed by the user.</li>
<li><strong>associative</strong> – Links and associations between content facets are both authored and generated algorithmically, providing a means for the user (and system) to build on-the-fly relationships between content facets. These associations can be as simple as hyperlinks, or they can define complex interrelationships that are neither hierarchical nor one-toone. Associations don’t need to change the entire context as typical web links do when they load a new page. Instead, they can help build up and vary a rich, multi-faceted collection of content that’s accessible all at once.</li>
<li><strong>dynamically updatab</strong><strong>le</strong> – Content can be revised, added to, and subtracted from after the initial work is released. The changes may come from the original author, be applied algorithmically, come from external sources, or be contributed by the audience. They Rule changes over time because users contribute new maps, which then change in their prominence because users rate the maps.</li>
</ul>
<p> </p>
<h3><em>Content </em><span style="color: #ff0000;">Context</span><em> </em><em>Affordance Audience</em></h3>
<p>The integrated presentation of content in form, decoration, attitude, organization, selection, values, and experiences.</p>
<ul>
<li><strong>system as facilitator/provocateur</strong> – Productive interactive systems are designed to actively help the user produce the meaning and knowledge they want. The designer may author the application to facilitate this in an assistive and collaborative way, or she may use a more provocative style, pushing the user in directions they may not be considering. </li>
<li><strong>real-time juxtaposition</strong> – The system can dynamically present combinations of elements that evoke new contexts, perceptions, and connections and enable the user to experiment and engage with these combinations. There’s a qualitative difference between static, fixed juxtaposition and the dynamic, real-time juxtaposition of productive interaction, especially when the user participates in the creation of the juxtaposition. The act of causing juxtaposition makes the user complicit and creates a more visceral connection with it. In the Topic Explorer, the user creates real-time juxtapositions by selecting the search keywords. New combinations of the two different texts are simultaneously displayed each time a keyword is selected, allowing the user to see the politicians’ views side by side in ways they might never have seen or considered before. </li>
<li><strong>adaptation</strong> – The system and its elements should be aware of current and past contexts, and behave in interesting and productive ways based on those contexts. Actionable contexts include user preferences, the state of other content elements, geographic location, time, events, news, etc. The adaptive system reconfigures itself based on these contexts. For example, mobile phones can adapt to a new location by presenting appropriate shopping information for the current neighborhood. Further, the phone could know the user’s current interests and preferences and provide more appropriate information according to that context. </li>
<li><strong>serendipity</strong> – Natural systems such as libraries and design studios provide ample opportunity for productive browsing, happenstance, coincidence, diversion and digression. These valuable opportunities for random and intentional unexpectedness can trigger new directions and new ways of seeing things, and should be built into interactive systems. For example, in the Topic Explorer experiment, the serendipity stream provides an alternative mode to reading the material in a linear way. The user can turn to this approach as a way to see the material in a new light and be surprised by perspectives they may not have seen otherwise. </li>
<li><strong>constructed simultaneity</strong> &#8211; Material can be presented in a live, multi-channel format, where content facets are played back at the same time, but in different combinations as driven by the interaction. This real-time, constructed simultaneity provides a rich, intensive interaction environment for the user to chart a path through. In the Physical Music project, the user is playing with simultaneous combinations of musical elements, orchestrating arrangements, adding and subtracting, filtering and modifying. In Topic Explorer, the user views two texts at once, driving them to related issues by using the keyword search. See also remixing below. </li>
<li><strong>center/periphery, explicit/implicit , attending/</strong><strong>attuning</strong> – John Sealy Brown identifies the importance of enabling the user to have simultaneous access to a range of material, some of which is in the center of attention, much of which is attuned to on the periphery. Designers must use subtle, wide-bandwidth techniques for enriching the flow of use, offering means of focus and unfocus that provide a fuller simultaneous content landscape without overwhelming the user. </li>
<li><strong>passive interaction</strong> – While active interaction by the user is central, sometimes the system interacts with itself to advance facilitation and provocation. It does this by taking the place of the user, getting a handle on the affordances and changing things, while the user remains passive or focused on other elements. The video game “attract mode” is a classic example of this, where if an arcade game is left unused for a period, it drops into a self-playing mode to attract new customers. In the Topic Explorer, the serendipity stream runs on its own, displaying a continuous set of options that can be can be attended to or not.</li>
<li><strong>presets</strong> – The designer can provide different presets that configure a system with many capabilities. These presets establish a starting point with immediate usefulness, and can assist the user in successfully climbing the learning curve and/or returning to a more known state. They also provide the designer with an opportunity to frame a highly crafted presentation in the context of dynamic and sometimes entropic systems. Physical Music uses presets to provide the user with “good” sounding arrangements from which they can diverge, experiment, and create their own presets.</li>
</ul>
<p> </p>
<h3><em>Content Context </em><span style="color: #ff0000;">Affordance</span><em> </em><em>Audience</em></h3>
<p>The handles that enable the audience to work with and manipulate the content and context.</p>
<ul>
<li><strong>faceting</strong> – Content and meaning can be viewed in different perspectives, individually or in combinations as a way to provide focus/periphery, juxtaposition and simultaneity. Faceting is a system of dynamically working content, like a table full of different books opened to pages of related information. In the Text Facets exploration, the user is able to see four different facets at once rather than having to scroll through a long, linear set of text or opening up individual pages for each set of text. </li>
<li><strong>excerpting</strong> – The user needs different ways of seeing and accessing material at different levels – full versions, clips, indexes, tables of contents and hyperlinks are “traditional” ways. But interaction allows for dynamically generated, user-controlled excerpts derived from the actual material – a kind of real-time clipping and summarizing service. This provides the user with means to pull out, highlight, and juxtapose content elements in new and useful ways. These excerpts can be created from metatagged sections of the content (e.g. predefined pull-quotes), or generated through algorithms (e.g. random pullquotes). In the Topic Explorer, the serendipity stream does exactly this kind of excerpting as an alternative to manually browsing through the full text or using a more traditional table of contents or index. </li>
<li><strong>filtering</strong> – With large amounts of content available, there’s a need to look at different subsets of material. Filters provide a way to view material by commonalities (filtering in), or eliminate material to clarify and reveal what’s left (filtering out). The filtering can be “hard”, eliminating material completely, or “soft”, pushing the extra material to the periphery. </li>
<li><strong>remixing</strong> – As a way to provide a deep engagement with the material, the system can enable the re-ordering, re-combination, and re-constitution of the material. This makes it possible for the user to make their own sequences, change the layering and mixing of simultaneous materials, mute and solo parts, and alter elements. The user becomes a DJ, with an array of media EQ, mixers, turntables, and effects. In the case of They Rule, the user turns organizations and board members on and off, expands and contracts displays, and moves elements around on the screen in a process of building a “mix,” or map that builds a new understanding of the relationships. </li>
<li><strong>wide bandwidth interaction</strong> – To rival other media, interactive systems must move beyond the impoverished mouse-crouch of current computing, to systems that more fully Philip van Allen Productive Interaction v.11/14/04 Page 14 engage human physical-spatial powers. This will involve designing for large, highresolution screens, tangible interfaces, multiple interaction devices, haptic feedback, gestural control, and new sensors that increase the resolution and quality of the interaction and outcomes. It requires moving beyond the zoetrope character of today’s interactive media. As a simple example, Topic Explorer is designed for a large video display to allow the user to see a full range of information at the same time. Similarly, the Minority Report interface provides a rich information landscape and a variety of mechanisms to manipulate and interact with that information. </li>
<li><strong>authoring, configuration, performanc</strong>e – Interactive systems commonly have use patterns that involve authoring, configuration and performance. The designer must provide different affordances for each of the modes. For example, a person fluidly takes photos (hopefully) without thinking about interface – a kind of performance. In a different mode, the photographer needs to configure their camera to take a self-timer picture. And in another mode, they would author a slideshow for their friends. Interactive designers must consider these different uses (and the transitions between them); providing the most appropriate affordances. These may be nicely integrated in a single “non-modal” interface, or they may be separated across independent devices (e.g. a camera for performance and configuration, and iPhoto on a computer for the slide show authoring). </li>
<li><strong>separation and clarity of functio</strong>n – Integrating all capabilities into a single system is sometimes useful, but it’s often better to create different affordance systems for different uses. Separating the capabilities may involve a reconfiguration of one device with different sets of affordance, or separation of capability into different devices. “Convergence” is not always the best approach. </li>
<li><strong>custom affordance</strong> – Systems can have a variety of capabilities, and rather than imposing a single set of affordances, the designer may enable the user to pick or create their preferred affordance set. Macro keys that perform a series of OS tasks are a simple example of this. An advanced approach for custom affordance would have the system publish its capabilities and allow various independent affordances/devices to “latch” onto selected capabilities. With this, the user could pick a personal system of affordance. E.g. someone could buy a “core” of an iPod with a “published” set of capabilities, and then wrap it with a separately purchased custom skin/interface that taps into a particular subset of those capabilities. Some might pick a skin that that is super small with limited access to capability. Others might want something bigger with handles on more features. Yet others might go primarily for cool style and just the features they like. The fanatics will make and modify their own hotrodded skins.</li>
</ul>
<p> </p>
<h3><em>Content Context Affordance </em><span style="color: #ff0000;">Audience</span></h3>
<p>The users as integral elements of the total system, who operate it through the affordances,and who create the final expressions.</p>
<ul>
<li><strong>contribution</strong> – The audience can move beyond interacting, and contribute their own material, providing content and content structures for later by themselves or a community of users. In They Rule, users can build “maps” and make them available to other users and sharing their insights. </li>
<li><strong>social design</strong> – Interaction design not only involves consideration of the current user(s), but of the social context in which the system is used. The “interaction” extends beyond the “interface” and into the social system that surrounds the system – people discuss and advise each other about the system, use it collaboratively, contribute to the system and share with others, fit the system into existing working methodologies, and use it to create new ones. </li>
<li><strong>user as content</strong> – If we extend the interactive system out to include the user, we begin to create very rich relationships and unique outcomes. For example, the system could automatically (with permission) sense the user’s information (age, preferences, past interactions, opinions, medical info, etc.), and adjust to it. In other words, the idea of metadata is extended to the user, who is tagged with a variety of information that can be incorporated into the interactive presentation.</li>
</ul>
]]></content:encoded>
			<wfw:commentRss>http://mediadesignprogram.net/affordance/2009/05/28/excerpt-from-productive-interaction-paper/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>A taxonomy for and analysis of tangible interfaces</title>
		<link>http://mediadesignprogram.net/affordance/2009/05/26/a-taxonomy-for-and-analysis-of-tangible-interfaces/</link>
		<comments>http://mediadesignprogram.net/affordance/2009/05/26/a-taxonomy-for-and-analysis-of-tangible-interfaces/#comments</comments>
		<pubDate>Tue, 26 May 2009 20:50:29 +0000</pubDate>
		<dc:creator>Phil</dc:creator>
				<category><![CDATA[Related Research]]></category>

		<guid isPermaLink="false">http://mediadesignprogram.net/affordance/?p=173</guid>
		<description><![CDATA[By Kenneth P. Fishkin
Personal and Ubiquitous Computing (2004) 8: 347–358 
Abstract 
There have been many research efforts devoted to tangible user interfaces (TUIs), but it has proven difficult to create a definition or taxonomy that allows us to compare and contrast disparate research efforts, integrate TUIs with conventional interfaces, or suggest design principles for future efforts. To address [...]]]></description>
			<content:encoded><![CDATA[<p>By Kenneth P. Fishkin<br />
Personal and Ubiquitous Computing (2004) 8: 347–358 </p>
<p>Abstract </p>
<p>There have been many research efforts devoted to tangible user interfaces (TUIs), but it has proven difficult to create a definition or taxonomy that allows us to compare and contrast disparate research efforts, integrate TUIs with conventional interfaces, or suggest design principles for future efforts. To address this problem, we present a taxonomy, which uses metaphor and embodiment as its two axes. This 2D space treats tangibility as a spectrum rather than a binary quantity. The further from the origin, the more ‘‘tangible’’ a system is. We show that this spectrum-based taxonomy offers multiple advantages. It unifies previous categorizations and definitions, integrates the notion of ‘‘calm computing,’’ reveals a previously un-noticed trend in the field, and suggests design principles appropriate for different areas of the spectrum.</p>
<p><a href="http://mediadesignprogram.net/affordance/wp-content/uploads/2009/05/a-taxonomy-for-tangible-interfaces.pdf">a-taxonomy-for-tangible-interfaces</a></p>
]]></content:encoded>
			<wfw:commentRss>http://mediadesignprogram.net/affordance/2009/05/26/a-taxonomy-for-and-analysis-of-tangible-interfaces/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Bill Gaver&#8217;s Technology Affordances</title>
		<link>http://mediadesignprogram.net/affordance/2009/05/26/bill-gavers-technology-affordances/</link>
		<comments>http://mediadesignprogram.net/affordance/2009/05/26/bill-gavers-technology-affordances/#comments</comments>
		<pubDate>Tue, 26 May 2009 20:44:10 +0000</pubDate>
		<dc:creator>Phil</dc:creator>
				<category><![CDATA[Related Research]]></category>

		<guid isPermaLink="false">http://mediadesignprogram.net/affordance/?p=160</guid>
		<description><![CDATA[By Bill Gaver
Proceedings of CHI&#8217;91, (New Orleans, Lousiana, April 28 &#8211; May 2, 1991), ACM, New York, pp. 79-84.

ABSTRACT 
Ecological approaches to psychology suggest succinct accounts of easily-used artifacts. Affordances are properties of the world that are compatible with and relevant for people&#8217;s interactions. When affordances are perceptible, they offer a direct link between perception and action; [...]]]></description>
			<content:encoded><![CDATA[<p>By Bill Gaver<br />
Proceedings of CHI&#8217;91, (New Orleans, Lousiana, April 28 &#8211; May 2, 1991), ACM, New York, pp. 79-84.</p>
<div>
<p>ABSTRACT </p>
<p>Ecological approaches to psychology suggest succinct accounts of easily-used artifacts. Affordances are properties of the world that are compatible with and relevant for people&#8217;s interactions. When affordances are perceptible, they offer a direct link between perception and action; hidden and false affordances lead to mistakes. Complex actions can be understood in terms of groups of affordances that are sequential in time or nested in space, and in terms of the abilities of different media to reveal them. I illustrate this discussion with several examples of interface techniques, and suggest that the concept of affordances can provide a useful tool for user-centered analyses of technologies.</p>
<p><span style="color: #0000ee; text-decoration: underline;"><a rel="attachment wp-att-161" href="http://mediadesignprogram.net/affordance/?attachment_id=161">technology affordances chi 91</a></span></div>
]]></content:encoded>
			<wfw:commentRss>http://mediadesignprogram.net/affordance/2009/05/26/bill-gavers-technology-affordances/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>First proposal for affordance list</title>
		<link>http://mediadesignprogram.net/affordance/2009/05/26/first-proposal-for-affordance-list/</link>
		<comments>http://mediadesignprogram.net/affordance/2009/05/26/first-proposal-for-affordance-list/#comments</comments>
		<pubDate>Tue, 26 May 2009 19:45:53 +0000</pubDate>
		<dc:creator>Phil</dc:creator>
				<category><![CDATA[affordance]]></category>
		<category><![CDATA[collaboration]]></category>
		<category><![CDATA[detailed]]></category>
		<category><![CDATA[expressive]]></category>
		<category><![CDATA[ideas]]></category>
		<category><![CDATA[location]]></category>
		<category><![CDATA[psychology]]></category>
		<category><![CDATA[reflection]]></category>
		<category><![CDATA[sketching]]></category>
		<category><![CDATA[tools]]></category>

		<guid isPermaLink="false">http://mediadesignprogram.net/affordance/?p=144</guid>
		<description><![CDATA[
Contents
[hide]

1 Location/scale
2 Sketching
3 Refined, precise, detailed
4 Broad, large, expressive
5 Tools
6 Reflection
7 Collaboration
8 Idea generation
9 Learning/design process
10 Manipulating Psychological State


Here is a first rough attempt at a list of affordances. These don&#8217;t always get to the afforded activity &#8211; needs fleshing out and re-working. This is kind of brain-dump and so the list is not consistent [...]]]></description>
			<content:encoded><![CDATA[<div class='contents'>
<h3>Contents</h3>
<p>[<a class='show' onclick='toggle_hide_show(this)'>hide</a>]
<ol class='content_list'>
<li><a href='#Location/scale'>1 Location/scale</a></li>
<li><a href='#Sketching'>2 Sketching</a></li>
<li><a href='#Refined, precise, detailed'>3 Refined, precise, detailed</a></li>
<li><a href='#Broad, large, expressive'>4 Broad, large, expressive</a></li>
<li><a href='#Tools'>5 Tools</a></li>
<li><a href='#Reflection'>6 Reflection</a></li>
<li><a href='#Collaboration'>7 Collaboration</a></li>
<li><a href='#Idea generation'>8 Idea generation</a></li>
<li><a href='#Learning/design process'>9 Learning/design process</a></li>
<li><a href='#Manipulating Psychological State'>10 Manipulating Psychological State</a></li>
</ol>
</div>
<p>Here is a first rough attempt at a list of affordances. These don&#8217;t always get to the afforded activity &#8211; needs fleshing out and re-working. This is kind of brain-dump and so the list is not consistent in tone or approach.</p>
<p><span id="more-144"></span><br />
<a name='Location/scale'></a><br />
<h2>Location/scale</h2>
<ul>
<li>handheld and can be easily moved
<ul>
<li>portability</li>
<li>think with hands</li>
<li>vary location</li>
<li>enable social interaction, collaboration</li>
<li>enables multiples for crit, comparison, juxtaposition in small field of view</li>
</ul>
</li>
<li>fixed in space, not easily moved
<ul>
<li>it&#8217;s a place to go to &#8211; exists in space (and in the head)</li>
<li>enables people to come together without planning</li>
<li>site specificity &#8211; relation to culture, objects, context</li>
</ul>
</li>
<li>various scales
<ul>
<li>hand scale, 4&#8243; &#8211; intimate, fine use of hands</li>
<li>book scale, 8&#8243; &#8211; good for writing and reading, narrow field of view enables single focus</li>
<li>arm&#8217;s length scale, 3&#8242;-4&#8242; &#8211; enables simultaneity, broad gestures, fills field of view</li>
<li>human scale, 5&#8242;-8&#8242; &#8211; evokes emotion, enables standing, full body sensation</li>
<li>car scale, 12&#8242; &#8211; requires movement to see entire, </li>
<li>building scale, 20&#8242; &#8211; evokes shelter, social, modulates light</li>
</ul>
</li>
<li>defines and visualize a physical or imaginary location in space &#8211; enables spatial mental representation &amp; manipulation</li>
<li>sit/stand</li>
<li>can spread-out work</li>
</ul>
<p><a name='Sketching'></a><br />
<h2>Sketching</h2>
<ul>
<li>little prep</li>
<li>rough work easy</li>
<li>lots of ideas quickly</li>
<li>low cost materials means little censoring</li>
<li>tangible output to assist in metaphor, reflection, ??? </li>
<li>helps brainstorm, idea generation</li>
</ul>
<p><a name='Refined, precise, detailed'></a><br />
<h2>Refined, precise, detailed</h2>
<ul>
<li>engages fingers, hands in gestures</li>
<li>learning curve enables fine, controlled motor skills</li>
<li>wide range of expression possible</li>
</ul>
<p><a name='Broad, large, expressive'></a><br />
<h2>Broad, large, expressive</h2>
<ul>
<li>big gestures</li>
<li>enables use of arms, other parts of body</li>
<li>wide field of vision</li>
</ul>
<p><a name='Tools'></a><br />
<h2>Tools</h2>
<ul>
<li>evocative, tool has character
<ul>
<li>specific, narrow-range, idiosyncratic, rich, evocative</li>
<li>general, adjustable, wide-range</li>
</ul>
</li>
<li>learning curve
<ul>
<li>learning curve minimal, fast to use</li>
<li>learning curve maximal, lots of nuance to expression</li>
<li>both are possible in some, but not always</li>
</ul>
</li>
<li>tools for making tools &#8211; custom for the designer&#8217;s practice, or specific project</li>
<li>tools for making processes - custom for the designer&#8217;s practice, or specific project</li>
</ul>
<p><a name='Reflection'></a><br />
<h2>Reflection</h2>
<ul>
<li>juxtaposition &#8211; see ideas in comparison to each other</li>
<li>isolation &#8211; of person, or of content
<ul>
<li>focus, eliminates context, losing yourself in it, flow</li>
</ul>
</li>
<li>viewable outside the mind &#8211; tangible, in the world, sensible</li>
<li>evokes ideas in the mind</li>
<li>editable</li>
</ul>
<p><a name='Collaboration'></a><br />
<h2>Collaboration</h2>
<ul>
<li>social interaction
<ul>
<li>group can see the same thing, shared experience</li>
<li>each can communicate with others</li>
<li>each can manipulate thing</li>
<li>&#8220;eye-contact&#8221;</li>
</ul>
</li>
<li>pin-up</li>
<li>synchronous and asynchronous discussion</li>
<li>divide into parts for individual work</li>
<li>scale of collaboration requires some different approaches</li>
</ul>
<p><a name='Idea generation'></a><br />
<h2>Idea generation</h2>
<ul>
<li>visualization of ideas</li>
<li>externalize &amp; organize</li>
<li>think by writing</li>
<li>think by sketching</li>
<li>think by making</li>
<li>serendipity</li>
<li>inspiration</li>
<li>define principles/constraints</li>
<li>enables complete absorption/flow</li>
<li>disrupt flow/absorption</li>
</ul>
<p><a name='Learning/design process'></a><br />
<h2>Learning/design process</h2>
<ul>
<li>test ideas</li>
<li>experiment with multiple approaches</li>
<li>learn medium in context of project</li>
<li>learn materials in context of project</li>
<li>organize</li>
<li>make a mess</li>
<li>reorganize/refactor</li>
<li>sequence</li>
<li>breakdown into tasks</li>
</ul>
<p><a name='Manipulating Psychological State'></a><br />
<h2>Manipulating Psychological State</h2>
<ul>
<li>ability to change modes through the day</li>
<li>concentration</li>
<li>distraction</li>
<li>entry into &#8220;flow&#8221;/absorption/focus</li>
<li>contemplation</li>
<li>daydreaming</li>
<li>discharge nervous energy</li>
<li>create nervous energy</li>
<li>enable thinking/analysis by moving around (physically/mentally)</li>
</ul>
]]></content:encoded>
			<wfw:commentRss>http://mediadesignprogram.net/affordance/2009/05/26/first-proposal-for-affordance-list/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Phil&#8217;s first refactoring of brainstorming</title>
		<link>http://mediadesignprogram.net/affordance/2009/05/20/phils-first-refactoring-of-brainstorming/</link>
		<comments>http://mediadesignprogram.net/affordance/2009/05/20/phils-first-refactoring-of-brainstorming/#comments</comments>
		<pubDate>Wed, 20 May 2009 21:38:30 +0000</pubDate>
		<dc:creator>Phil</dc:creator>
				<category><![CDATA[big ideas]]></category>
		<category><![CDATA[homepage]]></category>

		<guid isPermaLink="false">http://mediadesignprogram.net/affordance/?p=23</guid>
		<description><![CDATA[
Contents
[hide]

1 Overview
2 How Designers Work &#8211; Areas of Interest
2.1 Focus on Meaning Making
2.2 Designers operate in two different modes: Making Ideas and Making Bits
2.3 Design Process: Hand -&#62; Tool -&#62; Content -&#62; Format
2.4 Gestures of Expression
3 Our Approach to a Taxonomy of Affordance
3.1 Goals for a taxonomy
3.2 Focus on Meaning Making Affordances
3.3 What kinds of affordances [...]]]></description>
			<content:encoded><![CDATA[<div class='contents'>
<h3>Contents</h3>
<p>[<a class='show' onclick='toggle_hide_show(this)'>hide</a>]
<ol class='content_list'>
<li><a href='#Overview'>1 Overview</a></li>
<li><a href='#How Designers Work - Areas of Interest'>2 How Designers Work &#8211; Areas of Interest</a></li>
<li class='lvl2'><a href='#Focus on Meaning Making'>2.1 Focus on Meaning Making</a></li>
<li class='lvl2'><a href='#Designers operate in two different modes: Making Ideas and Making Bits'>2.2 Designers operate in two different modes: Making Ideas and Making Bits</a></li>
<li class='lvl2'><a href='#Design Process: Hand -&gt; Tool -&gt; Content -&gt; Format'>2.3 Design Process: Hand -&gt; Tool -&gt; Content -&gt; Format</a></li>
<li class='lvl2'><a href='#Gestures of Expression'>2.4 Gestures of Expression</a></li>
<li><a href='#Our Approach to a Taxonomy of Affordance'>3 Our Approach to a Taxonomy of Affordance</a></li>
<li class='lvl2'><a href='#Goals for a taxonomy'>3.1 Goals for a taxonomy</a></li>
<li class='lvl2'><a href='#Focus on Meaning Making Affordances'>3.2 Focus on Meaning Making Affordances</a></li>
<li class='lvl2'><a href='#What kinds of affordances should we look at?'>3.3 What kinds of affordances should we look at?</a></li>
<li class='lvl2'><a href='#Format of the Taxonomy'>3.4 Format of the Taxonomy</a></li>
<li><a href='#Prototype Directions'>4 Prototype Directions</a></li>
<li class='lvl2'><a href='#Tools for Making Ideas'>4.1 Tools for Making Ideas</a></li>
</ol>
</div>
<p><a name='Overview'></a><br />
<h2>Overview</h2>
<p>We covered a lot of ground in the first couple days, and I think it sets the stage well for our research. It seems to me that we&#8217;re covering three main areas.</p>
<ol>
<li>defining how designers work and what parts of that we&#8217;re interested in.</li>
<li>defining our approach to building a taxonomy</li>
<li>identifying potential directions for our prototypes</li>
</ol>
<p><span id="more-23"></span><br />
<a name='How Designers Work - Areas of Interest'></a><br />
<h2>How Designers Work &#8211; Areas of Interest</h2>
<p>In order to focus our work and chart out a unique area of research we have to narrow and refine what we&#8217;re looking at. I think we agreed that we are less concerned about the specifics of mark-making and gestural aspects of the designer&#8217;s tools. Others have covered much of that, and we think we can contribute more in the modes of design as they relate to making/crafting/forming/generating meaning. A big breakthrough in our thinking about design process was that designers not only make tangible outcomes, but as important to their process, <em><strong>designers make ideas from which the tangible outcomes result</strong></em>. In addition, we identified a pattern of making (at least for the tangible output) of, roughly, Hand -&gt;Tool -&gt;  Content -&gt; Format.<br />
<a name='Focus on Meaning Making'></a><br />
<h3>Focus on Meaning Making</h3>
<p>For both the taxonomy and working prototypes, we&#8217;re focusing on how designers make meaningful results rather than the lower level aspects of gesture, form-making and mark-making. In particular:</p>
<ul>
<li><strong>making bits <em>and</em> ideas:</strong> the design process that we consider must include affordances around idea making as well as making bits (see below for more)</li>
<li><strong><em>meaningful</em> modes of expression</strong>: we&#8217;re interested in how tools afford expressive and interesting making of meaning. The metaphor of musical instruments was raised in terms of how simple they are, yet how wide a range of output is possible (with skill). Further, we&#8217;re interested in the specific, idiosyncratic output tools afford. And lastly, we like tools that afford creative abuse.</li>
</ul>
<p><a name='Designers operate in two different modes: Making Ideas and Making Bits'></a><br />
<h3>Designers operate in two different modes: Making Ideas and Making Bits</h3>
<p>We realized that a designers process for design includes two parts. Often the designers spends a significant amount of time generating ideas, whether through thinking, note making, sketching or other process. Ultimately, this process is about helping the designer shape what&#8217;s inside their head (or the collective heads of a group) rather than making tangible output. This part of design requires significantly different kinds of affordances than producing tangible output (bits). The designer often slides easily between the realm of ideas and made outcomes, and there is not always a clear dividing line.</p>
<p>Nevertheless, we believe that the affordances needed for making ideas vs. making bits are substantially different. And we believe that the realm of tools with affordances for making ideas for designers is fertile ground for digital enhancement.<br />
<a name='Design Process: Hand -&gt; Tool -&gt; Content -&gt; Format'></a><br />
<h3>Design Process: Hand -&gt; Tool -&gt; Content -&gt; Format</h3>
<p>In trying to understand the methodology of design in relation to affordance, we came to the following understanding:</p>
<ul>
<li>The designer makes a gesture with part of their body, typically the <strong>HAND</strong></li>
<li>That gesture intersects with a <strong>TOOL</strong> of some sort</li>
<li>The tool operates on some form of <strong>CONTENT</strong>, either turning <strong>raw materials</strong> into communication, or reworking in some way existing &#8220;<strong>samples</strong>&#8221; into new forms.</li>
<li>The working of the content intersects with its context which is the <strong>FORMAT</strong> of the communication, such as an 8 1/2&#8243; x 11&#8243; paper, or multimedia installation in a 20&#8242;x40&#8242; room.</li>
</ul>
<p><a name='Gestures of Expression'></a><br />
<h3>Gestures of Expression</h3>
<p>We found 3 types of high level gestures for working with content as a way of creating a meaningful expression. Any of these three modes can be done in isolation or in combination.</p>
<ul>
<li>Additive/Generative &#8211; This is create new content out of thin air. Whether typing letters into a word-processor, applying graphite to paper, or making new vector shapes in Illustrator, the designer builds up new content.</li>
<li>Subtractive &#8211; This approach involves a process of removing material from existing content in a process of editing and eliminating.</li>
<li>Manipulative &#8211; Here the designer works with existing material to rearrange, distort, combine, and juxtapose.</li>
</ul>
<p><a name='Our Approach to a Taxonomy of Affordance'></a><br />
<h2>Our Approach to a Taxonomy of Affordance</h2>
<p>In trying to situate our research and develop a taxonomy of affordance, we discussed the goals of the taxonomy, the areas of affordance we&#8217;re interested in, and the format of the taxonomy.<br />
<a name='Goals for a taxonomy'></a><br />
<h3>Goals for a taxonomy</h3>
<p>We identified the following goals for our taxonomy of affordance:</p>
<ul>
<li>Provide designers with inspiration for invention</li>
<li>Analyze and understand design practice</li>
<li>Inform the discourse of design</li>
<li>Provide tools for design pedagogy</li>
</ul>
<p>To achieve these goals, we&#8217;ll want to eventually publish our results in a range of forms including a website, conference papers, and articles.<br />
<a name='Focus on Meaning Making Affordances'></a><br />
<h3>Focus on Meaning Making Affordances</h3>
<p>Rather than concentrate on detailed gestures of mark-making or the detailed affordances of tools and how they operate, we decided to focus our efforts on the quality of meaning making that affordances offer. As discussed earlier, we&#8217;re interested in:</p>
<ul>
<li><strong>range of output</strong> &#8211; that affordances offer useful ranges of output in terms of making meaningful output</li>
<li><strong>idiosyncratic output</strong> &#8211; we think that the character of the affordance is extremely important, and that often the best tools have a personality, and a somewhat idiosyncratic and rich way of interpreting the designer&#8217;s gesture. This means that the design can select a particular tool knowing its character and how that may fit their desired meaning.</li>
<li><strong>creative abuse</strong> &#8211; often the best tools do their particular job well, but also afford creative abuse. i.e. permit unintended uses that the designer discovers in through process of design.</li>
</ul>
<p>More generally, we&#8217;re interested in the designer&#8217;s process at the level of meaning making, the creative moment, and also as discussed the making of ideas.<br />
<a name='What kinds of affordances should we look at?'></a><br />
<h3>What kinds of affordances should we look at?</h3>
<p>We&#8217;re still in discussion on what affordances to look at. Should it be for making bits, making ideas, or? And should we also look at the affordances of humans? I.e. what role do they play in the mix? Hunter discusses this more in this post: <a href = 'http://mediadesignprogram.net/affordance/2009/05/20/human-affordance-and-ideation/' >Human Affordance and Ideation</a><br />
<a name='Format of the Taxonomy'></a><br />
<h3>Format of the Taxonomy</h3>
<p>We discussed different forms of taxonomy, from hierarchical to grid based. But we are leaning towards some form of database driven taxonomy that affords the user to get at the collection in a range of ways, producing their own conclusions through an interactive and computational driven approach. In particular, we think that some form of tagging and possibly rating characteristics may provide the best and most flexible taxonomy.</p>
<p>We may need to build a custom database to achieve this.<br />
<a name='Prototype Directions'></a><br />
<h2>Prototype Directions</h2>
<p>While more discussion is needed, we identified several areas of potential work in prototypes. First, each RA is interested in the following (these need expansion):</p>
<ul>
<li>Hyun &#8211; How tools and affordances can be customizable, and how tools can learn the designer</li>
<li>Chris &#8211; how can affordances help develop a culture for designers. also what affordances can help give media elements &#8220;thing qualities&#8221; through their behavior, agency, etc.</li>
<li>Hunter &#8211; How does the workspace itself become a tool for design. How does it shape context, help with collaboration (within design and across other disciplines), and how can mobile tools afford the designer more power as they operate in different environments including working in other people&#8217;s workspaces.</li>
</ul>
<p><a name='Tools for Making Ideas'></a><br />
<h3>Tools for Making Ideas</h3>
<p>In addition to these areas of interest, a new idea was developed. Out of our discussion on making bits and making ideas, we came to the realization that there is an interesting opportunity in creating something that will help designers in their generation and refinement of ideas. This system might have the following characteristics:</p>
<ul>
<li>Helps manage project ideas and documents</li>
<li>Permits sketching in many forms, and maintains a history of sketches</li>
<li>Helps with brainstorming</li>
<li>Is a separate device from the &#8220;workstation&#8221;</li>
<li>Automatically tracks documents as they are created, and assists in the collection of those documents into projects</li>
<li>Assists in the management of projects in terms of organizing ideas, documents, and outcomes.</li>
<li>Also permits the leveraging of previous projects in the starting of new projects, e.g. copying an old project to establish a starting point for something new.</li>
</ul>
]]></content:encoded>
			<wfw:commentRss>http://mediadesignprogram.net/affordance/2009/05/20/phils-first-refactoring-of-brainstorming/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>2nd day of brainstorming</title>
		<link>http://mediadesignprogram.net/affordance/2009/05/19/2nd-day-of-brainstorming/</link>
		<comments>http://mediadesignprogram.net/affordance/2009/05/19/2nd-day-of-brainstorming/#comments</comments>
		<pubDate>Wed, 20 May 2009 04:54:12 +0000</pubDate>
		<dc:creator>Phil</dc:creator>
				<category><![CDATA[whiteboard]]></category>

		<guid isPermaLink="false">http://mediadesignprogram.net/affordance/?p=14</guid>
		<description><![CDATA[Whiteboard images from day 2 of brainstorming
]]></description>
			<content:encoded><![CDATA[<p>Whiteboard images from day 2 of brainstorming</p>

<div class="ngg-galleryoverview" id="ngg-gallery-3-14">


	<!-- Piclense link -->
	<div class="piclenselink">
		<a class="piclenselink" href="javascript:PicLensLite.start({feedUrl:'http://mediadesignprogram.net/affordance/wp-content/plugins/nextgen-gallery/xml/media-rss.php?gid=3&amp;mode=gallery'});">
			[View with PicLens]		</a>
	</div>
	
	<!-- Thumbnails -->
		
	<div id="ngg-image-5" class="ngg-gallery-thumbnail-box"  >
		<div class="ngg-gallery-thumbnail" >
			<a href="http://mediadesignprogram.net/affordance/wp-content/gallery/day2whiteboard/img_0312.jpg" title=" " class="shutterset_day2whiteboard" >
				<img title="img_0312.jpg" alt="img_0312.jpg" src="http://mediadesignprogram.net/affordance/wp-content/gallery/day2whiteboard/thumbs/thumbs_img_0312.jpg" width="100" height="75" />
			</a>
		</div>
	</div>
	 		
	<div id="ngg-image-6" class="ngg-gallery-thumbnail-box"  >
		<div class="ngg-gallery-thumbnail" >
			<a href="http://mediadesignprogram.net/affordance/wp-content/gallery/day2whiteboard/img_0313.jpg" title=" " class="shutterset_day2whiteboard" >
				<img title="img_0313.jpg" alt="img_0313.jpg" src="http://mediadesignprogram.net/affordance/wp-content/gallery/day2whiteboard/thumbs/thumbs_img_0313.jpg" width="100" height="75" />
			</a>
		</div>
	</div>
	 		
	<div id="ngg-image-7" class="ngg-gallery-thumbnail-box"  >
		<div class="ngg-gallery-thumbnail" >
			<a href="http://mediadesignprogram.net/affordance/wp-content/gallery/day2whiteboard/img_0314.jpg" title=" " class="shutterset_day2whiteboard" >
				<img title="img_0314.jpg" alt="img_0314.jpg" src="http://mediadesignprogram.net/affordance/wp-content/gallery/day2whiteboard/thumbs/thumbs_img_0314.jpg" width="100" height="75" />
			</a>
		</div>
	</div>
	 		
	<div id="ngg-image-8" class="ngg-gallery-thumbnail-box"  >
		<div class="ngg-gallery-thumbnail" >
			<a href="http://mediadesignprogram.net/affordance/wp-content/gallery/day2whiteboard/img_0315.jpg" title=" " class="shutterset_day2whiteboard" >
				<img title="img_0315.jpg" alt="img_0315.jpg" src="http://mediadesignprogram.net/affordance/wp-content/gallery/day2whiteboard/thumbs/thumbs_img_0315.jpg" width="100" height="75" />
			</a>
		</div>
	</div>
	 	 	
	<!-- Pagination -->
 	<div class='ngg-clear'></div>
 	
</div>


]]></content:encoded>
			<wfw:commentRss>http://mediadesignprogram.net/affordance/2009/05/19/2nd-day-of-brainstorming/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>White board captures from first day</title>
		<link>http://mediadesignprogram.net/affordance/2009/05/14/7/</link>
		<comments>http://mediadesignprogram.net/affordance/2009/05/14/7/#comments</comments>
		<pubDate>Thu, 14 May 2009 15:33:36 +0000</pubDate>
		<dc:creator>Phil</dc:creator>
				<category><![CDATA[whiteboard]]></category>
		<category><![CDATA[pencil]]></category>

		<guid isPermaLink="false">http://mediadesignprogram.net/affordance/?p=7</guid>
		<description><![CDATA[White board captures from May 13th.
]]></description>
			<content:encoded><![CDATA[<p>White board captures from May 13th.</p>

<div class="ngg-galleryoverview" id="ngg-gallery-2-7">


	<!-- Piclense link -->
	<div class="piclenselink">
		<a class="piclenselink" href="javascript:PicLensLite.start({feedUrl:'http://mediadesignprogram.net/affordance/wp-content/plugins/nextgen-gallery/xml/media-rss.php?gid=2&amp;mode=gallery'});">
			[View with PicLens]		</a>
	</div>
	
	<!-- Thumbnails -->
		
	<div id="ngg-image-1" class="ngg-gallery-thumbnail-box"  >
		<div class="ngg-gallery-thumbnail" >
			<a href="http://mediadesignprogram.net/affordance/wp-content/gallery/day1whiteboard/img_0308.jpg" title=" " class="shutterset_day1whiteboard" >
				<img title="img_0308.jpg" alt="img_0308.jpg" src="http://mediadesignprogram.net/affordance/wp-content/gallery/day1whiteboard/thumbs/thumbs_img_0308.jpg" width="100" height="75" />
			</a>
		</div>
	</div>
	 		
	<div id="ngg-image-2" class="ngg-gallery-thumbnail-box"  >
		<div class="ngg-gallery-thumbnail" >
			<a href="http://mediadesignprogram.net/affordance/wp-content/gallery/day1whiteboard/img_0309.jpg" title=" " class="shutterset_day1whiteboard" >
				<img title="img_0309.jpg" alt="img_0309.jpg" src="http://mediadesignprogram.net/affordance/wp-content/gallery/day1whiteboard/thumbs/thumbs_img_0309.jpg" width="100" height="75" />
			</a>
		</div>
	</div>
	 		
	<div id="ngg-image-3" class="ngg-gallery-thumbnail-box"  >
		<div class="ngg-gallery-thumbnail" >
			<a href="http://mediadesignprogram.net/affordance/wp-content/gallery/day1whiteboard/img_0310.jpg" title=" " class="shutterset_day1whiteboard" >
				<img title="img_0310.jpg" alt="img_0310.jpg" src="http://mediadesignprogram.net/affordance/wp-content/gallery/day1whiteboard/thumbs/thumbs_img_0310.jpg" width="100" height="75" />
			</a>
		</div>
	</div>
	 		
	<div id="ngg-image-4" class="ngg-gallery-thumbnail-box"  >
		<div class="ngg-gallery-thumbnail" >
			<a href="http://mediadesignprogram.net/affordance/wp-content/gallery/day1whiteboard/img_0311.jpg" title=" " class="shutterset_day1whiteboard" >
				<img title="img_0311.jpg" alt="img_0311.jpg" src="http://mediadesignprogram.net/affordance/wp-content/gallery/day1whiteboard/thumbs/thumbs_img_0311.jpg" width="100" height="75" />
			</a>
		</div>
	</div>
	 	 	
	<!-- Pagination -->
 	<div class='ngg-clear'></div>
 	
</div>


]]></content:encoded>
			<wfw:commentRss>http://mediadesignprogram.net/affordance/2009/05/14/7/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
