Slide 1

Slide 1 text

C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co A M P E R SA N D,B R I G H TO N, 2 0 1 5 @lugotype Chinese Design for Westerners

Slide 2

Slide 2 text

1.4 billion Population in 2015 more than 20% of the world population C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 3

Slide 3 text

$307 billion Online retail market sale in 2013 the world’s largest online retail market C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 4

Slide 4 text

$9.3 billion Alibaba Group Holdings Online retail sale on 11 Nov. 2014 assume you spend $1 every second, you’ll need 295.24 years to spend that money C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 5

Slide 5 text

$14.3 billion 12 hours time taken to beat 2014 whole-day record of $9.3bn Alibaba Group Holdings Online retail sale on 11 Nov. 2015 C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 6

Slide 6 text

$1,000,000,000,000 Online retail market sale in 2019: Forrester, Feb. 2015 C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 7

Slide 7 text

Excited about designing for the Chinese market? Think twice. C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 8

Slide 8 text

C H A L L E N G E S 1 : It’s more than a translation C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 9

Slide 9 text

culture aesthetics technology psychology &more C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 10

Slide 10 text

C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 11

Slide 11 text

C H A L L E N G E S 2 : A ‘target audience’ you can’t predict C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 12

Slide 12 text

Mandarin Jin Wu Hui Gan Xiang Min Hakka Yue Ping Harbin Shenyang Beijing Hohhot Taiyuan Nanjing Shanghai Hangzhou Wuhan Taipei Fuzhou Nanchang Changsha Guangzhou Hong Kong Nanning Kunming Chengdu Chongqing Xi'an Lanzhou Urumqi C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 13

Slide 13 text

世界上大约有五分之一人口以汉语为母语, 主要集中在中国大陆。 同时在海外华人当中 使用。 不过, 不同汉语系之间不一定能互通, 不同汉语系的人之间一般人会使用汉语标 准语 (中华人民共和国称为普通话, 中华民 国称为国语、 东南亚称为华语) 来通话。 世界上大約有五分之一人口以漢語為母語 , 主要集中在中國大陸 。 同時在海外華人當中 使用 。 不過 , 不同漢語系之間不一定能互通 , 不同漢語系的人之間一般人會使用漢語標 準語 (中華人民共和國稱為普通話 , 中華民 國稱為國語 、 東南亞稱為華語) 來通話 。 Mainland China and Singapore Taiwan, Hong Kong, and much of the Chinese oversea community T R A D I T I O N A L S I M P L I F I E D C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 14

Slide 14 text

More than 3000 years! Traditional Chinese Simplified Chinese C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 15

Slide 15 text

C H A L L E N G E S 3 : The gigantic character sets C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 16

Slide 16 text

106,230 Yitizi Dictionary(2004) Biggest collection of Chinese Characters C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 17

Slide 17 text

10,000 Standard Chinese character set Unique characters C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 18

Slide 18 text

3,000 Standard Chinese character set Commonly used C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 19

Slide 19 text

20,000+ Simplified Chinese pro font C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 20

Slide 20 text

3-10mb Font file size per font weight Almost impossible for web embedding. C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 21

Slide 21 text

Hiragino Sans GB (Snow Leopard) STHeiti Light/STXhei STHeiTi STKaiti STSong STFangsong PingFang (El Capitan) SimHei SimSun NSinSun FangSong KaiTi FangSongGB2312 KaiTiBG2312 Microsoft YaHei (Windows 7) W I N D O W S O S X C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 22

Slide 22 text

“The generally preferred practice is to not specify any Chinese font styles in the body paragraph CSS... Doing this allows the browsers to choose the best font available to display for optimised legibility.” Zenan Liu, 5 High Quality Chinese Webfont services for your next Chinese web project C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 23

Slide 23 text

images source: ziwwwo.com C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 24

Slide 24 text

“ S O L U T I O N S ” flash or images(svg) D I S A D V A N TA G E S Takes more time to produce; not dynamic, harder to maintain; doesn’t support selecting, copying, searching or translating; requires more data downloading and bandwidth C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 25

Slide 25 text

“When you add an East Asian font family to your kit, it will automatically become what we call a dynamic kit. In a dynamic kit, you’ll have a new Character Set option in the kit editor called Dynamic Subsetting. When your dynamic kit JavaScript loads in the browser, it will detect your page’s character usage and request a dynamic subset for the glyphs needed for each member of the family. This makes for very small fonts, with incredibly fast load times.” -Adobe typekit blog Dynamic subsetting http:/ /blog.typekit.com/2015/06/15/announcing-east-asian-web-font-support/ C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 26

Slide 26 text

S E R V I C E S Adobe Typekit Fonts.com JUSTFONT Youziku ifontcloud C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 27

Slide 27 text

C H A L L E N G E 4 : Working with Chinese typography C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 28

Slide 28 text

L AT I N A L P H A B E T S C H I N E S E C H A R A C T E R S C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 29

Slide 29 text

Source Sans Pro - Light Source Han Sans CN - Light G G 龘 龘 10% size 100% size C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 30

Slide 30 text

英 语 no uppercase/lowercase no baseline; no ascenders nor descenders C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 31

Slide 31 text

世界上大约有五分之一人口以汉语为母语, 主要集中在中国大陆。 同时在海外华人当中 使用。 不过, 不同汉语系之间不一定能互通, 不同汉语系的人之间一般人会使用汉语标 准语 (中华人民共和国称为普通话, 中华民 国称为国语、 东南亚称为华语) 来通话。 no space for word separation, no hyphenation PA R A G R A P H C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 32

Slide 32 text

世界上大约有五分之一人口以汉语为母语, 主要集中在中国大陆。 同时在海外华人当中 使用。 不过, 不同汉语系之间不一定能互通, 不同汉语系的人之间一般人会使用汉语标 准语 (中华人民共和国称为普通话, 中华民 国称为国语、 东南亚称为华语) 来通话。 grid PA R A G R A P H C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 33

Slide 33 text

!),.:;?]}¢·–— ’ ” •‥„‧ †╴ 、 。〆 〈 《 「 『〕 〞 ︰︱︲︳︵︷︹︻︽︿﹁﹃﹏﹐ ﹑﹒﹔﹕﹖﹘﹚﹜!) , . : ; ?] |} 、 !%),.:;>?]}¢¨°·ˇˉ―‖’ ” „†‡›℃∶ 、 。 〃〆 〈 《 「 『〕 〗 〞 ︵︹︽︿﹃﹘﹚﹜! "% ') , . : ; ? ] `|} ~ ([{£¥ ‘ “‵々〇〉 》 」 〔 〝︴︶︸︺︼︾﹀﹂ ﹗﹙﹛ ( { $(*,£¥· ‘ “ 〈 《 「 『 【 〔 〖 〝﹗﹙﹛$ (. [ {£¥ Characters that are not allowed at the start of a line : Characters that are not allowed at the start of a line : Characters that are not allowed at the end of a line : Characters that are not allowed at the end of a line : T R A D I T I O N A L S I M P L I F I E D C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 34

Slide 34 text

R E A D I N G D I R E C T I O N 1 2 C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 35

Slide 35 text

R E A D I N G D I R E C T I O N 2 1 世界上大约有五分之一人口以汉语为母语, 主要集中在中国大陆。 同时在海外华人当中 使用。 不过, 不同汉语系之间不一定能互通, 不同汉语系的人之间一般人会使用汉语标 准语 (中华人民共和国称为普通话, 中华民 国称为国语、 东南亚称为华语) 来通话。 C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 36

Slide 36 text

C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 37

Slide 37 text

C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 38

Slide 38 text

C H A L L E N G E 5 : The design aesthetics C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 39

Slide 39 text

C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 40

Slide 40 text

C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 41

Slide 41 text

C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 42

Slide 42 text

busy cluttered lots of links many flash banners images are small outdated C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 43

Slide 43 text

C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 44

Slide 44 text

Why? Those websites are targeting most people who are still living with lower income. They like to see a lot of possibilities, choices & entertainment values to be explored. C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 45

Slide 45 text

Why? Comparing with many Western countries, the ‘Internet’ was introduced later to China. For many Chinese people, it is still more of a place to find entertainment values rather than to perform tasks. C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 46

Slide 46 text

It takes a lot of effort to type Chinese. “shi” C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 47

Slide 47 text

3.4mb/s 3.8mb/s World average: 3.9mb/s World average: 3.8mb/s A K A M A I 2 0 1 3 A K A M A I 2 0 1 4 C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 48

Slide 48 text

Why? We are familiar with it, and have higher tolerance. But we don’t like it either! C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co

Slide 49

Slide 49 text

Thank you! Slide set in Freight Display Pro, Filson Pro, Source Han Sans CN, Source Han Sans TW C H I N E S E D E S I G N for W E S T E R N E R S @ L U G O T Y P E LU Y U luyu.co @lugotype