Thursday, December 18th, 2008

Rich UI Apps Should Not Be Considered Harmful

Category: Ajax

<p>Herb Sutter is a great leader in our industry, and he has taken on Jeff Atwood’s post on Web 2.0 app design.

It comes to the age old issue of how “desktop-y” do you make your Web application? Herb believes that having them look like desktop apps is natural. I think that I disagree. I like Gmail because it is a great blend of web-y and desktop-y. In fact, it is more like pine on the Web than Outlook on the Web :)

The best applications seem to nail that blend of both worlds. What do you think?

This is Herb’s conclusion:

Most SaaS/Web 2.0 applications today look and feel pretty much the way GUI applications looked and felt like on DOS, before technologies like Windows and OS/2 PM existed. Around the late 1980s, people wrote lots of GUI applications that ran on DOS, but we didn’t have a widely-used common GUI infrastructure that handled basic windows and menus and events, much less standards like CUA that tried to say how to use such a common infrastructure if we had it. So they each did their own thing, borrowing where possible from what seemed to work well for GUIs on other platforms.

Twenty years ago, everyone writing GUIs on DOS designed the UIs as best they could, borrowing where possible from what they saw worked on platforms like the Macintosh and Xerox Alto and Star — but the results were all over the map, and would stay that way until a standard environment, followed by standard guidelines, came into being.

Today, everyone writing rich Web 2.0 applications is doing their own thing, borrowing as best they can from Macs and Windows and others — but the results are all over the map, and will continue to be until there actually is such a thing as a UI standard for rich-GUI web applications. You can see that in the differences between Zimbra and Outlook Web Access. In the meantime, it’s not just okay to borrow from what we’ve learned on the desktop; it’s necessary.

And the question isn’t whether metaphors users already understand on the desktop will migrate to the web, but which ones and how soon, because it’s the whole point of SaaS. The industry will soon be going well beyond Google Apps; with offerings like Office Online already announced for the short term, which puts still more rich-client GUI apps like word processors and spreadsheets in the browser (with functionality somewhere between Google Apps and the desktop version of Office).

Zimbra and Outlook Web Access aren’t examples of poor web app design, but exactly the opposite: They’re just the beginning of the next wave of rich web apps.

Related Content:

  • EGL Rich UI on IBM i: Do you Dojo?
    Taking advantage of the Rich UI features of EGL architecture on the AS/400 can save you time and complexity. Rich internet applications can be...
  • 10 rock-solid UI tips
    Give your Web applications that rich-client look and feel using ASP.NET. Lots of code samples in this...
  • Building Custom JSF UI Components
    One of the key strengths of JavaServer Faces (JSF) is that not only does it provide substantial technology for easy, out of the box component based...
  • Rich Internet Applications
    This spring I completed a Friendster-like site for Ziff-Davis to host 5 gaming magazines and 10 million members. Their old site was based on ASP and...
  • ZK Rich Client Framework and Agile Development
    Learn why rich client frameworks in general, and ZK in particular, not only allow for more pleasing, powerful UIs, but aid in applying an...

Posted by Dion Almaer at 6:05 am
12 Comments

++++-
4.1 rating from 30 votes

12 Comments »

Comments feed TrackBack URI

But this is all assuming that windows/mac applications have nailed it in terms of interface and usability. This is simply false. Webapps are in a position to become so so much better than desktop apps ever were or ever could be. Not every web app of course, but I don’t think we’ve yet fully seen what the web is capable of, but we’ve already seen GMail, and even Hotmail and Yahoo completely whip desktop clients in terms of uptake and usability.

Instead of just irrationally writing that off, I think it’s our responsibility to sit down and think really hard about precisely why that is. Why is using something like gmail better than using outlook? And I mean, in detail, and not general feelings.

Comment by Breton — December 18, 2008

Atwoods’ post is dead on. Blindly imitating desktop designs is never a good idea. If for no other reason than that there isn’t a canonical definition of what a “desktop design” looks like. Are we talking Windows, Mac, or Linux here? (which flavor of Linux?) And what about mobile platforms? Where do those fall into the mix.

When all is said and done, developers _have_ to customize their UI to meet the very different requirements of the platform they’re developing on.

We’ve seen web apps moving looking more like desktop apps for a decade now, while desktop app development has stagnated. But we can expect to see that change as platforms for building cross-browser, web-enabled, apps emerge. Platforms like XUL, AIR, and Silverlight, and also Fluid (for MacOSX) and similar Site Specific Browser utilities. Desktop apps will begin moving closer to web apps. Songbird is a good example.

Comment by broofa — December 18, 2008

I think there’s plenty to be learnt from desktop applications. There has been years of experimentation and research on desktop user interface and everyone is used to a lot of the conventions used. I don’t agree that trying to blindly copy desktop applications is the best way to go because desktop applications and web applications are so different.

Part of the reason desktop applications have evolved in the way that they have is because of the technology they’re built on. It’s influenced the way the interface conventions have evolved in a hundred tiny different ways that are really hard to see because we’re so used to the way things are. For example most desktop applications don’t scroll in the way webpages do. They might have scrolling areas but it’s unlikely that the whole screen will scroll. Even most long forms like preferences panels will split things up across multiple screens rather than scroll. Maybe you can argue that’s just good usability but I bet the convention came about because it’s hard to make the entire screen scroll in a desktop application. Most frameworks I’ve played with (mostly .NET winforms) just aren’t set up to do that. However in a browser it feels perfectly natural that a form too long to display on one screen will scroll. I would feel annoyed to be interrupted in my form filling to have to load a new screen each time the form got too long to be displayed. If I saw that I would think the site had done that just to get more page impressions and to show me more ads.

This is a good example of things that are trivially easy to do in a web application and tricky in a desktop app but there are plenty examples of things that are the other way around. A good example is loading lines into a grid as a user scrolls. It’s a real pain to do this in a browser and to get all the details of this (like remembering the user’s scroll location if they reload the page) exactly right. In a lot of situations I’d prefer good sorting and filtering options, a large enough page size and then some links to just scroll through the pages so I can send my friend a link to the page with the relevant information on it.

The actual physical difference between manipulating a document and drawing pixels on a screen is only one of the differences between web applications and desktop applications. There’s also heaps of others like the fundemental statelessness of HTTP, the forward, back and refresh actions, that your applications has URLs that can be bookmarked and the fact that an internet app is connected to the network by default. Some of these things can be painful when building apps but some are wonderful strengths of the platform. Most have a little of both.

I don’t think web applications are going to go away any time in the near future. I think what we need to do is borrow what we can from the desktop while figuring out a way to play to the web application’s strengths. To ignore that desktop applications and web applications have different strengths would be as silly as ignoring everything we’ve learnt from the desktop.

Comment by helephant — December 18, 2008

I agree with many of the statements above. Desktop applications got to a certain point then they simply stopped evolving. They were frozen in time due to legacy issues. The web has given us an opportunity to keep moving forward.
.
Flexible layouts don’t really exist on desktop applications and when desktop developers move to building web apps (especially with .NET) they’re often stuck in the boundaries of the box the grew up in.
.
Yes, there are certain benefits of UIs being predictable. We all expect a radio button to behave like a radio button. There is also little point in reinventing the wheel to the point were the learning curve is too steep.
.
There is still plenty of room to innovate (think Google Maps, lightbox) and there are likely still better ways to do things than we’ve done them in the past. But, yes, ignore the past at your own peril.

Comment by Diodeus — December 18, 2008

I think the web’s simplicity brought us a lot of new computer users. Desktop apps suck. They have UI that people don’t know how to use. Most functionality is effectively hidden from people because of the UI conventions that desktop designers and programmers assume people understand.
.
We’ll pick up some stuff from the desktop, but hopefully not too much.

Comment by Nosredna — December 18, 2008

An example I’ve come across was wrt Echo2 (which is used by the company where I work to build RIAs).

I got passed a change request to make the web app look less like a desktop app because several users found it confusing. What was the problem was that although Echo2 apps look (a bit) like native Windows (3.1) apps they don’t behave/perform like a desktop app – but users still expected them too because of the way they looked.

I think there is nothing wrong with making your app look like a ‘native’ app but it’s got to behave like a native app… to the end user, whats the difference between clicking a desktop shortcut that launches a web app running in a browser and a desktop shortcut that launches Swing App running in a JRE? As long as the UI doesn’t get in the way whats the problem?

Comment by wukfit — December 18, 2008

I think there is very clearly a wealth of document oriented or hybrid document applications out there that have no suitable analog in the desktop world. It is the real sweet spot for “stuff that goes in the browser”.
.
I have to say that I honestly get really bothered whenever people talk about the consistency of desktop applications. There are some basics that are extremely important, like application menus, window chrome/behavior, sitting in the dock etc. All the things that the browser is already doing and the web app can’t do. Beyond that, what we’re really talking about is a set of widgets provided by the interface library. Are there standard widgets on linux/mac/window? Yes. But right now I have a dozen mac applications open and it’s not blindingly obvious exactly how they are the same other than the things I already mentioned. Sure, the iLife suite is pretty consistent, but what about compared to Word, Photoshop, Adium, TextWrangler, Preview, Omnigraffle…
.
But heck, even in the iLife suite, we have iTunes with a different scrollbar style than iPhoto, and multiple types of split-pane controls etc.
.
When I hear people talk about “standardized” desktop applications, for the most part what I think they’re talking about is the crap that gets slapped together in visual basic and tossed out there. They’re talking about business applications. Somehow the A-level consumer apps don’t have to follow THOSE conventions… Even good ‘ol microsoft bucks the trend with completely redesigned ui for IE and Word. Don’t pretend like it’s just the web.
.
The most important thing is just to not make things difficult for the user. That means you can have a fancy button as long as it’s obviously a button. What would be a lot more confusing is making things that look like buttons, but don’t behave like buttons – which is much more to Atwood’s point. Don’t rip off desktop ui that you can’t make good on. It’s stupid to say that browser apps can’t be rich. Really? Let’s just ditch this whole ajax thing, it’s too confusing? How about instead of saying that, you just follow a little conventional wisdom and make an intuitive UI. Desktop apps seem to be able to be extremely varied and still make sense. Why can’t it be the same on the web.

Comment by genericallyloud — December 18, 2008

“(with functionality somewhere between Google Apps and the desktop version of Office)”

Sounds like Sharepoint to me.

Comment by wwwmarty — December 18, 2008

To be honest, I’ve never liked how desktop interfaces work. They’re inflexibly, clumsy and ugly (even with shiny buttons). The status quo has become “the optimum”, not by virtue of its quality, but by virtue of its ubiquity and familiarity. Just because people know how it works doesn’t make it the best interface possible. So I don’t mind that web interfaces haven’t “standardized”, because I think we desperately need some UI innovation, and the web sphere seems to be the place where this can happen.

Comment by Joeri — December 18, 2008

Why is there no link to Herb’s article?

A whole extra step to Google it! Agh!

Comment by zachleat — December 18, 2008

The only reasonable measure is user uptake. While I like theoretical discussions as much as the next guy, it is indisputable that any application that does something useful for a great number of people can have pretty well any damn interface it likes. So as long as you follow *some* understandable idiom-set (mac, windows, gmail, iphone, x, y, z) you’ll be fine. Perhaps this obsession with js frameworks has created a generation of developers who think that their ability to add event handers to make a notification fade out in a one-line chain somehow contributes to the value of a piece of software? Just sayin.

Comment by nataxia — December 19, 2008

Like it, or not, Ajax is all over the place making the same mistakes that desktop GUI developers made. Why reinvent the wheel? I came from the world of desktop UI design and there is valuable information that can be learned from that experience. I now design and develop using Ajax frameworks and so far the evolution of those frameworks is VERY disjointed. Please young Ajax developers! Don’t be so arrogant as to dismiss the desktop UI experience. That sounds a lot like the “not invented here” syndrome of the past ( http://en.wikipedia.org/wiki/Not_Invented_Here ). Remember the old adage, “Those who refuse to learn from history are doomed to repeat it”

Comment by quesadam — December 21, 2008

Leave a comment

You must be logged in to post a comment.