Human Computer Interaction Flashcards
Examples of human computer interaction
Moving a mouse, touching a screen, typing into a keyboard, using a scroll wheel, swiping upwards or downwards, viewing information on a screen.
Interfaces
Interfaces are parts of a computer which the user interacts with. A computer can have a physical, graphical or virtual interface. The purpose of a user interface is to clearly communicate information and hide the inner workings of the computer.
(Eg. Computer mouse, keyboard, speakers, screen, webcam, virtual reality headset)
Clients
Clients are devices used to access browsers and websites.
Interacting with an interface
Humans can use movement, sight, speech and hearing to interact with an interface. These interactions function as either ‘input’ or ‘output’.
User needs
Different users have different needs. Some features for more accessible web content for many users in many different situations are…
- Video captions
- Good colour contrast
- Voice recognition
- Text to speech
- Clear layout and design
- Notifications and feedback
- Large links, buttons and controls
- Understandable content
Aim of computer interaction
Information flows from the human, through the computer system, then back to the human again in a feedback loop. The aim of this human-computer interaction is to make it as efficient as possible.
Active and passive interaction
Humans can interact with computers passively or actively. For example, even if no physical movement is made by the user, interaction can still occur by sight as the user reads the information being displayed.
Cognitive walkthrough
A cognitive walkthrough helps to explicitly identify each step of an interaction between a human and computer, highlighting how many steps are involved.
Fit for purpose
Being ‘fit for purpose’ refers to the different features which are included in the design of products to function efficiently.
Trade off
A ‘trade off’ is a situation where designers compromise one feature to gain another.
Eg. Simple versus powerful interface
Simple interfaces are easier to learn, but less efficient to use due to the user constantly returning to menus or tabs (a solution could be to ease the user into the application by releasing more advanced features once the user is familiar with it).
Powerful interfaces are more difficult to learn, but more efficient to use due to its large variety of functions available for use.
What is a usability heuristic
‘Usability heuristics’ are a set of guidelines used by HCI designers to test an interface practically and cost-effectively.
The 10 usability heuristics
- Visibility of system status
- Match between system and the real world
- User control and freedom
- Consistency in standards
- Error prevention
- Recognition rather than recall
- Flexibility and efficiency of use
- Aesthetic and minimalist design
- Help and documentation
- Error recovery
- Visibility of system status
“The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.”
• An interface should indicate to users when it has started something, how long they must wait, and when it has completed something.
- Match between system and the real world
“The system should speak the users language with words, phrases and concepts familiar to the user, rather than system orientated terms. Follow real world conventions, making information appear in a natural and logical order.”
• Users should be able to recognise features such as designs and labels which follow a convention and are familiar to them.
- User control and freedom
“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.”
• Interfaces should enable users to make choices and have the freedom to change their mind if necessary, giving them the ability to undo an action by going back one or more steps.
- Consistency in standards
“Users should not have to wonder whether different words, situations or actions mean the same thing.”
• Interfaces should be consistently designed so users do not have to relearn how to use each new interface.
- Error prevention
“Even better than good error messages is a careful design which prevents a problem from occurring in the first place. Either eliminate error-prone conditions or check for them and present users with a confirmation option before they commit to the action.”
• Interfaces should be designed to prevent or correct human errors in computer input, because often mistakes will occur when the user intends to do one thing but accidentally does another.
- Recognition rather than recall
“Minimising the users memory load by making objects, actions and options visible. The user should not have to remember information from one part of the dialogue to another. Instructions for the use of the system should be visible or easily retrievable whenever appropriate.”
• Interfaces should use visual or audial prompts to encourage recognition from users, lowering the amount of energy required from them to complete simple tasks.
- Flexibility and efficiency of use
“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.”
• Interfaces should have features which enable users to maximise time, making interactions quick and efficient. This could mean interfaces use accelerators, which speed up different computer functions for users.
- Aesthetic and minimalist design
“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.”
• Interfaces should have an uncluttered design, with easily located and relevant information on it.
- Help and documentation
“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 users task, list concrete steps to be carried out and not be too large.”
• Interfaces should have accessible help and documentation which is easy to follow for users who may face issues. The F1 key is now commonly used to reach help and documentation.
- Error recovery
“Error messages should be expressed in plain language (no code), precisely indicate the problem and constructively suggest a solution.”
- Error messages should explicitly state the problem, be easy to read and understand, polite to users, be precise and use the correct terminology and be constructive in offering advice to reach a solution. This enables users to recognise, diagnose and recover quickly from errors.
- Fatal error messages relate to problems which can not be rectified. Error messages should aim to prevent negative implications happening in the future and solve issues before they require a fatal error message, which may cause a loss of data.
Describe the role of your chosen interface
The purpose of the (website name) website is to allow users to (main purpose). In (website name), users can (feature 1), (feature 2) and (feature 3). There is also a (feature 4) which means (purpose).
Identify an example from your chosen interface and show how this example illustrates usability heuristics
- Identify 1 key feature of the interface
- “This meets the usability heuristic of ___, because ____.”
- Elaborate with specific examples, while mentioning the effect on users
- Repeat this until all applicable usability heuristics of the feature have been mentioned (mention atleast 4 heuristics)
Evaluate your chosen interface using usability heuristics
- (Interface) (meets/does not meet) the (usability heuristic) heuristic because…
- (Interface feature) is a (positive/negative) example of the (usability heuristic) because…
- It is (simple/difficult) to (action) with (interface) because of (usability heuristic)…
Compare and contrast the chosen interface
- By comparing (interface 1) to (interface 2) you can see that (difference where one is better) which follows the usability heuristic of (usability heuristic)…
- Elaborate with specific examples, while mentioning how they meet the usability heuristics (discuss similarities and differences across sites)
Suggest an improvement to the interface
- To improve (interface) I would suggest that they (change of feature, atleast 3 suggestions), because (link to heuristic using key words)…
- Elaborate with specific examples, while mentioning how they meet the usability heuristics
Explain why changes would be an improvement
Eg. The aesthetics of a site affects the users ability to find the relevant information. Each additional piece of information on a page reduces the visibility of the other information on the page. By using less listing images per page like Ebay does, Trade and would be able to highlight featured auctions much more for potential buyers.
• Additionally, by (recommendation) this would mean (improvement) and (positive effect on user).
Examples of visibility of system status
Confirm actions, immediate feedback, progress bars/spinners
Examples of match between system and real world
Common symbols, familiar language, colour complements images, clear format of information in logical order
Examples of user control and freedom
Undo, redo, cancel and escape buttons, allow to re-edit entries, re-open closed or deleted items
Examples of consistency in standards
Common functions and buttons use the same icons, located in the standard order and position on page
Examples of error prevention
Invalid data types, re-type information on forms, drop-down selection boxes, pop-up confirmation windows, allow variations on correct answers, set defaults, position elements to prevent mistakes
Examples of recognition rather than recall
Hints, autocomplete, multiple choice, visible file names, menus and settings, instructions easy to locate, display familiar icons
Examples of flexibility and efficiency of use
Number and letter shortcuts, changing screen size, “pinch to zoom”, ALT key, favourites, bookmarks
Examples of aesthetic and minimalist design
Clear space, content focused, grid alignment, no excess colours, borders or shading, simple graphics and words
Examples of help and documentation
Video tutorials, FAQs, online discussion boards, manuals, help in clear and plain language which is accessible, technique support people and virtual assistants
Examples of error recovery
Message showing data inputs are not expected type, message showing inputs do not match
