<?xml version="1.0" encoding="UTF-8"?><rss version="2.0">
<channel>
<title>gestalt</title>
<link>http://www.computersight.com/tags/gestalt</link>
<description>New posts about gestalt</description>
<item>
<title>The Importance of Design Principles in Interface Design</title>
<link>http://www.computersight.com/Programming/The-Importance-of-Design-Principles-in-Interface-Design.39903</link>
<description>
<![CDATA[<p>Always consider how the customers will experience your newly designed web page or application. Don't design your way out of usability and satisfied customers. Make sure that you follow some well established principles of design that will help your customers reach their goal - which is the same as yours - to make that purchase, to find that information, or to be satisfied with your product and come back when another is needed.</p>
 <p>Even if your products are the most desirable in the world, or the information you provide is exactly what is searched for, or your application has all the capabilities the customer could ever dream of, if your interface is illogical, difficult to operate, full of confusing inconsistencies or calls the user an idiot every time he presses the wrong button, your target consumer will probably not make it to the purchase, or come back a second time, leaving both of you as losers. This article will state and explain a few known-to-be truths about user interfaces that will help you avoid much of the problems you could encounter otherwise.</p>
 <h3>What is Usability?</h3>
 <p>The International Standards Organization has stated that usability is “the effectiveness, efficiency, and satisfaction with which specified users achieve specified goals in particular environments.” This means, to achieve high usability, you must first consider who the user is, what that user needs to do and in which situation this will be done. </p>
 <p>When you have this information, you can then start to figure out what particular user interface solution will be most appropriate for your application.</p>
 <h3>Some Golden Rules</h3>
 <p>To start off, I will define some golden rules we all should follow in our desire for high usability and happy customers.</p>
 <h3>Consistency is Key</h3>
 <p>If you fail to follow this rule, you risk that your customer must relearn your interface for every new screen he arrives at. Use the same words all over when you describe the same things. Don't let the green blinking light in the corner mean “System active” on one screen and “Click me, I have a message” on the next.</p>
 <p>Using consistent interfaces smoothes the learning curve for your application, and lessens the annoyance that would no doubt build up for every oddly placed button or renaming of a specific function.</p>
 <h3>Give Informative Feedback</h3>
 <p>For every user action, the system should respond in a visual way. This is true on more than one level. If that round thing is a button, show it by animating its state when the user presses it, if the data submitted in the form was successfully stored, let the user know. Or if it wasn't successfully stored, definitely let the user know, and make it clear why it wasn't stored, and what the user can do (if anything) to make it work. This leads me to my next point:</p>
 <h3>Prevent Errors or Give Informative Error Messages</h3>
 <p>Prevent errors from happening. This is easier said than done, but if you are aware of the fact that a certain design choice in your application will commonly lead to a misunderstanding of that element's function, and thus produce erratic behavior, you should probably change your mind on that particular choice. Also, by disabling or not showing functionality that is irrelevant or illogical to apply to the current context, a lot of confusion can be avoided.</p>
 <p>If an error does occur, however, the message to the user should be as friendly and informative as possible, and should preferably contain information and suggestions about what the user may do to correct it. Avoid blunt and intimidating error messages such as “INVALID ENTRY” or “FATAL ERROR OCCURRED” that provide no information what so ever, and also shouts out in a way that would make the user (especially if the user is novice or have little experience with computer applications) feel guilty and less confident.</p>
 <p>Instead, the messages “Phone number contains too many digits.” and “The system ran out of virtual memory and needs to close. Shut down some applications and try again.” is a lot more informative, less intimidating and indicates both the cause and solution to the problem.</p>
 <h3>Design for Users of Different Skill Levels</h3>
 <p>The novice may need a lot of helping information when starting to use the application, but the expert will undoubtedly find the constant help pop-ups to be a source of limitless annoyance if he has no way of getting rid of them.</p>
 <p>On the contrary, expert users that do a lot of tasks repeatedly would like to have easy and quick access to these tasks and is willing to remember a few key strokes for doing so. Thus, you should provide these shortcuts for them as an alternative to the easy to figure out solution that you no doubt already have implemented.</p>
 <h3>Do Not Trust the User's Short-Term Memory</h3>
 <p>People don't like to remember a lot of little details, and certainly don't like being forced to do so to be able to complete the task at hand. Make all the information needed to complete a form or make the right choice in a dialog easily available to the user, but don't overdo it with irrelevant information.</p>
 <h3>Support Undo</h3>
 <p>Let the user have the possibility to undo the actions he performs as much as possible. There is no reason not to, and the user will feel more confident and more efficient.</p>
 <h3>Gestalt Principles</h3>
 <p>The Gestalt principles describe phenomena related to the visual perception of things, and are necessary to keep in mind when designing user interfaces. The way users' minds map various elements onto well-known things affects how they perceive the functionality of these elements.</p>
 <h3>Similarity</h3>
 <p>This effect occurs when various elements largely look alike and is thus perceived as a single unit. This can be used to express the fact that these elements belong together, and perform related tasks. This applies to both an elements shape and its color.</p>
 <p>This effect can also be used in its inverse, using dissimilarity to emphasize a certain element. A common use is having the currently selected section be marked with a different color than the rest.</p>
 <h3>Proximity and Grouping</h3>
 <p>If elements are placed near each other, they will be perceived as a group, and one might guess that these elements are related in some way. Thus, one must always be aware of the spacing between elements to make sure no false relations are suggested, and that the relations that do exist are made clear.</p>
 <p>One can also add clear separation of elements in form of borders and different background colors to establish the distinction between groups.</p>
 <h3>Continuation</h3>
 <p>This effect occurs when a shape compels the eye to move through and continue to another shape. Curves and lines are effective this way, and can be used to guide the user's attention to a desired area. Use this to emphasize a relevant or important element the user should notice immediately, such as a next-button that would otherwise be unnoticed in favor of other design elements.</p>
 <h3>Closure</h3>
 <p>This effect occurs when a shape that is not complete is composed in such a way that the user will complete the shape in their mind. Consider as an example that ¾ of a circle's outline would be enough to suggest the complete circle as a shape.</p>
 <h3>Affordance</h3>
 <p>Affordance is the term that describes the effect when an object strongly suggests a specific action, such as a door handle that says “push me down”, and the handle of a sword that says “grab me” (and the blade that says the opposite).</p>
 <p>An object that suggests a certain action very strongly is said to have high affordance, and an object that doesn't has low affordance. An example of the two would be an ordinary door handle that must be pushed down to open the door, versus a door handle that must be pushed in and then lifted up to open the door.</p>
 <p>The level of affordance depends on the person who looks at the object. Someone who've never seen a door handle might not know that it must be pushed down to open the door, while it would be obvious to anyone else.</p>
 <p>Thus, you should be aware of what the elements in your user interface signal to your users. If it looks like it can be clicked, it really should be.</p>
 <h3>Conclusion</h3>
 <p>Hopefully, you have been enlightened somewhat by this article and can now go over your interface designs and see all the things that don't work out, and make the necessary changes.</p>
 <p>Always consider how the potential user will perceive your interface, and remember that the potential user will rarely have the same notion of the world as you do. The things that are obvious to you might not be so obvious to everybody else.</p>
 <p>Even though the theory is necessary to know, and will save you a lot of trouble, don't forget the value of having actual users try out your interface and see how well they adapt. You will more often than not learn some surprising things about your design.</p><a href="http://www.pheedo.com/click.phdo?x=&u=http%3A%2F%2Fwww.computersight.com%2FProgramming%2FThe-Importance-of-Design-Principles-in-Interface-Design.39903"><img src="http://www.pheedo.com/img.phdo?x=&u=http%3A%2F%2Fwww.computersight.com%2FProgramming%2FThe-Importance-of-Design-Principles-in-Interface-Design.39903" border="0"/></a>]]></description>
<pubDate>Wed, 23 May 2007 06:04:08 PST</pubDate></item>
</channel>
</rss>
