Slashdot Mirror
Web Application UI Guidelines?
Tom Davies asks: "Every GUI platform has a document which describes the conventions developers should use when building GUIs with that toolset. There are also lots of good resources for Web site usability (e.g. Jakob Nielsen's useit.com). But what about web -applications-? I am developing an intranet application which is aimed at people who use it every day, not those who stumble on a web site and need to be able to use it immediately. It can have a higher learning curve, but must deliver more 'client/server like' usability. Are there any sites/books which address how to make HTML GUIs for applications?"
Check here, though admittedly you have to wonder about the GUI skills of someone who makes you click "Next" 10 times to read their thoughts. It's a decent paper, though, and cites numerous references.
And here is a decent but damned expensive book on the topic. Fortunately, a couple of the P2P application developers are good at GUI design and have made it quite easy to locate this book in PDF eBook format...
Technologies for creating rich GUIs in unmodified web browsers are just starting to catch on. If you want to build a desktop-like UI for a web application, you might want to start with one of the emerging client-server web presentation layers like (blatant self promotion) Isomorphic SmartClient.
Traditional web applications are pretty clunky, but you should look into Mozilla as a potential application toolkit.
The Mozilla browser is arguably the most complex program created so far using Mozilla and it compares favorably to a native application when it comes to functionality.
Some people will argue that Mozilla doesn't perform well, but apps created with Mozilla are portable and could be used on Windows, Macintosh, or Unix systems (and several operating systems that you would never expect). The cool part is that your code would not have to change.. it's the same for every platform.
Your web development skills will come in handy, because XML, CSS, and JavaScript are what you use to create applications in Mozilla. There is no compiler required.. just text editors!
Check out the tutorial on the XULPlanet website.
http://www.xulplanet.com/
A new O'Reilly book that gives an overview of creating apps with Mozilla was created with the Open Publication License and is online as well as available from O'Reilly.
http://books.mozdev.org/
Other sites to visit...
http://www.oreillynet.com/mozilla/
http://www.mozdev.org/
Ouch! The truth hurts!
Ironically (in the Alanis Morissette sense of the term), Slashdot just posted a pretty positive review of Creating Applications with Mozilla. Perhaps that may be what you're looking for?
My suggestion, if you're hell bent on a web application, it to consider perhaps a Java Applet. At least with an applet you can use Swing and AWT widgets for designing your app, and Applets provide some modicum of security. You would also be able to maintain a stateful connection, meaning people could still run this with just a browser, but also have most of the benifits of a C/S paradigm.
As for design, my thought is that standard GUI design rules (for the most part) apply. Consistant look and feel across screens (so the "add record" button isn't in a different place on every screen), clean asthetics (color, fonts, separation), meaningful labels (book title capitalization), no Peoplesoft-esque nested scroll bars, logical grouping of similar items, etc. Without knowing what your designing it's hard to say for sure, but if you've ever designed a GUI that didn't make users have seizures or get motion sick, most of those same rules apply.
"All I ever wanted was to see Larry Wall give Bill Gates a Perl necklace."
http://www.eisenschmidt.org/jweisen
There is not a single authoritative book that covers all browsers primarily because each browser has gone its own way in terms of standards (IE has JScript, ActiveX, etc.; Mozilla's options have been listed ad nauseum; Opera, Netscape, etc) I've generally followed the spirit outlined in Macintosh Human Interface Guidelines, Windows Interface Guidelines (both of the previous are very old), Designing for Web Usability, and my own common sense based on what I've seen that works.
I will state to all of those who say "well, do a true client/server" that saying that is short-sighted. Part of the design process has to look at it from the company point of view, in addition to "what is really sexy or easier for me to develop."
As an example, a typical company also has to think about support costs, as you now have to deal with "how are the client machines configured; what are they running"; "how do I deal with updates/changes"; "who is going to deal with installing the client everywhere?", etc. (and, yes, those same issues come up with "browsers", but browser compatibility and configuration issues are often more cut and dried) Basically, the tradeoff facing many companies is "cost of developing an application that takes a developer a tedious length of time to get the menus right and test with various browsers and systems" versus "cost of developing an application that will need support on the client side and that someone will need to test on various systems".
Additional factor for many companies is that people have become accustomed to the Web; so a well designed Web application should have a lower learning curve and a cheaper support curve - in general (and I'm generalizing wildly) Can I think of specific cases where I've done a client/server intranet app rather than a Web intranet app? Yup. Each case is different and must be judged on its own merits.