>Borders are a great way to distinguish two elements from one another, but using too many of them can make your design feel busy and cluttered.
>Instead, try adding a box shadow, using contrasting background colors, or simply adding more space between elements.
Emphasis mine. The above may be reasonable advice if you're building a low information density app for nonproductive content consumption... Or a touchscreen only app where all interactive elements must be at least a finger tall and wide... But it drives me absolutely batty when extra white space appears in software that I want to use to process/analyze a lot of information and actually get stuff done. And numerous examples on the website just make things... Farther apart and/or bigger.
I still rue the day Spotify fattened up its row height for all lists in the app. It's less readable than it was if I can't read as many song names as before without scrolling.
I don't want to rag on the book overall without reading it, especially given how many in this thread seem to love it and the table of contents does hint at good ideas within, but that seems like a terrible set of examples to lead with. 'More white space' is not universally good design advice. Give me design in the school of TMUX and Bloomberg Terminal any day over extra white space for the sake of 'readability.' As much information as it is possible to present clearly on a given screen.
There's a subchapter in the book called Dense UIs have their place in which the authors mention situations where more compact and busy design is more desirable, adding a screenshot of a sports results website as an example.
The rules in the book (and on the website) should not be seen as set-in-stone, they are more principles we can follow depending on the situation. I think the use fewer borders principle is very useful in many scenarios.
Saying that, I agree that today's designs tend to too much whitespace (there was a blog here recently ranting that all product landing pages are basically a navigation bar with a shallow text over a picture background).
I had a local entrepreneur showing me their website/product at a meetup a while ago, and after scrolling a bit through an info page, I unconsciously switched to desktop mode to get more information density.
The entrepreneur, who was watching me interact with the site, asked me what I was doing, and was confused at why I'd go to desktop mode. That, in his mind, was too information dense. But I wanted to see all the information at once without scrolling around, my eyes can scroll fine.
I guess it goes to show it should be a consideration, given its variance.
There are no universal
rule of design. You ragging about a mention of whitespace, as if whitespace is universally a bad idea, means you are just judging a book by its cover and only have the cursory understanding of the matter that is typical of most programmers.
Remember, good design is not only what the cool kids do or what FAANG might believe it is. Good design is timeless. Good design is a conversation with the product. Sometimes whitespace is good, sometimes it is not. You saying whitespace is a bad idea is as misinformed as a naive designer saying whitespace is king.
That said, I recommend Refactoring UI, but I recommend more anything on Dieter Rams or the book "The Design of Everyday Things" by Donald A. Norman.
Good design is also subjective. More whitespace is trendy and it annoys people who prefer a higher information density (I see the same with code formatting preferences: some people really like to space out code, others like to make it as compact as possible. Most people are somewhere in the middle).
There is a thing called user testing. I would say if big company makes design with a lot of whitespace its outcome of a process that had many variations and many tests.
So yes its subjective and people probably like it.
On the flipside, probably the most common software found and used in businesses everywhere is spreadsheet related, and it's common even in non-business contexts. How many of these applications are adding senseless whitespace everywhere?
In the cases I've seen where whitespace is added, it's purely an aesthetic choice and not a UI design choice.
>Borders are a great way to distinguish two elements from one another, but using too many of them can make your design feel busy and cluttered.
>Instead, try adding a box shadow, using contrasting background colors, or simply adding more space between elements.
Emphasis mine. The above may be reasonable advice if you're building a low information density app for nonproductive content consumption... Or a touchscreen only app where all interactive elements must be at least a finger tall and wide... But it drives me absolutely batty when extra white space appears in software that I want to use to process/analyze a lot of information and actually get stuff done. And numerous examples on the website just make things... Farther apart and/or bigger.
I still rue the day Spotify fattened up its row height for all lists in the app. It's less readable than it was if I can't read as many song names as before without scrolling.
I don't want to rag on the book overall without reading it, especially given how many in this thread seem to love it and the table of contents does hint at good ideas within, but that seems like a terrible set of examples to lead with. 'More white space' is not universally good design advice. Give me design in the school of TMUX and Bloomberg Terminal any day over extra white space for the sake of 'readability.' As much information as it is possible to present clearly on a given screen.