• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
User Interface Design Best Practices
 

User Interface Design Best Practices

on

  • 8,558 views

Good User Design Practices

Good User Design Practices

Statistics

Views

Total Views
8,558
Views on SlideShare
8,502
Embed Views
56

Actions

Likes
2
Downloads
137
Comments
1

2 Embeds 56

http://www.slideshare.net 55
http://www.brijj.com 1

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel

11 of 1 previous next

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
  • If anybody wants to know best practices in UI design, they can read
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    User Interface Design Best Practices User Interface Design Best Practices Presentation Transcript

    • User Interface Design: Best Practices
    • Design Language Comics © 2007, Stacie Gomm, Utah State University
    • Design Language Comics Design Language Comics © 2007, Stacie Gomm, Utah State University
    • Imbedded User Languages Stacie Gomm Utah State University May 2007 © 2007, Stacie Gomm, Utah State University
    • How do these relate? How do you know that? © 2007, Stacie Gomm, Utah State University
    • The design of the key and keyhole concept is implicit and it is has a language which “speaks” to users and let’s users know what they are supposed to do. © 2007, Stacie Gomm, Utah State University
    • Does this “speak” to you? © 2007, Stacie Gomm, Utah State University
    • Imbedded User Languages This imbedded language is often overlooked or its existence is not realized as users develop products which are used in our everyday lives. © 2007, Stacie Gomm, Utah State University
    • Imbedded User Languages The user language imbedded in every designed product communicates to the users the use for/of that product. © 2007, Stacie Gomm, Utah State University
    • Design of Everyday Things by Donald Norman The human mind is exquisitely tailored to make sense of the world. Give it the slightest clue and off it goes, providing explanation, rationalization, understanding. Consider the objects – nooks, radios, kitchen, appliances, office machines, and light switches – that make up our everyday lives. Well- designed objects are easy to interpret and understand. They contain visible clues to their operation. Poorly designed objects can be difficult and frustrating to use. They provide no clues – or sometimes false clues. They trap the user and thwart the normal processing interpretation and understanding (Norman, p. 2, italics added). © 2007, Stacie Gomm, Utah State University
    • Design of Everyday Things by Donald Norman Included in every design are the affordances, mappings, visibility, and feedback and each of these has it own implicit language which speaks to the user. © 2007, Stacie Gomm, Utah State University
    • Design of Everyday Things by Donald Norman Affordances are the “perceived and actual properties of the thing, primarily those fundamental properties that determine just how the thing could possibly be used” (Norman, p. 9). Mapping is a technical term meaning the “relationship between two things, in this case between the controls and their movements and the results in the world. … Natural mapping … leads to immediate understanding” (Norman, p. 23). © 2007, Stacie Gomm, Utah State University
    • Design of Everyday Things by Donald Norman In good design things are visible. “There are good mappings, natural relationships, between the controls and the things that are controlled” (Norman, p. 22). Feedback is the notion of sending back to the user information about what action has actually been done -- what result has been accomplished (Norman, p. 27). © 2007, Stacie Gomm, Utah State University
    • Design of Everyday Things by Donald Norman Norman suggests that when developing a product ALL of the following should be included in its user language: •Visibility – By looking the user can tell the state of the device and the alternatives for action. •Affordances – The designer provides a good conceptual model for the user, with consistency in the presentation of operations and results and a coherent, consistent system image. •Good mappings – It is possible to determine the relationship between actions and results, between the controls and their effects, and between the system state and what is visible. •Feedback – The user receives full and continuous feedback about the results of actions. (Norman, p.53) © 2007, Stacie Gomm, Utah State University
    • Netest A testing system developed at Utah State University that is used to administer the Computer and Information Literacy (CIL) tests. Lack of communication could interfere with the user being able to pass a test. © 2007, Stacie Gomm, Utah State University
    • Netest – Trainee Interface Visibility This screen shows all of the options available to trainees. © 2007, Stacie Gomm, Utah State University
    • Netest – Trainee Interface Affordances It is obvious which buttons perform which tasks. © 2007, Stacie Gomm, Utah State University
    • Netest – Trainee Interface Mappings Mapping buttons to their action is done well in this program. © 2007, Stacie Gomm, Utah State University
    • Netest – Trainee Interface Feedback The buttons actually do what is expected. © 2007, Stacie Gomm, Utah State University
    • Netest – Testing Interface Norman contends that when simple things need pictures, labels, or instructions, the design has failed (p.9). © 2007, Stacie Gomm, Utah State University
    • Implications for Portal Design When building a portal there exists a language that communicates to the user the actions which are expected by the user. When a designer designs the portal, there is a built in user language. The designer must realize this fact in order for his design to be able to communicate effectively with its users. This language is used by the user to communicate with the portal system. © 2007, Stacie Gomm, Utah State University
    • Implications for Portal Show sample Portals Identify commonalities and what the user expects © 2007, Stacie Gomm, Utah State University
    • Design of Everyday Things by Donald Norman When developing instructional products, according to Norman, this is what instructional designers should do: 1. Understand the causes of error and design and to minimize those causes. © 2007, Stacie Gomm, Utah State University
    • Design of Everyday Things by Donald Norman 2. Make it possible to reverse actions – to “undo” them – or to make it harder to do what cannot be reversed. 3. Make it easier to discover the errors that do occur, and make them easier to correct. © 2007, Stacie Gomm, Utah State University
    • Design of Everyday Things by Donald Norman 4. Change the attitude toward errors. Think of an object’s user as attempting to do a task, getting there by imperfect approximations. Don’t think of the user as making errors; think of the actions as approximations of what is desired. (p. 131) © 2007, Stacie Gomm, Utah State University
    • Imbedded User Languages “Good” designers have a realization and understanding of the user language contained within their products and insure complete communication takes place between the product and user. © 2007, Stacie Gomm, Utah State University
    • Imbedded User Languages Questions / Comments? Contact Info: Stacie.Gomm@usu.edu © 2007, Stacie Gomm, Utah State University