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

UI design for software developers. Part 1, Colors

amortizedcost.net

Post reply on HN
Print view View original

81–90 of 95 posts

Re: UI design for software developers. Part 1, Colors

#81

Post by jcranmer »

edoceo wrote: post #55
coldpie wrote: post #35

Earlier quoted context omitted.

> very timely given the trends for low contrast design that seem prevalent combined with my now over 40 eyes I'm a decade younger than you and I still bristle every time I see someone disparage black-on-white. #000 on #FFF looks fine, guys, and it looks way, way better than the #BBB on #CCC that you're about to publish. You're overthinking it.

bg: #fafafa; fg: #101010 Black and white, but take the edge of a little.

Black (#000) against a slight creamy color--like the main background of Hacker News (#f6f6ef)--is pretty good IMHO.

Re: UI design for software developers. Part 1, Colors

#82

Post by nottorp »

> Common advice here will be not to use pure black or white colors, which, as perfectly described in the article, hardly present in the real-world color pallet.

However, on the OLED screens that are all the rage now, and for good reason, a pure black background means those pixels are off, which saves power and shines less light into the user's eyes making the screen less tiring.

Aesthetics aren't always good for your health/battery.

Re: UI design for software developers. Part 1, Colors

#84

Post by ricardobeat »

nottorp wrote: post #82

> Common advice here will be not to use pure black or white colors, which, as perfectly described in the article, hardly present in the real-world color pallet. However, on the OLED screens that are all the rage now, and for good reason, a pure black background means those pixels are off , which saves power and shines less light into the user's eyes making the screen less tiring. Aesthetics aren't always good for you…

here's a comparison of power usage (it's negligible): https://www.xda-developers.com/amoled-black-vs-gray-dark-mod...

The contrast is bad for your eyes, not the total amount of light, which your pupil can adjust for.

Re: UI design for software developers. Part 1, Colors

#85

Post by gpanders »

EricE wrote: post #29

One of the best discussions of color - especially from an accessibility standpoint is from the US Digital Web Design System: https://designsystem.digital.gov/design-tokens/color/overvie... It has one of the best discussions of contrast I have seen; very timely given the trends for low contrast design that seem prevalent combined with my now over 40 eyes (darn those kids!)

> Accessibility is not a special case. In Q2 of 2018, sites using USWDS topped 1.4 billion pageviews. 4.5% [the portion of the population with some kind of color insensitivity] of 1.4 billion is around 60 million pageviews — when it comes to accessibility, thinking broadly and inclusively isn’t just a good idea, it’s our mission and responsibility.

It's honestly pretty cool to see this. I'm glad that the US government (or at least this one particular agency) takes accessibility so seriously.

Re: UI design for software developers. Part 1, Colors

#86

Post by ukyrgf »

habosa wrote: post #44

I'm no design expert but this advice is really thin and not that useful. Trust me that using a color palette generator is not the One True Way! Also there's no advice on how to pick a base color, just "pick one". Second this author is basing the advice on this app: https://play.google.com/store/apps/details?id=net.amortizedc... Again I am not an expert and I don't mean to be rude, but that's not a very nice looking a…

8 different font sizes, no logical line heights, some elements are spaced tightly (ordered list, share button) and some far apart (radio buttons). And the primary buttons in image 1 and 3 are teal, but in 2 we introduce a yellow button and in 3 there's a red one.

Even though this is about infographics, there is a lot of useful information here: https://blog.datawrapper.de/beautifulcolors/

Re: UI design for software developers. Part 1, Colors

#87

Post by dragonwriter »

jessaustin wrote: post #80
dragonwriter wrote: post #75

Earlier quoted context omitted.

System colors are in the CSS Color Level 4 working draft updated less than a week ago. What appears to be (durably) deprecated is just a subset of the system color names , with what sounds like a reasonable reason: Earlier versions of CSS defined several additional system colors. These color keywords have been deprecated, however, as they are insufficient for their original purpose (making website elements look like…

That explanation seems to be having it both ways. If it's really a spoofing security risk, do they still intend to provide functionality that is sufficient for the original purpose?

> If it's really a spoofing security risk, do they still intend to provide functionality that is sufficient for the original purpose?

The explanation explictly says that the original functionality was a spoofing security risk, but even so was “insufficient for their original purpose (making website elements look like their native OS counterparts)”. So, no, they've fairly explicitly abandoned the original purpose.

They retained functionality has a more limited purpose, which I would describe as providing a vehicle for the user/browser/OS to provide defaults which pages/apps can reference, which when provided by the OS, minimize aesthetic clash and preserve contrast/accessibility between the page/app features and native UI without disguising the nature of the web page/web app, rather than actually mimicing native system UI.

Re: UI design for software developers. Part 1, Colors

#89

Post by KineticLensman »

ChrisMarshallNY wrote: post #32
Jerard_Victor wrote: post #11

Earlier quoted context omitted.

hey, I do reading all the comments here. Frankly speaking, I didn't think about accessibility impact when I was playing with color palettes, but it turned out that Google does such assessment automatically when an app is being reviewed. Thankfully in my case, I didn't have any accessibility-related issues, but this is a valid point and probably it's better to do it during the mocking stage.

Good luck with this. I do think that aesthetics could be improved in the tech field (I wuz an artist, way back, when). But accessibility is critical. There are tools to do things like desaturate pages and apps, and measure contrast. I write Apple apps, and I make sure that I provide (sometimes, quite verbose) accessibility labels to all my UI elements. There's actually a ton more that can be done, but acc. labels, an…

> But accessibility is critical.

Totally agree. I once did some mandatory training at work (on avoiding discrimination, ironically) where some of the facts needed for a good score were only presented in the audio track and were thus inaccessible to deaf people. I'm partially deaf without my hearing aids so am sensitive to this issue.

Another place where I worked had the bays in its car park marked with a colour of brick that was the same as the main colour if you had a certain type of colour blindness. It's actually how most of us found out that one of our colleagues was colour blind, when he got a complaint about his apparently inconsiderate parking (usually taking two spaces because he couldn't see the markings).

Re: UI design for software developers. Part 1, Colors

#90

Post by KineticLensman »

Biganon wrote: post #41
monkin wrote: post #5

Tip No. 1. - Don’t make UI design courses for developers if you don’t have a solid experience in it.

This reads like a harsh criticism; arguments would be welcome as to why you feel this way

They say that the best way to learn something is to teach it, but it doesn't follow that the experience will be optimal for your students. Teaching well is quite hard.
Post reply on HN