Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

UI Design Dos and Don'ts

developer.apple.com

Post reply on HN
Print view View original

91–100 of 121 posts

Re: UI Design Dos and Don'ts

#91

Post by k-mcgrady »

juriansluiman wrote: post #62
Mandatum wrote: post #24

Earlier quoted context omitted.

Do you have a better example? I don't find the select diag's like in Desktop Chrome easier to use especially on a mobile. I think what they've done is better than anything else I've seen. With enough following it'd become the norm like anything else.

Android has a simple calendar which you can swipe to change the month. Click on the year and a year selection is shown. The time is a clock where you're able to select the hour first and minutes thereafter. This is the most intuitive mobile touch interface I have seen so far, any other is really small, awkward or not mentally easy to comprehend. Image: https://raw.githubusercontent.com/CiTuX/datetimepicker/maste...

>> "The time is a clock where you're able to select the hour first and minutes thereafter. This is the most intuitive mobile touch interface I have seen so far, any other is really small, awkward or not mentally easy to comprehend."

Really? This is incredibly unintuitive in my opinion. That clock was my biggest annoyance with Android and I always selected the wrong time first go round.

Re: UI Design Dos and Don'ts

#92

Post by coldpie »

rimantas wrote: post #68
erlkonig wrote: post #48

Their "contrast" section belies their determination, since the text there is grey on a white background, and true black on white would unquestionably be more readable. (looking at UI designers more generally:) I'm so sick of UIs that have repetitive, huge, contrasty, readable headings... only to have the core useful text be grey-on-something, tiny, possibly italic, and so on. Idiots, and they are legion. More subtle…

Black on white is actually bad combination, it strains the eyes.

Perhaps, but light-grey-on-white strains my eyes much, much more.

Re: UI Design Dos and Don'ts

#93

Post by kagamine »

TuringTest wrote: post #87
kagamine wrote: post #82

Earlier quoted context omitted.

Grey text on a white background is generally accepted as easier on the eye/mind when reading sentences, whereas on the header it is not necessary, it's just one word, there is no train of thought to follow there. This would be considered good UX [source: I don't have anything to link to right now, but I do have a degree in Interaction Design] The rest of your points get top marks and I hope to Cod that someone at App…

> Grey text on a white background is generally accepted as easier on the eye/mind when reading sentences That may the single most propagated unfounded myth in UI design this decade. [1] While it's true that pure black on pure white causes problems for some dyslexic users, there is also a _minimum_ required contrast [2], which is routileny ignored by many "stylish" web sites. The plague of contrast-less "light grey on…

Notice I said grey, not light grey. Good designers will understand that there has to be a contrast between the background and the foreground. There will always be some who misinterpret the rules.

The first site you linked could exist for any design principle found on the web, just change the pattern to fit. The example they give also has negative text-shadow (engraved effect). That is not evidence of anything. Anyone could make a website with focus on a single design error like that.

The W3 link doesn't support your argument either, as all they are saying is to make sure there is enough contrast, not that grey text is wrong. They also include "provide sufficient contrast when viewed by someone having color deficits" in the title, which I took to mean people with impaired sight. IF you want to go down the rabbit hole that's is more than 1% of the www friendly toward people with accessibility problems you will be lost in there until rabbits evolve to live in houses.

Think of the kindle, is that black text on a white page? Now search for why people like e-readers over tablets, you will see that black on white is not good for the eyes.

Re: UI Design Dos and Don'ts

#94

Post by TuringTest »

coldpie wrote: post #89
TuringTest wrote: post #87

Earlier quoted context omitted.

> Grey text on a white background is generally accepted as easier on the eye/mind when reading sentences That may the single most propagated unfounded myth in UI design this decade. [1] While it's true that pure black on pure white causes problems for some dyslexic users, there is also a _minimum_ required contrast [2], which is routileny ignored by many "stylish" web sites. The plague of contrast-less "light grey on…

> I've been forced to place a "Contrast" bookmarklet on the toolbar of all my browsers Could you please share these? I'm not web-programming-savvy enough to make anything that'd be generally useful.

I didn't make it myself, I found it here:

http://megpickard.com/2011/06/nifty-bookmarklet-to-make-web-...

This reminds me that I didn't thank the author enough, I'll have to drop her a line.

Re: UI Design Dos and Don'ts

#95

Post by sandofsky »

DanBC wrote: post #74
sandofsky wrote: post #55

Earlier quoted context omitted.

Most likely, that shade of grey was chosen precisely because the section headline is black. If both were black, it would compete with the typographic hierarchy, making it distracting to skim the entire page. Good design is a form of engineering. You have a set of principles and successful patterns– such as the ones on the linked page– but your job is adapting to real world constraints. In this case, the challenge is…

Attention to detail? http://imgur.com/Q9AhXKI That font, in the section that talks about the importance of larger fonts, is fucking tiny.

Nobody visits the developer portal on mobile devices. I know I don't browse reference docs on my phone since I can't run Xcode on it, so that's probably why they haven't optimized for mobile yet.

Re: UI Design Dos and Don'ts

#96

Post by TuringTest »

kagamine wrote: post #93
TuringTest wrote: post #87

Earlier quoted context omitted.

> Grey text on a white background is generally accepted as easier on the eye/mind when reading sentences That may the single most propagated unfounded myth in UI design this decade. [1] While it's true that pure black on pure white causes problems for some dyslexic users, there is also a _minimum_ required contrast [2], which is routileny ignored by many "stylish" web sites. The plague of contrast-less "light grey on…

Notice I said grey, not light grey. Good designers will understand that there has to be a contrast between the background and the foreground. There will always be some who misinterpret the rules. The first site you linked could exist for any design principle found on the web, just change the pattern to fit. The example they give also has negative text-shadow (engraved effect). That is not evidence of anything. Anyone…

> There will always be some who misinterpret the rules.

Right, though the problem is when the misinterpretation takes on a life of its own and it's propagated as a good practice, as it happened with light grey and its purported benefits to dyslexic readers. This practice is too widespread to be left unadressed without correction.

As for e-readers, the newer models of the Kindle and other competitors have darker text over whiter background as a selling point, and the early grey-on-grey was touted as a huge limitation of the format. I've tried both and I clearly prefer the high-contrast versions.

Also, people prefer e-readers because they are based on reflective light instead of emiting LEDs - it has nothing to do with them having grey text.

Re: UI Design Dos and Don'ts

#97

Post by kagamine »

coldpie wrote: post #88
kagamine wrote: post #82

Earlier quoted context omitted.

Grey text on a white background is generally accepted as easier on the eye/mind when reading sentences, whereas on the header it is not necessary, it's just one word, there is no train of thought to follow there. This would be considered good UX [source: I don't have anything to link to right now, but I do have a degree in Interaction Design] The rest of your points get top marks and I hope to Cod that someone at App…

> Grey text on a white background is generally accepted as easier on the eye/mind when reading sentences This sounds like wives-tale baloney. Please disregard this "advice" and make your text readable. The text on this page from Apple is too low contrast.

Feeling a bit confrontational today are we? Call it what you will, but this is "generally accepted" which means exactly what it says. You seem to have confused "this user's opinion" with "what the textbooks say". Still, I'm open to hear about all the UX books you have read.

Re: UI Design Dos and Don'ts

#98

Post by kagamine »

TuringTest wrote: post #96
kagamine wrote: post #93

Earlier quoted context omitted.

Notice I said grey, not light grey. Good designers will understand that there has to be a contrast between the background and the foreground. There will always be some who misinterpret the rules. The first site you linked could exist for any design principle found on the web, just change the pattern to fit. The example they give also has negative text-shadow (engraved effect). That is not evidence of anything. Anyone…

> There will always be some who misinterpret the rules. Right, though the problem is when the misinterpretation takes on a life of its own and it's propagated as a good practice, as it happened with light grey and its purported benefits to dyslexic readers. This practice is too widespread to be left unadressed without correction. As for e-readers, the newer models of the Kindle and other competitors have darker text…

> I've tried both and I clearly prefer

I think we can end this debate here.

Re: UI Design Dos and Don'ts

#99

Post by sandofsky »

mhomde wrote: post #75
sandofsky wrote: post #55

Earlier quoted context omitted.

Most likely, that shade of grey was chosen precisely because the section headline is black. If both were black, it would compete with the typographic hierarchy, making it distracting to skim the entire page. Good design is a form of engineering. You have a set of principles and successful patterns– such as the ones on the linked page– but your job is adapting to real world constraints. In this case, the challenge is…

"a foolish consistency is the hobgoblin of little minds"

"Read a book."

http://www.amazon.com/Design-Everyday-Things-Donald-Norman/d...

Consistency is an important tool. In the absence of obvious visual affordances, it's even more important.

Re: UI Design Dos and Don'ts

#100

Post by juriansluiman »

k-mcgrady wrote: post #91
juriansluiman wrote: post #62

Earlier quoted context omitted.

Android has a simple calendar which you can swipe to change the month. Click on the year and a year selection is shown. The time is a clock where you're able to select the hour first and minutes thereafter. This is the most intuitive mobile touch interface I have seen so far, any other is really small, awkward or not mentally easy to comprehend. Image: https://raw.githubusercontent.com/CiTuX/datetimepicker/maste...

>> "The time is a clock where you're able to select the hour first and minutes thereafter. This is the most intuitive mobile touch interface I have seen so far, any other is really small, awkward or not mentally easy to comprehend." Really? This is incredibly unintuitive in my opinion. That clock was my biggest annoyance with Android and I always selected the wrong time first go round.

I just see it as pointing where I'd like the hands of a clock. The only learning curve I had is the difference between 10:00 and 22:00 (or likewise, between AM and PM).
Post reply on HN