随着TikTok的海外关注度和影响力逐渐扩展、小红书在海外友人的媒体圈炙手可热，国内的互联网市场逐渐趋于饱和，互联网产品纷纷向东南亚、非洲、拉丁美洲、欧洲扩展商业版图，这也为UI设计师创造了新的机遇。

对于出海产品而言，UI设计师需要有基础的语言文化了解，在此基础上去进行设计才能真正满足海外用户的需求，本文主要从UI的文字、图标、色彩等几个角度来拆解设计师在设计海外项目时需要注意的关键点，避免因为文化习俗差异而影响产品的易用性。

目录：

1.小语种文字：超长文本的处理规则、镜像语言、小语种适配检视技巧

2.图标：需要镜像的典型图标、不需要镜像的典型图标、图标特例

3.颜色

4.图案：禁忌图标、禁忌手势、禁忌物品、禁忌动物

5.交互手势

  小语种文字

① 超长文本的处理规则

当在某些语种下出现界面用语超长显示不完整的情况，应按照如下优先级进行处理：

（1）精简界面用语

在保证可理解的前提下，考虑对该语言的翻译进一步精简，采用其他较短的近义词或者精简表达，如“save number”在界面用语超长时应精简为“save”。

（2）动态布局

当控件周围没有其他控件冲突时，控件可根据界面用语长度动态扩展，如按钮。

（3）缩小文字

将文本逐级缩小，建议最小缩小到18sp/dp。

⚠️并列的层级关系，文本超长时所有文字需要同时缩小字号

（4）多行显示

在设计中文时，提前考虑预留小语种换行空间，⚠️按音节换行。

（5）跑马灯

避免同意界面使用过多的跑马灯，1-3个为宜。过多的跑马灯会分散用户注意力，界面显示混乱。跑马灯占用系统资源，影响性能，过多的跑马灯可能会导致卡顿。

（6）打点截断

显示不下到文字截断显示并在末尾增加“…”

截断的使用场景：

A.用户自定义内容，如文件名，相册名

B.某处显示空间有限，但可以在本层级/上一层级/下一层级查看到全量内容。

② 镜像语言

阿拉伯、波斯语、乌尔都语、希伯来语等语言的书写都是从右向左书写，和当今世界主流语言（如英语）从左向右书写的方向相反。

受文字书写方向的影响，阿拉伯语言的用户对于左右逻辑的认知和英文等LTR （left to right)完全相反，比如习惯将右侧作为开始，左侧作为结束。

为了支持RTL语言和用户习惯特点，在UI设计中，需要在文本，界面布局，手势操作和动画，图标等交互元素中满足RTL的特殊要求。

③ 小语种适配检视技巧

（1）字串显示——检视语言：西班牙语（拉丁美洲）

（2）大字体显示——检视语言：西班牙语（拉丁美洲）

  图标

① 需要镜像的典型图标

（1）后退，前进

（2）显示前进方向的图标，如：骑车 发送 进度条。

（3）右侧具有滑块的音量图标应当镜像，滑块应从右向左显示，如：音量调节。

▲ 阿拉伯语-音量调节

（4）表达含有文本含义的图标，如：对话框、书写、备忘录。

▲ 阿拉伯语-文本含义图标

② 不需要镜像的典型图标

（1）虽然时间的线性表示在RTL中被镜像，但圆形时间方向不是。对于RTL需要，时钟仍然是顺时针转动，时钟图标或带有箭头指向顺时针图标的刷新图标不应该镜像。

▲ 阿拉伯语-带有时间含义的图标

（2）国际标准的图标不需要镜像，如蓝牙。

（3）拟物图标不需要镜像，如SIM卡。

  (4) 斜线不需要镜像 ，如静音图标。

▲ 阿拉伯语-特殊免镜像图标

③ 图标特例

(1)亮度图标需要镜像：英文习惯认为左边暗，右边亮；阿拉伯语习惯认为左亮，右边暗。

(2)阿拉伯语有自己的问号❓

(3)阿拉伯语am.pm的位置要移动到时间左侧

  色彩

1.中东市场：绿色为主、火红与黄色慎用。绿色象征吉祥，但叙利亚视黄色为不祥之兆，伊朗不喜爱蓝色。

2.非洲市场：禁忌多样。黑色普遍被认为不祥，红色在乍得、尼日利亚等国也不受欢迎。

3.欧洲市场：白色神圣，黄色慎用。

  图案

禁忌手势

禁忌物品

禁忌动物

  交互式手势

RTL语言中，带左右滑动方向的图片或者是左右滑动展开功能选项，应遵循与英文界面相反的镜像规则。

▲  汉语-左滑删除

▲  阿拉伯语-右滑删除

優(yōu)網(wǎng)科技秉承"專業(yè)團隊、品質(zhì)服務(wù)" 的經(jīng)營理念，誠信務(wù)實的服務(wù)了近萬家客戶，成為眾多世界500強、集團和上市公司的長期合作伙伴！

優(yōu)網(wǎng)科技成立于2001年，擅長網(wǎng)站建設(shè)、網(wǎng)站與各類業(yè)務(wù)系統(tǒng)深度整合，致力于提供完善的企業(yè)互聯(lián)網(wǎng)解決方案。優(yōu)網(wǎng)科技提供PC端網(wǎng)站建設(shè)（品牌展示型、官方門戶型、營銷商務(wù)型、電子商務(wù)型、信息門戶型、微信小程序定制開發(fā)、移動端應(yīng)用（手機站、APP開發(fā)）、微信定制開發(fā)（微信官網(wǎng)、微信商城、企業(yè)微信）等一系列互聯(lián)網(wǎng)應(yīng)用服務(wù)。