如何从0到1进行国际化/本土化设计落地-Part 1

Stay Woke

这几年国内各大公司纷纷把业务延伸到海外，而把产品全球化却是一件很困难的事情，即使老牌的外企也在摸索。本文从设计前期的筹备到完成设计，总结了一些常见的问题，给出解法，并提供了一些不错的工具，希望给需要做全球化产品的设计师们一些新思路。如有遗漏的或错误的地方欢迎指出。

文中部分图片来源于网络，侵删。

由于文字和图片太多，本文分2部分发布。本章阅读时间大约需要12分钟。

1.1 定义

在信息技术领域，国际化与本地化（英文：internationalization and localization）是指修改软件使之能适应目标市场的语言、地区差异以及技术需要。

国际化简称 i18n，本地化简称 L10n。

国际化和本地化之间的区别虽然微妙，但却很重要。国际化意味着产品有适用于任何地方的“潜力”；本地化则是为了更适合于“特定”地方的使用，而另外增添的特色。用一项产品来说，国际化只需做一次，但本地化则要针对不同的区域各做一次。这两者之间是互补的，并且两者合起来才能让一个系统适用于各地。
（摘自维基百科）

1.2 地域文化差异

如果要做一个产品的本地化，那么进入该市场之前，市场部门应该已经齐备一些关于该地区的基础信息，比如经济，人口，历史等。作为一个外人要了解全部业务涉及的地区的文化不太现实的，下面介绍几个常见的问题。例如

宗教，节日，民俗等问题。比如中东地区尤需要注意。
政治，民族，地缘，历史冲突问题。比如印度和巴基斯坦的历史问题。
色情，暴力，毒品，违禁品的限制等级问题。比如荷兰阿姆斯特丹对毒品和色情的态度。
道德文化，礼貌，社会地位，隐私需求。比如印度的种姓制度。
图片，颜色，符号，图标，手势，隐喻等。比如带绿帽子在爱尔兰裔人看来是在庆祝圣帕特里克节，在中国却是另外一个意思。
母语使用者的哏，母语网络流行用语。比如大概没有几个外国人懂得在美国”45”可以指代川普。

以上所提及的问题，在下文中会有案例说明。

1.3 社会文化模型

这个世界上并非每个人都会以相同的方式去看待相同的事物，来自不同文化的人会对不同的设计产生不一样的心理和行为上的反应，这些心理和行为反映在用户对待奖赏惩罚机制，隐私敏感性，信任感，严谨程度等等有不同的态度和举动。打破固有印象，以文化特征预判用户行为，制作用户角色模型，成为设计师作出设计决策的关键步骤，往往同一个网站会在不同国家地区的本地化页面上会有不同的设计。

推荐工具 https://diverseui.com/
这个网站可以生成多种肤色不同性别的虚拟头像，方便设计师为不同地域用户制作用户角色模型。

1.3.1 霍夫斯泰德文化维度理论

霍夫斯泰德文化维度理论（Hofstede's cultural dimensions theory）可以帮助设计师预判用户心理模型，该理论是荷兰心理学家吉尔特·霍夫斯泰德提出的用来衡量不同国家文化差异的一个框架。他认为文化是在一个环境下人们共同拥有的心理模型，能将一群人与其他人区分开来。通过研究，他将不同文化间的差异归纳为六个基本的文化价值观维度：

权力距离指数（Power Distance Index）：指在家庭、公司、社区等组织机构中地位较低的成员对于权力分配不平等的接受程度。中国的数值是80，表示中国是一个倾向于认为人们之间的不平等是可以接受的社会。

个人主义（Individualism）：与集体主义相对，指个人融入集体的程度，分数越高表述越注重个人。中国的数值是20，表示中国是一种高度集体主义的社会，在这种文化中，人们以集团的利益优先，而不是以自己的利益优先。

不确定性规避指数（Uncertainty Avoidance Index）：指社会能在多大程度上容忍不确定性。中国的数值是30，表示中国人对模棱两可的事情适应性比较强。

男性化（Masculinity）：与女性化（Femininity）相对，指人们（不论男女）更富有竞争精神，自信与野心，注重财富和社会资源的积累，而女性化社会责注重人们之间的关系和生活的品质。中国的数值是66，表示中国是一个倾向于以成功为导向和追求向上的社会。

长期导向（Long-term Orientation）：指社会对未来的重视程度。中国的数值是87，这意味着中国是一个拥有非常务实的文化的社会，并倾向于为未来做准备。

放任与约束（Indulgence VS. Restraint）：指社会成员在多大程度上意图控制自身的欲望。中国的数值是24，表示中国是一个受约束并克制的社会。在这一方面得分较低的社会倾向于愤世嫉俗和悲观主义。

推荐工具 Hofstede Insights

这个网站可以调查对比每个国家的数值情况，并给企业用户提跨文化研究工具。

1.4 法律问题

如果无意触碰一些文化禁忌，产品可能会被敏感人士攻击，但是违反法律规定，产品可能连上架的机会都没有。产品设计中能遇到的常见法律条款是隐私政策和退换货政策。比如欧洲的Distance Selling Regulations规定不拆包装退换货日期是30天。像欧美国家和日本比较注重隐私，日本的手机拍照会有很响亮的咔嚓一声，并且无法消除，这说明所有的相机应用，在进入日本市场的时候，都需要为此条款作出相应的体验适配。

1.5 设备使用情况

1.5.1 设备差异

在10年前，高端大屏幕手机在东南亚和非洲市场普及率并不高，因此做出海适配会比较麻烦。但是最近这几年，由于市场经济的发展，和中国手机的成功出海，即使是东南亚和非州的发展中国家，高端移动设备的普及率已经很高。设计师做移动屏幕适配基本上可以按照1334x750（2x）或者2436×1125（3x）的尺寸做设计。

每个国家的流行机型不一样。比如非洲最受欢迎的手机是深圳品牌传音，它的一些手机特性比如适合黑人的美颜相机功能，大容量电池，多卡多待功能等，跟在其他地区最受欢迎的手机型号比如iPhone, Samsung系列不一样。在落地本土化设计的时候，最好有一部真实的手机最为测试对象，这样你会发现很多之前无法预测的问题。

另外有一点值得注意的是，在同时拥有网站和App的产品，或在响应式网站中，有可能会出现移动设备浏览率高，桌面设备付费率高的情况，或者相反情况。这可能是地方用户习惯，也可能是两种设备体验感受导致，可以根据需要在后期做出相应的调整。

1.5.2 网速问题

很多国内公司出海，会选择东南亚为第一个市场。以东南亚为例，这些国家（新加坡除外）的网速普遍比较慢。柬埔寨，马来西亚，印度尼西亚，菲律宾，泰国和越南，六个国家的平均下载速度低于10 Mbps。这说明当你的产品是依靠视频或动效作为主要展现形式，在进入该市场时应做出调整。

每个国家对流量的收费不同，有的电信提供商会根据网速做阶梯定价。有些发展中国家，即使网速很快，但是因普通的居民的收入较低，依然不会为高速网络买单。比如菲律宾，中等城市Bacolod的居民平均收入大约15,000php一个月，一个顺畅的网络套餐却要1799php一个月，这说明很多用户会选择更低速低价的上网套餐。这时候主要受众网速就会成为做出设计决定的关键因素。

预测网速除了在网上查看各区域电信商的报告外，还可以使用该区域的VPN做测试，当然如果你的公司有当地土本团队可以参与调研再好不过。

1.6 用户消费习惯差异

1.6.1支付方式

支付体系做得好不好影响着最终的成交量，每个国家的支付习惯大相径庭。比如德国用户喜欢用未结发票支付，美国喜欢用信用卡，巴西喜欢用分期付款，日本和德国用现金寄付的方式也很常见。中国通用的支付宝微信也慢慢打开国门，但海外使用率还是比较少。如果支付方式没有做好本地化，即使设计做得多别出心裁也没有用。

推荐工具 Statista

这个网址可以付费查询多数国家的支付方式信息。

1.6.2 税

每个地区的购物交税方式都不一样。在中国“包邮包税”是一个电商常见操作，而在美国，每个州的税率可能都不一样；在日本，不管线上线下，是否包税需要在商品上明确标出。由于交税的方式不一样，这些差异影响到商品的展示，价格的设计层级，结算层级，及在小屏幕中字符缩放省略等。

1.6.3 购买习惯

购买习惯会改变一个产品任务的流程。比如，一些国家地区买车时会打包所有的配件功能一起卖，一些国家则会销售裸车，让用户按照自己的喜好额外购买配件。一些国家出差是允许报销餐费的，那么有早餐的酒店会比没早餐的酒店更受欢迎。这些习惯如果不是当地人会比较难发现。

1.7 Ui设计模式

利用本地人熟悉的UI模式比引入其他已知模式,并要求本地用户适应这种模式更为有效。去体验最受欢迎的本地应用和门户网站，会发现国家不一样会使用不一样的UI模式。当大多数产品趋于同化后，就养成了一个地区的用户习惯，突然让用户接受新的UI模式，会让用户觉得困惑，需要重新学习，并感觉这不是为自己而设计的产品。

比如中国的互联网产品有自己特定的设计模式，会将单个应用视为一个生态系统，而不是单一功能产品。而美国的产品设计模式则是简洁有力，功能单一。比较两个国家最常见的支付应用PayPal和支付宝的界面，PayPal更倾向于把重心放在一个核心功能本身上，而中国更倚重于优化流量，形成生态系统。

1.8 与本土团队合作

如果针对特定的语言环境进行设计，那么团队中有一位了解当地文化的人非常有价值。本地团队可以帮助你解决一些文化禁忌，市场习惯，语言翻译等等问题，而且在业务上可以跟当地的客户建立联系。

如果要为国际用户构建产品，那么具有不同国籍和背景的团队成员可以从不同的角度考虑产品，并产生比同背景团队更多的创意。多元化和包容性的工作环境可带来多种好处，包括更高的客户满意度，更高的社会敏感性和创新能力。

2.1 内容和翻译

2.1.1 不要使用文化哏

在1.2 地域文化差异里，提到过尽量避免用隐喻，也不要使用只有自己文化能看懂的哏。在营销的角度上讲，给功能取一些有趣的文案，可以提高品牌调性，可是从国际化的角度来说，翻译出来的语言不一定会有源语言的效果，甚至毫无意义。

例如，Dropbox 向用户提供了一个在文件里加上无限的历史版本记录的功能，叫“Packrat”, 尽管“Packrat”在英语里一语双关，然而对其他语言用户来讲，这很让人困惑。最终这个功能还是改成了直白易懂的”Extended version history”。

引用自Design for internationalization, John Saito

2.1.2 同时提供源语言与翻译版本

英语作为最常用国际通用语言，做产品国际化时使用英语为原始版本是最佳的选择。当产品某些内容迫不得已使用机器自动翻译的时候（大家都知道自动翻译并不完美），这时候应该给用户看到原始英文版本的选择。Airbnb提供了类似思路，不过它的做法刚好相反，显示英文，但是给用户翻译成中文的按钮。

值得注意的是，提供实时翻译的时候应该注意内容的位置锚点，因为译文高度可能是原文的几倍，翻译后阅读位置应该定位到用户原来阅读的位置。

2.1.3 翻译中单词结构差异

翻译时，一些单词或者句子，在别的语言里不一定能找到相同结构的翻译。比如芬兰语、德语和荷兰语，都会以一些单独的大型单词来取代其他语言中的短语。

例如，“输入处理功能”的英文翻译为 "Input processing features”，在德语，芬兰语，挪威语翻译都是一个长单词。在一些需要控制长度的设计或者小屏幕设计下，比如窄小的表单，按钮，菜单栏等，中文和英文都容易折成两行，但是在德文，芬兰语，挪威语中不能折行。这时候就需要重新考虑排版。具体做法请参考下文2.2.4 翻译文本所需空间，2.2.5 避免在狭小空间放文字

2.1.4 是否使用缩写

如果遇到以上情况，一个单词占了超过一行的空间，也许会有人提议使用缩写。然而使用缩写也并不可行。因为如果一个产品需要翻译多个版本，同一个单词或短句不一定在别的语言中找到同意思的缩写。

事实上缩写在许多语言中并不常见。比如，阿拉伯语的单词结构是非常紧凑，加上前缀，后缀和少许的局部变化，才能确切地表达单词的含义，使用缩写将会造成意思曲解。以常用的FAQ为例：

2.2 翻译排版

2.2.1 文字类型

在分析翻译排版前，需要研究文字类型，这有助于页面的最大程度地兼容所有翻译版本。设计页面时，可以根据业务涉及的国家数量去整合文字类型，调整排版。比如阿里做国际化时，把18种文字分为4种类型：拉丁字符，希腊/西里尔字符，图形字符，方格字符。

如果涉及的语言种类繁多，可以参考Material Design对字体类型的定义，它把世界上常见的字体分为3中类型字体：

拉丁字符：西欧，中欧和东欧以及非洲大部分地区的语言通常以拉丁字母书写，（越南文字是拉丁语延伸的，但是有音标所以行高较高属于高字符）。这类型文字有英语，希腊语，西里尔文，希伯来语，亚美尼亚语，格鲁吉亚语，等等。

高字符：南亚，东南亚，中东通常以高字符书写。这类型字符的不仅字型比较高，而且需要额外的行高，因识别性问题需要避免使用粗体。这类型文字有阿拉伯语，北印度语，泰卢固语，泰语，越南语，等等。

密集字符：东亚文字，这类型文字形状饱满，长段文字避免使用粗体，提高行高可提高可阅读性。这类型行文字包括中文，日文，韩文。

2.2.2 翻译字体选择

如果你的品牌非常有个性，并有自己的品牌字体，那么这将会加大本土化落地的难度。解决这个难题，一个是公司开发的品牌字体足够多能涉及所有业务涉及的国家；二是使用系统默认字体。

文字也承载着品牌连续性。比如如果英文中使用的是衬线字体，那么翻译的时候，需要找相似字形的字体。

2.2.3 字型字号选择

为里保持字体的可读性，按照每种文字的特性改变字型。比如阿拉伯文在翻译时需要在英语的基础上增加字号，由内涵基线的天城文演变而成的尼泊尔语，印地语，孟加拉语等不适合加下划线等。如以下案例，天城文加了下划线后，视觉上下划线成为了文字的一部分：

2.2.4 翻译文本所需空间

高度

从上文我们看出非拉丁字符往往会高于拉丁字符，不仅如此，由于这些文字的高度或者密集的特性，本身就会导致排列高度的增加。下图以英语为基准，印地语，越南语，泰语，日语，韩语，高度都比英语要高：

在追求最佳的可读性下，这些文字往往需要更高的垂直空间，也就是行高。下图以英语和泰语为例子，在同一“a”高度下，同样意思的泰语文本比英语需要的垂直空间大概多了130%。泰语的Y轴字符间距是英语的1.6倍。至于具体需要的空间，建议以英语为标准，多次测试目标语言的不同文案，以得到最佳的行高排版。

长度

如果一个产品没有做好产品翻译适配，很可能会出现文字溢出或者文字被砍断隐藏。例如：

这是因为做本土化翻译的时候，没有考虑好每种语言翻译后的长度，特别是在字符较少的情况下，译文所会产生的变化越大。

1994年IBM发表的的National Language Design Guide 中，当文本从英语翻译为其他各国欧洲语言时，预期长度的平均变化比率如下表：

这里只给出了欧洲文字的对比，基于欧洲文字基本属于拉丁语系，如果加入高字符和密集字符，表格会有很大变化。

解决翻译文字长度问题，有以下四种方法：

方法1

这个方法受到Dropbox Design启发，用Google Doc制作一张内嵌Google Translate的表格，估计翻译的文本的大概长度，设计时可以根据表格内容预留空间。值得注意的是，即使翻译的字符数量一样，在日语中，每个字符所占的空间也许会比较宽。例如下图，翻译后的日语比英语少了20个字符，但却占用了更多的水平空间：

推荐工具笔者做的实时翻译表格

打开表格需要爬梯子，而且表格只给了查看权限，如果大家有需求，可以自己做一个。制作方法也很简单，只需要 内嵌翻译 + 找出语言代码 + 计算字符 。

方法2

Phrasapp Sketch Plugin 可以在Sketch里翻译，直接给出各个语言版本翻译。非常方便，缺点是可以翻译的语言有限。

推荐工具 Phrasapp Sketch Plugin

方法3

如果你设计的是一个支持各种语言的响应式网站，但是资源不够不足以使用以上方法，那么MakeFit可以帮你调整文本大小以适配屏幕宽度。这是一个快速但并不完美的办法，有时候长段文字会被缩小，影响可读性。

推荐工具 MakeFit

方法4

在你的需要翻译的语言中，选择一种最短的和一种最长的语言做适配设计，最终选定一个合适的方案。这个方案比较省事，只适合长段文字，因为单词数量越少，需要的水平空间越无法估算。比如下图，社交产品常用的单词Like的译文空间差距甚大：

方法5

当你翻译的是短句或者单词时，可以考虑使用图标替换文字。

只要使用图标容易理解且没有文化偏见或冒犯，那么使用图标代替文本是解决短文案翻译空间扩展的最有效方法。值得注意的是，1.需要检查使用的图标在本地文化中是否有歧义。2，即使最通用的图标也有些人不理解，文字是最伟大的表意工具，所以当鼠标移过出现翻译文字解释，是一个很好的解决方案。例如：

2.2.5 避免在狭小空间放文字

在网页设计中，会用删格系统去归纳内容和适配屏幕，一般会以删格形式把内容分割成3列或4列，是一种很常见的设计版式。如果你的内容是在1440px的尺寸下设计的，适配到768px时候，有可能会导致折行，这会影响设计的美感。而以英语为初始语言的设计，一旦翻译成别的语言，这种情况有可能会更严重。下图是中文版本与德语版本对比：