Live data from Hacker News

Flat UI: Free Web User Interface Kit

designmodo.github.com

131–140 of 201 posts

Re: Flat UI: Free Web User Interface Kit

#131

Earlier quoted context omitted.

Yes it is. #00bd9c vs #00b290, I doubt you can tell the difference with the naked eye.

They're actually quite different http://i.imgur.com/LxoNXK2.png

Any two colors start to look very different when you put huge blocks of them next to each other. It's called Color Relativity. (That's half of why Josef Albers's illusions work in the first place...)

Regardless, it's clearly _very_ inspired.

The face icon: http://dribbble.com/shots/884574-Designer-News-Badges?list=u... http://dribbble.com/shots/800428-LayerVault-icon-set-for-del...

The gears icon: http://dribbble.com/shots/800428-LayerVault-icon-set-for-del...

The newspaper icon: http://antoniopratas.com/blog/wp-content/uploads/2013/01/des...

The clock icon: http://antoniopratas.com/blog/wp-content/uploads/2013/01/des...

Don't really know what's going on with the icon collection... they are all in slightly different styles and don't fit together at all.

Re: Flat UI: Free Web User Interface Kit

#132

Earlier quoted context omitted.

I like the flat button a lot more.

Good for you but understandable user interfaces are (and should be) higher priority than prettiness; the "warning button" looks like a warning message for me. But of course there are alternatives for visual clues that still look flat-ish: http://i.imgur.com/jXN2tpe.jpg

I have to admit, I like the flat button also but I appreciate you mocking up different versions. I dont think that a button needs to be raised to make people think they can press it. Look at the iOS settings page as an example. These buttons are completely flat. http://cl.ly/image/2j2m3I2R2x1z

Re: Flat UI: Free Web User Interface Kit

#133
Weirdly, nobody is complaining about the contrast. This might all seem crisp on a high-def screen in good lighting conditions, but try a cheap tablet or laptop and evaluate again. Elderly have tremendous problems reading the labels on the buttons. Try the firefox plugin https://addons.mozilla.org/en-us/firefox/addon/wcag-contrast... to evaluate the contrast.

Re: Flat UI: Free Web User Interface Kit

#134
post #20

Earlier quoted context omitted.

Read some books about Swiss design :) http://www.richardhollis.com/books-as-author-and-designer/sw...

but now I see, that most people that like the flat design "trend", probably have no notion of design history and never even heard about the international typographic style. And that worries me, a lot.

Some of us have though, and I'll talk for days about International Style to anyone who asks :)

Re: Flat UI: Free Web User Interface Kit

#135

Just as a joke, I'd like to see someone do a Skeu UI, the polar opposite, one with such ridiculous degrees of skeuomorphism, that you want to laugh. Maybe have it look like a WW2 era Navy Cockpit.

You'll enjoy http://skeu.it/ :) It's a collection of Dribbble shots that have an overdose of skeuomorphism...

Re: Flat UI: Free Web User Interface Kit

#136

Earlier quoted context omitted.

Good for you but understandable user interfaces are (and should be) higher priority than prettiness; the "warning button" looks like a warning message for me. But of course there are alternatives for visual clues that still look flat-ish: http://i.imgur.com/jXN2tpe.jpg

I have to admit, I like the flat button also but I appreciate you mocking up different versions. I dont think that a button needs to be raised to make people think they can press it. Look at the iOS settings page as an example. These buttons are completely flat. http://cl.ly/image/2j2m3I2R2x1z

The settings page is very specific context and there are no similar elements that aren't actionable so it is easy to learn that these links are links, not just labels. The arrow on the right side is also a nice cue.

You should not generalize from this example that flat buttonlike constructs are as usable as normal buttons in other contexts.

Also while I personally don't like the flat design, I believe it can work with a caveat: you will need to be much more careful in the design as you offer less conventional cues. In this I believe a design that offers more affordances is less prone to small mistakes.

Re: Flat UI: Free Web User Interface Kit

#137

Earlier quoted context omitted.

Good for you but understandable user interfaces are (and should be) higher priority than prettiness; the "warning button" looks like a warning message for me. But of course there are alternatives for visual clues that still look flat-ish: http://i.imgur.com/jXN2tpe.jpg

I have to admit, I like the flat button also but I appreciate you mocking up different versions. I dont think that a button needs to be raised to make people think they can press it. Look at the iOS settings page as an example. These buttons are completely flat. http://cl.ly/image/2j2m3I2R2x1z

Yes, but those are also the ONLY clickable options (and only visual elements, consistently in a list) on the entire screen. This does not hold true (in most cases) for a website / webapp.

Re: Flat UI: Free Web User Interface Kit

#138
post #41

Am I the only one who doesn't love the whole flat trend? It seems like once the novelty wears off, it becomes bland more than anything else.

No, I'm with you.

I find flat very hard to navigate, lazy, and to me is classic style over function or usability. I also find that non net savy folk just look blankly at it and get no real pointers as to what on earth to do with it. I actually think its very poor design, and slightly arrogant in that is assumes that people know what to do, or where to click. It assumes prior knowledge and excludes those with out.

But, its the current fad, trend, fashion, so people will die arguing opposite, until they flock to a new fady design. Try telling your kid that trousers/pants hanging under their butts is stupid and will go out of fashion and they will cry at old photos, like "we" did with 70's fashions!!!! Personally I feel a bit king's new clothes about it. But then, I have been round long enough to see these trends come and go. Flat design = butt pants.

One thing I think is going on is that its gained popularity with small screen devices. I think flat works for low res simple old screens that couldn't show much. Now, with higher res screens, it seems redundant to me. I mean, what is the point of a high res screen if all you do with its is simplistic flat designs? (Yes I know about games and video, but that's a different thing)

Re: Flat UI: Free Web User Interface Kit

#139
post #59

I love the work that was put into this and there are some elements that I think are done extremely well and stand on their own...but after seeing a page where everything is flat, I've totally joined the non-flat side of the debate, due to the confusion/ambiguity of the interface...the buttons were especially jarring for me.

There's an easy solution for this:

As soon as you interact with the page, be it mouse, touch proximity, or keyboard, you could highlight clickable elements - perhaps with a border, perhaps links with an underline.

Then you have the best of both worlds.

Re: Flat UI: Free Web User Interface Kit

#140
post #112
post #59

I love the work that was put into this and there are some elements that I think are done extremely well and stand on their own...but after seeing a page where everything is flat, I've totally joined the non-flat side of the debate, due to the confusion/ambiguity of the interface...the buttons were especially jarring for me.

It gets worse on something like Windows 8's Metro where you get to see like 20 different square blocks, each with a different color, that may update all the time too. Try not to get a brain seizure from that.

OT I still find oversized icons, as in Gnome 3, Unity and Windows 8, almost impossible to grok. I never used to be a fan at all of deep nested menus, but a menu is so much more succinct and easier to grasp.

It might just be something about the visual cohesiveness of all the elements.

Post reply on HN