Up until now, this series focused on rather well-known terms, but today, we will be taking on a term that many of you will not have heard of (in the context of user interface design, in any case): modes. I will start off by explaining what is meant by modes, I will give some examples, after which I will explain why some believe they are inherently evil (cue “mode errors”). I will end by explaining what can be done about solving the problems caused by modality in graphical user interfaces.
The definition of the word “mode” in a regular dictionary reveals little about its relation to graphical user interfaces. In order to get a better definition, we need to go to the man who spearheaded the campaign against the modal interface: Jef Raskin, co-creator of the Macintosh. In his well-known book, “The Humane Interface“, he defines the modal interface in the following way: “A human-machine interface is modal with respect to a given gesture when (1) the current state of the interface is not the user’s locus of attention and (2) the interface will execute one among several different responses to the gesture, depending on the system’s current state.” In other words, the same user input can produce different types of output, depending on the state (“mode”) the computer is in.
There are a lot of examples of this behaviour in today’s user interfaces, the most prominent of that being the infamous caps. lock key. When the caps. lock key is active, any text that gets put into the computer will be displayed with capital letters; when the key is deactivated, the computer displays the text as lower case letters – two different “modes” or “states” that the computer can be in. Another example is, as weird as it may seem, the on/off switch on that same computer: it allows you to switch between two modes: on, and (surprise) off (you did not see that one coming, did you).
However, modality is much deeper entrenched in the world of computers than these fairly tactile examples seem to illustrate: consider a drawing or photo editing program. If you want to see one type of application that is filled with countless modes, load up your favourite image editor, and click on the various options in the tool window. When you have the paintbrush tool activated, you are in a different mode than when you have the pencil tool activated. Good luck counting all the different modes in your drawing application.
Another particularly cruel and inherently evil (I got a little opinionated there, did you see?) modal element on a computer is the modal dialog. The modal dialog is a dialog (or window) that blocks all access to its parent application until the dialog itself has been dealt with. My most infuriating example of a modal dialog is Firefox’ settings window. When you open the settings panel in Firefox, and you have just one window open, all access to that window is blocked, meaning you are forced to deal with the settings panel before you can continue browsing. This gets particularly aggravating the moment you want to copy/paste something from that particular browsing window into the settings panel (like a link or a proxy .pac script URL); you must close all the settings panels, copy the URL and reopen the settings panel.
It can get even more cruel than that: modal dialogs that steal focus without the user’s consent. I am not even going to explain the horror. Use your imagination.
Apple’s Human Interface Guidelines also have some things to say on modes. “As much as possible, allow users to do whatever they want at all times. Avoid using modes that lock them into one operation and prevent them from working on anything else until that operation is completed. Mac OS X supports enhanced modelessness with drawers and sheets. Drawers provide additional functionality while allowing continued access to the parent window. Sheets are modal dialogs attached to a parent window, replacing the use of application-modal dialogs.” The sheets part is a bit misleading, as those sheets are still very much modal in that they block all access to their parent windows.
Even though Apple advises against using modes, one of their most defining user interface elements is the poster child for modal behaviour: the global menubar atop the screen. If there is one prime example of a completely and utterly modal interface element, with basically an unlimited amount of modes (all depending on the amount of applications there are for OS X) it is OS X’ global menubar. This is particularly interesting seeing Jef Raskin is the person who actually started the Macintosh project in the first place.
I’ve met my share of keyboards that are missing either the capslock key, or insert key.
These are generally people who do heavy data-entry or software development – pointing out to me that these keys are primarily useless for people who just need to get work done.
edit: oops, i meant overwrite mode – because pressing the insert key usually puts you into that mode
Edited 2007-11-11 17:28
…just out of curiosity…how does the logic for what you said actually pan out?
Do you really believe that there is a common practice of removing the caps lock and/or insert key because they’re useless amongst data-entry and software development types?
There’s a few old stand-bys that cause confusion/frustration prominent in many things, but those that involve editing text in one form or another are very common, such as text editors that force you to be in an insert mode to be able to enter any text, and particularly those that have modes between “Insert here” and “Overwrite” that can lead to data loss. Old common Unix text editors are (in)famous for that, but those old ways have carried over to a lot of the newer text editors and word processors as well.
Now if only every editor and text area was modal. I’m so tired of having to remove extra i’s and :wq’s all over the place.
I find User Interface design a fascinating subject and I enjoy writing clever user interfaces for my software.
Adobe Photoshop is a good example of UI do’s and don’ts, especially in terms of modality. In every new version over the years I kept hoping they’d have finally addressed the nagging UI problems and removed those intrusive modal dialogs, only to be disappointed time after time.
A common issue with modality in PS is the “your selection is not visible” and “even though you clicked you haven’t made a selection” pop-ups. They totally break your concentration, “Ok” needs to be clicked to continue, and it’s not remotely necessary to use modal dialogs for that information at all. I can think of countless ways to do it differently, some of which would also improve how selections are represented.
Another good example is the Quick Mask mode, which allows you to use brushes to paint a mask which is converted to and from a selection when you enter and leave the mode. The mode itself is useful, but it’s easy to turn it on by accident by hitting the wrong shortcut key. Then you likely won’t notice the mode until you become confounded when a tool doesn’t work or a function is disabled. A tiny icon somewhere changes very subtly when the mode is on, and that’s it. It would be much better if the window border or something changed color to let you know when you were in that mode.
Another good example is the Quick Mask mode, which allows you to use brushes to paint a mask which is converted to and from a selection when you enter and leave the mode. The mode itself is useful, but it’s easy to turn it on by accident by hitting the wrong shortcut key. Then you likely won’t notice the mode until you become confounded when a tool doesn’t work or a function is disabled. A tiny icon somewhere changes very subtly when the mode is on, and that’s it. It would be much better if the window border or something changed color to let you know when you were in that mode.
What?!?!?! The Quick Mask mode “adds a bright red layer” on top of your picture on Photoshop. Unless you’re working on a Ferrari’s or a strawberry’s photo, I can’t see how you can miss something like that!
It only shows a bright red layer where there’s a selection (and it has to be large enough so the red tint is actually visible). This has seldom been the case when I’ve accidentally bumped the Q key.
Interesting series of articles – as someone with a background in media design, it’s nice to see some discussion of usability that’s a little more academic than the usual “I may not know usability – but I know what I like/hate!”
An excellent book on the subject is The Psychology of Everyday Things by Donald Norman. The edition I read was fairly old (early 80s) and barely mentions computer interfaces – but that’s also helpful in dispelling the common notion that usability applies only to computers (E.g., the first chapter is largely about the usability of doors – in terms how easy/difficult it is to figure out if a door needs to be pushed or pulled open).
I think this might be yet another issue that confuses new computer users but is actually helpful for pros.
Ok, modal dialogs _are_ evil in that they limit what you can do without any reason.
But I think we shouldn’t focus too much on the disgusting caps lock key. It’s not annoying because you have no idea what’s going on, it’s annoying because 99.9% of the time you hit it by accident. This particular issue stems from the stupid keyboard layout rather than from the modal nature of the key itself. People wouldn’t hate it so very much if it had a size and position like one of the function keys.
Instead it sits right there on your beautiful home row, along with keys you use at least a million times more often.
But I think modes per se are a good thing even if they cause mode errors from time to time.
Having no modes at all is like cramming all functions of a programming language into a single namespace.
It means that the individual identifiers/actions need to be more complicated – either just plain longer or you need to use quasimodes like “escape meta alt control shift”, a term used to ridicule emacs.
I haven’t used emacs or vim nearly enough to decide which is saner but I am constantly annoyed by the damn shift key. The problem is that I stop pressing the shift key long before the other finger can reach any of the non home row buttons and it only gets worse with time. I guess my brain is just hopelessly modal and I cannot get used to holding down the shift key for so long. So if anybody knows, please tell me:
Is there any way to alter the function of the shift key so that you don’t have to hold it down while typing the character that you want to be uppercase?
Not like the damn caps lock, mind you, it should only turn the very next character into uppercase, not everything you type after pressing it.
Edited 2007-11-11 18:35 UTC
Is there any way to alter the function of the shift key so that you don’t have to hold it down while typing the character that you want to be uppercase?
Some operating systems have “sticky keys” for accessibility assistance…
In Windows for example, you can turn on sticky keys and other accessibility options by hitting the shift key 5 times in a row to bring up the settings dialog.
Thanks so much!
Although it is sort of embarrassing to find out your laziness is so extreme that you have to click on the wheelchair icon
” Ok, modal dialogs _are_ evil in that they limit what you can do without any reason.”
I know a whole administration application for healthcare (i. e. for psychologists) that has a main window it uses to show a wallpaper, and everything you do opens a modal dialog window that does not appear in the window list, so you can’t minimize the application; furthermore, it repeatedly steals focus and foreground (in “Windows”, both are the same). That’s stupid.
“But I think we shouldn’t focus too much on the disgusting caps lock key.”
I don’t know if it has been mentioned before in the discussion, and I think I didn’t read it in the article, but I think it’s worth mentioning why the caps lock key does only affect letters: It’s because only letters have an upper case, which is called a capital, and caps lock means “capitals lock”. This is a definition some of you may know from typesetting where you call uppercase letters capitals. The correct terms are majuscles (capitals) and minuscles (lower case).
On some keyboards, there’s a key called “shift lock” whick exactly does what it promises: It sets the shift modifier into lock mode, so even number keys and other characters that are no letters are shifted – lowercase letters into uppercase and numbers into special characters.
“It’s not annoying because you have no idea what’s going on, it’s annoying because 99.9% of the time you hit it by accident. This particular issue stems from the stupid keyboard layout rather than from the modal nature of the key itself. People wouldn’t hate it so very much if it had a size and position like one of the function keys.”
You’re completely right. There are keyboard layouts where the caps lock key is located at the bottom line, right next to the space bar (IBM XT keyboard), and the control key is located between the left shift and the tabulator key. It’s far more complicated to hit caps lock on such a keyboard by accident.
“Instead it sits right there on your beautiful home row, along with keys you use at least a million times more often.”
I often use it after #define. 🙂
Of course you’re free to remap the keyboard as you like (using tools like xmodmap for example). And if you’ve got an IBM keyboard (1351865 et al.) or one built by Sun (type 5, 6, 7), you can remap them in reality, too.
“Having no modes at all is like cramming all functions of a programming language into a single namespace. It means that the individual identifiers/actions need to be more complicated – either just plain longer or you need to use quasimodes like “escape meta alt control shift”, a term used to ridicule emacs.”
And, of course, we now remember the famous symbolics keyboard with the modes shift, control, meta, super and hyper. 🙂
http://www.pfu.fujitsu.com/hhkeyboard/kb_collection/images/symbolic…
http://home.hakuhale.net/rbc/symbolics/symbolics-keyboard.JPG
Edited 2007-11-11 20:24
Yeah, good old xmodmap. I’d be so screwed without it…
That symbolics keyboard is hilarious!
Of course, I don’t remember it – it’s probably older than me.
Hilarious nevertheless!
It’s a shame that today most keyboard manufacturers seem to lack creativity to do something different – other than sticking a few more media keys on the stupid thing.
One thing I’d love is a split space bar so that I could use the right part of it as a space bar and the left as a control key or whatever…
Of course it’d need a jumper to make it usable by left handed people – assuming that most right-handed people prefer to use their right hand to press the space bar like I do.
The function keys are great and all but there’s not a snowball’s chance in hell that I can reach them without leaving my home row…
“It’s a shame that today most keyboard manufacturers seem to lack creativity to do something different – other than sticking a few more media keys on the stupid thing.”
Oh, there are a few, let men mention this one: http://www.artlebedev.com/everything/optimus/
Or this one: http://pfuca-store.stores.yahoo.net/haphackeylit1.html
But what you see in the store is useless in most cases and will break after one year intensive use. I don’t consider it normal use what most home users do – they usually don’t touch the the keyboard unless it’s completely unavoidable. The best keyboards I’ve used are the IBM 3270 style keyboards and their PC compativles, no stupid… erm “Windows” keys at all. 🙂
“One thing I’d love is a split space bar so that I could use the right part of it as a space bar and the left as a control key or whatever…”
There are Dvorak keyboards with a split space bar, but I don’t know if the two physical keys do return different signals…
“Of course it’d need a jumper to make it usable by left handed people – assuming that most right-handed people prefer to use their right hand to press the space bar like I do.”
I think keyboard design did not take left handers into mind until today… Just imagine, Return on the left, and the numeric keypad on the very left. Interesting scenario.
“The function keys are great and all but there’s not a snowball’s chance in hell that I can reach them without leaving my home row…”
That’s true, of course, but not intended as well. You might find the “Happy Hacking Keyboard” interesting because its concept of the Fn key for the function keys (layered on top of the number keys, I think).
A similar approach could be seen in the 70s before the 3270 (or kind of) by IBM, I can’t tell you the model, it’s down in the cellar. On this keyboard, there was an Alt button right next to the space bar which made 1..0 act as PF1..PF10.
Oh, and don’t forget what Cherry (in Auerbach / Oberpfalz, Germany) offers: http://www.accesskb.demon.co.uk/cherry.htm – see the G80-2100, G80-3190 and G80-5000, and maybe the G80-11900.
Actually, I’m typing on a Sun type 6 USB keyboard. No comparison to the IBM – http://www.theochem.ruhr-uni-bochum.de/~axel.kohlmeyer/pics/ibm-key… -, but the programmable function keys on the left and top right indemnify a lot. Similar to this one – http://www.sunshack.org/data/sunpix/type6_kbd+mouse.jpg – but in german layout.
As an addition to one of my former posts:
http://wotsit.thingy.com/haj/images/ibm-keyboard-2.jpg
This is where IBM put the caps lock key on the original XT keyboard.
Edited 2007-11-11 21:53
The new Apple keyboard “senses” accidental hits. You need to press it slightly longer for it to activate itself – which in itself can be annoying when you do in fact need the caps lock key.
But nice effort nonetheless by Apple.
http://rentzsch.com/notes/applesantiCAPSLOCK
The idea by itself makes a lot of sense.
Apple’s mostly about making things easy and usable for the general public.
I wonder what they’ve been smoking, though, because they’re doing it _in_hardware_.
I mean, I know about Apple being a hardware manufacturer but still 250ms is a _long_ time if you type reasonably fast and remapped the key.
And if somebody buys Apple stuff and (also) uses a different OS I’d say there’s a significant chance that he has remapped caps lock to escape or control…
I also wished they were being more transparent about this matter because this is the first time I’ve heard of it and if they decide to silently introduce this hardware feature to macbooks there will be some people screaming bloody murder.
Then again, no matter what Apple does, there’s always some screaming and bitching 😉
I have to say that if Drag and Drop is an example of a good mode-less interface, then I am against it. Drag and drop is the cause of countless errors. When an inexperienced computer user is doing file manipulation, I have seen files disappear into unknown folders, requiring a call to the Help Desk to get them back.
I myself have dropped files into the wrong folders, missed the Trash icon and dropped on the desktop, dropped them into the launcher instead of onto the program icon, etc, etc.
It is far, far easier to select your files, Cut or Copy, move to the correct window and Paste.
Of course, I also avoid Emacs and use Vim.
This is more a limitation of the mouse and the software that powers it than it is of the concept itself. The concept itself is fairly easy to understand, and adds a good amount of physical quality to object in a computer user interface.
And that physical thing is what you’ll be hearing a lot about from me.
“It is far, far easier to select your files, Cut or Copy, move to the correct window and Paste. “
And it’s lots more far easier to have a two column window (instead of two separated ones) for this kind of action: copying and moving are “source target actions”. From my (admittedly very individual) point of view it’s not a good idea to use the edit buffer (^C/^X, ^V) to manipulate things like files. Applications like the Midnight Commander with its clear design (source column, target column, selection not only with the mouse, also depending on pattern matches, action determined by function key) are more appealing to me. But as I said, that’s a standpoint depending on experience and comfortability.
If you like the old midnight commander, you should really try Xplorer2 Lite. Completely free,and nearly all of the old commander shortcuts work! I replaced Explorer with Xplorer2 Lite and Astonshell for Windows shell and managed to lower my desktop resources from 76Mb down to just 5Mb while getting a more functional system out of the deal.
“If you like the old midnight commander, you should really try Xplorer2 Lite.”
Because I like the “old” Midnight Commander, I’m still using it (on my UNIX and Linux boxes). It’s not as old as you might think, it’s still my first choice as primary file manager due to its great interface and ability to be configured in nearly every imaginable way. And it runs in pure text mode (important for SSH or maintenance operations where no GUI is available), too. Of course, I won’t claim the Midnight Commander is the ideal tool for everybody and everything, but it has it advantages, allthough many of them may be seen very individually.
Here’s a cool screenshot of the MC running on a TV screen: http://ricomp.de/vdr/images/conmc_b.jpg 🙂
It’s nice to see that there’s something similar in “Windows” land, too. I just remember something like Total Commander, FAR manager (win32 text mode application) or Servant Salamander (with good command line integration), but that was many years ago when I had to make a “Windows” PC a bit comfortable for its user. I just had a look at Xplorer2 Lite using google’s image seach, looks similar, allthough a bit strange to me… but this is as “Windows” always looks to me. 🙂
Slightly off-topic (in context of user interface usability), but real-world story:
We develope an accounting software. In one sunny day we got very irritating support call from one of our customers:
“I did enter many documents into database and all these are missing, only the last one is present!”
What happened actually?
In new version, we allowed our software users just overwrite document contents without any explicit mode change command. In old version, users were forced to hit NEW button before entering new document (eg invoice) or hit EDIT button to edit old document.
Users, not seeing old version of our software, didn’t have any problems – they did know that like everywhere in Windows, overwriting something destorys old content. But some users of old version, having accustomized to explicit mode changes, assumed somehow that overwriting old content creates new one.
We solved this problem easily – we included one (optional) button/command to force user into edit mode. This way old users had two commans – EDIT or NEW, which changed interface mode to “edit mode” and there was no more problems with document overwriting.
Interestingly, this approach created big annoyances for developers and testers
I had many times entered screenful of data in attempt to repeat customers problem – just to notice, that particular database has this “expilicit mode change option” turned on and all my input went into nowhere 
Well, solution to this problem was easy enough – when our application detected that it was run under IDE (debugger), this option was disabled automatically 
—
What I wanted say with this comment – user interface (or application) mode is really important, especially in multitasking/windowed environment. In old DOS (commandline) times, there was no such problem present – entire user interface was usually straightforward, there were no possibilities to break program flow.
—
What about CAPS LOCK key – there’s only one key worse than it – I mean NUM LOCK key. I’ve recieved many calls about “I can’t enter any numbers into Excel datasheet”, hitting NumLock has resolved all these problems
“What about CAPS LOCK key – there’s only one key worse than it – I mean NUM LOCK key. I’ve recieved many calls about “I can’t enter any numbers into Excel datasheet”, hitting NumLock has resolved all these problems
“
Risking to get more off topic with this, you’ll find a similar some entries here:
http://www.rinkworks.com/stupid/cs_keyboards.shtml
Furthermore, the Num Lock key is a basal means of diagnostics – if switching the Num LED off and on still works, a defect can’t be that bad. 🙂
Num Lock is an artifact from the XT and early AT era when there were no separated cursor keys. Num Lock made you use the numeric keypad for entering numbers and for cursor control. Today, this choice is obsoleted with the MF-2 style keyboards where both functionality groups are present at one time, so this key is hardly used.
Other than the Capslock key difference mentioned above, this is yet another case where (at least with the new Mac keyboard I got with my computer) Apple has made a change: there’s exactly one set of arrow keys, and no numlock key at all. Perhaps someone at Apple had too many bad experiences with such keyboards
The one I miss because I’ve got my muscle memory setup for doing it efficiently is that on this keyboard, there’s no Insert key, which, while it can be used by software for modal input mode switching between insert=overwrite and insert at cursor, using Control-Insert to copy and then Shift-Insert to paste is easier and less likely for me to make mistakes, and I’ve been using that a very long time. Instead, there’s an “fn” key there which is a quasimodal key that goes with a lot of the function keys above to map them back into function keys, as opposed to media functions and other machine control functions. Of course, I promptly mapped things back to regular function keys without using fn, because I far more often use keyboard commands for various things than the mouse option, and it’s no big deal for me to select fn for the various machine control/system-wide things.
Indeed, Shift-Insert is not only more universal than any other paste key sequence (e.g it works on Windows Notepad *and* GNU Emacs) but it is also the only way to paste to an RXVT terminal from the keyboard (Ctrl-Y and Ctrl-V are rightly passed through to the underlaying application).
After qwerty, having to switch modes to perform trivial edits or issue commands is one of the things I find the most annoying when using modal text editors.
I am a very fast typist and having to break to switch from edit to command mode slows me down.
It is almost as bad as having to switch from the keyboard to a mouse to click menus on GUI editors.
One of the reasons why I switched to a non modal text editor…. not mentioning any editors particularly bad in this regard… *cough* vi *cough*.
Another particularly irritating mode error is that of the focus stealing window or dialog. You are typing something somewhere, and suddenly, a window or dialog steals focus, and you continue typing in that new window or dialog; you could be hitting the letters “y” or “n”, affecting the outcome of a dialog window before you even get the chance to read it.
Or even worse, press the space bar. In Win95 (and perhaps 98), after downloading a file (with IE) a dialog box stole the focus, informing the user the download was finished, and the file was being copied from the temp directoty to whatever directory you specified as destination of the download. There was one button on it: Cancel. It had the focus. And it was thus activated by pressing the space bar. In those days, downloading was slow, so imagine I was “slightly” frustrated when I was typing in some other program, the dialog stole the focus after an hour of downloading and I was just typing a space…
User-maintained modes also underlay one of the prime features of today’s graphical use interfaces: drag and drop, whose invention is attributed to Jef Raskin (who else). Copying and pasting in the Xerox PARC world happened in a “click-move-click” fashion, a strictly modal way of doing things. Raskin found this cumbersome, and consequently, came up with a drag-and-move way of copying and pasting – effectively a quasimode, because the user has to maintain the clicked state of the mouse button in order to continue the operation.
I honoustly think that drap&drop is one of the worste UI designs ever. It is so easy as a user to drop it in the wrong place, never to be seen again, and you can’t do anything else than drag (and drop). For a programmer it is hell as well, because you need to enable (i.e. program) all kinds of nifty features to support it. It introduces a pseudo-modality that each and every app must recognize in order to work properly. That’s really evil.
JAL
Really helpful and educating. I’m creating a little program myself(for noting down stuff, basicly Notepad with tabs) and these have helped me to make better GUI.
Looking forward to more in these series.
So am I the only one that actually finds this key useful? 🙂 As a translator, I often need to type something (for example, headings) in caps. Converting to caps post factum takes more time and hand movement than simply turning Caps Lock on and off.