A lot of negative comments here, but these are useful rules of thumb when designing UI, especially if you don't have a design background. They're not perfect, sure, but it's a good starting point.
A lot of these tips I've learned on my own just analyzing how designers I've worked with did things or noticing how sites I thought were aesthetically pleasing to the eye have done it. I kind of wish I had a summary like this a few years ago.
There are a lot of rules/guidelines type of things like these that are as stated "safe" to follow. However, it's after understanding these types of rules and what makes them safe that allows rules to be broken for purpose rather than ignorance.
Film/video/photography have them as well. Things like looking room, rule of thirds, and similar guidelines will pretty much always be safe. However, there are times when breaking those rules can look very awkward or very artistically done, but it can be telling when it was done from ignorance and just looks awkward or done with intent and the breaking of the rule reveals something else deeper.
1. The ROT has a bastardized history, that involves the artist Thomas Smith semi-completely misunderstanding the work of the artist Joshua Reynolds.
2. Smith re-wrote Reynolds's observation as a rule of prescription (e.g. 'walk only on the path') not as a rule of exclusion (e.g. 'don't walk on the path'). In aesthetics, the former generally do not have a long life expectancy.
3. Reynold's original observation was not restricted to composition. It addressed the artist's abhorrence of symmetry. Symmetry is understood as being a general phenomenon. Hence the following cases are all understood as being manifestations of symmetry...
maybe the rule of 1/3s was applied to way more than it should be, but i don't think it's one to throw the baby out with the bathwater though. again, it's a good starter rule. once you get skilled enough to start composing shots without needing a check list of rules to apply, you'll see that some of those starter rules getting broken regularly.
a common use of thirds is in graphics use of lower thirds. it's just enough room without being too much. lower quaters would be small. lower halves would be too much. centering your subject in the first 2/3 and leaving the remaing third as looking room isn't bad aesthetically.
so maybe how you are interpretting the ROT is different than how i use it, but you definitely seem to have a grudge
Yup. I guess I do. Perhaps I overstated my feelings, but as an art and design teacher such non-truths are the bane of my life.
Almost all 2D aesthetic images (paintings, art photographs or page layouts) feature a region of interest (ROI) sometimes called the point of focus or the center of attention. Indeed, it is difficult to construct an aesthetic image that does not.
The so-called rule of thirds states that this ROI is best located one third across the vertical and horizontal axis.
However, the actual; truth is more complex and more interesting:
1. The horizontal axis ratio is not 1:2 but closer to 1.618. In other words, the golden ratio https://en.wikipedia.org/wiki/Golden_ratio [1]. For many purposes, one third is close enough to the golden ratio. However, in practice artists/designers tend to actively avoid exact fractions (third, half, quarter, seventh etc).
2. There is a difference between the placement on the vertical axis to that of the horizontal axis. The vertical axis seems to be tighter towards the edge (the bottom edge in a painting, the top edge in a flat design).
3. Mysteriously, there is a slight favoring of the left side over the right. This seems to have something to do with writing direction [2].
My own small-scale field research supports these observations (on 31 art students), as well as the work of a few others (below).
On a personal note... one reason I like lurking in Hacker News is for the precision of thinking that computer and software engineers exhibit. In my own field (fine art) 'received wisdom' is often taken as lore. These non-truths are harder to kill than vampires. Examples:
- Red recedes over blue (in a FG/BG pairing, one will always recede, but which would depend upon which red and blue you employ and how they are used).
- The complementary of red is green (yes it is the perceptual complementary in RYB space, but the mix-to-neutral complementary in RGB space is cyan).
- That the Pointillist painter Seurat employed optical mixing of primaries by placing them in close proximity, like a CMYK printer (he simply did not... there were other reasons he favored small dabs of paint in close proximity).
... I could go on.
[1] Amirshahi, S.A., Hayn - Leichsenring, G.U., Denzler, J., Redies, C.: Evaluating the rule of thirds in photographs and paintings. Art Percept. 2 , 163 – 182 (2014)
[2] Chahboun, S., Flumini, A., Gonzàlez, C. P., McManus, I. C., & Santiago, J.: Reading and
Writing Direction Effects on the Aesthetic Appreciation of Photographs (2016)
It's wearisome how predictable HN is. I guess I've spent too much time on here (and continue to do so!). Every single time something vaguely design-related comes up, the entire discussion is about how thou shalt not steal my god-given right to use pure-black-on-white. Programmers apparently detest anything even remotely not #000, but fuck me is it ever repetitive and boring.
I don't think there's a name for this concept but I think of it as like, anti-pretentious pretentiousness. The place I first saw it well described was in a novel where tennis players who spend a lot of time on the court picking up balls develop a fluid motion to launch the ball off the ground with their racket and so avoid bending over to pick it up. It becomes a signal that a player is serious. But then less serious players see that, see that it looks smooth and cool, understand what it signals, and so practice that motion for its own sake.
In response the really elite players just go back to bending over to pick up the ball with their hand, signaling that they're too skilled to bother signaling how skilled they are.
HN falls hard into this in general. But then combine it with the disdain or even contempt it's fashionable to show towards subjective pursuits like aesthetics, and it gets dialed way up.
Like you said it's very predictable. Any time I see a link that has any sort of distinctive design, unique typographic style, or especially authorial tone, I know instantly what a handful of comments are going to be.
> In response the really elite players just go back to bending over to pick up the ball with their hand, signaling that they're too skilled to bother signaling how skilled they are.
Truly elite players have ball boys and girls pick up balls for them.
Your point, though, reminds me of the Sneetches by Dr. Seuss
I grew up in the days of SD video and the start of using computers for digital designs for video. In SD NTSC/PAL, you'd never use 000 for black nor 255 for white. Instead, you'd use broadcast safe 16,16,16 and 235,235,235. That's just something that has always stuck, even when converting to web. It's not because some rule, but just because I like to know there's a little bit more if I ever need it. To this day, I'll still start in a similar limited vein for HD and 4K designs. It's like a warm fuzzy blanket that I'll never let someone take away.
You missed the motivation behind my diatribe. Wanting black on white is fine (it's what I do on my text editors). I just hate that up and down this thread, that's all I get to read, although the list is full of other nuggets that I would have loved to have seen fleshed out here.
Your comment was the first one related to that rule I read, and I'm a good way down the page. Maybe you just happened to see the comments early on when a discussion on that happened to be at the top.
A lot of these tips I've learned on my own just analyzing how designers I've worked with did things or noticing how sites I thought were aesthetically pleasing to the eye have done it. I kind of wish I had a summary like this a few years ago.