Seminar on Principles of Usability

1
Windows 95 UI

• Seminar on Principles of Usability
• By
• Shai Turgeman
• Alon Kartin

2
Contents

• Making windows 95 UI
• Iterative design
• Exploration phase
• Rapid Iterations
• Fine tuning
• UI problems in windows 95
• Common dialog box
• General problems

3
Making windows95 UI
4
The Author

• Kent Sullivan Microsoft Corporation
• An adjunct to the UI design team
• A dedicated developer

5
The Goal

• Upgrade windows 3.x, already used by millions.
• Adjust the new operating system to a new beginner
  home market.
• Improve it for the advanced users, but only
  within a certain limit.

6
Iterative Design

• Design process changeable at all times.
• For every design a prototype is made.
• For every prototype a test is performed.
• In contrast to the waterfall approach Iterative
  design starts by exploration.
• Specification Process - Prototype or code are the
  spec.

7
Iterative design
8
First Phase

• Making a first prototype by
• taking care of the top 20 problems of the last
  version.
• Initial resources
• Win 3.1 UI design
• Apple Mac
• Xerox star

9
First desktop prototype

• The outcome of merging all the initial resources
  is the following desktop prototype.

10
First round test results

• Problems
• Navigating between folders the tested users
  didnt understand the relationship between the
  two panes.
• Parent folder looks like a regular folder

11
More test results

• More problems
• Confusing program folder each folder opened a
  new window, as result the users were lost in all
  of the folders.
• Three tray buttons which one to choose for an
  overlapping function, for example
• perform search in help.

12
More problems

• Fact The average time to locate and open a
  program was About 9 minutes.
• Double click the only way to open.
• Minimized windows do they exist?
• Confusing file hierarchy saving documents on
  default folder.

13
First round conclusions

• Too much consistency with win 3.1 made windows95
  different, not better.
• Focus will move to the most frequent tasks.
• A truly usable system will satisfy users of all
  levels.

14
Rapid Iterations phase

• Make improvements to the last results and test it
  once more.
• The new idea Separate the boys from the men i.e.
  make a beginner UI.

15
The beginner UI
16
The beginner UI why not

• A separate UI for beginners failed
• For one function that wasnt supported the
  beginner needed to abandon the Shell.
• Learning is needed in order to leave the beginner
  UI.
• Many differences between the shells made the
  users confused.

17
The start menu

• Start menu
• Take the good things from the beginner UI.
• Tested once more with all levels users.
• Programs sub-menu.
• One click start.

18
Task bar

• Making the minimized plates bigger didnt
  convince the users that it wasnt gone.
• Maybe by making it visible at all times.

a plate
19
Windows 3.1-Open and save as dialog

• The user has to handle 4 windows.
• The windows are not ordered in a logical fashion.
• Only one viewing option.

20
Windows 95 Open and save as dialog

• Only one wide window.
• There are some different viewing and ordering
  options for the user to choose from.
• Create new folder option.

21
Windows 3.1 - Printer setup

• Number one call generator.
• Many difficult choices need to be made in order
  to install a printer.
• Many scary buttons.

22
Windows 95 - Printer wizard

• A guide takes the user step by step.
• The wizard idea came up and fit exactly for this
  purpose Multi-step infrequent task.

23
Fine tuning Phase

• Adding up all the components
• Putting the top 20 popular tasks to the test by
  conducting a field study to the beta version.
• Problems that were unhandled or discovered too
  late were kept for the next version.

24
Conclusions

• Iterative design
• No detail of the first UI design was unchanged.
• Quick iterations.
• Usability Testing
• Test each task area.
• Test the Whole product for polishing.
• Problem tracking
• Problem database.

25
The final outcome

• A great OS with a great UI
• Used by millions all around the world
• Kent Sullivan is famous
• BUT

26
windows 95 UI problems
27
Introduction to windows 95 UI problems

• Microsoft invested huge efforts in the UI design
• Still, some basic UI principles were violated
• We will discuss
• Why Microsoft chose to implement in a certain
  way.
• The UI problems with that way

28
Windows 95 UI topics

• Open Dialog box
• Navigating the folders
• Long filenames
• File Extensions
• The start menu
• Tray Bar
• The Apply button
• Help files

29
Open Dialog - windows 3.1

• Separation of files from folders from drivers
• Separation of files names from files extensions
• When navigating the folders window
  you see the matching files immediately

30
Open Dialog windows 95 Vs. win 3.1
Windows 95
31
Open Dialog - windows 95

• Possible reasons for the windows 95 design
• Uniform access to drivers, folders and files
• The user has to select from only one window

32
Open Dialog - The UI problem in windows 95

• When a folder has a large number of subfolders -
  the user has to scroll right to find if there are
  files in the folder at all
• violates the Efficient principle.

33
Open Dialog Office 97

• The dialog is opened on the first file in the
  folder after skipping all the directories
• Creates the opposite problem- when the user wants
  to drill-down through folders

34
Open Dialog windows XP

• Built on the same principles of windows 95
• Shows that this problem is still open no better
  solution

35
Open Dialog UI tips

• The are no absolute solutions, just tradeoffs
• Possible directions are
• For each directory the first file will be the
  last one that was opened
• Or, you can let the user decide what will be the
  default open item ( first file, first folder
  ,etc.)

36
Navigating the folders windows 95 Vs. win 3.1

• Windows 3.1 Style
• Path shown graphically and written explicitly

37
Navigating the folders windows 95 Vs. win 3.1
Windows95 Style Click on Look in and scroll
upwards to know where you are
38
Navigating the folders windows 95 Vs. win 3.1

• Possible reasons for the windows 95 design
• Giving the user the option to decide how he wants
  to see the files
• The path above the graphic directories is not
  necessary

39
Navigating the folders windows 95 Vs. win 3.1

• Windows 95 implementation hides information from
  the user
• Two projects folder hierarchy

• ProjectA
• Contacts
• Notes
• Reports

• ProjectB
• Contacts
• Notes
• Reports

40
windows 95 - Navigating the foldersThe UI
problems

• Different files or folders with the same name
  look the same.
• violates the Clear principle.
• Scrolling upwards is not that intuitive.
• violates the Consistency principle.

41
Navigating the folders windows XP

• Still using the look in feature
• But , when using Look in all the path is
  shown

42
Navigating the folders - UI tips

• Provide one easy way to show the user the exact
  location in his navigation process
• Use intuitive actions when possible - show the
  whole tree instead of scrolling up

43
windows 95 Loooooooooooong filenames

• When viewing files in List mode -
  
• column widths width of the longest
  filename

44
windows 95 Long filenames

• The UI problem waste of screen space
• violates the Efficient principle.
• Why did Microsoft use fixed width?
• More files can be seen in one screen

45
windows 95 Long filenames

• Why did Microsoft use the same width for all
  columns?
• To make the form simple to create and use
• Long files that differ from each other at the
  last characters
• A better naming could solve this option

46
windows 95 Long filenames

• Alternative solution (provided by Microsoft)
• Like in the Details mode show the length that
  the user chooses and use tooltip to see the
  whole filename

47
Long filenames - UI tips

• Try to minimize the screen space that your
  program needs to the minimum required
• If you found a good solution try to use it with
  similar problems

48
Windows 95-Files Extensions

• When saving a file, the system can add an
  extension to the filename according to the file
  format.
• What happens when the user specifies an unknown
  extension?

49
Windows 95-Files Extensions

• Possible solutions
• Tell the user that this is an unknown extension ,
  and ask if he is sure
• Good maybe the user wrote the extension wrong
• Bad wasting the time of the user
• Allow the user to save the file with the
  extension specified
• Good the user knew what he is doing
• Bad Users that did make a mistake, might have a
  problem locating a file and opening it.

50
Windows 95 - Files Extensions

• Microsoft solution
• Adding an extension to the users extension

test.bch.txt instead of test.bch
51
Windows 95-Files Extensions

• The UI problems
• Ignoring the user request
• The user cant create a file with an unknown
  extension
• Violates the Powerful principle.
• Assuming the user made a mistake
• We know what is good for the user
• Microsofts solution still used in
• windows XP

52
Files Extensions UI tips

• DO NOT assume that the user made a mistake
• Force your solutions and you will lose him
• It is better to ask the user if he is sure
  rather than letting him find his mistake (in case
  it was a mistake)

53
Windows 95 - The start menu

• Why Microsoft choose this form
• Programs sub-menu.
• One click start.
• Take the good things from the beginner UI.

54
Windows 95 - The start menuUI problems

• The selection of the word start is confusing
• Isn't the computer already running?"
• Press the Start button to turn the computer
  off?"
• Does not support right-click context menus
• Doesn't offer a Properties option from the
  context menu
• Some problems remain from the Beginner UI stage

55
The start menu

• Today (windows XP) - right-clicking on the start
  button allows changing the menu structure and
  properties

56
Windows 95 - The start menuUI problems

• Cascading menus
• Microsoft no more than 2 levels deep
• In practice 4 or more levels deep
• Takes control of the users screen
• Microsoft cannot control the number of
  sub-menus, each program installs its own
  sub-menus

57
The start menu windows 95UI tips

• use smart naming the simplicity principle
  ,prefer intuitive word
• If you set standards obey them or change them
• If you have special buttons or folders let
  the user know about it or, just avoid it

58
Windows 95 - Tray Bar

• GUI service shared between separate programs

59
Windows 95 - Tray Bar UI problems

• Tray bar items dont look like control, but
  provide access to programs
• Different tray icons operate differently
• violates the Consistency principle.
• Displaying different things in the tooltip

60
Windows 95 - Tray Bar

• Example
• Microsofts speaker with one left-click setting
  volume level
• Microsofts clock with one left-click
  no response
• Possible solution
• Strong guidelines should be enforced
• The user will know what to expect when using tray
  bar
• All programs will be accessed the same way

61
Windows 95 - Tray BarUI tips

• Enforce uniform behavior when it can be done
  (like the example we saw)
• Much clearer for the user
• Set standards when you are sharing your program
  with other programs

62
Windows 95 The Apply button

• When editing a file we use the save option to
  prevent data loss
• What can we do to save changes when editing a
  form ?

63
Windows 95 The Apply button

• Possible option
• Choose OK and open the form again.
• Not a good idea - save , close and then open
  again
• Microsoft solution
• The Apply button chooses OK and opens the form
  again.

64
Windows 95 The Apply button UI problems

• The user cant restore the last changes that he
  made
• violates the Reversible principle

65
The Apply button - UI tips

• Give the user opportunity to check whether he is
  pleased with changes
• Give the user the ability to go back to previous
  settings
• For editing forms - provide save current sheet
  and restore sheet options

66
Windows 95 Help files

• Presented as a hierarchical list control
• Looks like a list
• Clicking on an item on the list opens another
  list

67
Windows 95 Help filesUI problem

• The user can easily get lost in these directories
• violates the Simplicity principle.
• Possible reasons for the windows 95 design
• a graphical view of the topics with a good
  navigation design might serve the user properly

68
Help files -UI tips

• Separate the help file to different subjects

69
Help files -UI tips

• Show related subjects to the one you are looking
  at now

70
Windows 95 UI problems summary

• Open Dialog box
• Let the user choose what to show first or use AI
  techniques
• Navigating the folders
• Provide one easy way to show the user the exact
  location in his navigation process
• Long filenames
• If you found a good solution try to use it with
  similar problems

71
Windows 95 UI problems summary

• Files Extensions
• DO NOT assume that the user made a mistake
• The start menu
• Set standards of correct use of your application
• Tray Bar
• Enforce uniform behavior

72
Windows 95 UI problems summary

• The Apply button
• Give the user the ability to go back to previous
  settings
• Help files
• Think of a creative order of your files that will
  be more user-friendly

73
Conclusions

• Microsoft design team invested a lot of money and
  resources in the development of good UI.
• When working in a new design environment
  choosing a design model in an important part.
• Even with good design and testing there are
  many UI principles which were violated.

74
Criticism

• Negative criticism
• Kent Sullivan Too many details about non
  relevant issues.
• The Interface Hall of shame site is totally
  anti-Microsoft
• Positive criticism
• Interface Hall of shame points out UI problems in
  a clear way.
• The idea behind the Iterative design method is
  detailed and clear .

75
References

• Kent Sullivan - The Windows 95 User Interface A
  Case Study in Usability Engineering.
• Interface hall of shame windows 95.
• Interface hall of shame Common File Dialogs.
• Interface hall of shame Design Links.