Overlay Off
I asked a question on twitter earlier today.
I received some interesting replies which I thought I might collate and share.
I found it interesting to see how much people disliked the overlay effect which is becoming increasingly popular due to sites like facebook popularising lightboxes. This is essentially websites, and RIAs in particular going back to the bad ol’ days of desktop application design. In such archaeic times dialog boxes which prevented the user from doing any other action until the dialog has been dismissed were common. Alas they’re still relatively common for some types of applications in some operating systems (not naming names of course).
I had believed that in certain process or stepped tasks the overlay or the lightbox was a useful tool which focuses the attention and restricts the user to more limited courses of action which is useful for keeping a process in line. But I would think again having seen some of these reactions. Has anybody experience of doing user testing with these sorts of interfaces.
I only think of them in terms of ads. For interface components, I sometimes do like overlays - for login windows or lightbox.
For me, the big problem with lightboxes and other heavily modal overlays on the web is interface lag. There’s a good deal of that on websites, even on broadband - it can routinely be in the 0.5-2 second range as image and other content loads. Not much, but enough to switch on the irritation factor when you’re left waiting for things to appear. If folks were less fond of lightboxes, you could for instance continue reading the article/profile or other page content while the image loads or transitions. Not so much a problem with desktop apps, where you can expect (on the design side) content loading lag to be minimal and predictable if it exists at all. Overlays (assuming we understand that to mean full screen modal dialogs a la lightboxes) immediately take your focus of attention, but they don’t always provide immediate content for that focus. Thus the annoyance.
Modern web browsing offers the user great multitasking capability, between more sophisticated page layouts that combine multi-columns, inset boxes, inline images or video, and better hardware like bigger monitors or better flowed mobile browsers that allow all that stuff to be displayed effectively. A designer shouldn’t use a modal interface to throttle all that UI “bandwidth” their page has access to, unless there’s very good reason for it.
Interesting comments…
Where I think a lightbox is a useful is where it prevents loading a new page so any delays would be incurred anyway. In general those transitions are much nicer with the lightbox than with a new page load.
I dislike both pop-ups and overlays.
I do think overlays are visually pleasant — the aesthetic is better than the clunkiness of a new window (or tab, if that’s how you roll). It is irritating to get rid of, making it really really annoying if it’s an ad.
Ravelry uses overlays in an unobtrusive way, when you’re doing something that leaves no ambiguity about what your priorities are. In those cases, it works nicely because 1. because of the nature of the task your immediate thought is not “oh god oh god get it off!” and 2. it’s pretty.
It’s also nice for those of us with limited screen real estate (a silent majority — all the people who talk about these things have awesome setups with huge multiple monitors, while most of the users are struggling along with normal settings). I think the key, like with any design element, is to make sure the content in the overlay is sensible and desired.
Interesting series of answers but I wonder if the respondents thought you were talking about advertising rather than pure interface? The more effective overlays are for providing attention focus in input, the more annoying they’ll be as advertising (ahem) media.
Also with two mentions of ‘modality’, something tells me that some of your audience may have more than a hobbyist’s interest in interface design.
Anyhow, one thing I find interesting is how quickly Facebook is throwing new - a complex - interfaces at its users in the name of ease of use.
They have, I think, a real knack for ergonomics and seem to be able to keep even the most abstruse of interfaces fairly intuitive.
They’re very free with doing a lot of manipulation of the DOM live, and have already moved most users outside of the area where they really have any sort of model about what’s going on.
Is it an overlay if the rest of the page isn’t frozen (a la lightbox)? What about the use of the superlarge input field with multiple subcontrols, or the new floaty multiple in-tab fields. There is certainly a rich design vocabulary being creating and distributed.
Mobile browsers are still kind of crude if you compare it to the desktop browsers we use on PC..`’