Design Books Every Hacker Should Read
davidmckinney.com
davidmckinney.com
Guys, do you test your sites on anything other than Macs with "retina" displays? For example, I maxed out the brightness setting on my Thinkpad x60 and the text is still barely legible. Granted, this TP has a very average display, but do you really want to limit your audience to Mac users?
Zap Colors is super handy when I can't easily make out text from background.
Now, anyone can zoom in with their browser... but your entire layout changes width when I do that: http://i.imgur.com/U96Py.png
This seems the most trivially easy thing to A/B test. Does anything less the 16pt cost you revenue?
Simple question, yes/no.
Actual data is so much better than someone's untested opinion which has been shown time and time again to be worthless in real life.
That's how it looks in my browser:
http://freeimagehosting.net/newuploads/cyqjo.png
(Firefox 18 / KDE 4.8).
Example (from this site):
font-family: 'proxima-nova', 'proxima-nova', 'Helvetica Neue', Helvetica, Arial, sans-serif;
If you have trouble reading that on a white background, then the problem is with your screen, not with the page.
Really unfortunate design for an article about design, and blaming the users' browsers, operating systems, lighting conditions or etc. is NOT the correct approach.
On a more useful note, I enjoyed Fred Brooks' "The Design of Design", on the process of design rather than on visual design.
But seriously, everything I see nowadays that frustrates me in its design immediately harkens back to a principle in The Design of Everyday Things.
Truly transformative book - couldn't recommend it enough.
How are these relevant to the hacker who writes his own Linux device drivers? Or the hacker building an open source voice recognition library?
There are plenty of hackers who do amazing work that has nothing to do with visual design.
I liked the nuclear reactor example in The Design of Everyday Things because it illustrated (again) that usability is important even if only trained professionals have to use <something>.
Something as general as "don't make me think" may make sense for API design, but honestly I doubt the applicability of "The Elements of Typographic Style" or "Grid Systems" to library documentation and API discoverability.
"Design Books Every Hacker Who Would Like to Read About Design Should Consider Reading Unless They are Designing an API"
I know 2 of the books mentioned and they are great books, but the poster should mention that the Design of Everyday Things is starting to be seriously dated. At least for the examples exposed - the principles do not age.
I've read 2 of them and they have may be relevant. The ideas in them go past visual design and through to communication of ideas etc.
http://www.amazon.com/Non-Designers-Design-Book-Robin-Willia...
From a pure graphic design standpoint, I would recommend The Elements of Typography Style to any developer, as well as Thinking with Type by Ellen Lupton. A solid understanding of typography is maybe the most important, and definitely the most immediately useful, facet of design.
Interesting point about Muller-Brockmann as well. It's essentially a collection of case studies about working within constraints.
Design as the original poster is talking about is essentially about communication and although Typography is one of the essential skills needed, it is not the only one.
Typography is pretty important there. It certainly isn't the only skill that's necessary, but it's a great place to start and is often key to layout, especially in designs informed by the grid.
Why don't you rotate that picture, 90 degrees counter-clockwise?
The trouble with all these posts is that they are trying to shortcut the methodology of design by various hacks, even something as lengthy as read 5 books is by-in-large a hack.
There is no substitute for practise, for looking and appreciating your world in a different way (this can be self-taught, I will discuss more below) and for in-depth thinking about what either comes down to communication or feedback problems.
Aesthetics largely is difficult to teach and learn and comes from confidence and a place in the brain that is hard to hack, but communication and interaction is learnt from early childhood by everyone - it just needs opening up and awareness of this as we mature.
By looking at the Design of Everyday Things (the book or the things around you) you begin to appreciate or notice the failures in signs, handles, buttons, phones, car controls, packaging and if you are tuned into this way of thinking it can be hard to stop considering the amount of interactions with “things” we have everyday.
Then taking this body of knowledge that is learnt one can then start objectively looking at one's own design and interaction problems, using the same tools that you have been using to analyse potential problems as they occur and working them out to find the best solution. But knowledge of the best solution will also come from practise of working with the constraints of whatever medium are working in (for example print, application, touch screen, architecture or furniture design).
This practise will mean mistakes - this is an important part of the learning process, just as it was when growing up, you will learn what works and doesn't work and in the future intuitively work with this in mind.
I'm seeing in various comments that 'hackers' and 'designers' are two different things, and that a 'hacker' needs a certain type of book or format to the material. I'd submit that most hackers have a thirst for knowledge, part from curiosity and part from a desire to be self sufficient in making their concepts a reality. Digest knowledge, practice the technique until it works and you've realized your goal? Does this not encapsulate the 'hacker spirit'? It's funny because most great designers I know came from the same perspective...
So I say put aside this idea of Hacker vs. Designer and who needs what. A design is a solution to a problem, visual design language/concepts are another tool set to help you make effective software and so much more. Don't treat it like its some sort of voodoo that only left-brainers can comprehend.
The books I recommend are: Non-Designers Design Book by Robin Williams. It focuses on topics like Consistency, Alignment, Proximity, and Contrast. With these four rules, you can make 90% of your designs look good. It also explains briefly on what colors and typography to use. When you've firm grasp of the fundamentals, it would make sense to arm yourself with more theory.
Don't make me Think by Steve Krug. It teaches you to simplify and focus on the end-user.
You've never read them then, as they all use real world examples. Don Norman's has 3 Mile Island for example.
"It's good to be knowledgeable about Golden Ration or Fitts Law but it wouldn't be of immediate help on your next project."
The Golden Ratio is one ratio, there are many. Some more, some less, aesthetically pleasing. Fitt's Law is basically about the metrics of completing any action involving your hand and a target, say a button or a link.
Consider an HTML pag with no graphical embellishments beyond a white body colour and a dark gray text colour, the proportions and spacing allocated to each bit of content will decide if people find it beautiful or not, and the ease with which they can interact with buttons and links will decide if they find it usable.
Indeed, statements like "four rules cover 90% of design", as you said, are both theoretical and practical: they strive to simplify and unify a conceptual landscape, which in turns helps you in your work, because you don't have to remember and apply many vague heuristics.
Of course, whether a true and satisfying theory of design exists, is another matter.
EDIT: Awful spelling.
A good design book for hackers, would have less than 200 pages and deal with the essentials, basic typography, using whitespace productively, grids, color theory etc. in a systematic way. If anyone has any recommendations for that kind of book, I would love to hear them.
These books will help you get a better understanding of the principles of good design at root level, but they won't do much if you're just looking to make your app look or work better.
On the other hand, these books are much more practical:
http://bootstrappingdesign.com/
http://nathanbarry.com/webapps/
And I also wrote a design eBook myself (not as good as the three above, but it's also a lot cheaper):
I have met AIGA award designers and Internet design celebrities who don't know some of the basics laid out in this short book.
http://www.amazon.com/Crisp-Graphic-Design-Visual-Communicat....
The book opened my eyes, and has certainly affected my ebooks and the css I created to style them.
Most books I've found so far are merely coffee table books: Pages of very nice illustrations, but weak on explaining the theory and principles of applying it to, e.g., a book, poster or website.
Does anybody know of such books? What do serious students of graphic design read? Is the book "Universal principles of design" a good fit?
Less generic that what has been listed in this article since it focuses more on user interfaces, it's a great overview of basic design principles, with clever illustrated examples.
http://www.amazon.com/Designing-Mind-Simple-Understanding-In...
If you want to buy a beautiful multi-lingual design book from that era, Emil Ruder's Typographie is the better buy: http://www.amazon.com/gp/product/3721200438/ref=as_li_ss_tl?...
I read this book in design school and its probably some of the best reading I've ever done. If I had to pick one book out of all of these, it'd be this one.
in my opinion, it's at par with "don't make me think". i recommend reading them both at once.
I read "understanding comics" a couple of years ago and while I think it's an awesome book I am not sure of why you think it's a good resource for designing stuff that is not "sequential art".
and also: you can't separate text from design (like in comics) a point that "understanding comics" makes quite clear.
and user interaction: changing from one state to the next, from one webpage to the follow up webpage is a transition, a transition like form one page to the next, also from one panel to the next - and you can determine how the users experiences the transition, like in comics you can go from one detail to the next detail, from moment to moment, from one aspect to another aspect, or from boring to surprise (or, you can even go completely dada).
"understanding comics" is not a 1:1 analogy for website/webpages, but it helps you to really understand your pages, your design and how the users experiences them.
this presentation I watched some time ago is cool http://www.organizedwonder.com/videos/310 although as with arial, I couldn't tell you why helvetica is bad.
The reason Arial is often, arguably inappropriately, slated as a bad font is because it stacks up poorly against other fonts in the situations where it's appropriate. Helvetica is more sterile, balanced, and tasteful — it does most of the things Arial does, but better. The only advantage Arial has over Helvetica is at smaller sizes on the web, where the head of the t, tail of the g, and terminal of a help to make the characters more distinguishable (in theory).
So beyond quality, it's about what's more appropriate. Then of course you've got to set it well, but that's practice.
I have met AIGA award designers and Internet design celebrities who don't know some of the basics laid out in this short book.
It's probably the only handwritten book you'll ever read.
http://www.amazon.com/Crisp-Graphic-Design-Visual-Communicat...