近年来，越来越多的国内开发者将目光从国内转移到国外，纷纷投入到移动大航海时代的浪潮之中。在产品国际化的过程中，你的产品 UI 是否也跟上了国际化的步伐？下面几 条关于 UI 设计国际化的建议，值得一看。
1. 为较长的翻译留出空间
最常见的国际化问题是没有为翻译留出足够的空间。以标签「New!」为例，在英语中，只是带感叹号的 4 个字符，但是在法语中，则是 9 个字符：「Nouveau !」。这是英语尺寸的两倍多，并且在法语中，在感叹号之前应该有一个空格。
如果你的设计包含单词，确保你留出了足够的空间来适应较长的译文。如果不这样的话，你可能会以重叠或截断的文本而告终，如下图：
2. 避免以窄栏的形式放置文字
栏是一种用以组织内容的优秀方式。它们创造了平衡、结构和韵律。它们和你精心设计的网格系统配合良好。
但是当你的文本长度变得不可预测时会发生什么呢？这就是在翻译时会发生的事情。你 1 行的标题可能会变成 2 到 3 行，而且你美丽的平衡布局会被突然打破。 折断的文字可以毁掉设计师一天的好心情。当你以窄栏的形式放置文本时，很有可能一些译文会折断成多行。
一个安全的选择是用宽行来替代窄栏，这会给你的文本提供更多的延展空间却不会破坏排版。
3. 不要在图片中嵌入文字
如果你的设计包含有带文字的图片，这在翻译成不同语言时可能会成为一个噩梦。翻译者可以在 Photoshop 或 Sketch 文件中翻译每个文字图层，但这会变得凌乱，因为你或许要调整每种语言的布局来适应较长的译文。
可以考虑用其他方式添加文字，比如用 CSS 生成覆盖文本。
4. 不要用 UI 元素来造句
设计师通常会移动不同的 UI 元素来查看哪种布局是最适合的。但是当你处理语句的时候你要额外小心。如果你试图把文字和按钮、文本框或下拉列表相结合来组成句子的时候，你经常会遇到很多困难。
如上图所示，这会让 UI 国际化变得混乱。原因如下：
• 不同的次序：不同的语言有不同的词语排列方法。如果你将 “买 3 件衬衫” 翻译成日语时，单词 “买” 将会移到句子末尾。如果你的设计依赖于特定顺序的词句，那么就不适用于每一种语言。
• 复数形式：在英语中每个名词只有一种单数形式和一种复数形式，如：“1 picture」和 “__ pictures”。但是在俄语中，则有 3 种可能的形式。所以如果一个用户需要在句子中输入一个数字的时候，整个句子可能会根据输入的数字出现语法错误。
• 词性：某些语言针对名词或形容词会有特定词性的形式。在法语中，根据其所描述的事物，单词 “large” 可以被翻译成 “grand”、“grande”、“grands” 或者 “grandes”。如果你把一个下拉列表放到句子中，这个句子可能会因其周围的词句出现语法错误。所以你会如何替代？一个较好的选择是让 UI 元素置于句外：
5. 注意隐喻产品
设计总与隐喻相关。每个图标，每个按钮以及每个交互都是物理世界中某种事物的隐喻。如：Dropbox 的图标是存储箱的隐喻。点击并拖动是你用手拿东西的隐喻。但是某些隐喻在不同的文化中的意思会有所不同。在美国，猫头鹰代表智慧。在芬兰与印度，猫头鹰则代表愚蠢。
同一种物品在世界各地看起来也各不相同。对于大多数美国人来说，下面的物品就是一个邮箱，但是在全球，邮箱看起来可不是这个样子。大部分国家不会在他们的邮箱上树立旗子，所以这个隐喻并不会让所有人都理解。
如果可能的话，在将隐喻加入你的设计之前可以进行一些研究。如果不确定全球用户是如何感知某一图标或者插图的时候，可以由国际化团队来检查它们。
6. 使用描述性的特性名称
从市场营销的角度来看，起一个引发人们谈论的有趣名称是件诱人的事情。但是有趣的名称难于翻译，并且在不同的语言中它们可能毫无意义。多年以前，Dropbox 引入了一个让用户查看文件无限版本历史的功能特性，最初叫做 “口袋老鼠”（Packrat）。
虽然「口袋老鼠」对于美国用户来可能是一个巧妙的名字，但是在其他语言中则毫无意义。旁边的老鼠图标让事情更加难以理解。于是，后来他们把这个名字改为「拓展版本历史」，这个翻译起来容易多了。
为了避免翻译错误，使用描述性的词汇来表达特性名称更加安全。描述性的词看起来可能会有点无聊，但是它们更加有助于正确翻译和提高可用性。
总之，设计师在进行国际化的产品 UI 设计时需要格外注意翻译适配、设计隐喻和文案撰写三个方面，针对拿不准的设计提前进行调研并不断拓宽自己的视野，只有这样才能为不同语言、国家、文化的用户提供一致的产品体验。
[dqr_code size="120" bgcolor="#fff"]