Tab-Modality and You
Thursday, December 17, 2009
Years ago, I remember watching a webcast of the introduction of the Aqua user interface when Mac OS X Public Beta was first demoed. The part I distinctly remember was realizing the brilliance of sheets. Like many great innovations, they were simple in retrospect and solved a problem you didn't realize you had: the modality problem — the fact that dialog boxes blocked interacting with the whole application even though only one window needed the information that you, as the user, had to provide. I watched in wonder as a save dialog blocked only the one window that needed saving, leaving all the other windows free. Finally, a solution to limit the modality.
Because modality sucks.
Back in 2000, sheets worked well because the smallest unit of user interaction with an application was a window. Soon after, though, things started to change. Web browsers in particular were among the first to start using tabs to put more than one document in a window. This caused a snag. A web page can require modal interaction from the user: picking a file, or supplying a username and password. Yet we don't want to prevent the user from switching to a different tab and continuing to interact with other websites. If the finest-grained modality control we have is per-window, how can we achieve that outcome?
Chromium's current answer comes from combining Cocoa's child window support with sheets to get tab-modal sheets:
While this looks like a normal sheet, you can switch between open tabs while the password request is up. You can't, however, interact with the web page.
The implementation, like all of the code used in Chromium, is open source, and can be found in the Google Toolbox for Mac, a collection of reusable components from the Mac developers at Google. The technical details of the GTMWindowSheetController can be found on the Google Mac blog. The other thing to note is that right now tab-modal sheets are only used for website authentication. The other sheets we use (for file selection, etc) are currently window-modal; we hope to convert them over soon.
The fate of tab modal sheets, however, isn't certain. A way to enforce tab-modal interaction is certainly needed. But is attaching sheets to the tabs the right way to achieve that goal? At the last WWDC, I talked to some graphic designers who were opposed to the idea. "Reusing sheets in a context that isn't window modality will only confuse the user!" On the other hand, my position is that the concept of modality is the same, and the context is similar enough that users will find that sheets help them understand the modality in which they must interact.
So the story isn't over. Tab-modal sheets are our contribution to the ongoing discussion, an experiment to see what works and what doesn't. Together we can work out the best way to help users interact with their computers.


17 comments:
Glen said...
I'm glad to see chromium tackling this usability issue. It currently doesn't make sense that modal windows such as "save as file" block interaction with other tabs, but they don't block interaction with other windows of Chrome/Chromium.
Will tab modal sheets be coming to Windows/Linux any time soon?
Is it not possible to make the current modal windows only modal to the tab in question? It'd be nice if I could switch tabs while a modal window is presented to dismiss the modal window until the relevant tab is reselected. Another area where this really can get annoying is with javascript alerts/dialogues. Even today a javascript alert chain can lock up your browser window without an obvious way (outside of going to chromium's task manager).
December 17, 2009 1:06 AM
Udo said...
The username dialog was the right choice to demonstrate the problem, how many times did i questioning myself on the password for a site, wanting back to GMail where the archive gives me answers.
December 17, 2009 1:49 AM
Scott said...
Why can't dialogs be fully asynchronous? It makes a lot of sense that they shouldn't block other tabs, but the same reasons also apply to them not blocking the current page. From the user's point of view, tabs are just an arbitrary boundary.
Async dialogs would obviously require a lot of changes, esp. handling JavaScript dialogs. (I guess alert() and friends could work like the "yield" statement in Gecko/JavaScript 1.7.) Then you'd also have to think about UI problems like making sure you don't show multiple instances of the same dialog.
Ok, maybe that's a lot of work now that I think about it, and it's probably more sensible to take things one step at a time with tab-modal dialogs first. But I really believe the answer to blocking/modality is to abolish it altogether.
December 17, 2009 3:30 AM
Cole said...
This is great. I'm with Glen, when can we get it (or simply tab-modal dialogs) in Windows/Linux?
December 17, 2009 7:48 AM
Avi Drissman said...
Right now, on Windows at least, auth dialogs are already tab-modal. Try it! That's why I had to do this, to match what the code expected.
I think there's a CL out there for going tab-modal with file selectors (can't recall at the moment whose it is), but there was some weird issue that people had with alerts. Last I heard there was finally some consensus so I'm hopeful.
December 17, 2009 8:38 AM
Ephilei said...
Fantastic! Sheets are a great example of OS X's good UI and tab modality has bothered me for some time.
December 17, 2009 11:59 AM
Satish said...
This is great...
I installed some apple theme on ubuntu and I can feel the same in different application windows and find it very helpful while working. It saves lot of time when monitoring more than one window at a time. I am eager to see the same in chrome with tab label. Google's contribution to the web world/ developers is more than the exponential curve..
Bravo.. guys...
December 17, 2009 7:51 PM
rr8004 said...
I really liked your blog! You have some great content. Please come visit my site Nashville Web Link when you got time.
December 17, 2009 9:09 PM
rr8004 said...
I really liked your blog! You have some great content. Please come visit my site Nashville Business Services And Classifieds when you got time.
December 17, 2009 9:10 PM
Glen said...
It's reassuring to see that the development team is already working on tab-modal file selectors, and even better to hear that there are things going on behind the scenes to make alerts tab-modal, too. I look forward to this Chromium of the future where one tab can't lock up a whole set of tabs!
December 18, 2009 12:04 AM
Drew said...
I hope chrome for mac will fix the bookmark manager soon.
December 20, 2009 11:49 AM
Hachre said...
I like the Chrome solution.
However:
I often see "computer beginners" and I notice that the Mac OS specific solution with the slide-in dialogs is still not enough to make new users understand that this dialog has to be answered now and the program cannot continue unless you do.
I suggest darkening the webpage that triggers the dialog, or making it black-white, or both... That way peoples attention is drawn to the only control that is still working: the dialog itself.
Splitting it up per-tab is perfectly logical though and I have noticed how several people got confused when they noticed that those dialogs block the entire program usually, and not just the specific part that requires it (in this case the tab).
On the other hand it's just as confusing to a beginner that some programs behave this way, while others behave another way.
It's a hard decision for sure, but since no matter how you do it, it will always confuse the beginner I say go with the better solutions for people who are past the beginner level: Using the slide-in dialogs per-tab.
December 27, 2009 10:18 AM
richiehennessy said...
i know this isnt the right place to post this comment but it was the quickest way just to express that i am a little disappointed with the new chrome browser i just downloaded for mac. i am sure its fancy and has a lot more than meets my layman eye but i just went to a website and tried magnifying the text using the two finger gesture on the multi touch mac mousepad and it didnt work. i had to open safari to be able to do it.
December 29, 2009 7:23 AM
Isaac said...
Another "this isn't the right place to post this but" post:
The FAQ link on the main Chromium page on Google Code is broken.
I think it's supposed to lead here: http://dev.chromium.org/chromium-os/how-tos-and-troubleshooting/developer-faq
December 30, 2009 7:11 AM
w3bsmith said...
I love the tab sheet idea! I too end up opening another tab for gmail in order to find passwords from an email!
December 30, 2009 6:56 PM
raradolly said...
This is amazing! I'm a Graphic Designer and a Student and I am absolutely psyched about this feature. Too often does a dialog box pop up and cover the information I have in a word pad that I need to put in the box, or something like that anyway. I really wish they were fully mobile though, and could be dragged around, resized, or at least minimized to be returned to.
January 10, 2010 9:40 PM
LogicProgrammer said...
Why not incorporate dialogs such as password dialogs etc. as part of the page itself (in a way similar to what Facebook does with chats and the like)?
This could even be done by some extension to HTML5 that pages could use.
January 17, 2010 10:21 PM
Post a Comment