CLEARLY CULTURAL Making Sense of Cross-Cultural Design for US and East Asian Websites/Apps. Presentation Details: https://medium.com/@praty/clearly-cultural-fefc06f68af1?source=friends_link&sk=9835a40ff1a069339c5a5b377695230d — We often say, "Oh, western users are different." “In US they prefer clean and simple UI.” etc.. But, let’s pause for a moment and ask ourselves, “what do we actually mean by these claims?”. One of the major reasons why products fail is due to our misunderstandings of the end users’ culture and behavior. To overcome this, we as designers must acknowledge the nuances of cultural differences, users’ mental models, and their environment. In this 1-hour semi-workshop style presentation we'll discuss and rationalize how culture impacts the web/mobile designs for the US and East Asian websites/apps.

1. Making Sense of Cross Cultural UX Design for
US and East Asian Websites/Apps.
了了解中⻄西⽅方线上设计差异背后的原因
⽂文化背后
- Liz & PP
clearly cultural

2. Spot the difference

3. Spot the difference

4. culture Design

5. what is culture?
- language, religion, cuisine, social habits,
music and arts
- way of life
- the way you think, act, and interact

6. culture Design

7. culture Design
cultural dimensions website / app dimensions
lots of screenshots

8. http://www.analytictech.com/mb021/cultural.htm
cultural dimensions
1. Analytical Thinking vs Holistic Thinking 2. Intent vs Discover 3. Cognitive vs Affective Trust
4. Individualism vs Collectivism 5. Long Term Orientation 6. Power Distance
7. Low Context vs High Context 8. Monochronic vs Polychronic 9. Time Limited vs Time Plentiful

9. http://www.analytictech.com/mb021/cultural.htm
cultural dimensions
1. Analytical Thinking vs Holistic Thinking 2. Intent vs Discover 3. Cognitive vs Affective Trust
4. Individualism vs Collectivism 5. Long Term Orientation 6. Power Distance
7. Low Context vs High Context 8. Monochronic vs Polychronic
website / app dimensions
1. Information Density 2. Images:Text ratio 3. Navigation 4. Function Accessibility
5. Color Saturation 6. Help/Support/Tips 7. Guidance 8. Colorfulness 9. Symbols
9. Time Limited vs Time Plentiful

11. Analytical thinking (W) & Holistic Thinking (E)
cultural dimensions
Information density
background information
categorization

12. Analytical thinking (W) & Holistic Thinking (E)
Parts Whole
Whole Parts

13. Parts Whole
Whole Parts
information consumption
18 22 27
United StatesChina S. Korea
Analytical thinking (W) & Holistic Thinking (E)

14. Parts Whole
Whole Parts
18 22 27
UnitedStates
China
S.Korea
information consumption
Analytical thinking (W) & Holistic Thinking (E)

15. Parts Whole
Whole Parts
Reading pattern
United StatesChina S. Korea
Analytical thinking (W) & Holistic Thinking (E)

16. Parts Whole
Whole Parts
Reading pattern
Analytical thinking (W) & Holistic Thinking (E)

17. Parts Whole
Whole Parts
Analytical thinking (W) & Holistic Thinking (E)

18. Parts Whole
Whole Parts
Analytical (W) holistic (E)
Analytical thinking (W) & Holistic Thinking (E)
Low information density
High Information density
no background
has background

19. Parts Whole
Whole Parts
Analytical (W) holistic (E)
Clear and simple.
Individual content areas are
important.
Clear Category, Title, &
Navigation.
No Background.
Content can be placed more
freely on the page.
Free to use the background.
Analytical thinking (W) & Holistic Thinking (E)
Low information density
High Information density
no background
has background

20. Analytical thinking (W) & Holistic Thinking (E)
https://us.yahoo.com/ https://tw.yahoo.com/

21. The Chinese...pay attention to a wide range of events; they search for
relationships between things; and they think you can’t understand the part
without understanding the whole.
Westerners live in a simpler, more deterministic world; they focus on salient
objects or people instead of the larger picture….”
— Richard E. Nisbett, PhD
“

22. make word pairs

23. make word pairs
Tiger Panda Cage
Grapes Corn Plate
BOAT CAR PERSON
SEAGULL SQUIRELL GRASS
MAN WOMAN BABY
CARROT TOMATO RABBIT1.
2.
3.
4.
5.
6.

24. make word pairs
Tiger Panda Cage
Grapes Corn Plate
BOAT CAR PERSON
SEAGULL SQUIRELL GRASS
MAN WOMAN BABY
CARROT TOMATO RABBIT1.
2.
3.
4.
5.
6.

25. make word pairs
Tiger Panda Cage
Grapes Corn Plate
BOAT CAR PERSON
SEAGULL SQUIRELL GRASS
MAN WOMAN BABY
CARROT TOMATO RABBIT1.
2.
3.
4.
5.
6.

26. make word pairs
Tiger Panda Cage
Grapes Corn Plate
BOAT CAR PERSON
SEAGULL SQUIRELL GRASS
MAN WOMAN BABY
CARROT TOMATO RABBIT1.
2.
3.
4.
5.
6.

27. VS
Tiger Panda
Grapes Corn
BOAT CAR
SEAGULL SQUIRELL
MAN WOMAN
CARROT TOMATO
Tiger Cage
Grapes Plate
CAR PERSON
SQUIRELL GRASS
WOMAN BABY
CARROT RABBIT
CATEGORICAL / LOGICAL - W IMPLICIT RELATIONSHIP - E
Vegetables
Animals
Food
Automobiles
Animals
Adults
Eats
Kept / Lives
Served / Eat
Drives
Runs
Birth / Cares

28. CATEGORICAL / LOGICAL - W IMPLICIT RELATIONSHIP - E
Cow Chicken Grass

29. CATEGORICAL / LOGICAL - W IMPLICIT RELATIONSHIP - E
Animals Eats

30. CATEGORICAL / LOGICAL - W IMPLICIT RELATIONSHIP - E
Brand Zone50% off air shipping Logistics service pay later service
Ready to Ship eCommerce Buyer Zone March Expohelp
Brand Zone50% off air shipping Logistics service pay later service
Ready to Ship eCommerce Buyer Zone March Expohelp
exercise

31. CATEGORICAL / LOGICAL - W IMPLICIT RELATIONSHIP - E
Brand Zone
50% off air shipping
Logistics service
pay later service
Ready to Ship eCommerce Buyer Zone
March Expo
help
Brand Zone
50% off air shipping
Logistics service
pay later service
Ready to Ship eCommerce Buyer Zone
March Expo
help
Promotions
Marketplaces
Services
Services
Sourcing

32. Time limited (W) & time plentiful (E)
cultural dimensions
water in a
glass with a hole
flowing water

33. Time limited (W) & time plentiful (E)
cultural dimensions
intent vs discovery
cognitive vs affective trust

34. Time limited (W) & time plentiful (E)

35. Time limited (W) & time plentiful (E)
Time limited (W)
Intent
time plentiful (E)
discovery
flowing water
water in a
glass with a hole

36. Time limited (W) & time plentiful (E)
Time limited (W)
Intent
time plentiful (E)
discovery
Cognitive trust - rule based
Prioritize intent over discovery
Can opt for discovery based on
Business and User goals
flowing water
water in a
glass with a hole

37. cognitive trust (W) & affective trust (E)
cultural dimensions

38. cognitive trust affective trust
cognitive trust (W) & affective trust (E)

39. cognitive trust affective trust
US
Canada Australia
UK
Spain
Turkey
China
Nigeria
cognitive trust (W) & affective trust (E)

40. cognitive trust (W) & affective trust (E)

41. cognitive trust (W) & affective trust (E)

42. cognitive trust (W) & affective trust (E)

43. individualism (W) & collectivism (E)
cultural dimensions
colorfulness
image : text ratio

44. Me
We
individualism (W) & collectivism (E)

45. Color
website dimensions

46. Less Color more color

47. image : text ratio
website dimensions

48. low image : text ratio
High
image :
text ratio

49. Me
We
individualism (W) & collectivism (E)
Less colorful
individualism
More colorful
Collectivism
Low image : text ratio high image : text ratio

50. Me
We
individualism (W) & collectivism (E)
Less colorful
individualism
More colorful
Collectivism
Low image : text ratio high image : text ratio

51. Me
We
individualism (W) & collectivism (E)
Less colorful
individualism
More colorful
Collectivism
Low image : text ratio high image : text ratio
Use large images, but balance
with text information.
Use less colors

52. a few other differences…

53. splash screen
East
West

54. East
West
permission asking

55. conclusion

56. Cultural dimensions and country scores

57. Cultural dimensions and country scores
25
50
75
100
Power Distance Individualism Masculinity Uncertainty
Avoidance
Long Term
Orientation
Cognitive Trust
32
88
9295
46
54
32
87
30
66
20
80
90
26
46
62
91
40
US CHina Japan

58. Low Score High Score
Power Distance
Data doesn’t have to be structured. Structured data is preferred.
Friendly error messages, suggesting how to proceed. Strict error messages.
Images show people in their daily activities. Websites show images of leaders, or whole nation.
Individualism
High Image-to-Text ratio High text-to-Image ratio
Colorful interface Monotonously colored interface
Use symbols to encode information Use color to encode information
Masculinity
Pastel colors Bright colors
Allow for exploration and different
paths to navigate
Restrict navigation possibilities
Personal presentation of content
and friendly communication
Use encouraging words to
communicate
Uncertainty avoidance
Nonlinear navigation Linear navigation paths / show the
position of the user
Use redundant cues to reduce
ambiguity
While users enter a dialog, Information other than the current dialog is
still visible, but inaccessible.
Unnecessary information is hidden in order to force users to concentrate
on a currentlyactive dialog
Long term orientation
Reduced information density Most information at interface level
Content highly structured into
small units
Content can be arranged around a
focal area
Low Information Density High Information Density
Cognitive trust Build on interpersonal relationship and emotion Build on data, objective facts, and state the obvious

59. Cultural dimensions and country scores
Low Score High Score
Power Distance
Individualism
Masculinity
Uncertainty Avoidance
Long Term Orientation
US
US
US CHina
CHina
CHina
US CHina
US CHina

60. for western ( mostly US ) users
Build on cognitive trust.
Prioritize intent over discovery.
Categorize information in a logical, taxonomical
way - use nouns to group information.
Use (categorical, logical) progressive disclosure of
information.
Information can be presented in unstructured
manner - text is fine.
Use friendly-tone in error messages.
Use less color - overuse of color should be avoided.
Use typography to draw attention, compared to
visual elements like images.
Avoid redundant cues (buttons/links) to reduce
ambiguity.
Avoid link sprinkling.
Reduce information density.
Avoid background imagery. Prioritize foreground.
Give extra attention to navigation and titles
When using images, show people in their everyday
activities.

61. 谢谢
thank you