<?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>Design By Candlelight &#187; usability</title>
	<atom:link href="http://www.designbycandlelight.com/tag/usability/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.designbycandlelight.com</link>
	<description>User Experience Design, even in the wee hours!</description>
	<lastBuildDate>Thu, 02 Feb 2012 23:00:25 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.1</generator>
<xhtml:meta xmlns:xhtml="http://www.w3.org/1999/xhtml" name="robots" content="noindex" />
		<item>
		<title>Usability Heuristics for Rich Internet Applications</title>
		<link>http://www.designbycandlelight.com/usability-heuristics-for-rich-internet-applications/?utm_source=rss&#038;utm_medium=rss&#038;utm_campaign=usability-heuristics-for-rich-internet-applications</link>
		<comments>http://www.designbycandlelight.com/usability-heuristics-for-rich-internet-applications/#comments</comments>
		<pubDate>Tue, 14 Oct 2008 20:05:59 +0000</pubDate>
		<dc:creator>rphillippi</dc:creator>
				<category><![CDATA[User Experience]]></category>
		<category><![CDATA[heuristics]]></category>
		<category><![CDATA[ria]]></category>
		<category><![CDATA[usability]]></category>

		<guid isPermaLink="false">http://www.designbycandlelight.com/?p=168</guid>
		<description><![CDATA[Great article found on Boxes and Arrows by Jess McMullin and  Grant Skinner on 2003/07/15. &#8212;&#8212;&#8212;- “ “The key difference between a typical Flash site and an RIA is that RIAs possess the functionality to interact with and manipulate data, rather than simply visualize or present it.” ” Heuristics, or “rules of thumb,” can be useful [...]]]></description>
			<content:encoded><![CDATA[<p>Great <a title="Usability Heuristics for RIA" href="http://www.boxesandarrows.com/view/usability_heuristics_for_rich_internet_applications">article</a> found on Boxes and Arrows by                    <a href="http://www.boxesandarrows.com/person/1-jessmcmullin">Jess McMullin</a> and                   <a href="http://www.boxesandarrows.com/person/81-jessmcmullinandgrantskinner">Grant Skinner</a> on 2003/07/15.</p>
<p>&#8212;&#8212;&#8212;-</p>
<div class="pullquote-right"><span class="quotation-mark">“</span> “The key difference between a typical Flash site and an <span class="caps">RIA</span> is that RIAs possess the functionality to interact with and manipulate data, rather than simply visualize or present it.”     <span class="quotation-mark">”</span></div>
<p>Heuristics, or “rules of thumb,” can be useful in both usability evaluations and as guidelines during design. <a href="http://www.useit.com/papers/heuristic/heuristic_list.html">Jakob Nielsen’s 1994 set of usability heuristics</a> were developed with a focus on desktop applications. In 1997, <a href="http://user-experience.org/uefiles/writings/heuristics.html">Keith Instone shared his thoughts</a> on how these heuristics apply to what was a relatively new area: websites. Today, in 2003, with Flash-enabled Rich Internet Applications (RIAs) becoming more popular, Nielsen’s heuristics still offer valuable guidelines for <span class="caps">RIA</span> designers and developers.</p>
<p>In this article, we focus on Flash because it currently dominates the <span class="caps">RIA</span> landscape. However, many of the lessons for Flash apply to other technologies as well.</p>
<p>Rich Internet Applications offer the benefits of distributed, server-based Internet applications with the rich interface and interaction capabilities of desktop applications. The key difference between a typical Flash site and an <span class="caps">RIA</span> is that RIAs possess the functionality to interact with and manipulate data, rather than simply visualize or present it. While RIAs hold significant promise, many in the Flash community don’t have the opportunity to work with interaction designers, information architects, or other user experience professionals. As well, user experience professionals often decry Flash or other rich technologies as “bells and whistles” that detract from user goals. We hope this article provides some common ground for discussion between the two communities.</p>
<p>The list below includes Nielsen’s heuristics in bold; our comments about how they apply to RIAs follow each heuristic. Since RIAs cover a broad range of applications, we know we haven’t covered everything. We’d love to hear your own thoughts and experiences in the comments.<span id="more-168"></span></p>
<p><span class="subhead">1. Visibility of system status </span></p>
<p><strong>The system should always keep users informed about what is going on, through appropriate feedback within reasonable time. </strong><br />
RIAs should leverage the rich display capabilities to provide real-time status indicators whenever background processing requires the user to wait. While progress indicators are frequently used during an extensive preload when launching an application, they should also be used throughout a user’s interaction with data. This may be monitoring backend data processing time or preloading time.</p>
<p>When dealing with sequential task steps, RIAs should indicate progress through the task (e.g., “Step 4 of 6”). This helps users understand the investment required to complete the activity and helps them stay oriented during the activity. Labeling task steps will provide a clearer understanding of system status than simply using numbers to indicate progress. RIAs’ ability to store client-side data can be used to allow the user to skip optional steps or to return to a previous step.</p>
<p>System status should relate to the user’s goals, and not to the technical status of the application, which brings us to our next heuristic.</p>
<p><span class="subhead">2. Match between system and the real world </span></p>
<p><strong>The system should speak the users’ language, with words, phrases and concepts familiar to the user, rather than system-oriented terms. Follow real-world conventions, making information appear in a natural and logical order. </strong><br />
Understanding the user’s vocabulary, context and expectations is key to presenting a system that matches their world. While RIAs are made possible by the functionality of Flash and other technologies, users are usually not familiar with terms like rollover, timeline, actionscript, remoting, or CFCs – such technology-based terms should be avoided in the application. (See our sidebar for definitions if you’re not sure of them yourself).</p>
<p>While RIAs can offer novel metaphors, novelty often slows usefulness and usability. When using metaphors, ensure that they act consistently with their real-world counterparts. If application functions cause the metaphor to behave in ways that don’t match the real world, the metaphor has lost its usefulness and should be discarded in favor of a different concept.</p>
<p>Both information and functionality should be organized to reflect the user’s primary goals and tasks supported by the application. This supports a user’s feeling of competence and confidence in the task – a key need that is also supported by letting the user stay in control.</p>
<p><span class="subhead">3. User control and freedom </span></p>
<p><strong>Users often choose system functions by mistake and will need a clearly marked “emergency exit” to leave the unwanted state without having to go through an extended dialogue. Support undo and redo. </strong><br />
Users are familiar with browser-based controls, including the Back button and Location field. However, using browser commands within an <span class="caps">RIA</span> may result in data loss.</p>
<p>The <span class="caps">RIA</span> should include code that is aware and responsive to browser history. For applications that contain complex functionality that is the focus of user attention, creating a full-screen version that hides the browser controls can be appropriate as long as there is a clearly marked exit to return to the browser.</p>
<p>While “undo” and “redo” are not yet well-developed in the Flash toolkit, changes to data can be stored as separate copies, allowing the application to revert to a previous version of the data. However, this becomes quite complex in multi-user environments and requires strong data modeling to support.</p>
<p>Many Flash projects include splash screens or other scripted presentations. These non-interactive exhibitions of technical prowess reduce the user’s feeling of control. The ubiquitous “Skip Intro” link offers little help – instead, consider how any scripted presentation benefits the user. If a scripted sequence doesn’t support user goals, skip the development time in favor of something that does. One area that may be a better investment is working to ensure consistency in the application.</p>
<p><span class="subhead">4. Consistency and standards </span></p>
<p><strong>Users should not have to wonder whether different words, situations, or actions mean the same thing. Follow platform conventions. </strong><br />
All applications require consistency within their features, including terminology, layout, color, and behavior. Complying with interface standards can help maintain consistency. However, since RIAs are a new category of applications, standards are still being developed. The Microsoft Windows User Experience guidelines, Apple Human Interface guidelines, and Macromedia’s developing guidelines provide some alternatives starting points for <span class="caps">RIA</span> standards.</p>
<p>Branding guidelines also often require consistency that <span class="caps">RIA</span> teams need to consider. RIAs are often deployed as branded solutions for a variety of customers. The application needs to be flexible in implementing custom copy, color, and logos. However, branding should not compromise good design. <span class="caps">RIA</span> teams may need to show that the brand will gain equity through applying useful and usable standards as well as beautiful visual design. A gorgeous, cutting edge, award-winning presentation won’t help the brand if it’s easy for users to make disastrous mistakes that prevent them from reaching their goals.</p>
<p><span class="subhead">5. Error prevention </span></p>
<p><strong>Even better than good error messages is a careful design which prevents a problem from occurring in the first place. </strong><br />
In forms, indicate required fields and formats with examples. Design the system so that it recognizes various input options (780.555.1212 vs. 780-555-1212) rather than requiring the user to comply with an arbitrary format. Also consider limiting the amount of data entry required and reducing input errors by saving repetitious data and auto-filling fields throughout the application.</p>
<p>Avoid system functions with disastrous potential, such as “Delete All Records.” When functions with significant impact are necessary, isolate them from regular controls. Consider an “Advanced Options” area only accessible to administrators or superusers, rather than exposing dangerous functionality to all users.</p>
<p>With RIAs, when problems do occur, network connectivity allows for the capture and transmission of error details. Similarly, the distributed model of RIAs empowers developers to provide minor updates that are nearly immediately available to the user. These immediate updates can provide correction to issues that repeatedly cause user errors. Beyond the technology, another way to prevent errors is to make currently needed information available to the user instead of making them remember things from previous screens.</p>
<p><span class="subhead">6. Recognition rather than recall </span></p>
<p><strong>Make objects, actions, and options visible. The user should not have to remember information from one part of the dialogue to another. Instructions for use of the system should be visible or easily retrievable whenever appropriate. </strong><br />
Too often, the rich presentation possibilities of Flash are used to play hide-and-seek with important interface elements. Don’t hide controls that are key to user tasks. Revealing application controls on rollover or with a click can create exciting visual transitions, but will slow user tasks and create significant frustration.</p>
<p>Since people who are engaged in a task decide where to click based on what they see, rollovers or other revealed elements can only provide secondary cues about what actions are appropriate. The interface should provide visible primary cues to guide user expectations and help users predict which controls will help them achieve their goals. While some of these cues will be basic functionality, cues should also be available for frequent users to show functions that save them time or let them work more flexibly.</p>
<p><span class="subhead">7. Flexibility and efficiency of use </span></p>
<p><strong>Accelerators—unseen by the novice user—may often speed up the interaction for the expert user such that the system can cater to both inexperienced and experienced users. Allow users to tailor frequent actions. </strong><br />
RIAs can leverage the advanced functionality of the platform to provide accelerators such as keyboard shortcuts, type-ahead auto-completion, and automatic population of fields based on previously entered data or popularity of response.</p>
<p>Less technically sophisticated accelerators should also be available—particularly bookmarks—either by allowing bookmarking in the browser, or creating a bookmark utility within the application itself. Another option for giving quick access to a specific screen is assigning each screen a code which a user can enter in a text field to immediately access the screen without navigating to it.</p>
<p>RIAs also offer the opportunity allow for personalization of the application through dynamic response to popularity or frequency of use, or through user customization of functionality.</p>
<p>Established usability metrics, such as time spent carrying out various tasks and sub-tasks, as well as the popularity of certain actions, can be logged automatically, analyzed, and acted on in a nearly real-time fashion. For example, if a user repeatedly carries out a task without using accelerators, the application could provide the option of creating a shortcut or highlight existing accelerated options for completing the same task. However, providing these options should be an exercise in elegance, instead of a display of technical prowess.</p>
<p><span class="subhead">8. Aesthetic and minimalist design </span></p>
<p><strong>Dialogues should not contain information which is irrelevant or rarely needed. Every extra unit of information in a dialogue competes with the relevant units of information and diminishes their relative visibility. </strong><br />
For any given feature, style, or branding element, ask two key questions: “What is the return on investment for the business?” and “What is the return on experience for the user?” What value does the element contribute? If a feature can be removed without seriously impacting <span class="caps">ROI</span> or <span class="caps">ROE</span>, the application will be better without it.</p>
<p><span class="caps">RIA</span> design is often a balancing act between application functionality and brand awareness for the business. Limit user frustration by reducing branding emphasis in favor of functionality. While branding can and often should play an important role, the brand will best be supported by a positive user experience. Rather than creating a complicated visual style with an excess of interface “chrome,” work for simplicity and elegance.</p>
<p>Animation and transitions should also be used sparingly. While animation and transition can make a great demo in the boardroom, gratuitous animation will provoke user frustration. The time to animate an element interrupts a user’s concentration and engagement in their task. Disrupting task flow significantly impacts usability and user satisfaction.</p>
<p>Sound can also disrupt task flow – use subtle audio cues for system actions, rather than gratuitous soundtracks that are irrelevant to the task at hand.</p>
<p><img src="http://www.boxesandarrows.com/files/banda/art_end.gif" alt="" width="8" height="8" /></p>
<p>A further advantage of maintaining clean, minimalist design is that it generally results in decreased file size, and lessened load times, which is essential given the limited patience of many internet users. Another advantage is that a clean interface makes it easier for the user to recognize when things are going right, and when things are going wrong.</p>
<p><span class="subhead">9. Help users recognize, diagnose, and recover from errors </span></p>
<p><strong>Error messages should be expressed in plain language (no codes), precisely indicate the problem, and constructively suggest a solution. </strong></p>
<table border="0" cellpadding="10" width="40%" align="right" bgcolor="#f2f2f2">
<tbody>
<tr>
<td class="excerpt"><strong>Rollover</strong><br />
Changing the visual appearance of an interface element when the mouse “rolls over” it. A rollover may also trigger changes to other interface elements.<strong>Timeline</strong><br />
The Flash development environment shows a timeline to organize screen elements and their interaction over time, and along with ActionScript is the primary way of creating interactivity in Flash applications.</p>
<p><strong>ActionScript</strong><br />
A JavaScript-based scripting language built into Flash. Used to program interface actions and behaviors.</p>
<p><strong>Remoting</strong><br />
Server technology called Flash Remoting allows the Flash client to interact with software components on a server that can contain business logic or other code. Flash Remoting can allow connections between Flash and server programming environments like ColdFusion, .NET, Java, and <span class="caps">PHP</span>. This provides for a cleaner division of labor and better security, with the server-side components doing the heavy computational lifting and the Flash client focusing on user interaction.</p>
<p><strong>CFCs</strong><br />
Acronym for ColdFusion Components – server-based software components written in Macromedia’s ColdFusion language. CFCs natively support remoting.</td>
</tr>
</tbody>
</table>
<p>Error messages should hide technical information in favor of explaining in everyday language that an error occurred. References to “missing objects” or other development jargon will only frustrate users.</p>
<p><span class="caps">RIA</span> error messages can explain complicated interactions using animation. However, animation should be used sparingly in favor of clear textual explanations. Explanations should focus on solutions as much as causes of error. Display error messages along with the appropriate application controls or entry field sot that the user can take appropriate corrective action when reading the message. The ability to overlay help messages or illustrations directly over the interface can be useful in explaining task flow between related screen elements.</p>
<p>When errors are not easily diagnosed, make solution suggestions based on probability – ask what things is the user most likely to want to accomplish right now, and present those options.</p>
<p>RIAs also provide the opportunity to immediately connect a user experiencing major difficulties with support personnel who can guide them to a solution through text chat, video chat, or remote manipulation. These live support channels are just some of the help options available to <span class="caps">RIA</span> teams.</p>
<p><span class="subhead">10. Help and documentation </span></p>
<p><strong>Even though it is better if the system can be used without documentation, it may be necessary to provide help and documentation. Any such information should be easy to search, focused on the user’s task, list concrete steps to be carried out, and not be too large.</strong><br />
RIAs should contain simple and concise instructions, prompts, and cues embedded in the application itself. More extensive help should be available from within the <span class="caps">RIA</span>.<br />
Using animation or video tutorials with concise narration can often guide a user through complex tasks, while engaging individuals who learn better from visual or audio instruction rather than text. Showing the required steps is often easier for the user to understand than mentally translating a text description of the steps to the appropriate interface elements. Providing immediate contextual help through the use of tool tips and contextual help buttons allows the user to complete their tasks without having to shift focus to a help system.</p>
<p><span class="subhead">Conclusion</span><br />
This take on how Jakob Nielsen’s heuristics apply to RIAs are far from definitive. Rather than accepting these examples as unquestioned rules, we hope it sparks your own thinking about how to apply the heuristics in your work, whether you’re a Flash developer or an interaction designer (or both). RIAs hold considerable promise for both Flash developers and user experience practitioners. Usability best practices like Nielsen’s heuristics are essential for realizing that promise.</p>
<p>The key takeaway for the Flash community: RIAs aren’t about grabbing attention, they’re about getting things done. This is a different mindset than many marketing-driven Flash sites, where bells and whistles are often encouraged in an effort to hold short attention spans. With RIAs, there’s no need to shout – the user is already engaged in accomplishing a goal. The best way to rise above the crowd is to cultivate a deep understanding of who your users are, what their goals are, and then design to meet those goals as quickly and elegantly as possible.</p>
<p>The key takeaway for the user experience community: Flash has matured beyond bells and whistles to provide a platform that enables a far better user experience for complex interactions than regular browser technology. While it isn’t perfect, it can open new possibilities for you as a user advocate. You’ll hear less “we can’t do that” from engineering teams, and be able to create interfaces and interactions closer to your vision. Getting to know the potential of Flash and other <span class="caps">RIA</span> platforms will help user experience professionals take advantage of the rich interaction available.</p>
<p>Over the coming months and years, RIAs will move from cutting edge to mainstream. That transformation will accelerate with the Flash and user experience communities working together to understand and develop best practices and shared knowledge. We’re looking forward to great new things— if you’re already doing them, drop us a line in the comments.</p>
<p class="clear"><img src="http://www.boxesandarrows.com/images/art_end.gif" alt="" width="8" height="8" /></p>
<ul>
<li><a href="http://developer.apple.com/documentation/UserExperience/UserExperience.html">Apple User Experience Documentation</a>
<p>http://developer.apple.com/documentation/UserExperience/UserExperience.html</li>
<li><a href="http://user-experience.org/uefiles/writings/heuristics.html">Instone, Keith Site Usability Heuristics for the Web</a>
<p>http://user-experience.org/uefiles/writings/heuristics.html</li>
<li><a href="http://www.macromedia.com/devnet/topics/usability.html">Macromedia Usability Topic Center</a>
<p>http://www.macromedia.com/devnet/topics/usability.html</li>
<li><a href="http://msdn.microsoft.com/library/default.asp?url=/library/en-us/dnwue/html/fore.asp">Microsoft Windows User Experience</a>
<p>http://msdn.microsoft.com/library/default.asp?url=/library/en-us/dnwue/html/fore.asp</li>
<li><a href="http://www.useit.com/papers/heuristic/heuristic_list.html">Nielsen, Jakob Ten Usability Heuristics</a>
<p>http://www.useit.com/papers/heuristic/heuristic_list.html</li>
</ul>
]]></content:encoded>
			<wfw:commentRss>http://www.designbycandlelight.com/usability-heuristics-for-rich-internet-applications/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Usability &amp; Information Architecture</title>
		<link>http://www.designbycandlelight.com/usability-information-architecture/?utm_source=rss&#038;utm_medium=rss&#038;utm_campaign=usability-information-architecture</link>
		<comments>http://www.designbycandlelight.com/usability-information-architecture/#comments</comments>
		<pubDate>Wed, 05 Sep 2007 17:40:00 +0000</pubDate>
		<dc:creator>rphillippi</dc:creator>
				<category><![CDATA[Information Architecture]]></category>
		<category><![CDATA[business]]></category>
		<category><![CDATA[usability]]></category>

		<guid isPermaLink="false">http://designbycandlelight.cordelia.titaninternet.co.uk/test/?p=123</guid>
		<description><![CDATA[&#8220;On the Web, if a site is difficult to use, most people will leave. On an intranet, if employees perform their tasks more slowly due to difficult design, the company bears the cost of the reduced productivity. In fact, I estimate that low intranet usability costs the world economy $100 billion per year in lost [...]]]></description>
			<content:encoded><![CDATA[<p>&#8220;On the Web, if a site is difficult to use, most people will leave. On an intranet, if employees perform their tasks more slowly due to difficult design, the company bears the cost of the reduced productivity. In fact, I estimate that low intranet usability costs the world economy $100 billion per year in lost employee productivity. This may not be the most important problem facing the planet, but it&#8217;s not a trifling issue either.</p>
<p>Usability is an important, though not the only, determinant for the success of a web site or an intranet. Information architecture is an important, though not the only, determinant for the usability of a design. There are other issues, but you ignore information architecture at your peril.</p>
<p>Critics may say that users don&#8217;t care about information architecture. They don&#8217;t want to learn how a web site is structured; they just want to get in, get their task done, and get out. Users focus on tasks, not on structure. But it&#8217;s because users don&#8217;t care about the structure of a web site that it is so important to get the information architecture right in the design. If users did bother to study our web sites, they could surely learn how an obscure or illogical structure works and utilize that knowledge to improve their task performance. Humans are flexible creatures and can adapt to hostile environments if they choose to do so.</p>
<p>But since we know that users won&#8217;t spend time learning our information architecture, we have to spend resources to design the best information architecture we can. Allow users to focus on their tasks, and let information architects be the ones to spend time worrying about the structure of the web site or intranet. This is a good division of labor, and the pay-off from good information architecture is immense. The more that answers are located in the places you look for them, the easier the design will feel to users, and the more successful the project. There will be more sales (for e-commerce sites), better reputation for good service (for marketing sites), and less loss of productivity (for intranets).</p>
<p>I am a great believer in having professional information architects design the structure of professional information projects such as corporate web sites and intranets. But I also think there will be an increasing role for personal information architecture in the future. It will soon be time to teach a simplified version of the discipline to high school students, and possibly even to bring it into elementary schools as well.</p>
<p>The modern world is one of information overload; we are constantly bombarded by an inflow of messages, and we ought to read much more information than we have time for. Keeping yourself from drowning in this morass of information will require personal information architecture skills for problems like structuring email folders and computer files as well as the ability to manage advanced search features.</p>
<p>In the long run, personal information architecture may turn out to be even more important than corporate information architecture. For now, though, read this second edition of Information Architecture for the World Wide Web and get your web site and intranet in shape to support your customers and employees. Good information architecture makes users less alienated and suppressed by technology. It simultaneously increases human satisfaction and your company&#8217;s profits. Very few jobs allow you to do both at the same time, so enjoy.&#8221;</p>
<p>Spoken by Jakob Nielsen<br />
Quoted in &#8220;Information Architecture for the World Wide Web, 2nd Edition&#8221;</p>
]]></content:encoded>
			<wfw:commentRss>http://www.designbycandlelight.com/usability-information-architecture/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

