Interface stress-test checklist
Alex Railean
http://info.railean.net/index.php?title=UI_stress_test_checklist
This list is used to verify the viability of a prototype. Each case
usually brings out various issues, such as misaligned controls,
hardcoded coordinates or colours, etc.
If a program passes this test, it is doubeplusgood!
I added a new entry to the list - play with the UI while the strings
are mangled. This means that all the labels on the buttons are changed
into mojibake - in order to simulate how a foreigner sees the program.
In such circumstances, people can only rely on icons, hotkeys and HIG
compliance (i.e. the program behaves like a typical program - so 'what
works there should work here too') to get things done.
In this context, I must emphasize that strings must not be
hardcoded, but loaded from a resource file - making such 'mijobake
tests' easy to implement.
Good luck!
Pavel Tuzov
Konstantin Grushetsky
Alex, what do you mean by "Custom themes"? Design the application so it supports different themes?
Pavel Tuzov
Why then “Custom”? (:
Sergiu Calancea
Alex Railean
> Alex, what do you mean by "Custom themes"? Design the application so
> it supports different themes?
There are several ways to deal with colours:
- hardcode RGB values (5:23:18,FF:FF:FF,GG:GG:GG - whiter than white)
- hardcode colour macros (Gray, Green, Teal, Navy, etc)
- rely on theme values
The last point is what I have in mind. UI elements in Windows have a
generic name for their colour.
For example, if I highlight text, it is blue (by default). This blue
is not defined as "Blue" or as "0:0:255". It is actually defined as
COLOR_HIGHLIGHT.
If someone has a custom theme and sets COLOR_HIGHLIGHT to zmeuriu,
then programs that had a hardcoded blue will look ugly, whereas
programs tha dynamically retrieved the colour ID will use zmeuriu.
The function you need is GetSysColor:
http://msdn.microsoft.com/en-us/library/ms724371(v=vs.85).aspx
In your specific example, you use green under the "pseudo-tabs that
are not tabs", you use green and yellow in the "week/day radioboxes
that are not radioboxes". It is fine by my standards, since green is
my second favourite colour after zmeuriu.
However, if one day I change my habits and my theme - your program
will be green, despite my new fashion preferences.
In contrast, if you use GetSysColor to retrieve colours from the
current theme, you can adapt the program's appearance to completely
new environments, and it will [in theory] look pretty.
With such an approach, we trust folks from Redmond when it comes to
choosing colours that go well together.
I haven't tinkered with this on other operating systems, but I'm
pretty sure they have similar mechanisms in place.
Alex Railean
> Why then “Custom”? (:
Because there is a way to adjust those colours by hand, instead of
choosing a predefined theme from Windows:
http://jooh.no/web/Windows_7_window_color_big.jpg
Also check out the helpful reply here:
http://www.msfn.org/board/topic/133082-window-background-color/
I think that this thread will clarify things for them, at last!
Indeed, it is an interesting aspect.
I've made some experiments with this some time ago. I am right-handed
in real life, but in another life - I am left handed. Every now and
then I use the mouse with the left hand (without swapping the buttons)
and use the left hand exclusively for interacting with widgets, door
knobs, buttons, keys, phones)
/*
The scriptures of ancient geeks say that I can be a better mother if
both my hands are well-trained; this improves multi-tasking abilities.
*/
Dima [Calancea] is left handed when it comes to writing, but he uses
the mouse with the right hand. That's interesting too.
I did not notice any discomfort in using interfaces with the left hand
on top of the mouse; but maybe that is because deep in my heart [if I
have one], I am right-handed. [citation needed]
I am not sure there is much we can do to support lefties, because the
right-hand bias that exists in computers is there at the level of
hardware, the OS and the frameworks. In the specific case mentioned
by Sergiu, the performance boost comes from the fact that keyboards
have the numpad on the right side.
Well, there is not much we can do about it - unless we put on the
"hardware designer" hats. Besides that, there are keyboards with
detachable numpads, there are even independent numpads with USB
interfaces - so this problem can be solved at the hardware level.
Still, it is a good idea to keep this use case in mind; it is exotic -
but it makes a difference to some people.
I prefer not to use the numpad, because it is right-hand optimized;
whereas if I use the top row of the keyboard to enter numerical data -
I can do so with both my hands - hence it is "massively parallel".
Pavel Tuzov
But I stopped at using system colors for some backgrounds and labels, which was enough to make my UI compatible with contrast themes.
Your suggestion to use system colors for each part of UI seems logical to me and, I agree, the interface will be a very flexible one, but in this case I end up using only about 15? colors exposed by the current theme (http://blogs.msdn.com/b/wpf/archive/2010/11/30/systemcolors-reference.aspx ), many of which are deviations of white and black.
What about "Rich UI designs" then? (: What color should I use to warn user that entered path does not exist? InfoBrush (which is almost white)?
Another question (rhetoric): what is the estimated ratio of our potential users that are used to change default system colors (Vs those who have no idea about this feature, but prefer "colorful" UIs)?
While I'm writing this email, I look at MS Outlook. I'm sure this "Blue Ribbon" theme defines a custom color and I can't change it from display properties.
As a conclusion, I think I'll stay with my current 'design' which is compatible (almost) with all contrast themes, which will satisfy more or less people that want different backgrounds and labels system colors and uses appropriate (IMHO) colors to improve user experience.
Alex Railean
> What about "Rich UI designs" then? (: What color should I use to warn user that
> entered path does not exist? InfoBrush (which is almost white)?
You should use HighlightBrush, this colour is 'far' enough from the
colour of the background to be easily noticed when it is shown on the
screen.
The scheme is designed in such a way that colours that are supposed to
be distinguashable from other colours - are distinguishable. Therefore
I think it is reasonable to give it a try this way and see what it
looks like - hopefully Microsoft did enough research before choosing
those colours.
Given that Windows itself relies on those colours, and that Windows 7
looks good - I think the assumption is a good one.
> Another question (rhetoric): what is the estimated ratio of our potential users
> that are used to change default system colors (Vs those who have no idea about
> this feature, but prefer "colorful" UIs)?
If X is the number of "normal" people, and Y is the number of
"abnormal" people, then Y' is the _real_ number of abnormal people;
and Y' > Y.
As they say - if you design something for accessibility, it makes the
regular uses cases better too.
> While I'm writing this email, I look at MS Outlook. I'm sure this "Blue Ribbon"
> theme defines a custom color and I can't change it from display properties.
Yes, last time I checked, the ribbon used its own themes. However,
they are switched automatically when the OS theme changes; there's a
high-contrast scheme as well.
There are third-party ribbons* from other vendors - I suspect they will
behave less politely [because those vendors didn't take edge cases into
account].
Alex Railean
Pavel Tuzov
> Yes, last time I checked, the ribbon used its own themes. However,
> they are switched automatically when the OS theme changes; there's a
> high-contrast scheme as well.
I was talking about "The Blue" color of "Blue Ribbon" theme. The color does not get switched. What I meant to say is that this blue is not a system color.
My UI also changes look/appearance when you switch theme (as you've seen at one of our meetings). Moreover, I can define a style for each control which will be used when a high contrast theme is switched on. But this is not the problem I was talking about...
The problem is limiting your UI only to this small set of colors. UX becomes cold and boring without green and red (:
Alex Railean
is called Agave: http://home.gna.org/colorscheme/
And there's this site - looks interesting too: http://www.colr.org/
http://home.gna.org/colorscheme/images/screenshots/colorscheme-0.2.2.1.png
Изберете цвят и вид палитра :-)
Konstantin Grushetsky
And there's this site - looks interesting too: http://www.colr.org/
http://home.gna.org/colorscheme/images/screenshots/colorscheme-0.2.2.1.png
Изберете цвят и вид палитра :-)