Don't Make Me Think!

Steve Krug

Mentioned 48

Web-usability expert Steve Krug updates his classic guide to designing intuitive navigation for the ideal user experience.

More on Amazon.com

Mentioned in questions and answers.

If you could go back in time and tell yourself to read a specific book at the beginning of your career as a developer, which book would it be?

I expect this list to be varied and to cover a wide range of things.

To search: Use the search box in the upper-right corner. To search the answers of the current question, use inquestion:this. For example:

inquestion:this "Code Complete"

Applying UML and Patterns by Craig Larman.

The title of the book is slightly misleading; it does deal with UML and patterns, but it covers so much more. The subtitle of the book tells you a bit more: An Introduction to Object-Oriented Analysis and Design and Iterative Development.

Masters of doom. As far as motivation and love for your profession go: it won't get any better than what's been described in this book, truthfully inspiring story!

Beginning C# 3.0: An Introduction to Object Oriented Programming

This is the book for those who want to understand the whys and hows of OOP using C# 3.0. You don't want to miss it.

alt text

Mastery: The Keys to Success and Long-Term Fulfillment, by George Leonard

It's about about what mindsets are required to reach mastery in any skill, and why. It's just awesome, and an easy read too.

Pro Spring is a superb introduction to the world of Inversion of Control and Dependency Injection. If you're not aware of these practices and their implications - the balance of topics and technical detail in Pro Spring is excellent. It builds a great case and consequent personal foundation.

Another book I'd suggest would be Robert Martin's Agile Software Development (ASD). Code smells, agile techniques, test driven dev, principles ... a well-written balance of many different programming facets.

More traditional classics would include the infamous GoF Design Patterns, Bertrand Meyer's Object Oriented Software Construction, Booch's Object Oriented Analysis and Design, Scott Meyer's "Effective C++'" series and a lesser known book I enjoyed by Gunderloy, Coder to Developer.

And while books are nice ... don't forget radio!

... let me add one more thing. If you haven't already discovered safari - take a look. It is more addictive than stack overflow :-) I've found that with my google type habits - I need the more expensive subscription so I can look at any book at any time - but I'd recommend the trial to anyone even remotely interested.

(ah yes, a little obj-C today, cocoa tomorrow, patterns? soa? what was that example in that cookbook? What did Steve say in the second edition? Should I buy this book? ... a subscription like this is great if you'd like some continuity and context to what you're googling ...)

Database System Concepts is one of the best books you can read on understanding good database design principles.

alt text

Algorithms in C++ was invaluable to me in learning Big O notation and the ins and outs of the various sort algorithms. This was published before Sedgewick decided he could make more money by dividing it into 5 different books.

C++ FAQs is an amazing book that really shows you what you should and shouldn't be doing in C++. The backward compatibility of C++ leaves a lot of landmines about and this book helps one carefully avoid them while at the same time being a good introduction into OO design and intent.

Here are two I haven't seen mentioned:
I wish I had read "Ruminations on C++" by Koenig and Moo much sooner. That was the book that made OO concepts really click for me.
And I recommend Michael Abrash's "Zen of Code Optimization" for anyone else planning on starting a programming career in the mid 90s.

Perfect Software: And Other Illusions about Testing

TITLE Cover

Perfect Software: And Other Illusions about Testing by Gerald M. Weinberg

ISBN-10: 0932633692

ISBN-13: 978-0932633699

Rapid Development by McConnell

The most influential programming book for me was Enough Rope to Shoot Yourself in the Foot by Allen Holub.

Cover of the book

O, well, how long ago it was.

I have a few good books that strongly influenced me that I've not seen on this list so far:

The Psychology of Everyday Things by Donald Norman. The general principles of design for other people. This may seem to be mostly good for UI but if you think about it, it has applications almost anywhere there is an interface that someone besides the original developer has to work with; e. g. an API and designing the interface in such a way that other developers form the correct mental model and get appropriate feedback from the API itself.

The Art of Software Testing by Glen Myers. A good, general introduction to testing software; good for programmers to read to help them think like a tester i. e. think of what may go wrong and prepare for it.

By the way, I realize the question was the "Single Most Influential Book" but the discussion seems to have changed to listing good books for developers to read so I hope I can be forgiven for listing two good books rather than just one.

alt text

C++ How to Program It is good for beginner.This is excellent book that full complete with 1500 pages.

Effective C++ and More Effective C++ by Scott Myers.

Inside the C++ object model by Stanley Lippman

I bough this when I was a complete newbie and took me from only knowing that Java existed to a reliable team member in a short time

Not a programming book, but still a very important book every programmer should read:

Orbiting the Giant Hairball by Gordon MacKenzie

The Pragmatic programmer was pretty good. However one that really made an impact when I was starting out was :

Windows 95 System Programming Secrets"

I know - it sounds and looks a bit cheesy on the outside and has probably dated a bit - but this was an awesome explanation of the internals of Win95 based on the Authors (Matt Pietrek) investigations using his own own tools - the code for which came with the book. Bear in mind this was before the whole open source thing and Microsoft was still pretty cagey about releasing documentation of internals - let alone source. There was some quote in there like "If you are working through some problem and hit some sticking point then you need to stop and really look deeply into that piece and really understand how it works". I've found this to be pretty good advice - particularly these days when you often have the source for a library and can go take a look. Its also inspired me to enjoy diving into the internals of how systems work, something that has proven invaluable over the course of my career.

Oh and I'd also throw in effective .net - great internals explanation of .Net from Don Box.

I recently read Dreaming in Code and found it to be an interesting read. Perhaps more so since the day I started reading it Chandler 1.0 was released. Reading about the growing pains and mistakes of a project team of talented people trying to "change the world" gives you a lot to learn from. Also Scott brings up a lot of programmer lore and wisdom in between that's just an entertaining read.

Beautiful Code had one or two things that made me think differently, particularly the chapter on top down operator precedence.

K&R

@Juan: I know Juan, I know - but there are some things that can only be learned by actually getting down to the task at hand. Speaking in abstract ideals all day simply makes you into an academic. It's in the application of the abstract that we truly grok the reason for their existence. :P

@Keith: Great mention of "The Inmates are Running the Asylum" by Alan Cooper - an eye opener for certain, any developer that has worked with me since I read that book has heard me mention the ideas it espouses. +1

I found the The Algorithm Design Manual to be a very beneficial read. I also highly recommend Programming Pearls.

This one isnt really a book for the beginning programmer, but if you're looking for SOA design books, then SOA in Practice: The Art of Distributed System Design is for you.

For me it was Design Patterns Explained it provided an 'Oh that's how it works' moment for me in regards to design patterns and has been very useful when teaching design patterns to others.

Code Craft by Pete Goodliffe is a good read!

Code Craft

The first book that made a real impact on me was Mastering Turbo Assembler by Tom Swan.

Other books that have had an impact was Just For Fun by Linus Torvalds and David Diamond and of course The Pragmatic Programmer by Andrew Hunt and David Thomas.

In addition to other people's suggestions, I'd recommend either acquiring a copy of SICP, or reading it online. It's one of the few books that I've read that I feel greatly increased my skill in designing software, particularly in creating good abstraction layers.

A book that is not directly related to programming, but is also a good read for programmers (IMO) is Concrete Mathematics. Most, if not all of the topics in it are useful for programmers to know about, and it does a better job of explaining things than any other math book I've read to date.

For me "Memory as a programming concept in C and C++" really opened my eyes to how memory management really works. If you're a C or C++ developer I consider it a must read. You will defiantly learn something or remember things you might have forgotten along the way.

http://www.amazon.com/Memory-Programming-Concept-C/dp/0521520436

Agile Software Development with Scrum by Ken Schwaber and Mike Beedle.

I used this book as the starting point to understanding Agile development.

Systemantics: How Systems Work and Especially How They Fail. Get it used cheap. But you might not get the humor until you've worked on a few failed projects.

The beauty of the book is the copyright year.

Probably the most profound takeaway "law" presented in the book:

The Fundamental Failure-Mode Theorem (F.F.T.): Complex systems usually operate in failure mode.

The idea being that there are failing parts in any given piece of software that are masked by failures in other parts or by validations in other parts. See a real-world example at the Therac-25 radiation machine, whose software flaws were masked by hardware failsafes. When the hardware failsafes were removed, the software race condition that had gone undetected all those years resulted in the machine killing 3 people.

It seems most people have already touched on the some very good books. One which really helped me out was Effective C#: 50 Ways to Improve your C#. I'd be remiss if I didn't mention The Tao of Pooh. Philosophy books can be good for the soul, and the code.

Discrete Mathematics For Computer Scientists

Discrete Mathematics For Computer Scientists by J.K. Truss.

While this doesn't teach you programming, it teaches you fundamental mathematics that every programmer should know. You may remember this stuff from university, but really, doing predicate logic will improve you programming skills, you need to learn Set Theory if you want to program using collections.

There really is a lot of interesting information in here that can get you thinking about problems in different ways. It's handy to have, just to pick up once in a while to learn something new.

I saw a review of Software Factories: Assembling Applications with Patterns, Models, Frameworks, and Tools on a blog talking also about XI-Factory, I read it and I must say this book is a must read. Altough not specifically targetted to programmers, it explains very clearly what is happening in the programming world right now with Model-Driven Architecture and so on..

Solid Code Optimizing the Software Development Life Cycle

Although the book is only 300 pages and favors Microsoft technologies it still offers some good language agnostic tidbits.

Managing Gigabytes is an instant classic for thinking about the heavy lifting of information.

My vote is "How to Think Like a Computer Scientist: Learning With Python" It's available both as a book and as a free e-book.

It really helped me to understand the basics of not just Python but programming in general. Although it uses Python to demonstrate concepts, they apply to most, if not all, programming languages. Also: IT'S FREE!

Object-Oriented Programming in Turbo C++. Not super popular, but it was the one that got me started, and was the first book that really helped me grok what an object was. Read this one waaaay back in high school. It sort of brings a tear to my eye...

My high school math teacher lent me a copy of Are Your Lights Figure Problem that I have re-read many times. It has been invaluable, as a developer, and in life generally.

I'm reading now Agile Software Development, Principles, Patterns and Practices. For those interested in XP and Object-Oriented Design, this is a classic reading.

alt text

Kernighan & Plauger's Elements of Programming Style. It illustrates the difference between gimmicky-clever and elegant-clever.

to get advanced in prolog i like these two books:

The Art of Prolog

The Craft of Prolog

really opens the mind for logic programming and recursion schemes.

Here's an excellent book that is not as widely applauded, but is full of deep insight: Agile Software Development: The Cooperative Game, by Alistair Cockburn.

What's so special about it? Well, clearly everyone has heard the term "Agile", and it seems most are believers these days. Whether you believe or not, though, there are some deep principles behind why the Agile movement exists. This book uncovers and articulates these principles in a precise, scientific way. Some of the principles are (btw, these are my words, not Alistair's):

  1. The hardest thing about team software development is getting everyone's brains to have the same understanding. We are building huge, elaborate, complex systems which are invisible in the tangible world. The better you are at getting more peoples' brains to share deeper understanding, the more effective your team will be at software development. This is the underlying reason that pair programming makes sense. Most people dismiss it (and I did too initially), but with this principle in mind I highly recommend that you give it another shot. You wind up with TWO people who deeply understand the subsystem you just built ... there aren't many other ways to get such a deep information transfer so quickly. It is like a Vulcan mind meld.
  2. You don't always need words to communicate deep understanding quickly. And a corollary: too many words, and you exceed the listener/reader's capacity, meaning the understanding transfer you're attempting does not happen. Consider that children learn how to speak language by being "immersed" and "absorbing". Not just language either ... he gives the example of some kids playing with trains on the floor. Along comes another kid who has never even SEEN a train before ... but by watching the other kids, he picks up the gist of the game and plays right along. This happens all the time between humans. This along with the corollary about too many words helps you see how misguided it was in the old "waterfall" days to try to write 700 page detailed requirements specifications.

There is so much more in there too. I'll shut up now, but I HIGHLY recommend this book!

alt text

The Back of the Napkin, by Dan Roam.

The Back of the Napkin

A great book about visual thinking techniques. There is also an expanded edition now. I can't speak to that version, as I do not own it; yet.

Agile Software Development by Alistair Cockburn

Do users ever touch your code? If you're not doing solely back-end work, I recommend About Face: The Essentials of User Interface Design — now in its third edition (linked). I used to think my users were stupid because they didn't "get" my interfaces. I was, of course, wrong. About Face turned me around.

"Writing Solid Code: Microsoft's Techniques for Developing Bug-Free C Programs (Microsoft Programming Series)" by Steve MacGuire.

Interesting what a large proportion the books mentioned here are C/C++ books.

While not strictly a software development book, I would highly recommend that Don't Make me Think! be considered in this list.

As so many people have listed Head First Design Patterns, which I agree is a very good book, I would like to see if so many people aware of a title called Design Patterns Explained: A New Perspective on Object-Oriented Design.

This title deals with design patterns excellently. The first half of the book is very accessible and the remaining chapters require only a firm grasp of the content already covered The reason I feel the second half of the book is less accessible is that it covers patterns that I, as a young developer admittedly lacking in experience, have not used much.

This title also introduces the concept behind design patterns, covering Christopher Alexander's initial work in architecture to the GoF first implementing documenting patterns in SmallTalk.

I think that anyone who enjoyed Head First Design Patterns but still finds the GoF very dry, should look into Design Patterns Explained as a much more readable (although not quite as comprehensive) alternative.

Even though i've never programmed a game this book helped me understand a lot of things in a fun way.

How influential a book is often depends on the reader and where they were in their career when they read the book. I have to give a shout-out to Head First Design Patterns. Great book and the very creative way it's written should be used as an example for other tech book writers. I.e. it's written in order to facilitate learning and internalizing the concepts.

Head First Design Patterns

97 Things Every Programmer Should Know

alt text

This book pools together the collective experiences of some of the world's best programmers. It is a must read.

Extreme Programming Explained: Embrace Change by Kent Beck. While I don't advocate a hardcore XP-or-the-highway take on software development, I wish I had been introduced to the principles in this book much earlier in my career. Unit testing, refactoring, simplicity, continuous integration, cost/time/quality/scope - these changed the way I looked at development. Before Agile, it was all about the debugger and fear of change requests. After Agile, those demons did not loom as large.

One of my personal favorites is Hacker's Delight, because it was as much fun to read as it was educational.

I hope the second edition will be released soon!

You.Next(): Move Your Software Development Career to the Leadership Track ~ Michael C. Finley (Author), Honza Fedák (Author) link text

I've been arounda while, so most books that I have found influential don't necessarily apply today. I do believe it is universally important to understand the platform that you are developing for (both hardware and OS). I also think it's important to learn from other peoples mistakes. So two books I would recommend are:

Computing Calamities and In Search of Stupidity: Over Twenty Years of High Tech Marketing Disasters

Working Effectively with Legacy Code is a really amazing book that goes into great detail about how to properly unit test your code and what the true benefit of it is. It really opened my eyes.

Some of us just have a hard time with the softer aspects of UI design (myself especially). Are "back-end coders" doomed to only design business logic and data layers? Is there something we can do to retrain our brain to be more effective at designing pleasing and useful presentation layers?

Colleagues have recommended a few books me including The Design of Sites, Don't make me think and Why Software sucks , but I am wondering what others have done to remove their deficiencies in this area?

I try to keep in touch with design-specific websites and texts. I found also the excellent Robin Williams book The Non-Designer's Design Book to be very interesting in these studies.

I believe that design and usability is a very important part of software engineering and we should learn it more and stop giving excuses that we are not supposed to do design.

Everyone can be a designer once in a while, as also everyone can be a programmer.

Is there something we can do to retrain our brain to be more effective at designing pleasing and useful presentation layers?

Yes. Watch users trying to use your software and don't help them. Also known as usability testing.

The basic idea of usability testing is that you take someone with a similar background to your target audience, who hasn’t seen your software before and ask them to perform a typical series of tasks. Ideally they should try to speak out loud what they are thinking to give you more insight into their thought processes. You then watch what they do. Critically, you do not assist them, no matter how irresistible the urge. The results can be quite surprising and highly revealing. Usability testing can be very fancy with one way mirrors, video cameras etc, but that really isn’t necessary to get most of the benefits. There is a good description of how to carry out usability tests in Krug’s excellent book Don’t make me think: a common sense guide to web usability. Most of his advice is equally applicable to testing desktop applications.

I'll start by saying that I have similar deficiencies to those voiced by the question. Nevertheless, I think the only reason anyone would suck at doing anything is because:

  • They didn't understand it and had never studied theory of how and why to do it
  • They never practiced it enough to become an expert

So my advice is to first get the books and web pages you need that describe the subject and study them. Lots of good answers here on these, I would add Tog On Interface to the list. Also look at those UIs that are considered great like the Mac, IPhone and Google.

The second step is to just start creating UIs. This sounds easy, but if this is not part of your job description you may need to do this on your own time. Get involved in a web development project as the UI developer. Maybe its your own project or someone else's but getting good at creating web pages can give you the experience you need and should not be to hard to do. Good luck!

To improve just look around at existing sites. In addition to the books already suggested, you might like to have a look at Robin Williams's excellent book "The Non-designers Design Book" (sanitised Amazon link)

Have a look at what's possible in visual design by taking a look at the various submissions over at The Zen Garden as well.

UI design is definitely an art though, like pointers in C, some people get it and some people don't.

But at least we can have a chuckle at their attempts. BTW Thanks OK/Cancel for a funny comic and thanks Joel for putting it in your book "The Best Software Writing I" (sanitised Amazon link).

"good ui design" is actually two problems:

  1. getting the right design
  2. getting the design right

both are hard problems. in my experience the two things should be explored in parallel, as to not get ugly surprises late in the project ("why is our sexy drag&droping ultra-slow in IE8?? what do you mean it's not fixable???")

to get the right design you will have to explore posibilites. books can guide you towards trying out things that make most sense for your cicumstance - experience is even better, of course. also you absolutly need feedback from real users - how else would you find out that the design is already right? (you certainly can't tell.. read on!)

"getting the design right" then is the next problem, as it means the design you found appropriate must be implemented.

those "user experience / gui" things are so hard, because finding the right answer involves understanding what humans want - which they can't objectivly tell you and you on the other hand can't find out from "the outside". this means an (experience-) guided trial&error approach is the only way to go.


to more clearly answer your question:

why is good ui design so hard for some devels

for hardcore developers a big problem is, that their understanding of how the software works is so very different from how the users think it works (for example the URL "www.stackoverflow.com" should be written as "com.stackoverflow.com", if you know anything about how DNS works. but try selling a browser that expects URLs it like that :)).

as a sidenote: I would suggest you look into "experience design" rather then "user interface design", but that's another story.

What is your best practical user-friendly user-interface design or principle?

Please submit those practices that you find actually makes things really useful - no matter what - if it works for your users, share it!


Summary/Collation

Principles

  1. KISS.
  2. Be clear and specific in what an option will achieve: for example, use verbs that indicate the action that will follow on a choice (see: Impl. 1).
  3. Use obvious default actions appropriate to what the user needs/wants to achieve.
  4. Fit the appearance and behavior of the UI to the environment/process/audience: stand-alone application, web-page, portable, scientific analysis, flash-game, professionals/children, ...
  5. Reduce the learning curve of a new user.
  6. Rather than disabling or hiding options, consider giving a helpful message where the user can have alternatives, but only where those alternatives exist. If no alternatives are available, its better to disable the option - which visually then states that the option is not available - do not hide the unavailable options, rather explain in a mouse-over popup why it is disabled.
  7. Stay consistent and conform to practices, and placement of controls, as is implemented in widely-used successful applications.
  8. Lead the expectations of the user and let your program behave according to those expectations.
  9. Stick to the vocabulary and knowledge of the user and do not use programmer/implementation terminology.
  10. Follow basic design principles: contrast (obviousness), repetition (consistency), alignment (appearance), and proximity (grouping).

Implementation

  1. (See answer by paiNie) "Try to use verbs in your dialog boxes."
  2. Allow/implement undo and redo.

References

  1. Windows Vista User Experience Guidelines [http://msdn.microsoft.com/en-us/library/aa511258.aspx]
  2. Dutch websites - "Drempelvrij" guidelines [http://www.drempelvrij.nl/richtlijnen]
  3. Web Content Accessibility Guidelines (WCAG 1.0) [http://www.w3.org/TR/WCAG10/]
  4. Consistence [http://www.amazon.com/Design-Everyday-Things-Donald-Norman/dp/0385267746]
  5. Don't make me Think [http://www.amazon.com/Dont-Make-Me-Think-Usability/dp/0321344758/ref=pdbbssr_1?ie=UTF8&s=books&qid=1221726383&sr=8-1]
  6. Be powerful and simple [http://msdn.microsoft.com/en-us/library/aa511332.aspx]
  7. Gestalt design laws [http://www.squidoo.com/gestaltlaws]

I would recommend to get a good solid understanding of GUI design by reading the book The Design of Everyday Things. Although the main printable is a comment from Joel Spolsky: When the behavior of the application differs to what the user expects to happen then you have a problem with your graphical user interface.

The best example is, when somebody swaps around the OK and Cancel button on some web sites. The user expects the OK button to be on the left, and the Cancel button to be on the right. So in short, when the application behavior differs to what the user expects what to happen then you have a user interface design problem.

Although, the best advice, in no matter what design or design pattern you follow, is to keep the design and conventions consistent throughout the application.

If you're doing anything for the web, or any front-facing software application for that matter, you really owe it to yourself to read...

Don't make me think - Steve Krug

Try to use verbs in your dialog boxes.

It means use

alt text

instead of

alt text

I'm not a usability specialist, and I really don't care to be one.

I just want a small set of rules of thumb that I can follow while coding my User Interfaces so that my product has decent usability.

At first I thought that this question would be easy to answer "Use your common sense", but if it's so common among us developers we wouldn't, as a group, have a reputation for our horrible interfaces.

Any Suggestions?

Read Don't Make Me Think by Steve Krug. It is a great starting point, and an easy short read.

EDIT: This is mainly for web usability though, but it would still be a good read even if you are doing rich clients.

  • Don't make things work in a different way than your users are expecting (i.e. breaking the "back" button when using Ajax in web forms
  • Follow the K.I.S.S principal

Really, any rules someone posts will be a variation on the theme: Don't Make Your Users Think

"Don't Make Me Think" has already been posted, see also Design of Everyday Things and Designing with Web Standards which are also great for light usability reading.

I suggest to read these blog posts from the Enso creators.

Of course they repeat guides/ideas/advices from books such as
The Design of Everyday Things and About Face, but nevertheless, the posts contain quite a few insights and (IMO) they are a good read.

Where do you turn when creating user interface? I am a programmer, not a designer. Any ideas? My "UI" is usually terrible, as I just want to make it work, what do you do?

If you're writing desktop applications, simply following the UI guidelines for your chosen platform will take you a long way.

If it's on the web then you're broadly screwed, you just need a designer.

That said, don't get fooled into thinking that UI design is all about the the visual appearance. Having the right interaction model is probably more important. A graphic designer isn't going to help you with that. If you don't have access to a UI specialist then try starting with User Interface Design for Programmers.

Google User Experience and The laws of simplicity are very good starts.

I was always bad at design, but after reading a lot about usability, simplicity, design and starting to analyse google's design and other designs based on simplicity, my UIs started to suck less.

I usually do it all myself - just because my budget is quite limited.

However there are some books that might be worth reading:

And it's always a good thing to look what other sites do that you like :)

The best book I've ever read on Usability/Interaction Design, and one of the best books I've read period, is a book called About Face 3: The Essentials of Interaction Design by Alan Cooper.

It's a fantastic book because it talks about a lot of fundamental concepts behind interface design for any type of interface, not just on the web. Understanding these concepts will help you make better creative decisions, especially when designing something that hasn't been design yet (like a new product or type of social website), not just help you copy what's already been done.

I'm a C++/Java developer and have no idea about .Net or GUIs. I need to develop a windows app for 2000/XP/Vista/7.

I think I've come to conclusion that C# is the best and the fastest way to go (please correct me if I'm wrong). What do you recommend? Which GUI approach should I learn? (Forms? Any other stuff?)

Is it the best way to compile in .Net 2.0 mode? It's going to be an application for the public to download.

I would recommend learning Winforms first, then move the WPF. Winforms is easier to learn and get something working quickly. The future however is WPF, so I wouldnt leave that in the dark. I posted some good books and links for GUI development work.

Books

  • Design of Everyday Things A really good book about design of interfaces. It's not software specific but a must read for GUI designers.
  • Coding Horror. He recommends a lot of development books on his book list, but these ones are specifically interface-related:

Don't Make Me Think
About Face 3.0
The Inmates Are Running the Asylum
GUI Bloopers

Web Links

I'm going to make my monthly trip to the bookstore soon and I'm kind of interested in learning some user interface and/or design stuff - mostly web related, what are some good books I should look at? One that I've seen come up frequently in the past is Don't Make Me Think, which looks promising.

I'm aware of the fact that programmers often don't make great designers, and as such this is more of a potential hobby thing than a move to be a professional designer.

I'm also looking for any good web resources on this topic. I subscribed to Jakob Nielsen's Alertbox newsletter, for instance, although it seems to come only once a month or so.

Thanks!

Somewhat related questions:

http://stackoverflow.com/questions/75863/what-are-the-best-resources-for-designing-user-interfaces User Interface Design

This is not directly related to GUI design or programming, but The Psychology of Everyday Things is a good book to read.

It is a general look at how things are designed and how they fail. The concepts in this book, although not directly applicable to GUI's, do apply. In fact you could say they apply to all instances of user centered design.

http://www.amazon.com/Psychology-Everyday-Things-Donald-Norman/dp/0465067093

The design of everyday things ? An "old" classic, but useful if you plan anything that requires human interaction.

Although completely independent of web and programming, The Design of Everyday Things by Donald Norman taught me a lot!

For a less in-depth, more cook-book approach (if you don't want to think), try Robin Williams' The Non-Designer's Design Book: Design and Typographic Principles for the Visual Novice.

Presonally I much prefer The Design of Everyday Things.

"Don't Make Me Think" is great. After sitting in on several usability studies I can safely say that several of his biggest points are the kinds of things drilled in your head over and over.

Joel Spolsky's book on user interfaces is also decent.

http://www.amazon.com/User-Interface-Design-Programmers-Spolsky/dp/1893115941

For the last, hmm, 6 months I've been reading into Programming in C, I got myself K&Rv2, BEEJ's socket guide, Expert C programming, Linux Systems Programming, the ISO/IEC 9899:1999 specification (real, and not draft). After receiving them from Amazon, I got Linux installed, and got to it.

I'm done with K&R, about halfway through Expert C Programming, but still feel weak as a programmer, I'm sure it takes much more than 6 months of reading to become truly skilled, but my question is this:

I've done all the exercises in K&Rv2 (in chapter 1) and some in other chapters, most of which are generally really boring. How do I lift my skills, and become truly great? I've invested money, time and a general lifestyle for something I truly desire, but I'm not sure how exactly to achieve it.

Could someone explain to me, perhaps if I need to continuously code, what exactly I'm to code? I'm pretty sure, coding up hello world programs isn't going to teach me any more than I already know about anything.

A friend of mine said "read" (with emphasis on read) a man page a day, but reading is all I do, I want to do, but I'm not sure what! I'm interested in security, but I'm not sure as a novice what to code that would be considered enough.

Ah, I hope you don't delete this question :)

Thanks

Consider reading more content on the "concepts" of programming than purely syntax:

Join a mailing list/newsletter/magazine/podcasts for programmers in your area of expertise: http://www.drdobbs.com/cpp/;jsessionid=XVZEO0SKOCRRBQE1GHPCKH4ATMY32JVN

Visit StackOverflow.com and try to solve issues periodically to give yourself a mental challenge and help others.

I was wondering if it was ever ok not to have a submit button (Ok, Go or Search for example) near a search box in Web pages.

I know that hitting enter is much faster and that it will perform the search.

However, is it an accepted convention for the average non tech savvy user or only for the tech community?

For example, the search box here at stackoverflow doesn't have a submit button, but I don't think anyone is complaining (and I sure don't).

On the other hand, someone suggested using Google as an example: would people notice if the buttons were removed?

I just started reading Don't Make Me Think by Steve Krug and he mentions that every search box should have something that tells me I can click on it to launch the search.

Your thoughts?

Why you should have a button:

  • Not everyone knows they can hit enter, so you are leaving some less savvy people out in the cold.
  • Some devices like phones and consoles may not have a way to submit without a button. The PC based browser is still dominant but don't assume it is the only way people access your site.

You may not have a button if (both conditions must be satisfied):

  • Your audience is tech savvy (as on SO)
  • You provide a visual cue that the search box actually is a search box
    • By adding text inside it mentioning it should be used to search
    • By adding an icon inside the box

Generally I would think that hitting enter is a shortcut to submit rather than the primary means.

I'm current a computer science student with a minor in psychology. I have the programming down when it comes to software design, but not so much the design of UI. What are some good books/websites/blogs for learning design principles for user interfaces and/or websites?

The consummate book on UI design is Don't Make Me Think. Additionally, The Design of Everyday Things is enlightening though it is not specifically about UI design.

That said, my experience with UI design has been primarily focused on web applications. I have found the work by Dan Cederholm to be the most enlightening in designing excellent user interfaces for the web. One of the most important aspects of web design is ensuring semantically correct accessible sites and Cederholm does an excellent job describing how to do that in Web Standards Solutions which was followed by the also excellent Bulletproof Web Design.

Though the CSS Zen Garden may not be explicitly about UI design it is an outstanding example of what can be accomplished visually through CSS-based design.

Finally, an often overlooked part of UI design is delivering effective error messages. While, Defensive Design for the Web emphasizes web error design much of what is described is applicable to other mediums. Those responsible for the book 37Signals maintain an excellent blog Signal vs. Noise.

Designing Interfaces by Jenifer Tidwell is a good one.

A must read: Don't Make Me Think

Consider a single button.

At one extreme, we have a black OpenGL window, with:

  • outline (in white) of a rectangle
  • bitmap remdered font inside of it, saying "Ok"

At the other extreme, we have Mac OS X, a button that is:

  • well rounded
  • has some gradient showing light effects on it
  • nice antialiased "OK"
  • soft shadow of some sort

These two UIs present very very different user experiences. The former says "This is from the 80s" the latter says "this is professional".

This is something I do not understand well as a programmer (and don't know where to learn about this).

Does anyone know of a good technical resource for this? [I'd prefer things that draws upon psychology / perception literature to say why to do something rather than design books that just says "use color XYZ with a gradient of blah"]

You will want to read up on Human User Interface guidelines HIG and Usability:

Apple's Human Interface Guidelines

Windows User Experience Guidelines

Platform agnostic guidelines

Amazon has plenty of books on the HIG subject, but I'd also recommend books based on usability. Steve Krug's "Don't make me think" is a great book (mainly tailored for web usability) etc.

alt text

A classic: The Design of Everyday Things

Pretty quick read, discussed some of the psychology behind using and understanding human interfaces. It's a bit dated and doesn't directly focus on programming GUIs but I would start here.

I just finished what I would call a small django project and pretty soon it's going live. It's only 6 models but a fairly complex view layer and a lot of records saving and retrieving.

Of course, forgetting the obvious huge amount of bugs that will, probably, fill my inbox to the top, what would it be the next step towards a website with best performance. What could be tweaked?

I'm using jmeter a lot recently and feel confident that I have a good baseline for future performance comparisons, but the thing is: I'm not sure what is the best start, since I'm a greedy bastard that wants to work the least possible and gather the best results.

For instance, should I try an approach towards infrastructure, like a distributed database, or should I go with the code itself and in that case, is there something that specifically results in better performance? In your experience, whats pays off more?

As a personal contribution: I sometimes have the impression that some operations, when done through django's signals, are faster then the usual view way. But hey, I'm biased. I freaking loooove signals. :)

Personal anecdotes like mine, are welcome as a way to stimulate some research, but some fact based opinions are much more appreciated. :)

Thanks very much.

Now what?

Deploy. If you have an MVP that is.

Other thoughts:

  1. You didn't mention anything about testing. Do you have unit tests? Do you feel that the test coverage is adequate? I'd recommend reading Karen M. Tracey's book Django 1.1 Testing and Debugging.
  2. Have you watched Jacob Kaplan-Moss's Deployment Workshop?
  3. Have you done any usability testing? You can check out Joel Test article by Joel Spolsky, or you can read Rocket Surgery Made Easy or Don't Make Me Think both by Steve Krug.
  4. Speaking of Spolsky, how does your process rank on the Joel Test?

I know that your question was slanted toward performance, and it may seem that my thoughts aren't performance related. However, thinking about some of these seemingly unrelated items may lead you in a direction that will impact performance. For instance, usability testing may reveal that a certain feature could be reduced in scope yielding better performance due to less data being delivered to the end-user.

Back in college, only the use of pseudo code was evangelized more than OOP in my curriculum. Just like commenting (and other preached 'best practices'), I found that in crunch time psuedocode was often neglected. So my question is...who actually uses it a lot of the time? Or do you only use it when an algorithm is really hard to conceptualize entirely in your head? I'm interested in responses from everyone: wet-behind-the-ears junior developers to grizzled vets who were around back in the punch card days.

As for me personally, I mostly only use it for the difficult stuff.

Steve McConnel's Code Complete, in its chapter 9, "The Pseudocode Programming Process" proposes an interesting approach: when writing a function longer than a few lines, use simple pseudocode (in the form of comments) to outline what the function/procedure needs to do before writing the actual code that does it. The pseudocode comments can then become actual comments in the body of the function.

I tend to use this for any function that does more than what can be quickly understood by looking at a screenful (max) of code. It works specially well if you are already used to separate your function body in code "paragraphs" - units of semantically related code separated by a blank line. Then the "pseudocode comments" work like "headers" to these paragraphs.

PS: Some people may argue that "you shouldn't comment what, but why, and only when it's not trivial to understand for a reader who knows the language in question better then you". I generally agree with this, but I do make an exception for the PPP. The criteria for the presence and form of a comment shouldn't be set in stone, but ultimately governed by wise, well-thought application of common sense anyway. If you find yourself refusing to try out a slight bent to a subjective "rule" just for the sake of it, you might need to step back and realize if you're not facing it critically enough.

When designing a good Web GUI what expectations can we expect from an end user?

I've come up with the following, but I wonder if there are any others which can suggest..

  • If I click on a hyperlink it will take me to another page/part of this page
  • If I tick/untick a checkbox it might alter the page state (enable/disable elements)
  • If I click on a button I expect it to do something to data.
  • If I click on a button I expect something to happen immediately (either to the current page, or for me to be taken to another page)
  • If I have clicked on a hyperlink and it has taken me to another page, I expect to be able to use the Back button to get back to the previous page in a state similar to that which I left it in
  • If I change something in a form, I can change it back to its previous value if necessary
  • Unless I click on the 'Submit' button nothing should happen to my data.
  • If I bookmark/favourite a page then it should show the same related data each time I visit it
  • If text is underlined and looks like a link, it should be a link and act as one

The reasoning behind this question is more a 'UI from hell' one. For example I have come across pages which checking a tickbox next to a record will delete it, straight away, via ajax. To me that just seems wrong, a checkbox is a toggle - something which a delete operation definitely isn't!

There are fundamental principles of UI design embedded in this question. I strongly recommend everyone who touches on UI design should read, at a minimum, our very own Joel's "Controlling Your Environment Makes You Happy", an article that I read some years ago that has stuck with me and is still as relevant today as it was the day it was written.

I also recommend the book "Don't Make Me Think!" as an excellent resource on the principles of good UI design, particularly on the power and importance of convention.

Your list is all about conventions.

Several comments:

  • The Back button has always been (and will probably always be as long as the Web exists) controversial. There are security and usability reasons to disable it's use. Double-submit might be an annoyance on a forum but it can be a costly error with an order to buy shares. This can be handled with other techniques (eg POST+REDIRECT+GET or overwriting the browser history) but the point remains: Back button behaviour is not always desirable let alone required;
  • Bookmarking a page and expecting the results has some merit (eg if I bookmark a quote for GOOG then I should go back there and get a current quote, not the quote I saw at the time I bookmarked, obviously) but a page result can also be costly so this may not always be appropriate.

I'll add a couple:

  • If I can click on it and it's not a button then the cursor should change to a hand when my mouse is over it;
  • Conversely, if the cursor changes to a hand, I shold be able to click on it and it'll do something; and
  • If there's a box containing some text that has a border and it looks like a text element on a form, then I should be able to type in it unless it indicates that it is "read-only" or "disabled" (eg by greying it out).

How can I make an Application look nice and not like an amateur pulled it together?

I mean graphic-wise.

Is there some sort of book you can read regarding beautiful program layouts, etc?

I put this in Community Wiki so please feel free to leave your opinions that way we can all learn. :D

Edit: Oh my god. I completely forgot to mention what kind of program. I mean desktop applications. Not web applications. :D

Three things:

  1. Hire a designers that knows the business models and customers; unless you are good at it yourself

  2. To help you provide meaningful feedback to the designer, read a book like I like Don't Make Me Think: A Common Sense Approach to Web Usability, 2nd Edition by Steve Krug

  3. Study many good Apps that have had success in the business of interest to you. Be inspired (aka copy) good ideas from them and mix in your own ideas. A prime example is how Google search "inspired" Microsoft's Bing

I need some good links which will teach more about User Interface for Android. UI is very important as users prefer good Ui apps. I already have knowledge about the basic UI designing in Android. But i want to make it more attractive. Help me guys. Thnx in advance

I'd say if you know the mechanics of making a UI in Android, what you need is a guid to making a good UI in general. Here are some recommended books for that.

Robin Williams' The Non-Designers Design Book (great for learning about layout, grouping, typography).

Steve Krug's Don't Make Me Think Yes I know it mentions the web specifically, but a lot of the concepts apply to any UI

Jennifer Tidwell's Designing Interfaces Good collection of common UI Patterns (also see the companion website.

Robert Reimann's About Face if you don't pick up any other book on UI design, get this one.

I'm looking to find any articles/books on usability. I'd like to get a handle on best practices when designing a UI, this can be anything from which user controls are more intuitive to a new user, to how to phrase text that is displayed to the user to avoid confusing dialogs. I mainly do Windows desktop applications, but most usability standards, I assume, would stand true regardless of the platform.

As an example, here's an MSDN article about the Windows User Experience Guidelines: http://msdn.microsoft.com/en-us/library/aa511258.aspx

The Design of Everyday Things by Donald A. Norman is a standard book on general usability considerations that can be applied to just about everything in day-to-day life. It's not specifically about software, but it's worth it to read it.

Universal Principles of Design is a recommended textbook for my university's Engineering Methods of Software Usability course. Myself, and others who have taken this course, have found this book to be more useful than the required textbook. There appears to be an updated version, called Universal Principles of Design, Revised and Updated: 125 Ways to Enhance Usability, Influence Perception, Increase Appeal, Make Better Design Decisions, and Teach through Design, but I can't speak about that one.

Designing Visual Interfaces by Mullet and Sano provides a great foundation for different layout-related issues. Not a book on usability per se but still relevant, I'd say.

As for web resources, try:

For book inspiration, see Suggested Readings in Human-Computer Interaction (HCI), User Interface (UI) Development, & Human Factors (HF) (and all the great answers in this thread).

Well, a long-standing favorite specifically for user interface design is Alan Cooper's About Face. It should touch most important topics when designing Windows desktop applications.

Then there are also various UX patterns which are well-presented in Quince (needs Silverlight).

Jef Raskin's The Humane Interface is also rather good, but very radical in his ideas. Still, this book points out many fallacies in modern UI design. If you need to stick to the WIMP world, then following his suggestions might be a little hard as he tends to suggest to overthrow everything we're used to. But well-written and good for provoking thoughts, even if you don't follow all his advice.

As for books/articles on usability in general or on slightly different topics:

  • Jakob Nielsen's website useit.com. While not particularly fancy-designed it is a trove of thoughts and advice on usability in general.
  • Steve Krug's Don't Make Me Think. Web usability, but also a very good read.
  • Donald Norman's The Design of Everyday Things. Usability in general and has many pointers on how to think about usability without going into specific technologies. It's applicable to desktop application usability anyway, though.

Try reading this book: Don't Make Me Think. While it's focused on web usability it is applicable to all facets of UI design.

To start with some context, I'm so annoyed whenever I get on a Windows computer that has the settings adjusted for "best appearance" over "best performance" that I instinctively turn off all fades, transitions, animations, etc. immediately. I almost can't focus until it's changed.

However, when it comes to my web apps, I will very occasionally throw in some "eye candy" - maybe a slight transition because the instant transition seems distracting or too abrupt.

I feel like a hypocrite though. I never opt for a slower UI on a desktop machine, and when I change desktop settings for family, friends, and clients, no one EVER asks to switch back to the old, slower way.

So am I biased or are there some legitimate rules of thumb for when it is actually appropriate?

In my current dilemma, I'm using a Javascript paginator with a fade in to show the next page's worth of content over 0.75 sec because if I do not do it, the change causes a tiny flicker (distracting to me), but maybe if I was in the user chair, I would be screaming, "just show me the page already!"

Thoughts? Anyone read any good books on this stuff?

Edit: I should mention that in my current example, the next page is almost always ready to be displayed instantly if I so desired. I prefetch the next page while the user is on the current page. That's one aspect of what makes something like this "eye candy" to me. I could do it faster with almost no difference to the user.

2nd Edit: Thanks for all the suggestions and considerations. There are several books that I'm looking forward to reading. I marked the ui-patterns website as the answer because it will be the most immediately useful for this type of problem. Also no one mentioned the YUI design pattern library, but I came across it later. It's an excellent resource and even addresses this issue. Also, I definitely intend to seek user input when I'm at that stage for this particular example.

Lastly, I understand that my initial reasoning about it didn't take into account my familiarity with windows vs my app. Since I'm so used to the Windows desktop, I now just want to get things done. Maybe way back when I first used xp, those transitions where helpful for a day or two. (I don't remember that being the case but maybe.) Probably the same will be true for my transitions in my web app if it's used often enough. Soon I (and my users) will be tired of any eye candy that I add even if it is very brief. I'll see and ask.

Thanks, everyone!

There is no easy answer The Design of Everyday Things is a good place to start looking into simplistic design. Sites like SO that have a "clean" look with a little extra flash (figurative not the adobe kind) seem to fair the best.

Exactly not MSDN is a good place to start...

Update - As pointed out by John in the comments the low bandwidth view of MSDN is actually pretty nice. Good call John Weldon I had never looked at it before (and likely never would have). Thanks!

After checking out some of the other books mentioned here on amazon, I also came across "Don't Make Me Think". While I haven't read the book, I read many reviews and excerpts and it looks very good, so I'm adding it to the list.

I am interesting in creating a better User Experience (UX). There are a lot of books out there, what are some that would be useful to a software engineer?

I would also recommend The Humane Interface: New Directions for Designing Interactive Systems by Jef Raskin. Has some really inspiring ideas.

My favorites:

At some point in your career, you may enjoy this wonderful book that draws parallels across multiple fields of design. (For example, the "confirmation" technique occurs both in software design and nuclear launch control.)

I'm a programmer (hobbyist, but looking to make it a career) by nature so when I was asked to design a website I felt a little out of place (most of my applications don't have pretty UI's, they just work because I'm the only one using them). I have been looking into how I could design my website and started wondering how you guys decide.

What guidelines can you guys give me? What should I consider before I start coding?

It's pretty hard to sum up the whole field of UI design in an answer.

Make the most common tasks the easiest. Figure out what people will want to do, and make that as intuitive and straightforward as possible. Don't make them think.

Make mockups and prototypes. Watch people try to use them (watch, don't help them), and fix things that they found awkward. Your first attempt at a design isn't right, don't be too opposed to throwing it away.

There's really so much to this field that it can't be explained to anyone easily. Designing is no less complex than programming, but many programmers seem to look at it as an afterthought for some reason. Try some creative googling for design principles, especially as they apply to the web. Look at sites you consider well-designed and try to figure out why they feel that way to you.

I have been developing a new online game for the past year now. The site has recently gone to beta testing and I am looking to go gold later this fall. I have heard from some people that they are confused when they first signed up, and it gave me the idea to hold a focus group of various types of people (such as gamers and non-gamers). I am not sure how I should go about setting up a focus group or how to get people to do it.

I got to a university, so I figure I have that on my side. Should I get people in person to do it, or is this something I could do online? I was sort of leaning towards the in-person thing. I imagine having 15-20 people of various experience with online games signing up for the first time and telling me what they like, don't like, and what they don't understand for about an hour. Do I need to pay people, or..?

Just wondering if anyone has ever done this, I'm not too sure how common it is for websites, but I am very serious about making this site as perfect as possible for the widest range of users.

First, a semantic (but important) quibble: You do want to do "usability testing" not a "focus group." Focus groups are for researching markets and discovering subjective tastes in a target group of people. You're not interested in opinions, you're interested in facts, most importantly "what makes my signup process difficult"

jms mentioned hallway testing and that's a great place to start. I doubt you'll need to even get to the point where you need to do more formal testing (eg, video cameras, screen recording software, formal script) but that avenue definitely exists.

Steve Krug's book "Don't Make Me Think" (Amazon) has a great chapter (ch 9) on how to do testing. There should be plenty of resources online. The key term you're googling for is going to be "usability testing" along with "informal" or "hallway"

The specific questions from your post:

  • "Should I do it in person": Yes, absolutely.

  • "I imagine having 15-20 people ... ": You probably don't need this many people. Most usability issues are uncovered with 5-10 people. You can get away with as few as 3 if you notice the first 3 people all encountering the same issues.

  • "Do I need to pay people?": Maybe. If you can afford to, its a good idea. It makes things feel more professional, and encourages people to actually show up :) For informal testing though, it isn't required.

The basic idea is that you are observing (not interviewing) people in order to find specific, factual, actionable issues (not necessarily subjective feelings) with your interface. To that end:

  • Figure out what task (focus on tasks and goals, not just "screens") you want the users to perform.

  • Tell your users, in plain english, without leading, what do to. For example "Ok, so you've decided you want to play this game, can you please do whatever you feel you need to do to start playing." If people aren't understanding that they need to create an account, don't tell them "Ok, create an account!" Don't have tasks like "ok so now click the create account button" - that button might not be obvious. Again, focus on goals not actions

  • Don't tell the users what do to, don't take control of the computer. Your goal is to be as invisible as possible. If the user asks you a question, a good response is "Pretend you're at home and I'm not here. Only let me know when you're so frustrated with the software that you would pick up a phone to call support.

  • You're not conducting a scientific experiment. Its perfectly acceptable if each user does different things, or if the environment isn't controlled. All you care about is collecting pieces of the puzzle.

  • It doesn't really matter who you test with, as long as they're not familiar with your product.

  • Once you think you've found enough "blocking" issues, stop testing and fix the issues. Repeated testing after you have a problem is only going to uncover the same problem over and over. Instead, fix and then re-test. Its better to do more rounds of testing with fewer people than one big test with lots and lots of people.

  • You do not need people to "talk aloud" and explain their every action. Just watch what they're doing. If you're confused about WHY they did something, stop and ask them if you think they won't remember why later. You can integrate these questions into a "test script"

  • Always debrief after the test. Keep in mind that people will generally rate things more favorably than they actually were (both to be nice to you, and because people remember successes and forget failures).

  • Remind people that you're testing the software, not them. Be patient and polite, especially in hallway testing where you're not paying them. If you recruit people in advance, you should probably pay them. If you use cash (don't bother with checks), have receipts prepared. Gift cards for a local retailer (jamba juice, starbucks, etc works well). At this point you'll also want a quick participant agreement form. Professional firms pay anywhere from $75-200 (and more, for specialists like doctors) per hour for testing but you can get away with less if you're just meeting people in a library meeting room.

If, after you've done all this you realize you need a larger scale study, you can look at hiring specific firms to do it - it is, however, pretty expensive ($5000 minimum for a competent firm I'd guess). Again, chapter 9 of "Don't Make Me think"

I'm trying to get some ideas about how to develop a web login screen. I'm using DynamicData Webforms, so most of powerful frameworks offers a lot of options, but I'll be very grateful to read your suggestions.

Thanks in advance

Edited: beyond the functionality, I'll want to read your view-point about the presentation model, i said, im using fx3.5 so improve more than 2 textbox for a single login or using the login aspx control, i have in mind use silverlight but is possible to "light my webapp" that is build in webforms and dynamicdata with out change all the presentation layer?

More Undestandable: Example of using Extjs as Presentation Framework for View Layer, but my project is webforms so this will be nice for MVC.net i said cause is more flexible in json concerns

alt text

the trick is make it as minimal as possible learn from google UI

This book is great book for UI design does not take your much of time to read Dont make me think

Let's say I have the following Python code:

if conditionOne():
    if conditionTwo():
        foo = bar
        foo += 1
        bar -= 2

If I later remove conditionTwo, I would like to dedent the three lines of the block so it looks consistent with all my other code. Normally I'd just reach for =% (my primary language is C++), but that won't work here, so I tried 3== on the first line of the block. That led to this:

if conditionOne():
    foo = bar
        foo += 1
        bar -= 2

That's not what I was looking for. I could have gone with 3<< and gotten a better result, but that's not a command I normally use. I'd rather not have to remember special indentation commands just for Python. In the spirit of Don't Make Me Think, is there a way to make the = filters work with Python code as I expect?

Whereas in C or C++ indenting a program does not affect its behaviour, in Python it could really, since indentation is part of the flow control.

Therefore in Python a program with a different indentation will have a different behaviour and for an editor it is impossible to guess whether the developer wanted to indent a line (in an inner scope) or not.

Hence auto-indenting features of your editor are designed to work with C-like languages, not Python.

What would be my best option for a minor? Graphic Design?....

I'm also majoring in CS and I've specialized in UI design. Maybe your CS university did not have courses about UI design? (And graphic design is not the same as UI design - the former is about how the program should look like, the latter is about what the program should do.)

Here are some books that I would recommend you to read, if you want to get more into UI design. In alphabetical order:

The course that I went to was mostly based on the User Interface Design: A Software Engineering Perspective book. I have not yet read the book itself, I've just skimmed through it, but it seems like a good book to start learning UI design. Also all the other books are good. Then when you have read some theory from the books, you just need to practice UI design until you develop a sense for good and bad usability, and get some training in requirements gathering and usability testing methods.

Live Example

HTML5 <menu> element

HTML5:

<menu type="list">
  <li><a href="/signup/"> Sign Up </a></li>
  <li><a href="/login/"> Log In </a></li>
</menu>

I want to add a signup / login menu to my website.

  • Would using <menu> be semantic?
  • Should I use <ul> instead?

Edit: I'm using semantic HTML5. Browser support is irrelevant.

As I'm sure you're aware:

The menu element represents a list of commands.

It really just depends on how you define "list" and "commands." Are "Login" and "Sign up" commands? Or are they list items? Personally I think they're commands. A list (ul or ol) is more akin to something longer, two items just don't seem to make a list, to me. Login and Sign up seem like commands because they're what Stephen Krug, in Don't Make Me Think calls "Utilities":

Utilities are links to important elements of the site that aren't really part of the content hierarchy.

These are contrasted with what he calls "Sections":

links to the main sections of the site: the top level of the site's hierarchy [navigation]

This makes sense semantically: You use <nav> for Krug's "sections" (navigation) and <menu> for utilities or commands (Log in, Sign Up, Search, etc.)

Does anyone have recommendations/experience of how to find people willing to do usability testing of web based apps? I suspect I may need people who might actually be potential users, because mine is a commercial/vertical app which contains some processes and terminology which may not mean much to the average joe/jane.

I have a fairly robust prototype of a web app which is designed for people in Sales Management and before I go too much further with it I want to try a couple of key pieces out on some live users. I have a few friendly faces I can turn to (and have already), but I really want strangers who will not feel they need to be nice to me about it.

I'm fine designing the usability tests themselves, it is finding the guinea-pigs that is proving difficult.

Don't Make Me Think has the exact chapter you would be interested in. Basically, you should set up your test in such a way that it's not about being nice or not, but it's about finding out whether the user can use it or not. This way you can use all your relatives or friends you want and know.

In a nutshell: set up a desk with a computer that has access to your app, get two chairs, a notepad and a pencil. The book mentions a video link to your co-workers, but let's skip that. You get your tester and place her in front of the computer, while you sit beside her with notepad and pencil at the ready. Be specific about that for the sake of this test, it's technically impossible that she would do something wrong, because that's what you are interested in.

Ask her then to do some specific tasks; You present her with some kind of state in the application, and ask her to do something. Example: "If you would want to do a new entry, how would you go about doing it". Ask her to describe what she's thinking, her train of thought; "I would seek for some kind of 'add' or '+' labeled button, let's see if I can find it. They're usually underneath the lists", etc. Make notes of the subtleties of her gestures and faces, like if she hunts with the cursor for something, or if she's grimacing in frustration.

If she can't find that add button quickly enough, there's a usability problem.

But really, buy the book. It's a great read, worth every penny.

I was just reading the "Open Letter to Joel and Jeff" and I noticed the dates on the comments are relative to when the blog entry was posted. So that means the first entry will always stay as "12 minutes later" and the next will always be "14 minutes later".

From a usability standpoint, does it make more sense to list out times relative to now, or to when the main action occurred?

Upon first seeing this I thought it was a little confusing (I think because I wasn't expecting this), but it very quickly grew on me.

As Steve Krug recommends in Don't Make Me Think, get rid of the question marks that pop in the user's head when they come to your site. If it is confusing it isn't likely to be helpful.

Although an interesting concept, in this context I think it is more confusing than useful. If I see "answered 18 mins ago" and "answered 17 mins ago" I have a perfect frame of reference. Also this is something I see on many other sites so it does not require me to learn anything new.

On the other hand if I see two comments that contain "5 mins later" and "6 mins later" I don't have a clear frame of reference. The first might be after the original question, but the other? Is it 6 minutes after that previous comment? Or 6 minutes after the original question, thus one minute after the other comment? Finally, this isn't what you typically see on a site so there will be a moment of "huh?" follow by either "wtf?" or "cool!". Not a reaction that should be left to chance.

When you to develop web applications from scratch, what are the skills needed, to produce usable and interaction-rich products?

  • Do you do UI Prototype first?
  • Do you use User Stories?
  • Some agile methodology or best practice you'd recommend or actively advocate?

In short: What skills make you transcend from requirements gathering to AmazingWebApp™?

Finally: Any books you'd recommend?

the guys here are giving excellent tips.

there is a distinction between 'visually pretty' and 'functional' (or ease of use). you can actually have one without the other. this forum is a good example, it has very high usability but frankly is butt-ugly - sorry stacks, i still love you though :)

the reality is you need skill to make good interfaces. this comes with years of practice. i am commonly contracted to come in and design the entire UI for a new app. i rarely see programmers or graphic designers with these kinds of skills (its a narrow market). i found at uni i had a natural acumen for HCI, UI design and usability analysis. i developed these skills further by doing a lot of reading and picking up experience by doing a lot o f ui design. so, all im saying is, get ready for some hard work if you are serious about becoming good at ui design. you can do anything you set your mind to, but if you are spending time studying ui design, that means you arent spending time learning agile with ruby on rails, or whatever the trendiest technology is.

a few general tips:

  • if you are building web software apps (as opposed to small business presence websites), then lo-fi prototyping is excellent. get a group of people together, a stack of butchers paper and colored markers, and you will be amazed at how many screens you can sketch out in a few days.

  • your software should be self-apparent. your software shouldnt need a user manual. the CMS i developed has no user manual, i have a few dozen customers that use it and none of them have ever asked me for a manual.

  • watch what the 'big boys do'. if ebay has their search box like this: '[......] (Search)' then do yours like that too (rather than the non-standard but ok: 'Search: [......] (Go)'.). this is known as affordance. you are using peoples familiarity with other systems to give them a kick-start on how your own system works.

i would recommend this book:

i also have a few blog articles which should help:

As a front-end developer, I would like to develop nice and good usability web applications. However, normally developers are good at coding. So, I would ask how to get started with learning some UI design knowledge? What's your recommended books or courses for a newbie to learn? Basically for graphic design, fonts and colors etc etc.

  1. Build on the shoulders of those who have gone before. To be a great developer, you have to know your stuff. In the same way, to be a good designer requires understanding of some basic foundational guidelines. Some of it may seem pretty simple and tedious, but understanding the proper principles of typography, color theory, grid systems and so on can help you a lot. A few resources to get you going are:

    That list should generate it's own follow-on books / websites reading list for you.

  2. Ask questions. Find some designers you really like and ask questions. Try to understand why they made the decisions they did. Most people are pretty willing to talk about their own work. Asking questions helps you to understand why designers use (or don't use) certain design principles in their work.

  3. Actually design (and seek out constructive criticism.) Like anything you do in life, reading and learning can only take you so far. At some point, you have to start practicing. Find a small circle / community of more senior designers who can review your designers and give you some brutal, but constructive criticism. Your stuff will suck at first. Everyone's work does. Designers spend hours upon hours honing their talents and skills. Don't get discouraged by it. Just like anything you can gain mastery in, it takes time. Having people in your life who can give constructive feedback is a huge help.

Good morning everyone,

I hope I'm not posting this in the wrong place; I've been programming web projects, mostly in MVC and ASP.NET for consulting companies, but I always pick-up unfinished projects, so I gotta say, my experience in web development isn't as good as I'd like it to be. To improve my experience, I decided to accept building a project for a veterinarian clinic and I'm going to build the project in MVC. There are a few things I'd like to know to make my project well structured and to avoid feeling lost in the process because I don't have as much time to research as I'd like to. So the main questions I'd like to ask are:

  • When beginning a new project, where should I begin? Making the stylesheets? Should I go straight for the code? If I make some planning, how should I go about it then?

  • When building up the Media folder in my project, if I decide I'll use
    jQuery and the like, what files
    should I really get? What's the best way to implement jQuery in a MVC
    project without having to mention it in every page?

  • To make a sort of planning for
    myself, complete with deadlines I
    have to respect, what structure
    should I use?

  • Well, I'm not good at designing at
    all, and I often have to rely on
    other people's CSS to make things
    look decent, so how could I use this project to improve that and still
    make it look good?

I hope we can all share some experience in the matter at hand and make this topic help others who might be feeling the same weaknesses as I do.

When you start building your code I suggest you start with register, login and authentication. After that: Internationalization and localization (see: http://en.wikipedia.org/wiki/Internationalization_and_localization)

Then create your CRUD's and so on..

EDIT: Some other resources you might wanna have a look at:

Good luck!!

I definitely appreciate a good interface and as a developer, I try to create them for my users. But appreciating a good interface and designing one are a different thing. I'm looking for good interfaces (such as IMHO StackOverflow, Gmail) as examples of good UI from which I can model my own UI's.

You should get yourself a copy of both Don't Make Me Think and The Non-Designer's Design Book for your base knowledge/insight.

From there, it's much easier for you to dissect and analyze the layouts you already know and like, and recreate them for your own amusement.

edit: To mitigate misunderstanding, the point I'm trying to make is that you probably don't need as many good examples of nice layouts, if you know what to look for. For example, I can be shown a thousand haute couture dresses, and I still couldn't make one myself, because I don't know what to look for.

I'm also interested in more general thoughts, but here is my specific problem. In an ASP.NET web app, I am connecting to a 3rd-party via API. The 3rd-party requires that the user login and answer a few configuration questions to set this up. All of the questions except one the user can just choose the default. On one question if the user chooses the default option, my app won't work with the 3rd-party. It is a limitation of their API. It is on their list to fix, but who knows when or if they actually will?

So what is the most effective way to give the user instructions in my app that they will follow once they go to this other site? Right now I have a screenshot with the option circled in red, follow by some descriptive text. What other techniques have you used in a similar situation?

Red text is the default mechanic in UI design to indicate importance (which is why it's used for errors so often).

Asterisks are the default choice for indicating required input.

Avoid flashing, and other garish-looking visual mechanics.

If this extends beyond a one-time inquiry, you should look at reading some good GUI books, like Don't Make Me Think: A Common Sense Approach to Web Usability and Designing Web Usability, both seminal books in the field.

I'm wondering about "fancy GUIes" are made.

When I say that, I have in mind softwares like iTunes, Picasa, Skype, Songbird, Spotify, Vlc (themed) ... everything that breaks with standard GUI

in which languages? what frameworks/tools are used?

Nothing beats a great design... Must likely all those applications are coded with very different frameworks. I mean, They all look different... good but different.

I don't think this fanciness has anything to do with the framework used but with the creative people behind the UI's design.

If you aim to develop great UIs forget about the framework and look for Design Tips. This, this and this books should help you with that. Please note that some of these books aim for Web Developing... but they can teach you very basics of UI designs.

I want to design a website but I don't know from where to start.

Is there a beginners' guide to start with?

I started with http://w3schools.com. Make sure you're using Firefox and the Firebug addon. Get your hands dirty then get familiar with the web design community.

I have CSS Mastery by Andy Budd on my desk and it's a good, readable, short, yet deep guide to CSS.

Don't Make me think has also become my mantra of web design.

Overall, you're going to produce a lot of crap--as I have--before you get good. If you have someone to look over what you're doing that'll be the best help. Personal drive will matter the most in the long run though, so stick with it and keep learning.

So, another teaching question. I'm teaching this course in web development and the school i'm with has a recommended text that we should use but i feel that most of the stuff is pretty surface level for the "principles of web design" area, eg, these are the topics:

  • Browsers
  • Platforms
  • Standards
  • Monitor Resolution
  • Connection speed and methods and Audiences

Do you think this is sufficient to introduce web design concepts?

I would add "usability" as topic. I recommend a book by Steve Krug

Don't Make Me Think
A Common Sense Approach to Web Usability

Usability design is one of the most important - yet often least attractive - tasks for a Web developer. In Don't Make Me Think, author Steve Krug lightens up the subject with good humor and excellent, to-the-point examples.

Another excellent resource is Nathan Bower's UX Hero blog about User Experience Design.

hi i am very bad at user interface design and flow of program in terms of user places of widgets and buttons ,please suggest me how to take better user interface decision for this what can i do ?

regards

rahul

Read the book Don't make me think by Steve Krug

I have seen tons of jquery/css/js tooltip solutions out there but I need one which will act as a tutorial when a user lands on my site.

e.g. When they log in for the first time a tooltip will show next to e.g. content area 1, then have a link ("Next" or something) in the tooltip which closes that one then spawns another at content area 2 and so on... but also with the ability to stop the tooltips.

Does this type of thing exist? Can it be done?

And would I store this in a cookie so as to only show it once?

Many thanks

Actually I don't know what the site are you develop, but if there are a lot of tutorial when a user land your site, this will be a very tedious and annoy user experience. The best way to show the next step is make the site intuitive and no thinking about the "next step". There was a book talking about it and may help you Don't Make Me Think.

I'm weak enough in art,so this kind of books will really help me lot,if there is.

I think most of us have seen the following: Form

I'm currently tasked with converting an existing winform app into a web application. The current system is like the "Your company's app" and it would be nice if I can trim it down and make it more use friendly, sleek and usable.

Can anyone recommend any good books, blogs, tutorials etc and UI design, specifically for web forms.

Thanks

I recommend Don't Make Me Think and anything else by Steve Krug.

I recommend Web Form Design: Filling in the blanks. Great form analysis and best practices for web form design.

Say for instance I'm going to do some seat of my pants coding adding a feature to an enterprise app. What are some good examples/tenants/cardinal rules a person can follow for making a fairly complex setup/config screen not look like feet.

What I'm looking for is along the lines of "Don't put one thing in a group box". But I'd also like some help with symmetry if anyone knows what layouts are most likely to achieve a relative amount of good looks that would be helpful.

You might be interested in the book "Don't Make Me Think," (author's web site) or "About Face 3.0". Both come highly recommended for reading about how to design interfaces.

There are firms which critique sites from the stand point of user experience and usability. They cost thousands. I am cheap and have little money for that! :)

I would like to get critiques from volunteer web designers who know a thing or two about good online experience and good web design.

Any online resources like forums where people look at your site upon request and give good genuine opinions without concentrating on the html which was used. (meaning losing the big picture and focusing on technical details. I don't want that).

A place where "Don't Make Me Think" enthusiasts gather online, if such a place exists! (I will ask the author!)

FeedbackArmy will give you 10 responses for $10. I haven't tried them myself, but I've heard good things about them.

Well i am currently working on a project doing some UI mockups when certain users wanted to have two logo on the top left ot the website. One is to indicate what is the website about then another is to indicate that this website is actually belong to this particular sector.

I thought that UI design wise this is very bad because two logos on top left. If users go in initially he won't be able to know which logo means what.

What are your opinions regarding this?

It does sound rather confusing, though it may depend on the content of the logos as to whether they are difficult to figure out.

I would recommend getting someone who hasn't used the site to see the mockup and see what they think about it (without guidance)... ie some usability testing.

Check out Don't Make Me Think by Steve Krug... you will want to do some tests right away after you read that, and he goes into detail about what to do when you get pulled in the wrong direction by people who don't really understand the consequences of the decision.

I am designing a page, with tiny portlets. Now, I personally like my actions on the right side, yet I wonder if there are methodologies that are targeted about usability. After all, most applications are aimed at the user. What about yourself? Do you prefer information to be on top, on the left or on the right? I've you need to take some sort of action, do you prefer buttons on the left?

References to good books and webpages are very welcome!

I think it depends a lot on content and the kind of actions the user is meant to do on the page. On a magazine-style webpage/blog, I'm more likely to look at the sidebars than on a content page, where I focus on the article text/images and ignore the sidebars.

I'm used to seeing these things on the right, so having them on the left would make me notice them more, but they might be more annoying, so it's not a great thing.

Buttons should be big enough that I don't accidentally click on a link or another button trying to click on the button. Not sure about the placement, though. Depends on the portlet layout, I think.

As for books, I know of Don't Make Me Think which is about web usability in general.

I want to Switch from Web Designer to Front End Developer or web developer PHP, which skill should I get , Is it Easy to switch from Designer to Developer. I have two years Exp. in Web Designing. Please suggest.

Or should i stick to the Designing what is the Next BIG thing for Designer after DIV layout.

My Current Roles Conversion PSD to HTML, fixing Bugs in Different Browsers , Strong knowledge of HTML and CSS. I want to Go with the Open source Programming like PHP and MySQL

@wazdesign, I didn't come from a design background like you, but I found my niche in Front-End Web Development none-the-less. I started with Standards-based HTML and CSS and then started working back in the day on the Views and Helper functions in MVC frameworks (with a good team doing the controllers, models etc.) Ask a competent Web Developer to give you a basic web-server architecture and process demo. Understand how data from the DB gets onto your user's pages, and all the checkpoints the data goes thru on the way. Once you understand the principles, you can pretty much work with any technology after tooling up with the syntax.

I've listed some terms to research below that are tech-agnostic. I can't help you with the PHP side of things :)

Some books worth reading:

Some terms to research:

  • Interaction Design
  • MVC Frameworks
  • Templating systems
  • HTTP
  • User Interface

Some tools to use:

  • Firebug
  • YSlow for Firebug

There are many more technologies and tools available to build the front end for an application.

Which is the best technology/tool/platform available using which I can build a better GUI, by which I'll be able to build a nice looking as well as an efficient GUI?

Definition of "better" includes factors such as efficiency,user friendliness,better content control mechanism, navigation and many more.

I know this is a question about which GUI toolkit you should use, but your first technology for producing a user-friendly UI is pen and paper. Sketch out some mock-ups. Draw buttons and menus on construction paper, cut them out, and glue them together. Then try your mockups on about a half-dozen people. You'll quickly find out what makes a good UI.

It doesn't matter how good the UI looks or whether it uses the latest snazzy effects -- if your users can't figure out how to use it, they'll go elsewhere. You need to learn what works for your target audience before you write a single line of code.

Read Don't Make Me Think to learn how to make mock-ups and do user testing.

Hi Ive been planning on doing a social network project and im wondering if there are readings on UX Design that I can read to base my site design on. Thanks.

Check out this question. My personal favorite is Steve Krug's Don't Make Me Think.

I have found Seductive Interaction Design helpful. There is a section about profile completeness and how to incorporate positive goals that compels your user to take the steps necessary towards completeness.

http://www.amazon.com/Seductive-Interaction-Design-Effective-Experiences/dp/0321725522

Other helpful sections on how to build in fun distractions and more importantly coming on too strong (and how not to!).

Hope this helps!