Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
@JennyShen
..
Build bridges, not walls
Design for users across cultures
Jenny Shen | WebCamp Zagreb | October 2017
@JennyShen
@jennyshen
@jennyshen
Travelled to Lived in Worked with Users from
46 6 20+ 27countries countries countriesclients
@jennyshen
What is culture?1.
How does culture affect our work?2.
Culture differences in UX UI3.
Common mistakes in locali...
@jennyshen
What is CULTURE?
@jennyshen
The collective programming of
the mind distinguishing the
members of one group or
category of people from other...
@jennyshenGeert Hofstede
Cultural Dimensions
@jennyshen
What does it mean for
Designers & Developers?
@jennyshen
Culture affects Internet usage,
e-commerce trust, information
and communication technology
adoption, Internet m...
@jennyshen
It is no longer enough to simply
offer a product translated in ten
to twenty different languages.
Users also wa...
@jennyshen
Research local culture
#1
@jennyshen
@jennyshenGeert Hofstede
@jennyshen
- Pragmatic
- Thrift is encouraged to
prepare for the future
- Propensity to save
@jennyshen
@jennyshen
transavia.com
@jennyshen
@jennyshen
Money motivates
& de-motivates
@jennyshen
@jennyshenGeert Hofstede
@jennyshen
The systematic overview has to be
given in order to proceed. This is also
reflected by the law system.
Details ...
@jennyshen
booking page NL v.s. DE
@jennyshen
booking page NL v.s. DE
@jennyshen
@jennyshen
@jennyshen
@jennyshen
Usability tests with locals
#2
@jennyshen
@jennyshen
Remote
User
Testing
UXtesting @jennyshen
@jennyshen
@jennyshen
Germany, Spain and worldwide
Malaysia, Singapore, Indonesia,
Philippines, Thailand, Vietnam
Worldwide
U.S., Can...
@jennyshen
Measure data
#3
@jennyshen
@jennyshen
Not the real heat map. Mockup created for illustrative purpose
@jennyshen
- High drop off on homepage
- First clicks on help and
company-related links
Google Analytics
@jennyshen
Ambiguity
Lack of trust1.
2.
@jennyshen
Trust logos from trustshops.de
Reviews from German customers
1.
2.
Accepted payment methods3.
German customers ...
@jennyshen
@jennyshen
@jennyshen
Paragraph format is used
almost twice as much in
Germany as in the U.S.
Localization of Web Design: An Empirica...
@jennyshen
@jennyshen
@jennyshen
@jennyshen
Localise copy
#4
@jennyshen
@jennyshen
furnished apartments serviced apartments
corporate housing extended stays
temporary housing
apart hotels
monthl...
@jennyshen
Housing for one month or longer
furnished apartments serviced apartments
corporate housing extended stays
tempo...
@jennyshen
American v.s. Filipino v.s. Dutch
@jennyshen
Longest translation first
#5
@jennyshen
English Dutch
@jennyshen
Finnish
@jennyshen
Increase vertical space to 3 lines
@jennyshen
English Finnish
@jennyshen
uniqlo.com/jp
@jennyshen
Research local UI patterns
#6
@jennyshen
DISCOVER
is the new
hamburger
menu
Chinese Mobile App UI Trends, Dan Grover
Chinese Mobile App UI Trends, Dan G...
@jennyshen
@jennyshen
mozilla.com
@jennyshen
mozilla.com.cn
@jennyshen
@jennyshen
@jennyshen
@jennyshen
“
Typing Chinese takes a
long time and finding the
precise word isn’t easy.
Search sucks, so optimize
for brows...
@jennyshenGeert Hofstede
@jennyshen
Uniqlo, United Arrows, Hot Pepper
@jennyshen
In collectivistic societies, what
other people are buying, doing,
saying are well-regarded.
@jennyshen
Personas of local users
#7
@jennyshen
@jennyshen
UIfaces
@jennyshen
DiverseUI.com
@jennyshen
Common Mistakes
@jennyshen
Google Translate
#1
@jennyshen
stuffdutchpeoplelike.com
@jennyshen
Dribbble
@jennyshen
Dribbble
@jennyshen
Idealise designs
#2
@jennyshen
Dribbble
@jennyshen
#firstworldproblems
Dribbble
@jennyshen
@jennyshen
@jennyshen
@jennyshen
@jennyshen
@jennyshen
Research mobile
device usage in
emerging markets
@jennyshen
Cultural stereotypes
#3
@jennyshen
@jennyshen
The secrets to
world domination
@jennyshen
Diverse teams
#1
rawpixel.com, Unsplash @jennyshen
@jennyshen
Having mixed backgrounds is a
real asset when you work in a
team: ideas bounce back
differently, and you end up...
@jennyshen
Travel &
Ethnographic Research
#2
Annie Spratt, Unsplash @jennyshen
@jennyshen
More positive view on
people of countries visited
75% 76% 76%More positive view on
other cultures in general
Mo...
@jennyshen
@JennyShen
Senior UX Designer at Toptal jennyshen.com
@jennyshenJenny Shen
Liked the talk? Didn’t like it?
Let me know wha...
Build bridges, not walls—Design for users across cultures
Upcoming SlideShare
Loading in …5
×

of

Build bridges, not walls—Design for users across cultures Slide 1 Build bridges, not walls—Design for users across cultures Slide 2 Build bridges, not walls—Design for users across cultures Slide 3 Build bridges, not walls—Design for users across cultures Slide 4 Build bridges, not walls—Design for users across cultures Slide 5 Build bridges, not walls—Design for users across cultures Slide 6 Build bridges, not walls—Design for users across cultures Slide 7 Build bridges, not walls—Design for users across cultures Slide 8 Build bridges, not walls—Design for users across cultures Slide 9 Build bridges, not walls—Design for users across cultures Slide 10 Build bridges, not walls—Design for users across cultures Slide 11 Build bridges, not walls—Design for users across cultures Slide 12 Build bridges, not walls—Design for users across cultures Slide 13 Build bridges, not walls—Design for users across cultures Slide 14 Build bridges, not walls—Design for users across cultures Slide 15 Build bridges, not walls—Design for users across cultures Slide 16 Build bridges, not walls—Design for users across cultures Slide 17 Build bridges, not walls—Design for users across cultures Slide 18 Build bridges, not walls—Design for users across cultures Slide 19 Build bridges, not walls—Design for users across cultures Slide 20 Build bridges, not walls—Design for users across cultures Slide 21 Build bridges, not walls—Design for users across cultures Slide 22 Build bridges, not walls—Design for users across cultures Slide 23 Build bridges, not walls—Design for users across cultures Slide 24 Build bridges, not walls—Design for users across cultures Slide 25 Build bridges, not walls—Design for users across cultures Slide 26 Build bridges, not walls—Design for users across cultures Slide 27 Build bridges, not walls—Design for users across cultures Slide 28 Build bridges, not walls—Design for users across cultures Slide 29 Build bridges, not walls—Design for users across cultures Slide 30 Build bridges, not walls—Design for users across cultures Slide 31 Build bridges, not walls—Design for users across cultures Slide 32 Build bridges, not walls—Design for users across cultures Slide 33 Build bridges, not walls—Design for users across cultures Slide 34 Build bridges, not walls—Design for users across cultures Slide 35 Build bridges, not walls—Design for users across cultures Slide 36 Build bridges, not walls—Design for users across cultures Slide 37 Build bridges, not walls—Design for users across cultures Slide 38 Build bridges, not walls—Design for users across cultures Slide 39 Build bridges, not walls—Design for users across cultures Slide 40 Build bridges, not walls—Design for users across cultures Slide 41 Build bridges, not walls—Design for users across cultures Slide 42 Build bridges, not walls—Design for users across cultures Slide 43 Build bridges, not walls—Design for users across cultures Slide 44 Build bridges, not walls—Design for users across cultures Slide 45 Build bridges, not walls—Design for users across cultures Slide 46 Build bridges, not walls—Design for users across cultures Slide 47 Build bridges, not walls—Design for users across cultures Slide 48 Build bridges, not walls—Design for users across cultures Slide 49 Build bridges, not walls—Design for users across cultures Slide 50 Build bridges, not walls—Design for users across cultures Slide 51 Build bridges, not walls—Design for users across cultures Slide 52 Build bridges, not walls—Design for users across cultures Slide 53 Build bridges, not walls—Design for users across cultures Slide 54 Build bridges, not walls—Design for users across cultures Slide 55 Build bridges, not walls—Design for users across cultures Slide 56 Build bridges, not walls—Design for users across cultures Slide 57 Build bridges, not walls—Design for users across cultures Slide 58 Build bridges, not walls—Design for users across cultures Slide 59 Build bridges, not walls—Design for users across cultures Slide 60 Build bridges, not walls—Design for users across cultures Slide 61 Build bridges, not walls—Design for users across cultures Slide 62 Build bridges, not walls—Design for users across cultures Slide 63 Build bridges, not walls—Design for users across cultures Slide 64 Build bridges, not walls—Design for users across cultures Slide 65 Build bridges, not walls—Design for users across cultures Slide 66 Build bridges, not walls—Design for users across cultures Slide 67 Build bridges, not walls—Design for users across cultures Slide 68 Build bridges, not walls—Design for users across cultures Slide 69 Build bridges, not walls—Design for users across cultures Slide 70 Build bridges, not walls—Design for users across cultures Slide 71 Build bridges, not walls—Design for users across cultures Slide 72 Build bridges, not walls—Design for users across cultures Slide 73 Build bridges, not walls—Design for users across cultures Slide 74 Build bridges, not walls—Design for users across cultures Slide 75 Build bridges, not walls—Design for users across cultures Slide 76 Build bridges, not walls—Design for users across cultures Slide 77 Build bridges, not walls—Design for users across cultures Slide 78 Build bridges, not walls—Design for users across cultures Slide 79 Build bridges, not walls—Design for users across cultures Slide 80 Build bridges, not walls—Design for users across cultures Slide 81 Build bridges, not walls—Design for users across cultures Slide 82 Build bridges, not walls—Design for users across cultures Slide 83 Build bridges, not walls—Design for users across cultures Slide 84 Build bridges, not walls—Design for users across cultures Slide 85 Build bridges, not walls—Design for users across cultures Slide 86 Build bridges, not walls—Design for users across cultures Slide 87 Build bridges, not walls—Design for users across cultures Slide 88 Build bridges, not walls—Design for users across cultures Slide 89 Build bridges, not walls—Design for users across cultures Slide 90 Build bridges, not walls—Design for users across cultures Slide 91 Build bridges, not walls—Design for users across cultures Slide 92 Build bridges, not walls—Design for users across cultures Slide 93 Build bridges, not walls—Design for users across cultures Slide 94
Upcoming SlideShare
What to Upload to SlideShare
Next
Download to read offline and view in fullscreen.

1 Like

Share

Download to read offline

Build bridges, not walls—Design for users across cultures

Download to read offline

Want your product to dominate the world? Here several case studies will show why you need more than translations to break into new markets.

As Internet access expands to the far corners of the world, product makers have the chance to see their work used by millions of people worldwide.

To create products for international users, we must be aware of the full range of human diversity with respect to language, culture and other forms of human difference. If the product doesn't adapt to users' differences, there's a big danger where we think our work is great, but users in other countries finds it terrible, or worse, unusable.

Join this talk to hear how Jenny designed for users in Europe, North- and South America, Asia, and Southeast Asia.

In this talk you will learn key insights including:
- How culture affects design, UX and front-end
- Case study of cultural differences: Germany v.s. Netherlands
- UI patterns comparison of the East and the West: Mozilla Firefox homepage, WeChat and Chinese app interfaces
- Design for culture, not stereotypes
- Research local mobile device usage

Related Audiobooks

Free with a 30 day trial from Scribd

See all

Build bridges, not walls—Design for users across cultures

  1. 1. @JennyShen .. Build bridges, not walls Design for users across cultures Jenny Shen | WebCamp Zagreb | October 2017
  2. 2. @JennyShen
  3. 3. @jennyshen
  4. 4. @jennyshen Travelled to Lived in Worked with Users from 46 6 20+ 27countries countries countriesclients
  5. 5. @jennyshen What is culture?1. How does culture affect our work?2. Culture differences in UX UI3. Common mistakes in localisation4. Secrets to world domination5.
  6. 6. @jennyshen What is CULTURE?
  7. 7. @jennyshen The collective programming of the mind distinguishing the members of one group or category of people from others. “ Geert Hofstede
  8. 8. @jennyshenGeert Hofstede Cultural Dimensions
  9. 9. @jennyshen What does it mean for Designers & Developers?
  10. 10. @jennyshen Culture affects Internet usage, e-commerce trust, information and communication technology adoption, Internet marketing, and website development. Website Design And Trust Across Cultures, Dianne Cyr, Simon Fraser University “
  11. 11. @jennyshen It is no longer enough to simply offer a product translated in ten to twenty different languages. Users also want a product that acknowledges their unique cultural characteristics and business practices. Elisa del Galdo and Jakob Nielsen, International User Interfaces “
  12. 12. @jennyshen Research local culture #1
  13. 13. @jennyshen
  14. 14. @jennyshenGeert Hofstede
  15. 15. @jennyshen - Pragmatic - Thrift is encouraged to prepare for the future - Propensity to save
  16. 16. @jennyshen
  17. 17. @jennyshen transavia.com @jennyshen
  18. 18. @jennyshen Money motivates & de-motivates
  19. 19. @jennyshen
  20. 20. @jennyshenGeert Hofstede
  21. 21. @jennyshen The systematic overview has to be given in order to proceed. This is also reflected by the law system. Details are equally important to create certainty that a certain topic or project is well-thought-out. “
  22. 22. @jennyshen booking page NL v.s. DE
  23. 23. @jennyshen booking page NL v.s. DE
  24. 24. @jennyshen
  25. 25. @jennyshen
  26. 26. @jennyshen
  27. 27. @jennyshen Usability tests with locals #2
  28. 28. @jennyshen
  29. 29. @jennyshen Remote User Testing UXtesting @jennyshen
  30. 30. @jennyshen
  31. 31. @jennyshen Germany, Spain and worldwide Malaysia, Singapore, Indonesia, Philippines, Thailand, Vietnam Worldwide U.S., Canada, Taiwan, India and worldwide
  32. 32. @jennyshen Measure data #3
  33. 33. @jennyshen
  34. 34. @jennyshen Not the real heat map. Mockup created for illustrative purpose
  35. 35. @jennyshen - High drop off on homepage - First clicks on help and company-related links Google Analytics
  36. 36. @jennyshen Ambiguity Lack of trust1. 2.
  37. 37. @jennyshen Trust logos from trustshops.de Reviews from German customers 1. 2. Accepted payment methods3. German customers in roster4. Company description in footer5.
  38. 38. @jennyshen
  39. 39. @jennyshen
  40. 40. @jennyshen Paragraph format is used almost twice as much in Germany as in the U.S. Localization of Web Design: An Empirical Comparison of German, Japanese, and U.S. Website Characteristics, Dianne Cyr and Haizley Trevor-Smith, Simon Fraser University “
  41. 41. @jennyshen
  42. 42. @jennyshen
  43. 43. @jennyshen
  44. 44. @jennyshen Localise copy #4
  45. 45. @jennyshen
  46. 46. @jennyshen furnished apartments serviced apartments corporate housing extended stays temporary housing apart hotels monthly rentals short-term rentals vacation rentals Housing for one month or longer sublets
  47. 47. @jennyshen Housing for one month or longer furnished apartments serviced apartments corporate housing extended stays temporary housing apart hotels monthly rentals short-term rentals vacation rentals sublets
  48. 48. @jennyshen American v.s. Filipino v.s. Dutch
  49. 49. @jennyshen Longest translation first #5
  50. 50. @jennyshen English Dutch
  51. 51. @jennyshen Finnish
  52. 52. @jennyshen Increase vertical space to 3 lines
  53. 53. @jennyshen English Finnish
  54. 54. @jennyshen uniqlo.com/jp
  55. 55. @jennyshen Research local UI patterns #6
  56. 56. @jennyshen DISCOVER is the new hamburger menu Chinese Mobile App UI Trends, Dan Grover Chinese Mobile App UI Trends, Dan Grover
  57. 57. @jennyshen
  58. 58. @jennyshen mozilla.com
  59. 59. @jennyshen mozilla.com.cn
  60. 60. @jennyshen
  61. 61. @jennyshen
  62. 62. @jennyshen
  63. 63. @jennyshen “ Typing Chinese takes a long time and finding the precise word isn’t easy. Search sucks, so optimize for browsing. Bram Pitoyo, Design Strategist at Mozilla
  64. 64. @jennyshenGeert Hofstede
  65. 65. @jennyshen Uniqlo, United Arrows, Hot Pepper
  66. 66. @jennyshen In collectivistic societies, what other people are buying, doing, saying are well-regarded.
  67. 67. @jennyshen Personas of local users #7
  68. 68. @jennyshen
  69. 69. @jennyshen UIfaces
  70. 70. @jennyshen DiverseUI.com
  71. 71. @jennyshen Common Mistakes
  72. 72. @jennyshen Google Translate #1
  73. 73. @jennyshen stuffdutchpeoplelike.com
  74. 74. @jennyshen Dribbble
  75. 75. @jennyshen Dribbble
  76. 76. @jennyshen Idealise designs #2
  77. 77. @jennyshen Dribbble
  78. 78. @jennyshen #firstworldproblems Dribbble
  79. 79. @jennyshen
  80. 80. @jennyshen
  81. 81. @jennyshen
  82. 82. @jennyshen
  83. 83. @jennyshen
  84. 84. @jennyshen Research mobile device usage in emerging markets
  85. 85. @jennyshen Cultural stereotypes #3
  86. 86. @jennyshen
  87. 87. @jennyshen The secrets to world domination
  88. 88. @jennyshen Diverse teams #1 rawpixel.com, Unsplash @jennyshen
  89. 89. @jennyshen Having mixed backgrounds is a real asset when you work in a team: ideas bounce back differently, and you end up making interesting connections. “ Parmigiano & Camembert
  90. 90. @jennyshen Travel & Ethnographic Research #2 Annie Spratt, Unsplash @jennyshen
  91. 91. @jennyshen More positive view on people of countries visited 75% 76% 76%More positive view on other cultures in general More positive view on differences and diversity momondo.com
  92. 92. @jennyshen
  93. 93. @JennyShen Senior UX Designer at Toptal jennyshen.com @jennyshenJenny Shen Liked the talk? Didn’t like it? Let me know what you think!
  • ChristianRAgostiniRa

    Oct. 13, 2017

Want your product to dominate the world? Here several case studies will show why you need more than translations to break into new markets. As Internet access expands to the far corners of the world, product makers have the chance to see their work used by millions of people worldwide. To create products for international users, we must be aware of the full range of human diversity with respect to language, culture and other forms of human difference. If the product doesn't adapt to users' differences, there's a big danger where we think our work is great, but users in other countries finds it terrible, or worse, unusable. Join this talk to hear how Jenny designed for users in Europe, North- and South America, Asia, and Southeast Asia. In this talk you will learn key insights including: - How culture affects design, UX and front-end - Case study of cultural differences: Germany v.s. Netherlands - UI patterns comparison of the East and the West: Mozilla Firefox homepage, WeChat and Chinese app interfaces - Design for culture, not stereotypes - Research local mobile device usage

Views

Total views

746

On Slideshare

0

From embeds

0

Number of embeds

24

Actions

Downloads

7

Shares

0

Comments

0

Likes

1

×