×

Welcome to the Slashdot Beta site -- learn more here. Use the link in the footer or click here to return to the Classic version of Slashdot.

Thank you!

Before you choose to head back to the Classic look of the site, we'd appreciate it if you share your thoughts on the Beta; your feedback is what drives our ongoing development.

Beta is different and we value you taking the time to try it out. Please take a look at the changes we've made in Beta and  learn more about it. Thanks for reading, and for making the site better!

GUI Design Book Recommendations?

kdawson posted more than 6 years ago | from the wrapping-the-mind-around-it dept.

Books 338

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."

cancel ×
This is a preview of your comment

No Comment Title Entered

Anonymous Coward 1 minute ago

No Comment Entered

338 comments

What I like to do. (-1, Offtopic)

Anonymous Coward | more than 6 years ago | (#21893478)

Ask a Windows administrator to do some serious admin work using only a command line and watch them squirm.

Flamebait, but true.

Re:What I like to do. (1)

somersault (912633) | more than 6 years ago | (#21893798)

While I like Linux and can use a command line fine, I don't really see how the graphical control panel is a negative point in Windows (or Mac OS for that matter, which also has a good command line, being based on BSD and all..). A lot of the configuration options in Windows are hidden away in the registry rather than in plain text files. Yes, I prefer having easily accessible configuration files, but the fact is that Windows was designed to be used mainly through a graphical environment, while Linux is more flexible and is designed to be usable even without X server.

Re:What I like to do. (1)

MajinBlayze (942250) | more than 6 years ago | (#21894008)

I can't possibly see any reason why having more options is a benifit

To me, that's what Linux is about, having options.

That being said, the new windows shell sounds interesting useful, if a little late to the party.

Re:What I like to do. (1)

SQLGuru (980662) | more than 6 years ago | (#21894102)

GUI interfaces are easier for input (no switches to remember, easy to navigate, etc.)
Command lines are easier to schedule and include in custom batch scripts
Command lines allow input prior to the program loading

Both have their place.

The big problem I have is that most administrators* that rely on the command line (in particular DBA's using SQL*Plus) don't help themselves out and manually enter that string of commands instead of batching them up or writing a GUI to simplify their normal tasks. (* administrators that I have personally encountered, your experience my be different).

Layne

Re:What I like to do. (-1, Flamebait)

hatchet (528688) | more than 6 years ago | (#21894282)

Actually quite the contrary, you only have problems because you are used to do stuff in unix. Windows command line and GUI have something linux doesn't have. CONSISTENCY.

User interfaces (4, Informative)

MartinG (52587) | more than 6 years ago | (#21893480)

While not specifically relating to user interfaces of computer software, there is an excellent book relating to making things in general easy to use, and most of the ideas translate well to GUIs.

The book is called "The design of everyday things" by Donald Norman.

Re:User interfaces (5, Informative)

morgan_greywolf (835522) | more than 6 years ago | (#21893858)

That's a good book and it has plenty of common sense principles.

Most of the people on here will say something along the lines of one of the two variants:

1) Human-computer interaction is a discipline and you should read this HCI book or that HCI book. (Alan Cooper's About Face comes to mind).

2) Some vague advice about making look like the OS you're targetting.

It's all crap. Good interfaces are built by following a few principles:

1) KISS principle -- Keept It Simple, Stupid. You don't need to make every friggin' thing customizable and you don't want to overwhelm your users with a multitude of options.
2) Make it 'just work'. Automate as much as you can. Try to have configuration options that either will work in the vast majority of cases with the defaults, or have the application automatically try to determine the best settings for the user's environment. The best configuration dialog is one the user never has to see.
3) Softer software -- make things customizable, but in a way that they don't HAVE to be customized for a good user experience. Most users won't customize their environment very much. Always keep this in mind.
4) Present as little of the interface as necessary to accomplish the task at hand. Better to have more dialogs or dialog tabs with a few options than one big gargantuan dialog that has everything.
5) On layouts -- put the most commonly-used controls in a very prominent place and make them big and easy to click on. Things that are less likely to be used should be smaller and out of the way. Buttons are better than menus, but don't end up with so many buttons that the user gets lost -- again, fewer controls on more windows is better than more controls on fewer windows.
6) Don't use gaudy, distracting color schemes or fonts. Make it fit-in with the user's environment. If possible, on GNOME, you want to follow the GNOME HIG. Ditto for Mac. On Windows, follow the 'User Experience Guidelines.' But this shouldn't be your overriding priority. Don't scrimp on the other principles I've outlined just because you're trying to shoehorn your application into the OS vendor's model of what an application should look like.

Re:User interfaces (-1, Offtopic)

Anonymous Coward | more than 6 years ago | (#21893922)

That's some really good tips. Thanks from another AC. Oh and by the way, mod parent up (some of you moderators need some advice...)!

Re:User interfaces (4, Informative)

SQLGuru (980662) | more than 6 years ago | (#21894196)

7) Know your audience.
          -This is related to #5 in that your audience determines what features should be prominent: the person answering the phone needs the "take message" feature to be easiest to reach....the person at the cash register needs the "ring up sale" feature to be easiest.
          -This is related to #6 in that your audience determines what colors are good / bad (think "high contrast" color schemes for visually impaired, cultural implications of color, etc.)
          -This is related to #3 in that if your audience is Slashdot readers, they expect skinning and an options screen with 50,000 selections.....if your audience is the owner of the basement you live it, they expect a single button that is labeled "Do What I Mean"

I'm sure that principle applies to the others in some way, too, but you get the idea.

Layne

Re:User interfaces (1)

owlstead (636356) | more than 6 years ago | (#21894310)

7) Don't go and design your own framework. Try to rely on platform features as much as possible; people are used to those. And don't try and reinvent the wheel, use pre-build components when and if they are available. Don't forget keyboard input, and make sure that you can tab go the widgets in a non-obstructive way.

All these advises are really nice, but don't let your users learn everything from scratch. Unfortunately, even M$ and Apple sometimes forget this part. In most UI books, there is no distinction between creating platform widgets and creating an application. This seems to be a big oversight in my opinion, normally an application developer should not have to create everything from scratch.

Don't forget i18n if you are catering for a world wide audience.

Re:User interfaces (0)

Anonymous Coward | more than 6 years ago | (#21894344)

Yes, the interface should look like the "The Hitchhiker's Guide To the Galaxy"
and have the words "Don't Panic" on it!

about face ..... alan cooper (1)

the_wesman (106427) | more than 6 years ago | (#21893494)

get this one [amazon.com]

Re:about face ..... alan cooper (1)

Burnhard (1031106) | more than 6 years ago | (#21893590)

Well, a quick peek at the reviews, 1 of 3 says:

At every chapter in this book I thought, "Well this book's been worthless so far, but I think it gets better in the next chapter." I thought that until the last (26th) chapter, which was actually half-decent. I've never been so disappointed in a book. Any designer with the slightest bit of experience will learn nothing from this book. Nearly every piece of advice is trite ("Design principle: Use noneditable controls for output-only text"). There's very little depth or thinking beyond the completely obvious. You will learn more from any other book (on any topic) than from this book. If you've already bought it, you should skip to the chapters with non-zero value. I recommend chapter 5 (personas), chapter 16 (undo), chapter 17 (save), and chapter 26 (misc). The section on perpetual intermediates is good too. I finished the book 10 minutes ago after a very tedious three months. I can finally put it on the shelf and never look at it again.
Having some experience of reading UI design books, this is fairly typical in my experience. There is no "catch all" guide to designing UI experiences, because the principles you apply will depend on the application, the ergonomics and the libraries you are using, alongside the motivation of the user to get to know your particular method of interaction. My only suggestion would be to prototype, see what works and what doesn't and to never assume because "it's good for you, it's good".

Re:about face ..... alan cooper (0)

Anonymous Coward | more than 6 years ago | (#21894044)

You peeked too quickly. There were 7 reviews. One was the one you quoted. Another gave it 3 stars but said the book itself was worth 5 stars but deducted 2 for the quality of the printing. The remaining reviews gave it 5 stars.

Personally I think he made a lot of good points in the book, and I also appreciated the energy with which he wrote. However, I can't claim to be well read in the field of GUI design.

Usage-Centered Design (0)

Anonymous Coward | more than 6 years ago | (#21893506)

I am a big fan of Constantine and Lockwood's "Software For Use". Usage-centered design seems more practical and pertinent than user-centered design. There are some interesting articles and resources at their website, foruse.com.

Depends (1)

damusicman (1125525) | more than 6 years ago | (#21893514)

A lot of factors can determine how the GUI should be created... Whether it is for an individual program, or for an entire operating system is a factor. It should combine form and functionality. Two ends of the spectrum is Plan 9 from Bell Labs's Rio GUI which if highly functional, but is lacking in form or styling, and Windows Vista's Aero, which although it does look nice, is pretty much useless...

Re:Depends (3, Insightful)

Amouth (879122) | more than 6 years ago | (#21893614)

i agree but from a personal perspective for UI i always try to look at is

-who is going to be using it and their relitive understanding of what is happening
-what
          -what is it that i am having to show the user
          -what is it that they want to do
-where (as in environment) is this going to be used? (sales register - production floor - pda on the go - person at random cube desk)
-why is this application even existing what is it's true purpose

once you answer the w's you can then figure out the
-how
so that it meets what you want in the w's

also remember to include the users in the design.. their info is invaluable - as they are the ones that will decide if the app survives.. you will hate nothing more than to write something you like and think is wonderful only to see it sit idle or have people bitch all day about it

- also note that you learn from experience.. you will not get it right the first time..

Re:Depends (5, Insightful)

sm62704 (957197) | more than 6 years ago | (#21894060)

It should combine form and functionality

Wrong. "Form follows function" is one of the main tenants of good design. Make your toaster as pretty as you like, but don't forget that its function is to make toast, with the least amount of effort for the toaster user as possible.

If you make your toaster so that it looks like a pig, fine, but if you use the pig's snout as a lever to make the bread go down, you have a shitty design. It should be obvious to the user HOW to make the bread go down.

If your user needs to RTFM, you have failed in your attempt to design well.

-mcgrew

Re:Depends (0)

Anonymous Coward | more than 6 years ago | (#21894240)

"If you make your toaster so that it looks like a pig, fine, but if you use the pig's snout as a lever to make the bread go down, you have a shitty design."

Okay, I grew up on a farm ... and pushing down on the pig's snout is exactly how we made the bread go down.

Rule #1: Don't make the user look stupid (2, Informative)

PaleoTek (174518) | more than 6 years ago | (#21893516)

Alan Cooper's About Face is a good place to start. I read Version 1.0 back in the day, and am reading the 3rd Edition now. Alas, he's gotten a bit more tedious in the interval, but is still smart, funny, and committed to better GUIs.

Rule #1: Don't make the user look stupid-Mirrors. (0)

Anonymous Coward | more than 6 years ago | (#21894152)

According to slashdot the user already is stupid. How can the UI designer make it worse?

Sharp et al: Interaction Design (0)

Anonymous Coward | more than 6 years ago | (#21893526)

I just bought this:
Sharp, Rogers, Preece. Interaction Design: Beyond Human-Computer Interaction, 2nd edition

"I have no clue how to write a good one." (4, Interesting)

El_Muerte_TDS (592157) | more than 6 years ago | (#21893532)

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.

Re:"I have no clue how to write a good one." (1)

PrescriptionWarning (932687) | more than 6 years ago | (#21893564)

exactly, just try to think about all the OSes and Applications you've ever used, and try to think about what you liked and didn't like. Then add in a little of your own flavor, try it out, and if you don't like it, redo it!

Re:"I have no clue how to write a good one." (1)

UbuntuDupe (970646) | more than 6 years ago | (#21893880)

User interface design really interests me. I understand that other people don't share this passion. Still, I think simple rules can provide a good guide, even if you have no clue. Here is rule I would propose instead of (or in addition to) that one:

Have ONE potential user try to use it as they would for its intended purpose. Then, eliminate the things that severely bother them until there are none. (Severe means things like, "Can't find a function after trying obvious ways of searching for it", takes a lot of effort to instruct it to do very common tasks, anythink irritating enough that they want to avoid using that part of the program.)

Believe it or not, that will put you ahead of about 50% of user interfaces out there.

Re:"I have no clue how to write a good one." (1)

kaian (1206772) | more than 6 years ago | (#21894080)

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.
That's a strange couple of sentences to string together...

I've found that really understanding the situation(s) the program will be used in is fundamental. Good user interfaces just fit with the situation, and feels second nature. Too many toss inn all the info and controls that they can into each window, where a better understanding of what the user need in each scenario would allow to remove most of it alltogether.

Also, consistency is king. So do adhere to good recognisible style.

Re:"I have no clue how to write a good one." (1)

sm62704 (957197) | more than 6 years ago | (#21894106)

Doesn't matter, neither does anyone else

Wrong. Google knows good design. Lots of people know good design. Unfortunately, way too many people share your apathy towards the user.

If you're developing for Windows... (3, Informative)

PhrostyMcByte (589271) | more than 6 years ago | (#21893538)

I don't have any book recommendations, but if you're developing for Windows, be sure to read the Windows Vista User Experience Guidelines [microsoft.com] . Even if you're not on Windows it has some design advice applicable anywhere.

Re:If you're developing for Windows... (1)

Zey (592528) | more than 6 years ago | (#21893748)

Given the terribly cluttered interface is just one of the things driving people away from Vista, you may or may not want to ignore those Vista Guidelines ;-).

Re:If you're developing for Windows... (3, Interesting)

MBGMorden (803437) | more than 6 years ago | (#21893894)

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.

Re:If you're developing for Windows... (1)

SQLGuru (980662) | more than 6 years ago | (#21894254)

Vista is fine, but they sure did screw up Office 2007......I can't find anything easily....

Of course, I'm in the camp of "give me a remote with 84 buttons and I'll figure out which one I want" instead of the camp of "give me a remote with 10 buttons and make them only do what I need"......I want the power, not the protection.

Layne

Re:If you're developing for Windows... (1)

peragrin (659227) | more than 6 years ago | (#21894280)

Actually MSFt tends to hide things with Poor GUI design, and frequently renames commonly used items. They are getting better however.

Something I do find interesting Is Office 2007 ribbon. A new and innovate take. if it works in the long term is something else, but at least they tried something else.

I just have to wait for MSFT to port it to the Mac.

There are no experts on /. (-1, Flamebait)

Anonymous Coward | more than 6 years ago | (#21893552)

Just guys repeating what they read here and there. And some other clueless types that claim to be experts..........

Design of everyday things (1)

mattpalmer1086 (707360) | more than 6 years ago | (#21893556)

It's not aimed at GUI design in particular, but I'd strongly recommend "The Design of Everyday Things" by Donald Norman.

Also, "The Inmates are Running the Asylum (why high tech products drive us crazy)" by Alan Cooper is quite good (although about a third of the book is just a pitch for the author's consultancy).

In Your Face, Slash dot (-1, Offtopic)

Anonymous Coward | more than 6 years ago | (#21893562)

What he said !!

Mac and non-Mac (2, Interesting)

Zey (592528) | more than 6 years ago | (#21893578)

Be prepared to use at least two design styles. There's the Mac way (and you'll find a lot of good guidelines in their Human Interface Guidelines [apple.com] for that), but, follow those on Windows and X11 and your applications will look rather strange and not at all platform native; even when using native UI controls.

I don't have any suggestions for books on good design, but, here's a classic site which covers some bad design mistakes: The User Interface Hall of Shame [mac.com] . The examples are fairly dated now, but, the principles remain true.

Listen (2, Insightful)

C10H14N2 (640033) | more than 6 years ago | (#21893588)

What are the issues in designing an interface that is clean, easy to understand, and easy to use?
Listening to your users enough.

What are things to be avoided?
Listening to your users too much.

Really, the whole thing boils down to balancing the above and, unfortunately, it's a very subjective thing. /Appropriately, my captcha was "miseries."

I would suggest... (4, Informative)

scafuz (985517) | more than 6 years ago | (#21893592)

I would suggest you two books:
1] GUI Bloopers 2.0: Common User Interface Design Dont's and Dos [Morgan Kaufmann Publishers]
2] Designing Interfaces [O'Reilly]
the first to understand what not to do and the other one to get some good ideas to start from.
I really think any book will do, except any Jacob Nielsen's books about usability... I've read them at the very beginning of my career... I think it was jus a loss of time

HIG Guidelines (0)

Anonymous Coward | more than 6 years ago | (#21893604)

Even if you don't develop for Mac, GNOME or KDE, these documents have a fairly good set of guidelines, some of them are specific to the uniformity of the "experience" however. I would imagine Microsoft having atleast some type of guidelines for interface design in MSDN.

http://library.gnome.org/devel/hig-book/stable/ [gnome.org]
http://developer.apple.com/documentation/UserExperience/Conceptual/OSXHIGuidelines/XHIGIntro/chapter_1_section_1.html [apple.com]
http://usability.kde.org/hig/current/ [kde.org]

Anything by Robin Williams (0)

Anonymous Coward | more than 6 years ago | (#21893616)

I have the Non-Designer's Web Book that she wrote and it is awesome. She's written a lot of books that are UI related so you should be able to find something suitable.

I'm no UI expert... (2, Informative)

Kjella (173770) | more than 6 years ago | (#21893648)

...but I'd say most designs fail at one of these two things:
1. Split the elements into three categories:
a) Must set / vital parameters / things that can't have a default
b) Has a default, but users should change regularly
c) Nice to have - every other little setting

Make it very clear what the minimum effort is.
Show the second so users know they're there.
Hide the third behind an expander/button, for those that specificly look.

2. Group things logically by function

Those two things can be contradictory enough. I've met many UIs where either a) there's ten pages of configuration with one a-level option per page, or b) the advanced functions aren't logically ttached to the basic functions at all. If you can make an UI that cover those two well, I'd say you do better than 90% of the UIs out there.

Top ten list by HCI prof (5, Informative)

stew77 (412272) | more than 6 years ago | (#21893652)

Here's a list my former professor compiled:

1. Alan Dix, Janet Finlay, Gregory D. Abowd, and Russell Beale: Human-Computer Interaction
2. Ben Shneiderman and Catherine Plaisant: Designing The User Interface
3. Donald A. Norman, The Design Of Everyday Things
4. Jenny Preece, Yvonne Rogers, and Helen Sharp: Interaction Design
5. Jef Raskin, The Humane Interface
6. Terry Winograd (ed.): Bringing Design to Software
7. Brenda Laurel (ed.): The Art of Human-Computer Interaction
8. Apple Computer: The Apple Software Design Guidelines

http://media.informatik.rwth-aachen.de/HCIBooks [rwth-aachen.de]

Keep in mind that testing your UI on real users is very important. Just because you think it's a good UI doesn't make it a good UI.

Top ten list of Game UIs. (0)

Anonymous Coward | more than 6 years ago | (#21893842)

"Keep in mind that testing your UI on real users is very important. Just because you think it's a good UI doesn't make it a good UI."

How well does all that apply to Game UI's?

on the web (1)

Uzik2 (679490) | more than 6 years ago | (#21893658)

http://jimjansen.tripod.com/academic/pubs/chi.html [tripod.com]
It has references to paper works if you must kill trees to learn

The basics: (4, Insightful)

localroger (258128) | more than 6 years ago | (#21893668)

1. Make the most common operations the easiest to get to, and hide things that aren't done very often behind menus and secondary forms.
2. Use it yourself, and rearrange the controls to get rid of any apparent awkwardness.
3. Give it to the actual end users, and be prepared to rearrange the controls again when you notice all the unexpected things they do to it.
4. Don't get cute. Use standard controls that people recognize.
5. Pay attention to keyboard shortcuts and tab order. Don't make the user use a pointing device.

By far the biggest thing is the willingness to refactor. You won't get it right the first time; that's almost impossible, and nothing is worse than a UI that is written to spec and then slavishly nailed to that spec even when the users complain about it. You'll probably find something that you thought would be a common operation is hardly ever done; get the annoying button out of their faces. And something else you thought would happen once a month happens every hour; bring the control out front for them.

Re:The basics: (2, Insightful)

sjaguar (763407) | more than 6 years ago | (#21893710)

4. Don't get cute. Use standard controls that people recognize.
In addition to using standard controls, have a consistant look. The application/webpage/whatever should be at least consistant with itself.

Re:The basics: (1)

Tsu Dho Nimh (663417) | more than 6 years ago | (#21893820)

4. Don't get cute. Use standard controls that people recognize.

Same goes for icons ... make sure the icons are easy to distinguish among themselves, and if possible use ones wiht meanings that are already well-known. I remember one disastrous Linux app that had two identical-looking icons on one user dialog box, and no pop-up text to explain what they did. One closed out the whole app, losing all my work.

Development versus Design (1)

cbart387 (1192883) | more than 6 years ago | (#21893676)

I've heard (and from my experiences I think is true) that people who are good at development are not necessarily the best for design, and vice versus. There's always exceptions, and I'm sure some on this site will say that they can do both well. If I was independently writing a software (for the general population) I'd want someone to do the UI, because my mind doesn't work that way.

Besides making UIs that look 'pretty' these are ideas that I've been pointed to in classes here [useit.com] and here [asktog.com] . They are useful for both developers and designers of GUIs.

GUI design tips (4, Insightful)

Tsu Dho Nimh (663417) | more than 6 years ago | (#21893712)

Tips are all over the internet. I'd start with the Alertbox by Jakob Nielson (ex-Sun employee, now a usability consultant) and anything his group has published on user interfaces. http://www.useit.com/alertbox/ [useit.com]

My pet peeves in GUIs ... the designers ignore that people actually have to read the GUI, and treat it like it's supposed to be admired for artistic. For a GUI, bland and boring is good, functional is the goal.

  • Gaudy color schemes: High-contrast is good, but that means high tonal contrast, not screaming red on puke green. Dark text on a pale background is the best for most users, and the colorblind. To test your design, print it out on a black and white printer. If you can't read it, you have the wrong colors
  • Too-subtle color schemes: Pale shades of blue with gentle grey text, unreadably misty and soothing.
  • Reversed tones: pale shades on dark, for optical reasons need special spacing if you don't want the verticals to blur together.
  • Bizarre fonts and font sizes. I remember one supposedly great CD player software that had a jagged "lightning bolt" font for its control labels ... couldn't read them at all, so I deleted it.
  • Odd names for things that have well-known common names. Don't call the mute button the "audio whiffer", even if the developers call it that.
  • Multiple names for the same control, on different menus. Pick a name and use it all over the GUI.

Re:GUI design tips (0)

Anonymous Coward | more than 6 years ago | (#21894290)

My biggest peeve is programs stealing the focus from other programs. If I load outlook, I know it'll take about five minutes to load, so I'll use another program in the mean time. While waiting for outlook to complete loading, it will steal the focus about three times. Just the tiniest bit annoying when half way through a password field on a webpage...

It's like a sandwich ... (1)

lysdexia (897) | more than 6 years ago | (#21893718)

I worked as a busboy my freshman year of college (`84). I was mopping vomit out of the bathroom. The Assistang Manager came in to have a leak. He said "I don't know anything about a roast beef sandwich, but I do know that if I ever made one, I'd slice it thin" (pause for dramatic eye contact) "and pile it high." He zipped, tucked his tie back between the third and fourth buttons on his shirt and left.

Thus I was enlightened.

Oh, and Jef Raskin's "Humane Interface" is still pretty good reading.

Good GUI Design? (1)

flajann (658201) | more than 6 years ago | (#21893720)

As one who has designed GUI for many years (pre-Web), I can say that good GUI design is not an easy thing to come by.

You have to look at and understand your audience intimately. Demographics matter, too. What works for 20-somethings might totally confuse 50-somethings.

And today, good GUI design is even made trickier by the expectations users have from using the best applications and web sites. If your application is very "MySpace"-like and is intended for that same audience, you'd better make sure it's a good match.

Also, gone are the days you can expect your audience to RTFM to use your application. It must be obvious from the first click of the button.

But to our credit as GUI designers, today's audience is much more sophisticated than those pre-Web. So, if you stick to certain measures, it's actually easier than it was before. And there are many tools to help you, too.

Bruce Tognazzini (3, Informative)

deacent (32502) | more than 6 years ago | (#21893740)

My favorite expert on UI is Bruce Tognazzini. His site at http://www.asktog.com/ [asktog.com] has been quite useful to me. I don't agree with everything he says, but it's always gets me thinking, always challenging me to approach development from a human perspective.

test it with users. (1)

Racemaniac (1099281) | more than 6 years ago | (#21893760)

i've had a basic course on UI design, and one of the basic points was to test it with users, look at the results, and correct things you saw went wrong, and start over again...
basically you just make a mockup (or in the beginning even a simple paper prototype) and ask the test subjects to do certain things, and make use of think aloud (aks them to as much as possible say what they're thinking, doing, and thinking they're doing. a random/weird action may suddenly become clear when you realise your users are understanding certain things completely differently than you).
and besides that, look at other interfaces for similar purposes, it's useless to try and reinvent the wheel (depending on the application, ofcourse make sure you don't run into legal trouble for exactly copying something existing).

Oh dear... (0)

Anonymous Coward | more than 6 years ago | (#21893764)

I hereby tag this "article" with ROFLDOYOUHAVENODISTANCETOANYTHING? and now I filling this post out with pointless lower-case blabber just to circumvent the lameness that is the "lameness filter" of Slashdot's not entirely brilliant comment interface. I have had no cups of coffee today, but two glasses of orange juice. One two. 2.

HCI Theory (1)

IndieKid (1061106) | more than 6 years ago | (#21893768)

The core text on my Human Computer Interaction course at University (College for you American folks) was this [amazon.co.uk] . It might be a bit long in the tooth now but it covers the general principles of how to design a good user interface and how to actually measure user interaction with an interface, as well as the theory (some psychology type stuff mixed with Computer Science) behind the principles.

It doesn't really cover web stuff if that's what you're after, but the most of the principles are largely the same. Having said that, I still refer back to this book from time-to-time even though I've worked exclusively with Web applications for the last three years.

Macintosh Human Interface Guidelines (5, Insightful)

amper (33785) | more than 6 years ago | (#21893770)

Start with the original Macintosh Human Interface Guidelines. Apple Computer put forth an extremely strong effort in researching basic human interaction with graphical user interfaces during the development of their products in the 1980's, and this book is still the gold standard, even if Apple themselves disregard much of its advice nowadays (mainly because Apple was taken over by the team from NeXT). Remember that when Apple was developing the Lisa and Macintosh interfaces, the general populace had never yet been exposed to this type of interaction with technology, and quite a lot of emphasis was placed on making available powerful features to expert users that were easily accessible, yet unobtrusive to novices.

Along the same lines, I would recommend the original interface guidelines manuals for many of the early graphical operating systems, especially those for early PDA's, like GO's PenPoint, Apple's Newton OS, and the manual for General Magic's Magic Cap.

All of the aforementioned books are out of print, but any serious student of interfaced design should own all of these.

Re:Macintosh Human Interface Guidelines (1)

jacquesm (154384) | more than 6 years ago | (#21893836)

better yet, go straight to the source and find out what Xerox was up to.

Some suggestions (2, Informative)

Registered Coward v2 (447531) | more than 6 years ago | (#21893788)

Donald Norman Design of Everyday Things (ISBN-13: 978-0385267748) He will get you thinking about the implications of your interface design; this classic may be hard to find but he has other books out as well. While his examples focus on mechanical objects the thought process and criticisms provide insights into how to think about the end user in your design and avoid become someone "Who won an award" for their design. Once you read teh book you'll get what I mean. http://www.jnd.org/ [jnd.org]

Bruce Tognazzini Tog on Interface (ISBN-13: 978-0201608427) A bit dated but the concepts and idaeas are what matters. He has a website as well as other books. http://www.asktog.com/ [asktog.com]

Finally, there are classics by Edwin Tufte you may want to checkout as well. He focuses on displaying information (mostly quantitative) in a manner to support understanding; and hates PowerPoint type presentations with a passion. Tufte has a website as well. http://www.edwardtufte.com/ [edwardtufte.com] His one day course ie excellant.

Edward Tufte (Re:Some suggestions) (1)

Beorytis (1014777) | more than 6 years ago | (#21894218)

Absolutely recommend Tufte's work, and for a much broader audience than those implementing GUIs. (Really everyone from weathermen to magicians). Enjoyable reading to boot!

"There's no bullet list like Stalin's bullet list!"

A notebook (pen & paper) (1)

ByOhTek (1181381) | more than 6 years ago | (#21893800)

A lot of people have different views on a UI. Some people think the Apple style is the end-all/be-all, and some don't. Some go for the style of Windows, some go to a completely different direction.

Look at a few apps with good UIs, write jot down what elements you like about them. See if you can find elements you don't and jot those down.
Next, go to some similar apps with bad UIs, write down what they did wrong and what they are missing, in your oppinion.

You should actually get a fairly good idea of how to make a decent UI from this. Now, take some of your UIs, really look at them, pretend they were written by someone else if you have to, and figure out "What is it missing, why don't I like it?"

Spolsky. (2, Informative)

MythMoth (73648) | more than 6 years ago | (#21893802)

I particularly User Interface Design for Programmers [joelonsoftware.com] by Joel Spolsky.

If you're designing web software, then read through the archives of Use It [useit.com] by Don Norman. I don't like his books - Designing Web Usability is the only paperback I've ever bought that had usability issues! But he's mostly on the ball.

I have (1)

borizz (1023175) | more than 6 years ago | (#21893808)

User Interface Design and Evaluation by Stone, Jarrett, Woodroffe and Minocha. It's the book my university uses for its course titled Interface and Interaction Design. I like it, but then again, I haven't actually seen any of the other books.

This one helped me (1)

martyb (196687) | more than 6 years ago | (#21893856)

This one helped me a lot: "The Windows Interface Guidelines for Software Design" by Microsoft Press. (ISBN 1-55615-679-0)

I'm sure it's out of date now (it targets Win95 & NT), but I got it so I could help test some Windows applications back in the day. It was a great help in learning how to lay things out on the screen, in dialog boxes, menus, etc. Even more importantly, I learned the rules for keyboard navigation -- it's amazing how much can be done without having to take hands off the keyboard. Things are quicker, too, because I can key my way through drop-down menus without having to wait for each one to paint before I could click on the next selection I wanted.

I'm interested in what its follow-ons are and what people's experience have been with it.

Well you can start by (1)

AbRASiON (589899) | more than 6 years ago | (#21893892)

Reading this old classic article, I always loved this one (and agreed so much)
http://homepage.mac.com/bradster/iarchitect/qtime.htm [mac.com]

While you're at it, Vista's explorer - yeah, don't copy anything from that either.
See more info here from me.
http://it.slashdot.org/comments.pl?sid=364823&cid=21406737 [slashdot.org]
Specifically take note of what I whine about in the JPG's - it's that kind of shit which kills users.

Programming As If People Mattered (1)

Lodragandraoidh (639696) | more than 6 years ago | (#21893900)

"Programming As If People Mattered" Nathaniel S. Borenstein -Princeton University Press 1991 - ISBN: 0-691-03763-9

Dated, but simple and very much applicable today. Humorous segways and examples abound.

Top Books (1)

will_die (586523) | more than 6 years ago | (#21893902)

The top book in this area are generally considered to be..

About Face by Alan Cooper. Version 3 is out
Don't make me think by Steve Kung. This is for web.
Anything by Jakob Neilsen. Now mainly focuses on web but he is the main UI person around. Has a web site http://www.useit.com/ [useit.com]
GUI Bloopers by Jeff Johnson a little dated but far too much informaion about every aspect of the user interface.

Then you have the books for the language or framework you are working on. Java, Apple and Microsoft all have books on how the user interface should work for thier environment and language. Most of theses can be freely downloaded or read online.
Then for a higher level look along with other information _Code Complete 2_.
If you can make it through all of thoses you will be one of the top UI people around.

Go to the Master: Joel Spolsky! (1)

microTodd (240390) | more than 6 years ago | (#21893960)

Joel Spolsky wrote "User Interface Design for Programmers" which discusses exactly what you are asking. Not the technical aspects of the API, but the Human Interface aspects that make an interface easy-to-use, intuitive, and useful.

Here is the Amazon link [amazon.com]

He was also nice enough to put the book online for free: http://www.joelonsoftware.com/uibook/chapters/fog0000000057.html [joelonsoftware.com]

KISS me (1, Informative)

sm62704 (957197) | more than 6 years ago | (#21893998)

The old adage called the "KISS" principle applies: Keep It Simple, Stupid. This has fallen out of favor with the younger generation. Today's apps are busy; too busy. Everyone and their dog wants to be Bill Gates so they copy Microsoft.

However, at the opposite end of the spectrum isn't Apple, but Google. Google does it right. Simple, clean, light, fast. There is little to no trouble finding any of the myriad things Google has to offer these days, yet the interface still isn't cluttered.

IMO if your interface would fit a Microsoft product, it sucks. Microsoft writes the WORST interfaces. Big, heavy, bloated interfaces (and code to match) that give the impression of having more than it actually does, and offering more than you need.

Now, I'm a bit biased from my college training, as I was a fine arts major, and the instructors were mostly minimalists. One of my better instructors, when faced with a busy piece, would often say "there's less here than meets the eye". That's Microsoft.

Is there a patent on the circular menu or something? I have yet to see one an any commercial or OSS application.

If I weren't so damned lazy (and wasting all my time at slashdot) I'd use the KDE codebase to write a GUI that instead of having the windows-like taskbar at the bottom, would have a command line. You would still have icons, wallpaper, etc, but instead of a "start" button like Windows or KDE you would click on any empty part of the screen to pull up a circular menu. If you just started typing (without clicking anywhere first), what you typed would show up on the command line at the bottom of the screen. I still find it a hell of a lot easier to type "dir" or "ls" than to right-click "start", find "Home" or "Explore" in an old fashioned, should be obsolete straight menu, then click and click and click to get to where you were when you pulled it up. I find it easier to type "del ??task.bat" than to use Windows Explorer, drill to where the files are, hold down "alt" and choose the files I want to delete, then... well, GUI is great but command line interfaces have their strengths, too.

But to reiterate, what's worse than Microsoft? Any newspaper's web site.

-mcgrew

PS- don't go to my site looking for good design, it's cobbled together without much effort or thought. It loads fast though.

sh1t (-1, Offtopic)

Anonymous Coward | more than 6 years ago | (#21894010)

Whether you were compounded Short of a miracle SSe. The number

Gui Bloopers (1)

hibiki_r (649814) | more than 6 years ago | (#21894016)

This one [google.com] might not have all the rules you might want, and some of his concepts are debatable, but it goes into the nitty gritty details other books don't.

Another Helpful Book Rec... (1)

endofoctober (660252) | more than 6 years ago | (#21894084)

...would be Steve Krug's Don't Make Me Think [tinyurl.com] . While specifically focused on web design, the book introduces some helpful concepts that are fairly universal for UI design. I also second (or third or fourth by now) anything by Tufte - genius stuff (and he'll be the first to tell you that), and very thought-provoking.

About Face! (1)

me( coffee ) (1130367) | more than 6 years ago | (#21894162)

About Face 1,2, and 3, by Alan Cooper, are the best interface design books I have ever read. I have recommended them to many people and have never had any complaints, only thanks.

Apple's Book on UI (0)

Anonymous Coward | more than 6 years ago | (#21894172)

Apple wrote what I understand to be the defacto standard on User Interface Design (I have a copy in storage) - it was written in the 1980's but apparently is still very applicable.

Don't make them use the mouse... (1)

technomom (444378) | more than 6 years ago | (#21894180)

Keep in mind that touch typists HATE to have to use the mouse. Be sure to design so that enter pages can be navigated logically using the keyboard. By logically, think left->right, top->bottom (at least for the North American English speaking audience, I can't speak for other cultures).

Also, make the system intelligent. If a lot of the data entry is repetitive, build in some typeahead and use intelligence (e.g. a bill-to address usually IS the same as the ship-to address so provide for that). Get yourself a zip-code lookup. There is nothing more annoying than having to enter the same data repeatedly.

Use the system yourself for a while. Really. Not for 2 or 3 record entries, use it for 100 or so REAL entries to find trouble spots you imagined and requirements that were never raised (Some surnames ARE longer than 15 characters, some names have accented characters, some people DO put capitalization in the middle of their names, Oops, what do we do with this order from Toronto? It seems to have a weird zip code that our numerical filter cannot handle...). And of course, find out what annoys you when you use it and FIX IT.

Good luck!

Ignore the books (1)

Thaelon (250687) | more than 6 years ago | (#21894300)

This is surprisingly simple. Ignore all the artsy fuckers that thing GUI design is an art. It isn't. It's a surprisingly hard science.

Good GUIs minimize the amount of physical user interactions required by the user to perform any action. Mouse down is an action, mouse up is an action moving the mouse 5mm is an action. You get the idea. You need to be aware of EVERY tiny action and try to eliminate as many as possible. If you must use a right click menu with 2-3 menus deep, provide a hotkey for the same action.

Good GUIs absolutely, positively, never throw a modal dialog with only a single button. And avoid one with two or three buttons if possible.

Provide a hotkey for everything.

Use one thread for the GUI, one thread for the behind the scenes work.

Make sure your cancel buttons actually work to halt long resource intensive processes.

Don't use hover menus. Ever. Seriously, never. The mouse is a feedback only device until a button is clicked. Tooltips are OK as long as the vanish the instant the mouse moves off of the (small) trigger area, blocking what a user is trying to see is obnoxious.

Above all, don't annoy your users. Your GUI is a means to use your software, that is all.

Much can be learned here [mac.com] for free. Interface hall of shame on the left bottom. It's what NOT to do.

Jef Raskin's The Humane Interface (1)

RealGene (1025017) | more than 6 years ago | (#21894308)

..will clarify why most interfaces suck, and what you can do to avoid sucking also.
--Gene

"About Face" by Alan Cooper (1)

kcdoodle (754976) | more than 6 years ago | (#21894314)

I read this book years ago. It makes you think about features people come to expect in programs. The author is about "putting in ALL on the programmer". What I mean is, many of his ideas are great, but are very hard to implement.

Some example pointers: "Infinite undos - keep track of EVERYTHING done in the program, and let the go backward and forward through the changes", another: "Silently fail - when a user clicks on the wrong thing, DO NOT make a pop-up that says - 'You did something bad', just do nothing, the user doesn't need to be told he is stupid".

Actually the book is extremely short on actual implementation, but that part is up to you.

Technical Communication (1)

pmbasehore (1198857) | more than 6 years ago | (#21894334)

I recommend the book Technical Communication by Mike Markel (http://www.amazon.com/Technical-Communication-Mike-Markel/dp/0312441975/ref=pd_bbs_2?ie=UTF8&s=books&qid=1199371904&sr=8-2 [amazon.com] )
It goes into a lot of the basic theory behind good communication in general, which is really all an interface is (communication between the user and the computer). It does not have a chapter on interfaces specifically, but it talks in depth on good electronic interfaces like online documents and webpages.

Recommendation... (1)

TemporalBeing (803363) | more than 6 years ago | (#21894340)

Back when I was in High School I got the starter set to learning Visual Basic 5 that Microsoft Press put out. It came with two books, one was more thorough on Visual Basic, but the other (the title of which escapes me at the moment) went into all the controls and GUI elements, etc. And (while most here would not like this) I would use Visual Basic as a tool to teach GUI design and focus on content like that book had - which, btw, went into accelerator keys, how controls relate, and more. (I'd use VB only because you can ignore most of the rest of the program and focus on GUIs alone; I'd use and recommend other languages for all other aspects of programming.)
Load More Comments
Slashdot Account

Need an Account?

Forgot your password?

Don't worry, we never post anything without your permission.

Submission Text Formatting Tips

We support a small subset of HTML, namely these tags:

  • b
  • i
  • p
  • br
  • a
  • ol
  • ul
  • li
  • dl
  • dt
  • dd
  • em
  • strong
  • tt
  • blockquote
  • div
  • quote
  • ecode

"ecode" can be used for code snippets, for example:

<ecode>    while(1) { do_something(); } </ecode>
Sign up for Slashdot Newsletters
Create a Slashdot Account

Loading...