Usability - SIG, Spin, Echo icons [was Re: Icon theme for ubuntu]

David Nielsen david at lovesunix.net
Thu Nov 22 15:54:33 UTC 2007


tor, 22 11 2007 kl. 13:15 +0100, skrev Martin Sourada:
> On Thu, 2007-11-22 at 11:17 +0100, David Nielsen wrote:
> > I just walked away from the screen to see which icons would work at that
> > distance - I would disagree that you have well defined shapes to begin
> > with. I also remind you that having a strong black outline helps the
> > brain define the shape which is why the games icon appears to work so
> > well.
> > 
> OK, then assume they are not so well defined. BUT. As I look at the
> filtered images I see no difference as to how well is the shape defined
> in original and in filtered images. It's just that some details are
> washed out, but the shape remains defined to same extent (which you
> think is not enough).

Colorblindness as such should only affect the shape definition if you
have clashing colors. Shape issues would tend to be more pronounced with
poor eyesight such as simulated with a blur filter (I seem to remember
jimmac having scripts to automate this). I didn't mean to give the
impression that shape was affected by colorblindness, information
exchange can be though.

Colorblindness will affect the information you convey, it's largely
important that you don't depend on things like red indicating bad and
green indicating good (as the extreme examples). The absolute best way
to avoid that is to regularly take a snapshot of your desktop in real
use and run it through VisCheck. If you aren't colorblind it's hard to
take it into consideration in the design phase since you are not living
with it. The best option is simulation on a regular basis for you as a
designer.

> I can only say I have to disagree. I see there more degrees of freedom
> when defining 3D (meaning isometric perspective) shape than in defining
> 2D (meaning head on perspective) shape, which basically means that we
> are able to further distinguish in 3D between shapes that are
> indistinguishable in 2D. And I think one should be able to clearly
> distinguish *between* the shapes.

By reducing the surface area you are reducing the effective amount of
information carried. That has a pronounced effect on usability and
accessibility. 

> > Why am I suddenly reminded of that old game Lemmings?
> > 
> Sadly, I don't know this game.

It's a fun game, here's a version reimplemented in DHTML:
http://www.elizium.nu/scripts/lemmings/

> That I don't see them it does not mean that I don't care about them. I
> appreciate what you did, but I fail to see the problem there - my eyes
> or brain just are not capable of seeing the problem where you see it (so
> your guidance in this matter would be appreciated). You are the one with
> experience, so if You could help to improve the guidelines, it would
> make Echo better in the future.
> 
> And once more to the shape... My eyes aren't so good when seeing distant
> objects, so I tried to go further from my PC while looking at tritanope
> image. All shapes there lost their clear differences between themselves
> more or less at the same time, so when I say I do not see there a
> problem it means that I do not see it physically, from which one could
> assume that the problem isn't here, but you say it is here, so I am most
> likely wrong.

Okay remember that eyesight is tricky, the evolution of the human eye
has brought about some interesting quirks like the blind spot it's
definitely not simple to adjust an interface to suit this complex
system. Let alone possible to ensure it works universally. I mean there
are good evolutionary reasons why green is a restful color to the eye so
we might be tempted to make the whole thing green - that means we have
to care deeply about the use of red since a significant amount of users
will experience issues with that combination.

The general concerns with regards to colorblindness is clashing colors
and reliance on specific colors to convey specific information -
red/green colorblindness being the most common makes those the prime
suspects. This however does not mean you can't use those colors, but
that certain combinations are bad.

Shape is important and size is important, remember that most people
walking around you wear glasses or need them. Also remember that no
eyesight correction with glasses is perfect, this means you can win some
recognition by going for a clear shape and reducing detail level. Try
applying a mild blur to a screenshot.

Another great way of testing if the information you are trying to convey
is getting across. Switch your language setting and pick something which
you know nothing about - I like chinese. If a user can navigate the
desktop using only the icons then you win.. big time (also I'll buy you
beer and cake since that would be heroic). Optimally we would have a
kind of test language that turned every string into "----------" since
that would not be subject to untranslated strings, use of similar words
and such that might affect the test subject but for now just picking a
language the user doesn't know which has good coverage will suffice.

I would propose these general guidelines:

Less detail at small sizes
No isometric prespective at small sizes
Defined outlines are your friend

Test a real world scenerio with VisCheck and blur filtering, single icon
testing does not tend to yield as convincing a result as a whole picture
in real size since you get the environment colors as background.

Switch your language and get <elderly person or child of choice> to play
around with the desktop, ask them to perform real world tasks like
opening the web browser, doing a bit of wordprocessing e.g. That should
give you a good idea of problem areas for color, shapeness and
information.

- David
-------------- next part --------------
A non-text attachment was scrubbed...
Name: signature.asc
Type: application/pgp-signature
Size: 189 bytes
Desc: Dette er en digitalt underskrevet brevdel
URL: <http://listman.redhat.com/archives/fedora-art-list/attachments/20071122/dd541f19/attachment.sig>


More information about the Fedora-art-list mailing list