T he t it l e g o t g a rb l d Successful - - PowerPoint PPT Presentation

t he t it l e g o t g a rb l d successful locali z s ation
SMART_READER_LITE
LIVE PREVIEW

T he t it l e g o t g a rb l d Successful - - PowerPoint PPT Presentation

T he t it l e g o t g a rb l d Successful Locali(z)(s)ation Kentaro Takiguchi Droidcon Berlin 2016 @rejasupotaro Introduction Introduction > Real World Localizlation > Localization in Development >


slide-1
SLIDE 1 T̷he t ͜ itl̕e ̢go͢t ̷g͞a͡rbl͡ȩd
slide-2
SLIDE 2

Successful Locali(z)(s)ation

Droidcon Berlin 2016 Kentaro Takiguchi @rejasupotaro

slide-3
SLIDE 3

Introduction

Introduction > Real World Localizlation > Localization in Development > Translation > Understanding users > Conclusion
slide-4
SLIDE 4

About our service

Cookpad was established in 1998. Cookpad has started expanding business globally from 2014.
slide-5
SLIDE 5

This is the first step of our 🌐

The previous logo looks “loud” in foreign countries
slide-6
SLIDE 6 We have branch offices around the world and collaborate with local members
slide-7
SLIDE 7 We support English, Español, ภาษาไทย, Bahasa Indonesia, Tiếng Việt, … Each locale has different lifestyle and different recipes.
slide-8
SLIDE 8

Why Go Global

Should we really do it?
slide-9
SLIDE 9 http://www.kpcb.com/internet-trends
slide-10
SLIDE 10 http://www.internetworldstats.com/stats7.htm
slide-11
SLIDE 11 Can you find Japan?
slide-12
SLIDE 12 That’s it.
slide-13
SLIDE 13

Global Project - Domestic Project = Localization

The only different between global project and domestic project is localization
slide-14
SLIDE 14

GLOBALIZATION = INTERNATIONALIZATION = LOCALIZATION = TRANSLATION = CALTURALIZATION ?

What’s the difference between these terms?
slide-15
SLIDE 15

Internationalization

  • The process of designing a service so that it can

potentially be adapted to various languages and region without engineering changes.

a.k.a. i18n
slide-16
SLIDE 16

Localization

  • The process of adapting internationalized

service for a specific language or region by adding locale specific components or text.

a.k.a. l10n
slide-17
SLIDE 17

Extract string resources →Internationalization

i18n and l10n are can’t be separated.

Add local language resources →Localization

slide-18
SLIDE 18 In my understanding.

Globalization Internationalization Localization Translation

Industry Legal Religion Culture

slide-19
SLIDE 19

Real World Localization

Introduction > Real World Localizlation > Localization in Development > Translation > Understanding users > Conclusion
slide-20
SLIDE 20 Street Fighter is a fighting video game published by Capcom.
slide-21
SLIDE 21 In the latest title, they completely support Arabic and added an Arabic playable character named Rashid
slide-22
SLIDE 22 Users growth in Arabic is 6,592.5%
slide-23
SLIDE 23 Far Cry 4 is an open world first person shooter video game developed by Ubisoft
slide-24
SLIDE 24

Localized version was released 2 months later

What’s the difference between the original version and the localized version?

 Released on November 2014  Released on January 2015

slide-25
SLIDE 25

Violence and Obscene

They have different standard

 Released on November 2014  Released on January 2015

slide-26
SLIDE 26 Don’t worry. This is flour.
slide-27
SLIDE 27

Each country has different rules

https://support.google.com/googleplay/answer/6209544?hl=en

Content Rating in Google Play

  • North & South America
  • Europe & Middle East
  • Germany
  • Australia (Games only)
  • Brazil
  • South Korea
  • Other countries
slide-28
SLIDE 28 These movie posters are for the same movie. The poster designed in Japan has much more information.

A closed-room mystery made by Quentin Trantino Who will be able to survive? 8 ruffians, all of them are liar This movie should be an Academy Award winning

slide-29
SLIDE 29 Asian people put information into small space
slide-30
SLIDE 30 It encourage consumer purchasing sentiment for people living in there
slide-31
SLIDE 31

International availability

  • f McDonald’s products
I don’t know how much German people love 🍼

 Pasta

 Red beans paste

 McBeer

slide-32
SLIDE 32 The preference depends on what they have had before now
slide-33
SLIDE 33 McDonald’s in india has numerous vegetarian options
slide-34
SLIDE 34 Pay attention what people feel
slide-35
SLIDE 35

Opportunities and Challenges

  • Language
  • Religion
  • History
  • Industry
  • Legal issues
  • Climate
  • Infrastructure
To obtain opportunities, solve localization issues
slide-36
SLIDE 36

Localization in Development

Introduction > Real World Localizlation > Localization in Development > Translation > Understanding users > Conclusion
slide-37
SLIDE 37

Localize your app

  • LTR, RTL
  • Locale
  • Format
  • Performance
  • APK size
  • Traffic
Only in the field of Android development, there are many things to consider
  • Writing system
  • Character
  • Encoding
  • Font
  • Text size
  • Grammer
  • Text length
slide-38
SLIDE 38 It’s obvious that we are using different characters
slide-39
SLIDE 39 I don’t need to worry about characters if I use the same encoding, right?

Unicode 9.0

128,172 characters

slide-40
SLIDE 40

Unicode and Characters

https://medium.com/behancetech/localization-gotchas-for-asian-languages-cjk-e52a57c0fde1
slide-41
SLIDE 41 They would uninstall your app

This app doesn’t seem to support Japanese

Uninstall Custom font The same unicode value

slide-42
SLIDE 42

Font

The text is rendered perfectly! How about in other languages?
slide-43
SLIDE 43

Text Size

These font and the text size are the same between screenshots
slide-44
SLIDE 44

Text Size

According to my colleague, using the same text size doesn’t work in Arabic <!— ar/dimens.xml —> <resources> <dimen name="text_size_xxlarge">27sp</dimen> <dimen name="text_size_xlarge">25sp</dimen> <dimen name="text_size_large">21sp</dimen> <dimen name="text_size_medium">19sp</dimen> <dimen name="text_size_small">17sp</dimen> <dimen name="text_size_xsmall">15sp</dimen> <dimen name="text_size_xxsmall">13sp</dimen> <dimen name="text_size_xxxsmall">11sp</dimen> </resources> <!— dimens.xml —> <resources> <dimen name="text_size_xxlarge">26sp</dimen> <dimen name="text_size_xlarge">24sp</dimen> <dimen name="text_size_large">20sp</dimen> <dimen name="text_size_medium">18sp</dimen> <dimen name="text_size_small">16sp</dimen> <dimen name="text_size_xsmall">14sp</dimen> <dimen name="text_size_xxsmall">12sp</dimen> <dimen name="text_size_xxxsmall">10sp</dimen </resources>
slide-45
SLIDE 45

Text Size

The difference is small but it helps Arabic users a lot

Default (ar) +1 sp (ar)

slide-46
SLIDE 46
  • Alphabets:
  • Syllabaries:
  • Logographies:
There are various characters and writing systems
slide-47
SLIDE 47

Logographies

It can contain a lot of meaning in just one character
slide-48
SLIDE 48

How to say “Butterfly”

Writing systems affect text length

Farfalla

Mariposa

Papillon

SCHMETTERLING!!!

slide-49
SLIDE 49 I make sure to check all layouts in German when I launch my app in Germany
slide-50
SLIDE 50

Word Order: SVO

SVO: 488 languages

 I eat bread

= [Subject] [Verb] [Object]

slide-51
SLIDE 51

Word Order: SOV

SOV: 565 languages

 I bread eat

= [Subject] [Object] [Verb]

slide-52
SLIDE 52

Word Order: VSO

VSO: 95 languages

 Eat I bread

= [Verb] [Subject] [Object]

slide-53
SLIDE 53

Word Order

  •  = [Subject] [Verb] [Object]
  •  = [Subject] [Object] [Verb]
  •  = [Verb] [Subject] [Object]
What is the impact of this difference?
slide-54
SLIDE 54

Quantity: Ingredient Name?

Which does it look natural?
slide-55
SLIDE 55

Left-To-Right and Right-To-Left

RTL languages start from the right and continue to the left
slide-56
SLIDE 56 Depending on the text direction, we also need to flip views and some icons

Flipped

slide-57
SLIDE 57 https://developer.android.com/about/versions/android-4.2.html#RTL
slide-58
SLIDE 58

How to support RTL

The cost of supporting RTL is not so high
  • layout_marginLeft => layout_marginStart
  • layout_marginRight => layout_marginEnd
  • layout_alignParentLeft => layout_alignParentStart
  • layout_alignParentRight => layout_alignParentEnd

<application android:supportsRtl=“true” … >

slide-59
SLIDE 59 Some components need to be flipped by hand 😭

FloatingActionButton ViewPager

slide-60
SLIDE 60

Put your app on a diet 🔦

It affects the number of daily downloads. We should avoid adding locale specific resources as much as possible.
slide-61
SLIDE 61
slide-62
SLIDE 62 Sometimes we add locale specific images like this

Flipped

slide-63
SLIDE 63

Locale

  • A set of parameters that defines a user language

and country.

  • It is used to identify user’s environment.
Identifying the user environment is important to provide optimized content.

Locale.getDefault()

slide-64
SLIDE 64

en-US

Language codes are defined in ISO 639. Country codes are defined in ISO 3166.

ISO 639 ISO 3166 = new Locale(“en”, “US”);

slide-65
SLIDE 65

Language != Country

Spanish is spoken widely. We have 4 translations only for Spanish.

en-US American English en-GB British English es-ES Spanish Spanish es-419 Latin American Spanish pt-PT Portuguese in Portugal pt-BR Portuguese in Brazil zh-CN Simplified Chinese zh-TW Traditional Chinese

slide-66
SLIDE 66 The order and the format are totally changed

Formatter.format(new Date()); // =>  2016/06/09 午後11:50 Formatter.format(new Date()); // =>  6/9/16 11:50 PM Formatter.format(new Date()); // =>  09/06/16 11:50 PM

slide-67
SLIDE 67

Format

We should use formatters. Don’t try to write something by hand, it wouldn’t make sense in some counties. US English French German Spanish Italian Japanese Time hh:mm:ss am/pm (12- hour clock) hh:mm:ss (24-hour clock) hh:mm:ss (24-hour clock) hh:mm:ss (24-hour clock) hh:mm:ss (24-hour clock) hh:mm:ss (24-hour clock) Decimal Separator period (.) comma (,) comma (,) comma (,) comma (,) period (.) Thousand Separator comma (,) space ( ) space ( ) or period (.) space ( ) space ( ) or period (.) comma (,) Number Example 12,345.67 12 345,67 12 345,67 or 12.345,67 12 345,67 12 345,67 or 12.345,67 12,345.67 Currency $12,345.67 12 345,67¢ 12 345,67¢ 12 345,67¢ ¢12.345,67 ¥12,345 Ordinal 1st 2nd 3rd … 1er 2e 3e … or 1re 2e 3e … … 1o 2o 3o … or 1a 2a 3a … 1o 2o 3o … or 1a 2a 3a … 1つ 2つ 3つ …
slide-68
SLIDE 68 Japanese is multibyte string. US has multiple timezone.

 are good at multibyte string  are good at time difference

slide-69
SLIDE 69

Performance

Performance turning is a part of localization.
slide-70
SLIDE 70 The crowds in rush hours in Tokyo is crazy.
slide-71
SLIDE 71 Japanese ticket gates have high throughput and high availability
slide-72
SLIDE 72
slide-73
SLIDE 73
slide-74
SLIDE 74 https://speakerdeck.com/rejasupotaro/improving-ux-through-performance
slide-75
SLIDE 75 Facebook is developing a lite version of Facebook app
slide-76
SLIDE 76

Traffic

Prepare for events, don’t miss your opportunity.
slide-77
SLIDE 77 People gather and cook during Christmas

Christmas 📉

slide-78
SLIDE 78 Muslims abstain from all food and drink during the daylight hours

Ramadan 📉?

slide-79
SLIDE 79 Actually, traffic is increased doubled, tripled, …
slide-80
SLIDE 80 “Fasting” doesn’t mean they don’t have anything for a month. It is only in daylight hours. They cook and enjoy dinner after sunset.
slide-81
SLIDE 81 Traffic from Arabic starts increasing 2 weeks before Ramadan unlike Indonesia. Why?

Arabic Indonesian

slide-82
SLIDE 82 Our app has been featured on Google Play
slide-83
SLIDE 83 Alarm apps get become popular during Ramadan. Why?
slide-84
SLIDE 84

Prepare for Ramadan

We can prepare if we know when traffic is increased in advance
slide-85
SLIDE 85

Translation

Introduction > Real World Localizlation > Localization in Development > Translation > Understanding users > Conclusion
slide-86
SLIDE 86

name + “ added ” + number + “ person to his list”

How many problems can you find?
slide-87
SLIDE 87 How many problems can you find?

MARY + “ added ” + 7 + “ person to his list”

Should be “her” Plurals Number could be changed Female / Male

Don’t concatenate string

slide-88
SLIDE 88

Plurals Forms

Use Android internationalization framework

<?xml version="1.0" encoding="utf-8"?> <resources> <plurals name="plural_name"> <item quantity=["zero" | "one" | "two" | "few" | "many" | "other"] >text_string</item> </plurals> </resources> English Polish Apples Jablek 1 Apple Jablko 2..4 Apples Jablka 5..21 Apples Jablek 22..24 Apples Jablka 25..34 Apples Jablek

slide-89
SLIDE 89

Choose “appropriate words”

I know, but what is “appropriate word”?
slide-90
SLIDE 90

Semantics Difference

“Appropriate word” is changed by locale

American British Holiday Vacation Football Soccer American Football Football Flat Apartment Garden Yard

slide-91
SLIDE 91 “Appropriate word” is changed by context

Move to my library —— Oregon State —— Continue shopping

OR = Oregon State, right…

slide-92
SLIDE 92 The difference is obvious if you know the context
slide-93
SLIDE 93

“Premium” could be offended

“Premium” sounds like “Evil” in some countries
slide-94
SLIDE 94

“Premium Service”

  • Cookpad Premium
  • Cookpad Prime
  • Cookpad Elite
  • Cookpad Deluxe
  • Cookpad Extra
  • Cookpad Select
  • Cookpad First Class
“Premium” could give negative impression. But in Spanish, it’s a familiar word.
slide-95
SLIDE 95

How to make it “appropriate”?

Good workflow makes good translation
slide-96
SLIDE 96 What do translators feel when they receive this phrase?

%1$d replied to your photo of %2$d.

slide-97
SLIDE 97 We are using placeholders to make phrases readable

{sender_name} replied to your photo of {recipe_title}.

slide-98
SLIDE 98 https://github.com/square/phrase - Phrase is an Android string resource templating library

Phrase.from(context, R.string.reply_to_photo_comment) .put(“sender_name”, user.getName()) .put(“message_count”, messages.size()) .format();

slide-99
SLIDE 99 Leave a comment when adding a new phrase

<!— This message is displayed when a user receive a reply—> <string name=“reply_to_photo_comment”> {sender_name} replied to your photo of {recipe_title}. </string>

slide-100
SLIDE 100 To make translators understand the context This message is displayed when a user receive a reply
slide-101
SLIDE 101 Otherwise, Latin American people may think “Spanish is available but Latin American recipes are not available”.

es-ES es-419

slide-102
SLIDE 102 Introduction > Real World Localizlation > Localization in Development > Translation > Understanding users > Conclusion

Understanding users

slide-103
SLIDE 103 Preferences vary with each individual

“All German people drink beer everyday?”

slide-104
SLIDE 104

“What is national character!?” “What is localization!?” “How to develop global services!?”

I’m getting confused
slide-105
SLIDE 105 “We never know what users want until we release the service”
slide-106
SLIDE 106 We are repeating a cycle of Build - Measure - Learn to understand users

Build - Measure - Learn

slide-107
SLIDE 107 https://speakerdeck.com/rejasupotaro/collecting-logs-from-mobile-apps
slide-108
SLIDE 108

Unified logging layer for mobile apps

  • Buffering
  • Filtering
  • Batching
  • Retrying
  • Pluggable
slide-109
SLIDE 109

Conclusion

Introduction > Real World Localizlation > Localization in Development > Translation > Understanding users > Conclusion
slide-110
SLIDE 110

Requirement level

Requirement level is not the same between services

Quality Cost Requirement level (depends on service)

slide-111
SLIDE 111

Localization is fun!

I leaned a lot while locazing my app
slide-112
SLIDE 112

Thank you!

  • Kentaro Takiguchi
  • GitHub: rejasupotaro
  • Speakerdeck: rejasupotaro
  • Twitter: @rejasupotaro
Thank you for listening my talk