A good user interface design enables the user to effectively interact with the system and perform his tasks. (True) HCI: (Human-Computer Interaction) is the study of how humans interact with computers and their applications. It tells us how to build user interfaces that are safe, efficient, easy and enjoyable to use (as well as functional!). A user interacts with a computer system via the user interface (UI). (True) the UI of different types of computer systems are different because the ways in which we interact with them are different. (True) The UI is two-way communication. (True) 1
Because of the UI is all you will see of any computer system, certain authors have concluded that, to users, the user interface is the system. (True) What is the difference between the terms user interface and human computer interaction? The user interface constitutes that part of the computer system through which the user communicates commands, and receives data for interaction with a computer system. Human computer interaction, as a discipline, is the study of how users interact with computer systems. It is concerned with the design of computer systems that are safe, efficient, easy and enjoyable to use, as well as being functional. How could we consider a UI as a good one? 1- easy to use. 2- easy to understand. 3- meets the needs of the intended users. 4- supports users in the tasks they wish to undertake. 2
A good UI designer thinks about the users of the UI and pays great attention to the usability of the UI for users. (True) What Usability does mean? the extent to which a [system] can be used by specified users to achieve specified goals [or tasks] with effectiveness, efficiency, and satisfaction in a specified context of use. A good UI is one that is easy to use and easy to understand, one that meets the needs of the intended users, and one that supports users in the tasks they wish to undertake. (True) A good UI designer thinks about the users of the UI and pays great attention to the usability of the UI for users. (True) For organizations, poor usability can lead to decrease in staff productivity, high staff turnover, low morale and poor job satisfaction. (True) 3
To design a good UI it is important to know who the users will be, their goals, their tasks, and their specific context of use. In HCI, this is called user-centered design. (True) Before designing a system, What a good UI designer should Know? 1- Who are the users? 2- What are the users experiences? 3- What skills do they have? 4- What tasks will they be using the system for? and if the system is a replacement for an existing one: 1- What are the users expectations? 2- How do they currently perform their tasks? 3- How will the new system support and/or change their goal and tasks, and environments? What are the UI design principles? Visibility, feedback, affordance, simplicity, structure, consistency and tolerance. 4
Give some examples of UI widgets? menu bar, toolbar, dialogue box... Visibility? making it clear what a UI element is used for. All UI elements should have good visibility. (True) How can the UI designer achieve the Visibility? By think about the goal that will be achieved by using that element. Feedback? making it clear what action has been achieved through the use of the UI element. 5
All UI elements should provide adequate feedback in response to the user s actions. (True) Feedback? making it clear what action has been achieved through the use of the UI element. How can the UI designer achieve the Feedback? By think about what information should be sent back to the user about. Affordance? making it clear how a UI element should be used, to afford means to give a clue. The clue is of how to interact All UI elements should have good affordance. (True) 6
How can the UI designer achieve the Affordance? The element s appearance should make it obvious how a user should interact with it Simplicity? means keeping things as simple as possible. How can the UI designer achieve the Simplicity? To achieve simplicity, employ actions, icons, words and user interface controls that are natural for the user. Structure? A UI will be more usable if it is structured in way that is meaningful and useful to user. 7
How can the UI designer achieve the Structure? Things that the user will think of as related should be clearly and closely related and appear together in the UI, or at least they should be clearly and closely associated Consistency? in appearance, positioning and behavior within the UI makes a system easy to learn and remember. The presentation of the UI should be consistent. (True) How can the UI designer achieve the Consistency? If two UI elements are to serve the same or similar purpose they should be made as consistent as possible. 8
Tolerance? Refers to the ability of a UI to prevent errors if possible, or to make them easy to recover from, if not. The UI should be designed to reduce the number of user errors and facilitate recovery from them. (True) How can the UI designer achieve the Tolerance? Think of the ways in which the user can make errors. What is a Home page? A home page is the main entrance into the website. As the name suggests, there is usually only one home page per website. 9
What is a interior page? An interior page is a web page that can be reached from the home page. Metaphorically, if the home page is the main entrance, then interior pages are the interior rooms that can be reached from it: any non-home web page within a website is an interior page. Errors, of course, are not always due to poor UI design, sometimes user is unfamiliar with an application or does not have the right experience or skills. (True) Recoverability of a UI refers to how easy it is for users to recover from their mistakes. (True) Explain the two types of error recovery? Backwards error recovery: the user will be allowed to undo the effects of the action that caused the error. Forwards error recovery: the system accepts the error there is no undo but still helps the user to accomplish their goal. 10
Text is a very natural way for us to communicate because of its recognised flexibility and power. (True) Readable text will allow the user to find the information that they need easily on the page. (True) Legible text will allow the user to read easily, once they have found the information. (True) How could we present Numeric data? through several graph and chart types (line graph, the bar chart, and the pie chart). 11
How can the designer achieve the presenting of Numeric data? By ask himself the following questions: 1- Is there a comparison to be made? 2- Can I draw the chart so that viewers are led to make a comparison? 3- Check that data ranges on the two axes of a graph are appropriate. 4- Check that any comparison you make is fair. Non-data-ink can include important information, e.g. labels or grids, but also the fancy graphics that can distract the reader. (True) The largest share of the ink on a graphic should be data-ink. (True) Chart junk is the enemy of simplicity in information visualization. It distracts a reader from achieving their task with meaningless photos and line art, administrative clutter, fancy fonts, weird backgrounds. (True) 12
How can the designer avoid chart junk? By ask himself the following questions: 1- Are you using content-free decoration? 2- Is that background really necessary? 3- Do those photographs really add information? 4- Is there anything that can be removed without changing the message? The power of the graphic depends just as much on the data that is discarded as on the data that is presented. (True) The more data there is, the more difficult its representation for information visualisation. (True) A simple structure allows each element of the page to be tied to its message and enhances the flexibility and adaptability of your site. (True) 13
A consistent layout of web pages increases ease of use, aids user navigation and helps to establish unity across several pages of the website. (True) How relevant is the content of a website for the user? The website must allow the users to carry out the tasks they want to perform easily with no error. Give some guidelines on what to include in home page? 1- Something that identifies the website as yours. 2- The name of the website. 3- An important part of telling the users where they are also involves the choice of typeface, colors and page layout. 4- A brief introduction to the site telling your user what they can expect. The information in such website should be relevant, credible, useful and up to date. (True) 14
Give some guidelines on what to include in home page? 1- Something that identifies the website as yours. 2- The name of the website. 3- An important part of telling the users where they are also involves the choice of typeface, colors and page layout. 4- A brief introduction to the site telling your user what they can expect. There should always be a link to the home page from an interior page. (True) Small errors in spelling and grammatical mistakes will also reduce the feeling of quality. (True) The important content of a page should be visible without scrolling. In general, it is better to ensure that all the links are visible without scrolling. (True) 15
For consistency, the look and feel colours, fonts, title bar, and so on of the interior pages should be similar to that of the home page. (True) 16