Design Rules

1. Design Rules

2. Contents • Design principles • Standards and Guidelines • Patterns

3. Design Rules • This section will present design rules to increase the usability of software products • We will examine • Principles as a way of understanding usability • Design rules and standards • Design patterns to capture and reuse design knowledge

4. Design Principles • Principles are the most abstract design rules • Principles were derived from observing successful systems and discovering why they were successful • The study of principles will provide an understanding of what makes a system usable

5. Design Principles • Principles can be broken into 3 categories • Learnability • How easy they are to learn • Flexibility • The number of ways the user can communicate with the system • Robustness • Features which support the successful achievement of a goal

6. Learnability • This is concerned with the features of a system which allow a novice user to • Understand the system • Use it at an initial level • Master the system to use it efficiently with a higher level of proficiency • We will now examine each of the principles affecting learnability

7. Predictability • Predictability involves being able to predict the effect of an action based on how the system has performed in the past • This means that the user should be able to observe the system for a period of time and then predict the effect of actions

8. Predictability • In the worst case, the user would have to see every operation performed to be able to predict the effect of an action • In the best case, observing a few operations is sufficient to allow someone to predict future operations • The goal is to achieve predictability with minimal exposure to the system

9. Synthesizability • This is the ability of the user to assess the effect of past operations on the state of the system • Predictability cannot be achieved if the effect of operations cannot be readily observed • One of the hallmarks of synthesizability is immediate feedback

10. Synthesizability • An Example • An early version of the Macintosh finder allowed the user to create new folders which were placed at the end of the list of files • If there were enough files to fill the window, the new folder was placed out of sight • This caused the user to assume the operation had failed and repeat it multiple times, resulting in many unnamed folders in the directory

11. Familiarity • Familiarity refers to how familiar the user is with concepts similar to those of the system • This is often aided by the system being a metaphor for something the user is familiar with in the real world • The word processor is similar to a typewriter • Therefore, the user’s familiarity with the typewriter will aid he or she in understanding the word processor

12. Generalizability • Users can extend their understanding of the system by generalizing the concepts they already understand • Example • A drawing program allows one to constrain an ellipse to be a circle by holding down the shift key while drawing • The user can extend this to conclude that a rectangle can be constrained to be a square by holding down the shift key • Generalizability is related to consistency

13. Consistency • Consistency is the most often mentioned principle of interface design • It means that similar actions should have similar effects in similar situations • Consistency reduces the load on the user’s memory since there are fewer rules to remember

14. Consistency • Input consistency • The arrow keys are used to move around in many text editors • Some editors use regular keys arranged in the same pattern on keyboards which do not have arrow keys • Eg. Using e, s, d, x as arrow substitutes that have the same relative positions

15. Consistency • Output consistency • The control panel for an aircraft color codes the messages on the panel • Urgent (red) • Requires immediate attention • Warning (amber) • Requires attention soon • Advisory (green) • For information only, no action required

16. Flexibility • Flexibility refers to the number of ways the user can exchange information with the system • There are several underlying principles which contribute to flexibility

17. Dialog Initiative • Dialog initiative indicates who starts a dialog – the system or the user • System preemptive • The system initiates all dialog and the user simply responds • This happens when the system displays a modal dialog so that the user must respond before any other operation can be performed

18. Dialog Initiative • User preemptive • The user can initiate any action • In a system preemptive dialog the user’s actions are controlled by the system and greatly restricted • We want to maximize • the user’s ability to preempt the system • Minimize • The system’s ability to preempt the user

19. Dialog Initiative • Consider filling in an address form • System preemptive • User selects country • System presents list of states or provinces • User selects province • System presents list of cities • User selects city • System prompts for street • The user must • Enter data in a specific order • Cannot cut & paste from elsewhere • Do exactly what the system demands

20. Dialog Initiative • User preemptive • User asks to enter address • System displays address form • User enters data in any order desired • This model provides much greater flexibility for the user • Most users prefer this form of dialog initiative

21. Dialog Initiative • There are still situations where it is better for a dialog to be system preemptive • Consider a shared text editor where two users can edit at the same time • To avoid problems, the system locks paragraphs so that only one user can change a paragraph at a time • If this was not controlled by the system a lot of confusion would result

22. Multi-threading • A multi-threaded dialog allows the user to interact with different parts of the system at the same time • This is common in windowing systems which allow a user to switch between running programs and interact with each one • The same thing can be done for an application by providing multi-threading

23. Multi-threading • Multi-modality is related to multi-threading • It means that different communication channels can be used simultaneously • A bell can sound when invalid input is supplied • The user can also be provided with multiple ways to perform a task • Open a window by • Clicking an icon • Keyboard shortcut • Say “open window”

24. Task Migratability • This means that control of a task can be transferred from the user to the system and vice versa • Consider the case of checking the spelling in a document • The user can look each word up in a dictionary • The system can perform the same task automatically

25. Task Migratability • Task migratability can enhance safety • In an aircraft, routine flying can be relegated to the auto pilot • In an emergency, it is vital that the functionality be transferred to a human pilot • Without this migratability, safety would be compromised

26. Substitutivity • This means that one form of information representation can be substituted for an equivalent form • Consider entering a distance • As a value in default units – 3.8 • As a value in specific units – 3.8 in • As a calculation – (5 – 1.2) cm

27. Substitutivity • There are also equivalent forms of output that can be substituted • Consider the display of the temperature • As a thermometer showing the current temperature • As a chart showing temperatures over a period • As a graph showing temperatures over a period

28. Substitutivity • Equal opportunity blurs the distinction between input and output at the interface • An analog dial which shows a value but whose hand can be moved to adjust the value • A cell in a spreadsheet whose value can be changed and it will cause other values to be recalculated

29. Customizability • This allows the interface to the modified by the system or the user • Adaptability refers to the user’s ability to adjust the form of input and output • This can take two forms • Lexical customization • the user can only change the layout of on-screen buttons or rename commands • The overall structure of the interface remains the same

30. Customizability • Programmability • The user can program the interface • The UNIX shell can be programmed • VB/Java script can be used to program many applications • Macros can be recorded to create new commands with simple logic in them • Adaptivity is the automatic customization of the interface by the system

31. Customizability • Adaptivity allows the system to adjust the interface to the perceived needs of the user • For example, the system could monitor the actions of the user to decide whether to provide an interface for a novice or an expert • The user plays an explicit role in adaptability but an implicit role in adaptivity

32. Robustness • A user communicates with a computer to achieve a set of goals • The robustness of the interaction is any feature of the system that supports the successful completion of the goal

33. Observability • Observability allows the user to evaluate the internal state of the system by interacting with the interface • Observability is supported by • Browsability • Defaults • Reachability • Persistence • Operation visibility

34. Browsability • Browsability allows the user to explore the current state of the system from the user interface • Typically, the user interface does not display all of the information about the system • What it should do is display all of the state information which is relevant to the current task

35. Browsability • Often, there is more information than which can be displayed at once • This means that the user must be provided with some means of navigating the information to explore and find what is needed • The browsing itself should not affect the state of the system

36. Defaults • The use of default values can • Reduce the amount a user has to remember • Reduce the number of physical actions necessary to provide a value • There are two types of default values • Static – the values never change • Dynamic – values are calculated based on the state of the system

37. Reachability • This refers to the user’s ability to navigate through the observable system states • A state is reachable if it can be reached from every other state in one way or another • It is important that all states be reachable

38. Persistence • Persistence has to do with how long an act of communication between the user and the system persists • If the system plays a sound to alert the user, it is gone in an instant • If the user went for coffee when the alert sounded, it would be missed • If the alert is displayed on the screen, it will persist for a much longer time and there is less chance it will be missed or forgotten

39. Recoverability • Recoverability refers to the ability to recover from a mistake and still be able to achieve a goal • Recovery can occur in two directions • Forward • The current state is accepted and it is possible to work to the final goal from that state • This might be the only possible technique if an action has irreversible side effects, such as printing

40. Recoverability • Backward • This allows you to undo one or more actions to return to a previous state • You can then move in a different direction from the previous state to correct the error • The principle of commensurate difficulty states that if it is difficult to undo an operation, it should have been difficult to perform the operation in the first place

41. Responsiveness • Responsiveness is the rate of communication between the system and the user • Response time is the duration needed for the system to display a state change to the user • Ideally, response time should be close to zero so the user perceives it as instantaneous • Stability, the constance ofresponse time across similar tasks, is more important than absolute response time

42. Task Conformance • Task conformance means that the necessary operations must not only be provided but provided in a way that they are convenient to use for a variety of tasks • Task completeness means that all operations necessary to perform the task are provided

43. Contents • Design principles • Standards and Guidelines • Patterns

44. Standards • Standards are issued by national or international bodies to ensure compliance with design rules by a large community • Most of the existing standards address hardware concerns • A small amount of the standards address software • The software standards are more vague than the hardware standards

45. Guidelines • Guidelines are less prescriptive than standards • They are issued by companies or manufacturers • They are directed towards a smaller community of users • Surveys have been compiled that list large numbers of guidelines issued by different organizations

46. Guidelines • Many guidelines come from software companies to ensure that people writing for their platforms have a common look and feel to their software • Examples include • Microsoft • Apple • Sun Microsystems

47. Contents • Design principles • Standards and Guidelines • Patterns

48. Patterns • Patterns are solutions to recurring problems that have been generalized so that they can be applied to similar problems when they are encountered • Software design patterns have become accepted in the last few years • HCI patterns have also appeared that provide solutions to interface design problems

49. Patterns • Most patterns are stated in a stylized form that makes them easier to read • Name of pattern • When it might be used • How the solution can be implemented • References to related patterns

50. Breadcrumbs • Problem • The users need to know where they are in a hierarchical structure • Use when • Sites with a large hierarchical information structure, typically more than 3 levels deep. Such sites are medium to large sized and include shops, catalogs, portals, corporate sites etc. The site has got a main navigation scheme that allows users to traverse the hierarchy. Users may want to jump several steps back instead of following the hierarchy. Users may be unfamiliar with the hierarchical structure of the information. Users may need to know where they can go. users need to know how they arrived at their current location.