<?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>Learning the World &#187; Jef Raskin</title>
	<atom:link href="http://learningtheworld.eu/tag/jef-raskin/feed/" rel="self" type="application/rss+xml" />
	<link>http://learningtheworld.eu</link>
	<description></description>
	<lastBuildDate>Tue, 06 Nov 2012 00:17:33 +0000</lastBuildDate>
	<language>en-US</language>
		<sy:updatePeriod>hourly</sy:updatePeriod>
		<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.9.1</generator>
	<item>
		<title>Quantitative Methods of Usability Analysis</title>
		<link>http://learningtheworld.eu/2007/usability-analysis/</link>
		<comments>http://learningtheworld.eu/2007/usability-analysis/#comments</comments>
		<pubDate>Fri, 23 Mar 2007 19:30:12 +0000</pubDate>
		<dc:creator><![CDATA[Martin Kliehm]]></dc:creator>
				<category><![CDATA[design]]></category>
		<category><![CDATA[usability]]></category>
		<category><![CDATA[web development]]></category>
		<category><![CDATA[analysis]]></category>
		<category><![CDATA[book:ean=9780201379372]]></category>
		<category><![CDATA[book:ean=9780898592436]]></category>
		<category><![CDATA[book:isbn=0201379376]]></category>
		<category><![CDATA[book:isbn=0898592437]]></category>
		<category><![CDATA[Fitt's Law]]></category>
		<category><![CDATA[GOMS]]></category>
		<category><![CDATA[HCI]]></category>
		<category><![CDATA[Human Computer Interaction]]></category>
		<category><![CDATA[Humane Interface]]></category>
		<category><![CDATA[information efficiency]]></category>
		<category><![CDATA[Jef Raskin]]></category>
		<category><![CDATA[keystroke-level model]]></category>
		<category><![CDATA[KLM-GOMS]]></category>
		<category><![CDATA[quantitative]]></category>
		<category><![CDATA[tantek]]></category>
		<category><![CDATA[Tantek Çelik]]></category>

		<guid isPermaLink="false">http://learningtheworld.eu/2007/usability-analysis/</guid>
		<description><![CDATA[In his recent article <strong>Three Hypotheses of Human Interface Design</strong> Tantek Çelik came up with some interesting hypotheses about the usability of computer interfaces. It was a brilliant idea, but I&#8217;m afraid the well-established method for Human Computer Interaction <acronym title="Keystroke-Level Model &#8212; Goals, Objects, Methods, and Selection Rules">KLM-GOMS</acronym> describes his hypotheses pretty well. Unfortunately somebody came up independently with that, 27 years ago.&#160;[&#8230;]]]></description>
				<content:encoded><![CDATA[<p>In his recent article <em><a href="http://tantek.com/log/2007/02.html#d19t1813" rel="met colleague">Three Hypotheses of Human Interface Design</a></em> Tantek Çelik came up with some interesting hypotheses about the usability of computer interfaces, the <em>cognitive load</em> of doing things.</p>

<ul>
<li><strong>Minimize the number of text fields</strong> in your interfaces down to the absolute minimum necessary.</li>
<li><strong>Minimize the number of clicks</strong>&nbsp;/ keystrokes&nbsp;/ gestures necessary to accomplish actions in your interface.</li>
<li>Make your interface as responsive as possible&nbsp;&mdash; <strong>minimize the latency</strong> of each and every action a user might take in your interface.</li>
</ul>

<p>In short: <strong>keep it simple. Don&rsquo;t make me think. Don&rsquo;t make me wait.</strong></p>

<p>Brilliant! Then a couple of days later I found the time to finally read <a href="http://jef.raskincenter.org">Jef Raskin&rsquo;s</a> book <em><a href="http://en.wikipedia.org/wiki/The_Humane_Interface">The Humane Interface</a></em> (2000) where he demonstrates four methods of quantifying the efficiency of a software interface: <a href="http://en.wikipedia.org/wiki/Fitt%27s_law">Fitt&rsquo;s Law</a> (1954), <a href="http://en.wikipedia.org/wiki/Hick%27s_law">Hick&rsquo;s Law</a> (1952), Raskin&rsquo;s own measures of efficiency, and the <a href="http://en.wikipedia.org/wiki/GOMS"><acronym title="Goals, Operators, Methods, and Selection rules">GOMS</acronym></a> method, in particular the <a href="http://en.wikipedia.org/wiki/KLM_%28human_computer_interaction%29">Keystroke-Level Model</a> (1980).</p>

<p>I hadn&rsquo;t heard of at least half of them before, and so did my colleagues. Apparently those methods are well established in software <acronym title="User Interface">UI</acronym> design, but less known among web developers. Which is a good reason to blog about them. <img src="http://learningtheworld.eu/wp-includes/images/smilies/icon_wink.gif" alt=";)" class="wp-smiley" /> </p>

<h3 id="fitts-law">Fitt&rsquo;s Law</h3>

<p>You most probably have heard of that law. Given the size <em>S</em> of a target (like a button) and the distance <em>D</em> to move a cursor, you get the average time it takes to hit the button:</p>

<p><code><span class="indent">time (in msec) = a + b log<sub>2</sub> (<abbr title="Distance">D</abbr>&nbsp;/ <abbr title="Size">S</abbr> + 1)</span></code></p>

<p><em>a</em> and <em>b</em> are empirical constants, like the reaction time or time to click a button. You can use an approximation of <em>a</em>&nbsp;=&nbsp;50 and <em>b</em>&nbsp;=&nbsp;150. Also the smaller horizontal or vertical value for the size is good enough, and an average distance on a screen. The binary logarithm log<sub>2</sub> is the equivalent of the binary chance to hit or miss the button. That said, <strong>a large button is easier to hit</strong>.</p>

<p>For some practical examples see <a href="http://particletree.com/features/visualizing-fittss-law/">Kevin Hale&rsquo;s excellent article</a>, or Microsoft&rsquo;s application of <a href="http://blogs.msdn.com/jensenh/archive/2006/08/22/711808.aspx" rel="nofollow">Fitt&rsquo;s Law in Office 2007</a>.</p>

<h3 id="hicks-law">Hick&rsquo;s Law</h3>

<p>Hick&rsquo;s Law is about <strong>the time it takes to make a choice</strong> from a number of elements. Be careful when applying this law to menus, because there are other factors like the size, design, sort order, or readability of menu items.</p>

<p><code><span class="indent">time (in msec) = a + b log<sub>2</sub> (n + 1)</span></code></p>

<p>For example, ignoring the constants, we can boldly claim that choosing from a menu of eight items takes <em>longer</em> than from one of four items because <code>log<sub>2</sub>&nbsp;8&nbsp;=&nbsp;3</code> and <code>log<sub>2</sub>&nbsp;4&nbsp;=&nbsp;2</code>. In theory, opening a submenu of four items in another menu of four items takes longer than the choice between eight, because <code>2(log<sub>2</sub>&nbsp;4)&nbsp;=&nbsp;4</code> and <code>log<sub>2</sub>&nbsp;8&nbsp;=&nbsp;3</code>. Because human performance sinks on cognitive tasks involving more than <code><a href="http://en.wikipedia.org/wiki/The_Magical_Number_Seven%2C_Plus_or_Minus_Two">7&nbsp;&plusmn;&nbsp;2</a></code> items, choosing one of eight items could actually take longer.</p>

<h3 id="interface-efficiency">Interface efficiency</h3>

<p>The information-theoretic efficiency of an application is the <strong>minimum amount of necessary information divided by the actual amount of information</strong>. Sounds difficult, but is easy. Making a choice means <em>one bit</em> of information. &ldquo;<q>Push OK or Cancel.</q>&rdquo; One bit of information, requiring one click or keystroke. One keystroke is approximately 5 bits, so the efficiency is <code>1&nbsp;/&nbsp;5&nbsp;=&nbsp;0.2</code>, or 20%. Thus you know there is <strong>room for improvement</strong>.</p>

<p>In the following example you got no choice at all, so the information efficiency is <em>zero</em>:</p>

<p class="center"><img src="/wp-content/uploads/2007/03/word-search-not-found.png" width="434" height="115" alt="Microsoft Office Word dialog box with the only choice to push a button OK" /></p>

<p>Of course it is <a href="http://blogs.msdn.com/jensenh/archive/2006/06/14/629189.aspx" title="Microsoft Blog: The Spelling Check is Complete" rel="nofollow">necessary to inform a user</a> that the search is over or that certain fields in a web form are required, but that can be done in an unobtrusive way <em>without</em> alert boxes. A yellow-fade does not require pushing a button and has 100% efficiency. If the user can only do one thing next, have the computer do it. Besides hitting &ldquo;OK&rdquo; soon becomes habitual and therefore pointless.</p>

<h3 id="goms">Goals, objects, methods, and selection rules (<acronym>GOMS</acronym>)</h3>

<p>These rules were further described by Stuart Card, Thomas P. Moran &amp; artificial intelligence pioneer Allen Newell in their influential book <em>The Psychology of Human-Computer Interaction</em> (1983). <acronym>GOMS</acronym>, and in particular the simplified Keystroke-Level Model (<acronym>KLM</acronym>), offers a simple approach to <strong>estimate the duration of tasks</strong> on a computer.</p>

<ul>
<li><strong>K</strong> = 0.28 <abbr title="seconds">sec.</abbr>&nbsp;&mdash; key press and release (keyboard)</li>
<li><strong>P</strong> = 1.1 <abbr>sec.</abbr>&nbsp;&mdash; pointing the mouse to something</li>
<li><strong>B</strong> = 0.1 <abbr>sec.</abbr>&nbsp;&mdash; button press or release (mouse)</li>
<li><strong>H</strong> = 0.4 <abbr>sec.</abbr>&nbsp;&mdash; homing, hands movement from mouse to keyboard or reverse</li>
<li><strong>M</strong> = 1.2 <abbr>sec.</abbr>&nbsp;&mdash; mentally preparing</li>
<li><strong>W(t)</strong> = t <abbr title="milliseconds">msec.</abbr>&nbsp;&mdash; wait or response time (system)</li>
</ul>

<p>Inserting mentals is probably the most difficult part of this, but there are <a href="http://books.google.de/books?id=30UsZ8hy2ZsC&#038;pg=PA267&#038;vq=Heuristics+for+the+M+Operator&#038;source=gbs_search_r&#038;cad=1_1&#038;sig=ACfU3U3GxU-S3VKwyuQqZcrJHjiC_JTBbg" title="Rules for applying mentals" rel="nofollow">six simple rules</a> how to apply them. So in another infamous <acronym title="microsoft">MS</acronym> Word example when the user wants to change a radio button we get the sequence <em>HMPBPB</em> with a total of 4.0&nbsp;<abbr title="seconds">sec.</abbr>, or <em>HMPBHK</em> with a total of 3.48&nbsp;<abbr>sec.</abbr> when the user hits <em>Return</em> instead of clicking on &ldquo;OK.&rdquo;</p>

<p class="center"><img src="/wp-content/uploads/2007/03/word-update-toc-unefficient.png" width="270" height="143" alt="Microsoft Office Word dialog box for updating the generated table of contents. Selection with two radio buttons and a submit button." /></p>

<p>3.48 seconds is pretty fast, but since there is only one bit of information but two keystrokes we know it could be faster:</p>

<p class="center"><img src="/wp-content/uploads/2007/03/word-update-toc-efficient.png" width="270" height="143" alt="Microsoft Office Word dialog box for updating the generated table of contents. Selection with two submit buttons." /></p>

<p>The sequence required for this selection is <em>HMPB</em> or <em>HMKK</em> with a duration of 2.8&nbsp;<abbr>sec.</abbr> or 2.16&nbsp;<abbr>sec.</abbr>, respectively.</p>

<p>Simpler interfaces increase usability and are faster. Because they are simpler, I don&rsquo;t have to think so hard. Wait, that sounds familiar&nbsp;&hellip; it sounds like&nbsp;&hellip; <em>cognitive load!</em></p>

<p>Let&rsquo;s take <a href="http://tantek.com/log/2007/02.html#cogloadclicks" rel="colleague met">Tantek&rsquo;s examples</a> where he describes the steps for instant messaging and writing an email. That would be something like:</p>

<ul>
<li><em>HMPMBBM(K&nbsp;&times;&nbsp;n)MK</em></li>
<li><em>HMPMKKKKMKKM(K&nbsp;&times;&nbsp;n)MKM(K&nbsp;&times;&nbsp;n)MPB</em></li>
</ul>

<p>Even without knowing and thus ignoring the amount of characters in the message and subject (<em>K&nbsp;&times;&nbsp;n</em>), the estimated time for writing an <acronym title="Instant Message">IM</acronym> (5.58&nbsp;sec.) is significantly smaller than writing an email (13.06&nbsp;<abbr>sec.</abbr>).</p>

<p>I&rsquo;m really sorry, it was a brilliant idea, but I&rsquo;m afraid <acronym title="Keystroke-Level Model &mdash; Goals, Objects, Methods, and Selection Rules">KLM-GOMS</acronym> describes pretty well what Tantek calls <em>Three Hypotheses of Human Interface Design</em>. Unfortunately somebody came up independently with that established method for Human Computer Interaction, 27 years ago. <img src="http://learningtheworld.eu/wp-includes/images/smilies/icon_sad.gif" alt=":-(" class="wp-smiley" /> </p>
]]></content:encoded>
			<wfw:commentRss>http://learningtheworld.eu/2007/usability-analysis/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
	</channel>
</rss>
