<?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>Letters from the Equator &#187; interaction design</title>
	<atom:link href="http://boonyew.com/blog/category/interaction-design/feed/" rel="self" type="application/rss+xml" />
	<link>http://boonyew.com/blog</link>
	<description>Pursuing a Masters, Life in London, and other Ramblings</description>
	<lastBuildDate>Mon, 26 Jul 2010 23:24:00 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.8.4</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Google Wave is Not About Email</title>
		<link>http://feedproxy.google.com/~r/boon/interaction/~3/kkE86OKCc_o/</link>
		<comments>http://feedproxy.google.com/~r/boon/interaction/~3/kkE86OKCc_o/#comments</comments>
		<pubDate>Mon, 12 Oct 2009 23:39:39 +0000</pubDate>
		<dc:creator>boon</dc:creator>
				<category><![CDATA[interaction design]]></category>
		<category><![CDATA[technology]]></category>
		<category><![CDATA[tools]]></category>
		<category><![CDATA[user experience]]></category>
		<category><![CDATA[web]]></category>

		<guid isPermaLink="false">http://boonyew.com/interaction/?p=339</guid>
		<description><![CDATA[
Everyone&#8217;s hyped up about getting a Google Wave invite. I have one and I don&#8217;t see what the fuss is about. Yes, I&#8217;ve seen the YouTube video, and yes I&#8217;ve watched the Developer Preview video too. It looks great and all, but seriously folks &#8211; it&#8217;s one complicated thing&#8230; next to email.
And this is why [...]]]></description>
			<content:encoded><![CDATA[<p><img class="alignnone size-large wp-image-340" title="Boon - Google Wave_1255390358218" src="http://boonyew.com/interaction/wp-content/uploads/2009/10/Boon-Google-Wave_1255390358218-1024x516.png" alt="Boon - Google Wave_1255390358218" width="614" height="310" /></p>
<p>Everyone&#8217;s hyped up about getting a Google Wave invite. I have one and I don&#8217;t see what the fuss is about. Yes, I&#8217;ve seen the YouTube video, and yes I&#8217;ve watched the Developer Preview video too. It looks great and all, but seriously folks &#8211; it&#8217;s one complicated thing&#8230; next to email.</p>
<p>And this is why Google Wave isn&#8217;t about email. The same way computers aren&#8217;t (just) about calculators.</p>
<p>What it is is real-time collaborative messaging with historical playback. Which, granted, is very good for real-time anything. Except that real-time in human terms is highly contextual.</p>
<p>Because people have better things to do besides sit in front of their computers all day long, they are much better off carrying Blackberries and having push email rather than collaborative messaging. In my opinion, push email works just as well &#8211; because you don&#8217;t need to be in front of a computer to communicate with your colleagues.</p>
<p>Wave is also a tool. Meaning that the interface itself is not the message. In order for users to synthesize information, they have to make sense of it in a collaborative sort of way, which means paying attention to whatever is happening in that messaging window, which takes up at most 1/2 of the screen. It looks and feels like, a video player &#8211; but for messages. Think of IM on steroids, not email.</p>
<p>Email works because it&#8217;s mind-dumbingly easy. And because of that, nobody needs to take 3 week lessons on how to use email &#8211; and that includes your grandpa. And because it&#8217;s so atomic, it can easily be transported as a message to any other atomic messaging forms &#8211; SMS, blog post, forum post, IM chat, whatever.</p>
<p>Waves, on the other hand, are almost asynchronous streams &#8211; anyone can start writing content at anytime into a wave, and hope that it doesn&#8217;t make a mess of the conversation. Last I checked, people still pay attention to body language and subliminal messages, both of which are devoid in Wave but affects the way people communicate collaboratively and socially together &#8211; i.e. turn-taking and all that jazz.</p>
<p>Which part of a wave is atomic? You have to spend effort to calculate and decide. Then you have to find a way of &#8220;clipping&#8221; that message &#8211; and how do you make it portable? Can you cut and paste portions of your wave onto your blog? SMS? can you print it out?</p>
<p>Like email, most of what is published gets fixed in time. But a Wave, is a collection of content played out over time. Just like how photographs put together over time become videos. But with the added complexity of multiple sources of photographs, it becomes more and more difficult to separate and organize content in a Wave.</p>
<p>And that&#8217;s why Google Wave is not about email.</p>
<p>Sites and Articles Relevant to this Post:</p>
<ul>
<li><a href="http://slate.com/id/2232311">It&#8217;s Just Fancy Talk</a></li>
<li><a href="http://easiertounderstandthanwave.com/">EasierToUnderstandThanWave</a></li>
</ul>
<img src="http://feeds.feedburner.com/~r/boon/interaction/~4/kkE86OKCc_o" height="1" width="1"/>]]></content:encoded>
			<wfw:commentRss>http://feedproxy.google.com/~r/boon/interaction/~3/kkE86OKCc_o/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Designing with Methods is a Flaky Thing</title>
		<link>http://feedproxy.google.com/~r/boon/interaction/~3/7lihAayDh2s/</link>
		<comments>http://feedproxy.google.com/~r/boon/interaction/~3/7lihAayDh2s/#comments</comments>
		<pubDate>Sun, 04 Oct 2009 14:25:08 +0000</pubDate>
		<dc:creator>boon</dc:creator>
				<category><![CDATA[interaction design]]></category>
		<category><![CDATA[tools]]></category>
		<category><![CDATA[user experience]]></category>

		<guid isPermaLink="false">http://boonyew.com/interaction/?p=328</guid>
		<description><![CDATA[I&#8217;m currently in a team of 3 people working on a redesign of a website. To me, this feels like my first &#8220;real&#8221; design project, one where I&#8217;ve initiated without any requirements for software implementation. Instead, we began to ask ourselves who are our users, and what exactly are we trying to communicate to them?
User-Centred [...]]]></description>
			<content:encoded><![CDATA[<p>I&#8217;m currently in a team of 3 people working on a redesign of a website. To me, this feels like my first &#8220;real&#8221; design project, one where I&#8217;ve initiated without any requirements for software implementation. Instead, we began to ask ourselves who are our users, and what exactly are we trying to communicate to them?</p>
<h3>User-Centred Design &#8211; Using What Works For Me</h3>
<p>I felt that a lot of &#8220;formal&#8221; usability methods didn&#8217;t help me much, here. I felt somewhat trapped by procedure and process, thinking about best practices for wireframes, personas, user journeys, etc. Having been exposed to too much user experience jargon, I realized that user-centered design isn&#8217;t necessarily synonymous with visual design. In fact, each stakeholder seems to have a different understanding of who the user is, even if the differences are slight.</p>
<p>What ended up working for me was to put down the questions I felt the users would ask (while using the interface/application) onto little bits of post-its, and looked for patterns like organizing those questions into related categories. I organized this in several ways:</p>
<h3>&#8220;User Journey&#8221;-type Things and &#8220;Site Map&#8221;-type Things</h3>
<p>One way of visualizing the questions was to list them out in the <em>style</em> of a &#8220;user journey&#8221;, which were lists of questions laid out in a temporal fashion (e.g. question A leading to question B as a user traversed deeper into the application). This helped me understand which questions to address first, and which to address later. It helped me prioritize my workflow, and make decisions on which interfaces to work on first. It was already obvious that we needed to focus on designing the homepage, but there were other pages that weren&#8217;t immediately obvious, such as a page to help users to &#8220;learn more&#8221; about the product &#8211; that page only came about after looking at the questions from the user journeys.</p>
<p>Another way was to group the questions that were related to one another, and label them as categories. That helped me to visualize the overall site layout, because I absolutely hate building software in the dark &#8211; and that includes building on software requirements without understanding the whys to the point I&#8217;m convinced of its business and user needs.</p>
<p>At this point, I hadn&#8217;t used any formal methods I had learnt from a class, website, or book. It was good that I understood who I was designing for, and I wouldn&#8217;t have been able to do this without classes, websites and books &#8211; but the formal methods were pretty useless. I just used what worked for me.</p>
<h3>We Used Fireworks, but I can&#8217;t Recommend it to You</h3>
<p>It&#8217;s important to note that two of us jumped onto paper and pencil and did wireframe sketches, and then designed a hi-def visual of the homepage on Fireworks (which I now really love) &#8211; only because we were three people and we couldn&#8217;t quite picture the outcome in our minds. At the same time, we needed our boss to make a decision and he has a lot of emotional attachment to the look and feel of the site, being the founder and all. So it was important to get those designs out.</p>
<p>I don&#8217;t think I can recommend the same process to other designers &#8211; it really depends what you&#8217;re designing for. Those fireworks designs took up several days and a lot of it was thrown out of the window as we iterated from one design to another. But I think that&#8217;s necessary in design, sometimes &#8211; because the interface is what users will end up seeing and using, again and again.</p>
<p>Sometimes I read articles from other designers and it all sounds really cool and makes you feel that there&#8217;s some kind of order or process in the design of an interface. But I find these things hard to use because it&#8217;s the designer that makes a difference, not the method. It&#8217;s about knowing what you know that works &#8211; a process or method can&#8217;t save you. They&#8217;re just tools.</p>
<img src="http://feeds.feedburner.com/~r/boon/interaction/~4/7lihAayDh2s" height="1" width="1"/>]]></content:encoded>
			<wfw:commentRss>http://feedproxy.google.com/~r/boon/interaction/~3/7lihAayDh2s/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Servin’ up pure *.HTMLs in a Web 2.0 world</title>
		<link>http://feedproxy.google.com/~r/boon/interaction/~3/hfwAu4N3gDc/</link>
		<comments>http://feedproxy.google.com/~r/boon/interaction/~3/hfwAu4N3gDc/#comments</comments>
		<pubDate>Mon, 21 Sep 2009 09:00:31 +0000</pubDate>
		<dc:creator>boon</dc:creator>
				<category><![CDATA[interaction design]]></category>
		<category><![CDATA[user experience]]></category>
		<category><![CDATA[web]]></category>

		<guid isPermaLink="false">http://boonyew.com/interaction/?p=317</guid>
		<description><![CDATA[I love this idea: http://www.somebits.com/weblog/tech/good/webapps-with-json.html
]]></description>
			<content:encoded><![CDATA[<p>I love this idea: <a href="http://www.somebits.com/weblog/tech/good/webapps-with-json.html">http://www.somebits.com/weblog/tech/good/webapps-with-json.html</a></p>
<img src="http://feeds.feedburner.com/~r/boon/interaction/~4/hfwAu4N3gDc" height="1" width="1"/>]]></content:encoded>
			<wfw:commentRss>http://feedproxy.google.com/~r/boon/interaction/~3/hfwAu4N3gDc/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Wireframes Aren’t the Only Thing</title>
		<link>http://feedproxy.google.com/~r/boon/interaction/~3/5-cVtSA7nW0/</link>
		<comments>http://feedproxy.google.com/~r/boon/interaction/~3/5-cVtSA7nW0/#comments</comments>
		<pubDate>Sun, 20 Sep 2009 23:29:25 +0000</pubDate>
		<dc:creator>boon</dc:creator>
				<category><![CDATA[interaction design]]></category>
		<category><![CDATA[tools]]></category>
		<category><![CDATA[user experience]]></category>

		<guid isPermaLink="false">http://boonyew.com/interaction/?p=312</guid>
		<description><![CDATA[I&#8217;m at the start of a new phase of our development, and we&#8217;re at the point where we need to generate ideas for our interfaces. I&#8217;ve observed that wireframes aren&#8217;t always well-received by people who don&#8217;t understand them &#8211; clients who think they need more color, developers who want to code over it, etc. If [...]]]></description>
			<content:encoded><![CDATA[<p>I&#8217;m at the start of a new phase of our development, and we&#8217;re at the point where we need to generate ideas for our interfaces. I&#8217;ve observed that wireframes aren&#8217;t always well-received by people who don&#8217;t understand them &#8211; clients who think they need more color, developers who want to code over it, etc. If the only resolution we have to this problem is educating the public, I think we&#8217;re in for a very long ride.</p>
<p>This might be because wireframes aren&#8217;t obvious enough to people.</p>
<p>You heard that right &#8211; if people are misunderstanding your wireframes for a finished product, or your sketches for a placeholder for a WYSIWYG dev tool like Visual Basic &#8211; there&#8217;s clearly something inappropriate about the tool&#8217;s use.</p>
<p>I believe some of us take wireframes for granted, such that we see no other way of implementing a product. While wireframes work well for some designers, I sometimes think they take up time and that there might be better, faster, more efficient ways to build software.</p>
<p>Also, wireframes aren&#8217;t great for super-dynamic AJAX-heavy interactions. And they aren&#8217;t great if you want to break out of the 2D mode, and work with more dimensions (how do wireframe a keypress, or an animation, or audio?).</p>
<p>I remember the first time I used tons of wireframes on a project, and ended up realizing that we wasted all that time building hi-fidelity prototypes just because I felt it was the right way to design an application. Time was wasted testing the prototype because we didn&#8217;t get THAT much insight out of it, simply because it was so blatantly obvious &#8211; we should have just tried it on ourselves before testing it on other users.</p>
<p>I&#8217;m probably stepping on some UX no-go zones &#8211; aren&#8217;t we supposed to test apps on real users, and not ourselves? Well, I think there are some things which are so blatantly obvious you needn&#8217;t waste the users&#8217; time to fix or test. Testing via paper prototypes a la Carolyn Snyder isn&#8217;t always going to save you time. There are much faster ways to get it done, if you think through it a little.</p>
<p>I&#8217;m not advocating against wireframes. I&#8217;m just advocating against getting locked down on a specific method &#8211; against &#8220;methoditis&#8221; &#8211; you know, when you start believing that one method is better than another just because.</p>
<p>Basically, you might want to re-think wireframes if they:</p>
<ul>
<li>confuse the people you&#8217;re communicating to</li>
<li>take up time when something else can be so much faster</li>
<li>cut down too many trees</li>
</ul>
<p>Here are some examples or ideas of doing without wireframes:</p>
<ul>
<li><a href="http://gettingreal.37signals.com/ch11_Dont_Do_Dead_Documents.php">http://gettingreal.37signals.com/ch11_Dont_Do_Dead_Documents.php</a></li>
<li><a href="http://code.new-bamboo.co.uk/polypage/">http://code.new-bamboo.co.uk/polypage/</a> (a tool developed by Clearleft and New Bamboo)</li>
<li>method-acting (see Bill Buxton&#8217;s Sketching User Experiences for an example a designer &#8220;being&#8221; the device)</li>
<li>plasticine? feel free to add your own examples.</li>
</ul>
<img src="http://feeds.feedburner.com/~r/boon/interaction/~4/5-cVtSA7nW0" height="1" width="1"/>]]></content:encoded>
			<wfw:commentRss>http://feedproxy.google.com/~r/boon/interaction/~3/5-cVtSA7nW0/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>A Framework for Interaction</title>
		<link>http://feedproxy.google.com/~r/boon/interaction/~3/cm-UA6GEXA4/</link>
		<comments>http://feedproxy.google.com/~r/boon/interaction/~3/cm-UA6GEXA4/#comments</comments>
		<pubDate>Wed, 17 Jun 2009 22:00:29 +0000</pubDate>
		<dc:creator>boon</dc:creator>
				<category><![CDATA[interaction design]]></category>
		<category><![CDATA[user experience]]></category>

		<guid isPermaLink="false">http://boonyew.com/interaction/?p=220</guid>
		<description><![CDATA[Because I have been doing a lot of PHP plumbing lately, I&#8217;ve been thinking a lot about implementing a web interaction framework that would make my life easier as a web developer cum interaction designer. One of things that got me thinking is the amount of complexity that&#8217;s involved in provide the right kind of [...]]]></description>
			<content:encoded><![CDATA[<p>Because I have been doing a lot of PHP plumbing lately, I&#8217;ve been thinking a lot about implementing a web interaction framework that would make my life easier as a web developer cum interaction designer. One of things that got me thinking is the amount of complexity that&#8217;s involved in provide the right kind of feedback at the right time to the user.</p>
<p><strong>No plugins allowed</strong></p>
<p>It&#8217;s not as easy as hooking up messages to specific URLs, which get displayed when an action is performed. Interaction is complex, some involving multiple conditions and terms. And you can never design for everybody in mind, because there&#8217;s always an issue of context that you have to deal with. So, then what you&#8217;re actually trying to build is based on an assumption of the kind of context that is most appropriate for the task at hand.</p>
<p>For example, take the simple case of a password reminder. Although it&#8217;s relatively straightforward to implement a mechanism to send off a password via email, how the user  has arrived at that task is another thing altogether. A password reminder system for an online banking application would look a lot different than a social networking site. Do you send the password along with the email? Do you send a link with that takes the user to a page to reset the password? What should the messages say? How often do these password reminder tasks occur with the existing user base? How did they know how to find help?</p>
<p>With such a basic task, there&#8217;s already so much to consider. What more a task that involves collaboration, scheduling, persuasion, trading, payment, and communication.</p>
<p><strong>The bare necessities</strong></p>
<p>This is when I started to take a step back and ask myself &#8211; what are the most essential things that I need to build an effective interaction framework?</p>
<ol>
<li>I mentioned feedback, so I think <strong>notification </strong>is one of them &#8211; a way to inform the user regarding the <strong>state of the application or system</strong>.</li>
<li>Then, I think there&#8217;s the element of <strong>context </strong>I mentioned earlier<strong> </strong>- technology can help with helping us understand more about what is appropriate, and also helping us in designing for what is appropriate.</li>
<li>Also, I don&#8217;t think we can ignore <strong>the interface itself </strong>- all the buttons, fields, and little components that are used to interact with the system. I think this is the main part in what we usually consider as interaction design.</li>
<li>Somewhat related to the issue of context, but I feel deserves its own section, is <strong>testing </strong>- or, <strong>evaluation</strong>. This is so that we can identify potential areas of improvement by understanding the patterns of existing user behavior.</li>
<li>Finally, because all interaction is both a function of time and space, I feel that there needs to be an element of <strong>process</strong> &#8211; some kind of journey, or set of occurences that take place one after another. Much like how stories are expressed using specific narratives, interaction is also played out between the system and user through various sequences.</li>
</ol>
<p>There may well be more, but these have been on my mind lately &#8211; ways in which I think a framework could help in solving interaction design problems.</p>
<p><strong>Design patterns and human predictability<br />
</strong></p>
<p>While I think design patterns like the ones from Tidwell&#8217;s <a href="http://designinginterfaces.com/">&#8216;Designing Interfaces&#8217;</a> or <a href="http://www.welie.com/patterns/">Welie&#8217;s pattern library </a>are extremely useful resources for solving interaction problems, they are also somewhat limited as they don&#8217;t propose more high-level strategies for interaction design. This is simply because many of these patterns are extremely tangible, and are essentially a collection of existing interactive solutions that have been known to solve common problems in interfaces (e.g. accordions, tooltips, tag clouds, wizards, breadcrumbs, etc.)</p>
<p>This is where I think an interaction framework can help &#8211; by providing the necessary &#8220;glue&#8221; and language by which these patterns can coexist and integrate in a <strong>flexible</strong>, <strong>scalable</strong>, <strong>managable way</strong>.</p>
<p>My inspiration comes not from the hubris of Steve Jobs, nor the empathic anecdotes of Don Norman. Neither is it from the pragmatism of Cooper&#8217;s Goal-Directed Design methodology, to which I owe great thanks in sparking my journey toward interaction design. Instead, I was inspired by <a href="http://www.corej2eepatterns.com/Patterns2ndEd/index.htm">J2EE design patterns</a> from my early days as a Java developer.</p>
<p>This is an important distinction is because all of these design patterns come to play in a <strong>systematic, structural whole</strong>. Whereas, many of the existing interaction design patterns we know of now are sort of separate and somewhat distinct from each other.</p>
<blockquote>
<table border="1">
<tbody>
<tr>
<td></td>
<td><strong>System Architecture</strong></td>
<td><strong>Interaction Architecture</strong></td>
</tr>
<tr>
<td><strong>Transform, Manipulate, Guide, Communicate, Create, Translate, etc.</strong></td>
<td>Bits, Bytes, Strings, Numbers, Objects, Packets, Records, Emails, Documents, Interfaces, etc.</td>
<td>Emotion, Feeling, Mood, Action, Behavior, Values, Words, Drawings, Opinions, Stories, Decisions, etc.</td>
</tr>
</tbody>
</table>
</blockquote>
<p>In a way, I am envisioning an interaction architect structuring an interactive system the way a system architect designs an application&#8217;s infrastructure. The system architect defines the language in which data (or manifestations of it) is transformed, manipulated, sent/received, created, etc. The interaction architect defines the language in which human attention, behavior or actions are transformed, manipulated, communicated, guided, persuaded, etc.</p>
<p><strong>Some comparisons</strong></p>
<p>Bill Verplank proposed<strong> </strong>an <a href="http://cm-wiki.stanford.edu/wiki/Interaction_Design_Framework">interaction framework</a> that looks really interesting. It&#8217;s set up mostly to assist teams in designing interaction and interfaces, and has little to do with the actual nuts and bolts of a particular interaction technology. This is all fine, because as an interaction designer you don&#8217;t necessarily want to lock yourself down to any particular technology. In the same way, Cooper&#8217;s <a href="http://www.cooper.com/about/process/">Goal-Directed Design</a> also proposes a methodology that provides a practical framework for understanding who the target users are and designing for them. GDD also takes the approach of being technology agnostic, although Cooper mostly refers to software interfaces like desktop applications, mobile phones and websites.</p>
<p>However, I think there&#8217;s a growing need for a technology-focussed framework &#8211; one that sits just between the sort of team-focussed, process-driven, project methodology &#8211; and the tangible, collective, distinct set of pattern libraries I talked about earlier. I am probably thinking about web applications, but this can apply to any other technology (Air Traffic Control systems, for example).</p>
<p>The J2EE design pattern specification exists for Java architects to build enterprise Java applications in scalable, managable, flexible ways. In a similar vein, interation designers can establish similar frameworks for their own interactive systems &#8211; that sits between the system and the project, that can be expressed in terms that are more closely linked to the systems themselves (like interaction design patterns are), rather than wireframes, storyboards, sitemaps, affinity diagrams &#8211; stuff that&#8217;s more commonly used for communicating between people rather than communicating between systems.</p>
<img src="http://feeds.feedburner.com/~r/boon/interaction/~4/cm-UA6GEXA4" height="1" width="1"/>]]></content:encoded>
			<wfw:commentRss>http://feedproxy.google.com/~r/boon/interaction/~3/cm-UA6GEXA4/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
