随着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语言中,带左右滑动方向的图片或者是左右滑动展开功能选项,应遵循与英文界面相反的镜像规则。
▲ 阿拉伯语-右滑删除

优网科技秉承"专业团队、品质服务" 的经营理念,诚信务实的服务了近万家客户,成为众多世界500强、集团和上市公司的长期合作伙伴!
优网科技成立于2001年,擅长网站建设、网站与各类业务系统深度整合,致力于提供完善的企业互联网解决方案。优网科技提供PC端网站建设(品牌展示型、官方门户型、营销商务型、电子商务型、信息门户型、DIY体验、720全景展厅及3D虚拟仿真)、移动端应用(手机站、APP开发)、微信定制开发(微信官网、微信商城、企业微信)、微信小程序定制开发等一系列互联网应用服务。