一、項(xiàng)目背景

更多B端出海經(jīng)驗(yàn)：

二、JDL 國際業(yè)務(wù)情況

1. 覆蓋國家和地區(qū)

目前 JDL 國際物流業(yè)務(wù)已覆蓋美國、荷蘭、英國、智利、日本、澳洲、中國香港等 220 多個(gè)國家和地區(qū)，涉及的語言有中文、英文、印尼語、泰語、馬來語、日語等，為多國提供專業(yè)的倉運(yùn)配物流軟件+自動(dòng)化倉儲(chǔ)規(guī)劃+物流運(yùn)營經(jīng)驗(yàn)結(jié)合的一體化供應(yīng)鏈方案。

2. 具有包容性的國際化產(chǎn)品

跨國業(yè)務(wù)的需求量增多，促使我們需要一個(gè)具有「國際化」 產(chǎn)品來服務(wù)于不同國家的用戶，而國際化的主要需求特點(diǎn)就是——包容性。

三、國際化特點(diǎn)

喜好差異：在不同的文化與生活背景下，左右著人們的喜好。例如不同顏色在不同國家所代表的意義也完全不同，在中國的文化背景里，紅色代表著吉祥喜慶。新年等節(jié)日元素中，大家都會(huì)使用紅色，而不是藍(lán)色，綠色。

行為差異：文化受到多方因素的影響，例如地理、經(jīng)濟(jì)、社會(huì)政治等因素，不同文化背景下成長的人，養(yǎng)成不同的行為習(xí)慣，例如國內(nèi)的閱讀習(xí)慣是從左向右，但穆斯林國家是從右向左。

喜好差異與行為差異，都是會(huì)影響視覺界面的重要因素，例子還有很多，內(nèi)容如下：

1. 喜好差異

基于不同的文化背景，色彩所代表的意義與情緒感受會(huì)有所不同。了解色彩禁忌，規(guī)避文化沖突的風(fēng)險(xiǎn)。

中國香港地區(qū)：白、黑、灰色不大受歡迎，紅、黃和鮮艷的色彩則很受歡迎。

日本：喜愛紅、白、藍(lán)、橙、黃等色，禁忌黑白相間色、綠色、深灰色。

泰國：喜愛紅、黃色，禁忌褐色。

馬來西亞：伊斯蘭教區(qū)喜愛綠色……

文化背景不同，宗教信仰的差異，會(huì)表現(xiàn)在一些禁忌上，這里簡單的說一下圖案的使用，界面設(shè)計(jì)時(shí)要結(jié)合國家特性使用圖案，特別要避免使用一些禁忌圖形。

在圖標(biāo)運(yùn)用中，視覺設(shè)計(jì)師經(jīng)常使用日常中熟悉的元素。然而不同的國家有不同的文化理解與不同的形狀。

國際頁面上使用的照片、插圖盡量避免人物膚色單一，避免帶來一些敏感性問題，不使用真實(shí)環(huán)境中的膚色也是一樣不錯(cuò)的方案。

2. 行為差異

不同國家的閱讀順序不一樣，界面中文字排布要特別符合當(dāng)?shù)厝说拈喿x習(xí)慣，很多中東國家的語言閱讀習(xí)慣是從右向左的（RTL）。

從左到右（Left-to-Right 以下簡稱 LTR），如漢語、英語、韓語、日語；

從右到左（Right-to-Left 以下簡稱 RTL），如阿拉伯語、波斯語、烏爾都語等。

中國的地址通常是按照“國家-省-市-地區(qū)-道路-小區(qū)-樓房-樓層-房間號”的順序，是由大到小的順序書寫，英美國家的地址恰恰相反，是由小到大的書寫方式。

例如：#20A, 2345 Belmont Avenue, Durham, NC，27700

其中#代表公寓號，2345 Belmont Avenue 代表街道號，Durham 是城市，NC 是州，27700 是郵編，一般在網(wǎng)上郵編、城市和州都有分出來讓你分別填寫，如果沒有的話就按上面的內(nèi)容填寫。

不同國家的時(shí)間展示方式不同，會(huì)影響用戶的理解成本，如果使用錯(cuò)誤的話會(huì)導(dǎo)致不必要的錯(cuò)誤發(fā)生。

如果涉及到多國家使用同一套樣式，電話號碼部分不建議用“空格”區(qū)分位數(shù)。但為了提高用戶體驗(yàn)，在頁面落地時(shí)可以，按照每個(gè)國家習(xí)慣格式展示。

RMB 并不是國際通用的人民幣縮寫，而是由 ISO 4217 定義的 CNY。同樣的，為了避免出現(xiàn)其他標(biāo)準(zhǔn)上或理解上的錯(cuò)誤，建議統(tǒng)一使用 ISO 標(biāo)準(zhǔn)。

四、B 端國際化設(shè)計(jì)策略

在了解了上方的這些國際化差異特點(diǎn)后，如何應(yīng)用到具體的國際化項(xiàng)目？我們可以從表現(xiàn)層、行為層、業(yè)務(wù)層三個(gè)角度去思考。

1. 表現(xiàn)層

（圖片來源于，阿里云官網(wǎng)中國站/海外站 https://www.aliyun.com/?utm_content=se_1013083955 ）

例如，阿里在中國站與國際站頁面，采用了完全兩種視覺風(fēng)格。

國內(nèi)版色彩清亮并使用 3D 元素+動(dòng)效元素，而國際版更多的會(huì)選用穩(wěn)重深沉的顏色，比如灰、深藍(lán)、黑色等，圖片選用上，多為一些重色、扁平的圖片，可以起到感觀刺激的作用。

京東印尼 logo 設(shè)計(jì)：京東 Logo 在國內(nèi)和其他國際站點(diǎn)都是用的小狗，在做印尼的 logo 設(shè)計(jì)時(shí)，避開使用狗的元素，改成了小馬，充分表達(dá)了對本地文化的尊重。

（伊斯蘭教規(guī)定禁止把狗當(dāng)作寵物養(yǎng)在家中，也不允許把狗當(dāng)做兒童的玩伴，因?yàn)闀?huì)對兒童的健康不利，也不允許讓狗與人有密切的接觸。）

空狀態(tài)設(shè)計(jì)：在空狀態(tài)上，在考慮到色彩禁忌、優(yōu)化屏效，以及國際簡潔的風(fēng)格，縮小了圖形尺寸，采用線性疊加小面積填充色的樣式；

人物插畫：如果插畫中需體現(xiàn)人物，可以在性別、種族、發(fā)色、膚色上提供多種組合方案。

圖片中的文字，是不跟隨語言切換改變的，會(huì)造成語言內(nèi)容不統(tǒng)一，對用戶體驗(yàn)影響很大。

一般來說，盡可能避免圖片上使用文字，如需要，圖片上的文字建議采用分層展示，也就是可以在不替換圖片的情況下，通過簡單替換字符串即可滿足需求（在特別為某個(gè)國家設(shè)計(jì)的情況下，可以做在圖片中）

2. 行為層

在 B 端表單頁中，國際的地址填寫與國內(nèi)地址存在差異，且需注意填寫順序，國家后地址為倒序填寫。

亞洲國家日期一般為年/月/日；

歐洲國家、英聯(lián)邦國家或拉丁語國家，日期一般為日/月/年；如果是美國系國家，一般為月/日/年。

需要我們在進(jìn)行設(shè)計(jì)的時(shí)候，務(wù)必了解用戶當(dāng)?shù)厥褂们闆r，保障閱讀習(xí)慣的一致性。

根據(jù)用戶選擇的國家不同，展示對應(yīng)的電話格式。需要增加國家編碼的選擇器，一般會(huì)使用「前置選擇器+輸入框」復(fù)合型輸入框組件，也可根據(jù)情況在選擇器里增加國旗輔助判斷。

LTR(左至右)為常規(guī)閱讀方式，這里需要重點(diǎn)注意 RTL(右至左)適布局。通常情況下，對齊關(guān)系、排列順序等均需要進(jìn)行相反處理，包括 icon、箭頭方向也需要進(jìn)行翻轉(zhuǎn)鏡像。主要操作按鈕也要從右側(cè)調(diào)整至左側(cè)。

3. 業(yè)務(wù)層

若工作臺前期未考慮語言適配，后期直接適配多語言會(huì)出現(xiàn)哪些問題？在多語言 UI 界面中最容易出現(xiàn)的問題之一，就是語言適配時(shí)文案占位面積不可控。

以京東國際物流文案為例，做了多語言占位面積測試，來了解語言翻譯后的效果，可以發(fā)現(xiàn)拉丁字母的國家文案長度是眾多語言中最長的，基本在中文的 2.5 倍以上。

在做國際化設(shè)計(jì)時(shí)，可以考慮以英文版做基礎(chǔ)產(chǎn)出，并防止后期加入其它長度大于英文的語言，可以預(yù)留 50%的長度；也可以漢字為參考，預(yù)留 200%~300%長度產(chǎn)出，都可較好避免占位面積出現(xiàn)的顯示問題。

針對國際 UI 進(jìn)行組件化，并建立規(guī)范，能大幅度提高設(shè)計(jì)效率、一致性和復(fù)用性，也便于其他同學(xué)快速了解國際組件的差異性。

文化背景不同、審美觀念不同等，造成了當(dāng)前國內(nèi)外存在不同的視覺衡量標(biāo)準(zhǔn)，兩種標(biāo)準(zhǔn)其實(shí)不分好壞，相信在全球化的浪潮下，中西方文化會(huì)相互影響、相互促進(jìn)，國內(nèi)外的視覺風(fēng)格會(huì)逐漸趨同、審美邊界越來越小，但又有著各自國家的特性，彰顯不同的美。

歡迎關(guān)注「京東設(shè)計(jì)中心JDC」的微信公眾號：