WAB interface design question
Regarding a website with WAB, I am wondering about the toolbar icons on the top. We're in the business of cartography and graphical user interface design.
What I have done:
They are all dim, unless hovered over. I'd recommend making them full opacity like below.....
... and then highlighting the background on hover, like our site www.sagis.org/home/map
I will probably implement the hover on with CSS on our WAB sites like above soon. I am considering colorizing all the buttons except Layers.
I was just curious if anyone else liked these ideas, or maybe some variation thereof? Perhaps ESRI may want to refine the standard WAB icons or at least make them not 50% opacity, perhaps add a dash of color. What does everyone think? By the way feel free to use my icons. At some point I'll probably have a public site with them. For now they are all only internal.
It would also help with accessibility for low-vision users I would think, with more contrast between icons. Bearing in mind of course that male red-green color blindness is common and building that in to the color choices.
I am seeing the flattening of UI across the Internet and white icons and text sans serif, and it seems Windows 8 has been taken as a good design cue. I am guessing it's probably a fad. Like symbology, I think it has been shown that icons should be quickly recognizeable to people, and so have unique shape, texture, and color. While balancing realism vs distilling the functionality into an icon. A cartoon of a ruler is actually more quickly recognizable than a tiny scrunched up image of a ruler, because it distills the unique visuals into a simpler and more quickly recognized image. So, thoughts from the community? This is perhaps a good project for focus group taste-testing! From the real end-users, not developers.
The end goal being discoverability. Yellow pegman and perhaps to some municipal users the Pictometry logo, are instantly recognizeable.
A sidenote, it would also be nice to have a color picker to pick an overall WAB design color from, instead of only six colors. i.e. the Dojo colorpicker.
