UI design and cultural sensitivity/awareness [closed]

Question

When designing a user interface for an application that is going to be used internationally it is possible to accidentally design an aspect of the UI that is offensive to or inappropriate in another culture.

Have you ever encountered such an issue and if so, how did you resolve the design problem?

Some examples:

1. A GPS skyplot in a surveying application to be used in Northern Ireland. Satellites had to be in a different colour to indicate whether they were in ascent or descent in the sky. Lots of satellites in ascent are considered good as it indicates that GPS coverage will be getting better in the next few hours.
   I chose green for ascent and orange for descent. I had not realised that these colours are associated with Irish Catholics and Irish Protestants. It was suggested that we change the colours. In the end blue and a deep pink were chosen.
2. For applications that are going to be translated into German, I've found that you should add about 50% extra space for the German text compared to the English text.
3. A friend was working on a battlefield planning application for a customer in the Middle East. It was mandated that all crosshairs should take the form of a diagonal cross, to avoid any religious significance.
4. (Edit - added this) In the UK a tick mark (something like √) means yes whereas a cross (x) means no. In Windows 3.1 selected checkboxes used a cross, which confused me the first time I saw it. Since Windows 95 they've used (what I would call) a tick mark. As far as I can tell both a tick and a cross are called a check mark in the US, and mean the same thing

Edit

Please ensure that any reply you add to this question is as culturally sensitive as the user interfaces we're all trying to build! Thanks.

Answer 1

You should try to follow the i18n and l10n pointers provided by the look and feel guidelines for the UI library you're using, or platform you're delivering to. They often contain hints on how to avoid cultural issues, and may even contain icon libraries that have had extensive testing for such potential banana skins.

• Windows User Experience Interaction Guidelines
• Java Look and Feel Design Guidelines
• Apple Human Interface Guidelines
• GNOME Human Interface Guidelines
• KDE User Interface Guidelines

I guess the most important thing is designing your application with i18n in mind from the ground up, so that your UI can be resized depending on the translated text; mnemonics are appropriate for different languages; labels are to the left for latin languages, but on the right for Hebrew and Arabic, etc, etc.

Designing with i18n and l10n in mind means that shipping your product to a location with a different culture, language or currency will not require a re-write, or a different version, just different resources.

Generally speaking, I believe you'll run into more problems with graphics and icons that you will with text (apart from embarrassing translations) simply because people identify more strongly with symbols than particular passages of text.

Answer 2

The idiom to use a big (green) checkmark symbol to mean OK/Yes/Correct is somewhat confusing in Sweden, where the checkmark is typically used to mean "wrong". I.e. when grading tests in school, a teacher will often use a capital R (from the Swedish word for "Right") for a correct answer, and a checkmark ("bock" in Swedish) for "wrong".

I find this issue interesting not only because I'm in the affected group (I'm Swedish), but also because it highlights that these kinds of issues can appear where you might not expect them to. Sweden is a generic Western culture, you might assume that usage of these kinds of symbols should be the same.

Answer 3

Another Yes/No example for Japan

I have to use an online database tool that has some user settings that can be toggled on and off. On is indicated by a green cross (×), Off is indicated by a red circle (○).

In Japan this is confusing since Off (NG, stop, closed) in general would be indicated by a cross (× : batsu) and On (ok, open) by a circle (○ : maru). Adding to that the green red color combination makes things very confusing.

Answer 4

There is a good reason why the Windows resources (and not only) contain more than just strings. A lot of elements should be considered localizable: - colors - images (including icons, toolbars, etc.) - sounds - font and font sizes - alignment - control flags and attributes (think UI mirroring for Arabic & Hebrew) - dialog sizes - etc.

This way all most of the problems can be addressed by the localizers, without any code changes.

For dialogs resizing should either be done by the localizers (to leaving extra space is not necessary), or should use auto-layout (available in frameworks like Java, .NET, Flex, wxWidgets, Qt, etc.)

This might also be a good read: http://msdn.microsoft.com/en-us/goglobal/bb688120.aspx