如何打造B端國際化？京東高手總結了4個方面！

一、項目背景

更多B端出海經驗：

二、JDL 國際業務情況

1. 覆蓋國家和地區

目前 JDL 國際物流業務已覆蓋美國、荷蘭、英國、智利、日本、澳洲、中國香港等 220 多個國家和地區，涉及的語言有中文、英文、印尼語、泰語、馬來語、日語等，為多國提供專業的倉運配物流軟件+自動化倉儲規劃+物流運營經驗結合的一體化供應鏈方案。

2. 具有包容性的國際化產品

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

三、國際化特點

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

行為差異：文化受到多方因素的影響，例如地理、經濟、社會政治等因素，不同文化背景下成長的人，養成不同的行為習慣，例如國內的閱讀習慣是從左向右，但穆斯林國家是從右向左。

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

1. 喜好差異

基于不同的文化背景，色彩所代表的意義與情緒感受會有所不同。了解色彩禁忌，規避文化沖突的風險。

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

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

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

馬來西亞：伊斯蘭教區喜愛綠色……

文化背景不同，宗教信仰的差異，會表現在一些禁忌上，這里簡單的說一下圖案的使用，界面設計時要結合國家特性使用圖案，特別要避免使用一些禁忌圖形。

在圖標運用中，視覺設計師經常使用日常中熟悉的元素。然而不同的國家有不同的文化理解與不同的形狀。

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

2. 行為差異

不同國家的閱讀順序不一樣，界面中文字排布要特別符合當地人的閱讀習慣，很多中東國家的語言閱讀習慣是從右向左的（RTL）。

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

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

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

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

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

不同國家的時間展示方式不同，會影響用戶的理解成本，如果使用錯誤的話會導致不必要的錯誤發生。

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

RMB 并不是國際通用的人民幣縮寫，而是由 ISO 4217 定義的 CNY。同樣的，為了避免出現其他標準上或理解上的錯誤，建議統一使用 ISO 標準。

四、B 端國際化設計策略

在了解了上方的這些國際化差異特點后，如何應用到具體的國際化項目？我們可以從表現層、行為層、業務層三個角度去思考。

1. 表現層

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

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

國內版色彩清亮并使用 3D 元素+動效元素，而國際版更多的會選用穩重深沉的顏色，比如灰、深藍、黑色等，圖片選用上，多為一些重色、扁平的圖片，可以起到感觀刺激的作用。

京東印尼 logo 設計：京東 Logo 在國內和其他國際站點都是用的小狗，在做印尼的 logo 設計時，避開使用狗的元素，改成了小馬，充分表達了對本地文化的尊重。

（伊斯蘭教規定禁止把狗當作寵物養在家中，也不允許把狗當做兒童的玩伴，因為會對兒童的健康不利，也不允許讓狗與人有密切的接觸。）

空狀態設計：在空狀態上，在考慮到色彩禁忌、優化屏效，以及國際簡潔的風格，縮小了圖形尺寸，采用線性疊加小面積填充色的樣式；

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

圖片中的文字，是不跟隨語言切換改變的，會造成語言內容不統一，對用戶體驗影響很大。

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

2. 行為層

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

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

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

需要我們在進行設計的時候，務必了解用戶當地使用情況，保障閱讀習慣的一致性。

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

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

3. 業務層

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

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

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

針對國際 UI 進行組件化，并建立規范，能大幅度提高設計效率、一致性和復用性，也便于其他同學快速了解國際組件的差異性。

文化背景不同、審美觀念不同等，造成了當前國內外存在不同的視覺衡量標準，兩種標準其實不分好壞，相信在全球化的浪潮下，中西方文化會相互影響、相互促進，國內外的視覺風格會逐漸趨同、審美邊界越來越小，但又有著各自國家的特性，彰顯不同的美。

歡迎關注「京東設計中心JDC」的微信公眾號：