Slashdot Mirror


GUI Design Book Recommendations?

jetpack writes "I've always hated writing user interfaces, and graphical user interfaces in particular. However, I suspect that is largely because I have no clue how to write a good one. I don't mean the technical aspects, like using the APIs and so on. I mean what are the issues in designing an interface that is clean, easy to understand, and easy to use? What are things to be considered? What are things to be avoided? What are good over-all philosophies of UI design? To this end, I'd like to pick up a book or two (or three) and get my learn on. I'd appreciate some book suggestions from the UI experts in the Slashdot crowd."

5 of 338 comments (clear)

  1. "I have no clue how to write a good one." by El_Muerte_TDS · · Score: 4, Interesting

    Doesn't matter, neither does anyone else.
    There is one important rule in creating a GUI: follow the same design principles as the target OS and applications with similar functionality as yours.

  2. Re:If you're developing for Windows... by MBGMorden · · Score: 3, Interesting

    There are a lot of things driving people from Vista, but it's interface generally isn't one of them (I did say generally, just to counter those 3 people who respond immediately with "But I did!"). Microsoft has invested a lot into user interfaces, and most people find their programs VERY nice to use. Microsoft's problems come from DRM, poor security, traditionally poor stability, and anti-competitive practices. Those are all good reasons to look at something different. I wouldn't knock their interface though.

    --
    "People who think they know everything are very annoying to those of us who do."-Mark Twain
  3. Re:If you're developing for Windows... by sm62704 · · Score: 3, Interesting
    I mostly disagree. You should use the conventions that the user expects, of course, but don't look to Microsoft for good design. Silk purses and sow's ears and all that, you know.

    Study Microsoft design for good design in the same vein as going to webpagesthatsuck.com/ for learning good design. For example, if you have the "options" uder "file" in version 1.1 of your program, don't move it to "edit" in 2.1 and "tools" in 3.1 as Microsoft is wont to do.

    -mcgrew

    From the linked site (and I haven't put all the checklists in, because slashdot's horrid design gives an error message about too few characters per line):

    The answer sheet: If you check the box for any of the questions, your web site sucks. Period.

    There is a really big problem, though. It takes a great deal of knowledge to fill out the checklist. You have to know how your site is constructed and you have to have a good understanding of web design. If you don't know what a MARQUEE tag does or that your site's content came from a Microsoft Word document and was converted to HTML, how can you fill out the checklist?

    Note #1:
    Apparently, nobody likes to read much, which is why I haven't put a lot of explanations or outside links in the checklists. I've been looking at sucky design for the last 11 years and I've only been wrong once. That's a topic for another day.

    Note #2:
    Yes, WebPagesThatSuck.com fails to pass the checklist. The site's design has always sucked.

    Checklist 1: First Impression / Big Picture

    • We've designed our site to meet our organization's needs (more sales/contributions) rather than meeting the needs of our visitors.
    • Our site tries to tell you how wonderful we are as a company, but not how we're going to solve your problems.
    • It takes longer than four seconds for the man from Mars to understand what our site is about.
    • The man from Mars cannot quickly find the focal point of the home page.
    • The man from Mars cannot quickly find the focal point of the current page.
    • Our site doesn't make us look like credible professionals. Our site doesn't make visitors feel they can trust us.
    • Our home page -- or any page -- takes more than four seconds to load.
    • Quickly scanning the page doesn't tell our visitors much about its purpose.
    • We don 't put design elements where our visitors expect them.
    • We have not eliminated unnecessary design items.
    • We don't know which design items are not necessary.
    • Our site breaks when visited with the Javascript turned off.
    • Our site breaks because of back-end coding errors.
    • We say "Welcome to..." on our home page.
    • Our site is Flash-based (and this is what our site looks like to people without Flash.)
    • Our site's navigation is Flash-based.
    • Our site uses a splash page (unless it's a liquor, porn, gambling, adult, tobacco, or a multi-lingual / multinational site).
    • Our site makes visitors register before they can enter.
    • Our site uses two or more splash pages.
    • Our site's TITLE tag is something like "New Document", "Index" and not the name of your company or other search-engine friendly terms.
    • Our site has a sound file automatically play in the background when a web page loads, but we're not a record label or musician
    • I don't know if our site looks the same in the major browsers.
    • Our site doesn't look the same in different browsers.
    • The important content does not fit in the first screen.
    • Our pages have too much/too little white space.
    • Our site uses pop-up windows.
    • Our site forces visitors to install weird plugins.
    • Our site has "Download latest browser" text or buttons.
    • Our site prominently displays what hardware and software was used to create the site.
    • Our site's design was "borrowed" from another site.
    • Our
    --
    mcgrew's razor: Never attribute to stupidity that which can be explained by greedy self-interest
  4. Hall of Shame by Ed+Avis · · Score: 4, Interesting

    Don't forget to have a good look at the Interface Hall of Shame for examples of what not to do.

    --
    -- Ed Avis ed@membled.com
  5. Good User inteface Design Tips... by linebackn · · Score: 3, Interesting

    If you want to whiz off your users...

    From http://toastytech.com/guis/uirant.html

    General application user interface guidelines:

    * Always use cute icons, buttons, and graphics. Everyone loves big red hearts, pink bunnies, and yellow smiley faces.

    * Don't be afraid to experiment with colors!

    * Your application should play fun sounds while operating to keep the users entertained.

    * Never, ever, under any circumstance use the OS-native graphical controls or widgets. Users get bored of the same old buttons, text boxes, and stuff.

    * When possible, disable window management and use unusual, oddly placed graphics for the windowing functions such as the window close option.

    * When writing your own controls or widgets, make absolutely sure they look and feel nothing like the OS-native widgets or anything else the user might expect. Otherwise you might accidentally make the user think that your application is actually designed for their OS.

    * Use your own creative ideas on how a "save as" dialog should look and work. Built in ones are always too limiting.

    * It is important that the user should never be able to tell the difference between a checked and unchecked check box or option box.

    * Always use obscure or poorly drawn graphics for your tool bar buttons, and never put text on them.

    * Avoid including a preferences or options dialog. Instead, let the user use the standard OS provided text editor or an editor of their choosing to edit text configuration files. .

    * Users need time to think about what they are doing and get coffee. Your application should always take at least 5 minutes to load even on the fastest available computer.

    * Make sure an accidental double-click on a single-click item does something really nasty or unexpected.

    * Tool tips are the perfect way to display critical information.

    * To get the most screen space, force your application to always run maximized.

    * Always make the default positions of floating properties windows cover something important.

    * Use the most exotic fonts you can find.

    * Your application's user interface should be flexible and customizable to the point where if the user accidentally sneezes on the mouse or keyboard they will have to spend the next half an hour setting things back.

    * Let a 5-year old draw your graphics, including your corporate logo.

    * File browsing dialogs are not needed, users can easily remember and type in long file paths.

    * Design your application so it requires the user to set their tiny monitor to 10512*7430.

    * Always crash at a critical step and then display a fake apology to the user.

    * It is a mistake to make use of application hooks in the native desktop environment such as new file templates, file associations, or program menu icons.

    * The exception to the above is placing icons in the system tray. Place as many icons as you can in the system tray and make sure that the user can not remove them.

    * If your program implements keyboard shortcuts be original and make them completely different from any other applications.

    * Rent extra UI space in your application out for advertising. Advertising benefits the users and y