SlideShare a Scribd company logo
1 of 76
Download to read offline
Chinese Web Design Patterns
      How and why they’re different



      Chui Chui Tan    @ChuiSquared
      cxpartners




                                      http://www.flickr.com/photos/photolate/2452470259/

Monday, 27 June 2011
I’m a      Malaysian born Chinese,
                                                 bro ug     ht up follow ing Chinese
                                                 cultu     re an d tra ditions. I live   Chui Chui
                                                  an d w     ork in UX for many years.
                                                  I’ve t    he a dvantages to see
                                                            s fro m both sides an d
        http://www.flickr.com/photos/sacharules/2613374596/
                                                  thing
                                                      om    different perspectives.
                  @ChuiSquared fr
Monday, 27 June 2011
Ho mepage of a Chinese
                                                       -
                       po p ular online sho pping site
                       www.taobao.co m.
                                                    n?
                       W hat’s yo ur first impressio


Monday, 27 June 2011
H o mepage of a po pular
                       C hinese web portal site -
                       www.qq.co m.

                       What’s yo ur first impression?

Monday, 27 June 2011
Busy?
                                    Complicated?
                       Cluttered?

                                       Confusing?
                 Colourful?



                          Wow
                                         Any of these?




Monday, 27 June 2011
Must look complicated    ?
      Must have lots of links ?

      Links must open new windows       ?
      Must use flash
                     ?   It’s easy to just
                         sites an d make
                                           lo ok at a few Chinese
                                          quick assu mptions an d
                            nclusions abo ut them.
                     ?
                         co
      Must look busy     Th  ese are the most co m mo
                                                       n
                          assu mptions ma de abo ut Chinese sites.
                          But are they true?
                          If  they are, then why?
                          If  they are not, then why?

Monday, 27 June 2011
Must look complicated


                Must have lots of links

                Links must open new windows

                Must use flash
                                          Must  all Chinese sites lo ok
                Must look busy            co mplicate d?

                                          Let’s think abo ut why they
                                          lo ok co mplicate d.


Monday, 27 June 2011
Yo u can   see two things in one
                       -  a yo ung la dy an d an old
                       la dy. It’s an illusion.

                       Co uld t hose co mplex Chinese
                       sites be  co mplex an d simple?

Monday, 27 June 2011
n
                       BBC News site: UK versio

                       Tidy la yo ut, easily scanne d.




Monday, 27 June 2011
B BC News site: In donesian
                       version

                       Similar layo ut, same alphabets. But
                       might lo ok a  bit more co mplicate d.


Monday, 27 June 2011
BBC n ews site: Russian version

                       Tidier  layo ut, but lo ok more
                       co mplicate d than the English
                       version.

Monday, 27 June 2011
BBC news site:
                       “COMPLIC  ATED” Chinese version

                       Is it really co mplicate d?
                       Same amo    unt of info as the other
                       ver sions an d similar layo ut.
                       Westerner    s think it’s co mplicate d
                                                               t
                        because t  hey don’t un derstan d wha
                        they are lo oking at.
Monday, 27 June 2011
BBC news site:
                       “COMPLIC  ATED” Chinese version

                       To C hinese users, it’s not
                       co mplicate d. It’s as simple as the
                       English ver  sion because they are
                       tak ing the same amo unt of
                        infor mation as the West.

Monday, 27 June 2011
s
                       O ther reason Chinese site
                       often lo ok more co mplicate d is
                       because of Chinese
                       characters:
                       Beautiful but co mplex
                                     http://www.flickr.com/photos/xiangxi/3308585857/

Monday, 27 June 2011
Tan             Chui           Chui




                                11              8             15              15
                                strokes       strokes         strokes         strokes


  Chinese characters are
  for me d by strokes.

   It can be fro m 1 stroke                             64                   36
   to o ver 60 strokes.                             strokes
                                                                             strokes

                                                              nàng (Snuffle)
                                    zhé (Verbose)
   My last name:
                               kes
   Simplifie d Chinese: 8 stro        Most strokes             Most complex characters found
                                 kes
   Tra ditional Chinese :11 stro                              in modern Chinese dictionaries
                              s each
   My first name: 15 stroke


Monday, 27 June 2011
Twitter “Tweet”
                                           “Follow”
                                                        Facebook
                 “Like”          Twitter
                       “Tweet”                           “Follow”
                 Twitter
                                                                              e
                                                 No capital letter in Chines
                                                 writing.
                                                 No spac  e between characters.
                                                 H ence, it lo ok more intense
                                                 w ith less breathing ro o m.

Monday, 27 June 2011
Twitter “Tweet”
                                           “Follow”
                                                         Facebook
                 “Like”          Twitter
                       “Tweet”                            “Follow”
                 Twitter

                                                 But, it doesn’t lo ok co mplicate d
                                                 to Chine  se users because they
                                                 are use d to rea d it.




Monday, 27 June 2011
Must look complicated


                Must have lots of links

                Links must open new windows
                                  It’s not  co mpletely true that all
                Must use flash     Chinese sites   must lo ok co mplicate d.
                                  It’s an illusion yo ur brain create d when
                                                                            t.
                                  yo u don’t kno  w what yo u are lo oking a
                                                                            s
                Must look busy     It’s also beca use of Chinese character
                                   which can be    co mplex an d Chinese
                                   writing which    w itho ut space between
                                   characters.


Monday, 27 June 2011
Must look complicated


                       Must have lots of links

                       Links must open new windows

                Must use flash

                Must look busy



Monday, 27 June 2011
T hey DO use a lot of links.

                       WHY?




Monday, 27 June 2011
Designers suggeste d it’s
                       because  typing in Chinese on
                       an alph abet-base d keyboard is
                       hard. He nce sites are designe d
                       for clicking as o ppose d to
                       searching.

                       I DON’T agree.

Monday, 27 June 2011
Standard Chinese keyboard




                                   Chinese use the same
                                   keyboards as the West.

                                   T hey use ‘Pinyin’ to input
                                   Chinese  characters using these
                                   a lphabet-base d keyboards.
Monday, 27 June 2011
*This page was
    modified to
    replace a video
    showing how to
    use ‘Pinyin to
    input Chinese
    characters.




        Beijing(       ) Fei(   ) Niuyue (   )
Monday, 27 June 2011
There are shortcuts.

                                          In stea d of typing ‘beijing’,
         *This page was modified to        Chinese c   an just type ‘bj’ an d
         replace a video showing how to   cho ose fro m the list.
         use shortcuts to input Chinese   Sim  ilarly for ‘Niuyue’ [New
         characters using ‘Pinyin’         Yo rk] where they can just
                                           type ‘ny ’.

Monday, 27 June 2011
It’s fast an d easy. It co uld be
                       slow er for Chinese to type in
                       English than in Chinese.

                       Chin ese also co mplain abo ut
                       not  being able to fin d what
                       they   are after on a page due
                       to t he o ver whelming content
                                                         e
                       an d  links. Instea d, they cho os
                                                         ip
                       to u se the search box an d sk
                        the ho mepage.

Monday, 27 June 2011
Must look complicated


                       Must have lots of links

                       Links must open new windows

                 Must use flash
                                        A lot of links is what most
                 Must look busy         Chinese sites have.

                                         But it’s not what Chinese users
                                         like.

Monday, 27 June 2011
o
                       L inks o pen new w in dows t
                                                   g
                       support Chinese’s browsin
                       behavior:

                       T hey lo ok at one w in dow
                       w hilst waiting for other
                       w in dows to loa d.
                                   http://www.flickr.com/photos/ryananderson/223193295/
Monday, 27 June 2011
Average connection speed

                             15000                                    It’s  because China has slow
                                                                      Int ernet connection spee d
                                       12021                          wh   ilst it has the highest
                                                                      int ernet po pulation in the
                             10000                                     world.
           Kilobits/Second




                              5000                           4684
                                                                      3812


                                                                                1271
                                                                                             695
                                 0
                                     South Korea             USA      UK        Brazil      China




http://www.techknowtimes.com/web/global-downloads-speed-comparison/
Monday, 27 June 2011
Average connection speed

                             15000                                    Ho wever, this is go ing to
                                                                      change.
                                                                                                   er
                                       12021                          Ch ina Teleco m aims to deliv
                                                                      100 Mbps by 2013.
                                                                                                    o
                             10000                                    Ch ina Mobile is ho ping to d
           Kilobits/Second




                                                                      the same in 5 years.


                              5000                           4684
                                                                      3812


                                                                                 1271
                                                                                             695
                                 0
                                     South Korea             USA      UK        Brazil      China




http://www.techknowtimes.com/web/global-downloads-speed-comparison/
Monday, 27 June 2011
Must look complicated


                       Must have lots of links         Just for now

                       Links must open new windows

                 Must use flash
                                      Only  for now where links o pen
                                      new w in dows.
                                                                     ill
                 Must look busy       Inte rnet connection spee d w
                                                                        g
                                      be in crease d in China in co min
                                      year  s an d Chinese users’
                                                                        .
                                      brow   sing behavior w ill change

Monday, 27 June 2011
Must look complicated


                Must have lots of links   Just for now

                Links must open new windows

                        Must use flash

                  Must look busy



Monday, 27 June 2011
Monday, 27 June 2011
[Go to sina.co m.cn - a
                       in fotainment web portal
                       co vering news, entertainment,
                        games, blog s an d
                        microblogg ing.
                                                   sh
                       L o ok at the nu mber of fla
                       banners on the page.]




Monday, 27 June 2011
They are all a dverts.

                       This is how China cur rent
                                                        he
                       econ o my situation is like at t
                                                        e
                       mo m ent. Their main profits ar
                       fro m a dverts.

                       The  best way to get users’
                       atte ntion to these a dverts is
                       via flash a dverts.




Monday, 27 June 2011
For example, T
                                       aobao’s main
                       revenue is fro
                                      m its a dverts
                       (more than th
                                      e profits they
                       get fro m their
                                        ser vices).
                       But it is starti
                                       ng to change
                       now in China.


Monday, 27 June 2011
w
                       Lo ok at  www.do uban.co m - a ne
                       Chinese   online librar y site for
                       b o oks, music, mo vies, etc.
                                                            ut
                       There’s    no flash or no a dverts. B
                       it ’s do ing well in China.
Monday, 27 June 2011
e
                       “36   0 safeguard” is a Chines
                                                         s
                       We   b security to ol. One of it
                       fun  ctionalities is to allow
                       Ch  inese to filter a dverts.
                        It’s  a po pular to ol in China.

                       Ch inese want to see pages
                       w it ho ut distracting a dverts.
                                            http://middle.blog.sohu.com/159409841.html

Monday, 27 June 2011
Fonts

                                                      se
                           A nother reason why Chine
                                                     on
                           designers often use flash
                           w ebsites is because of
                                                     ts.
                           a vailable Chinese Web fon



Monday, 27 June 2011
Limited font choices


        No way to emphasise font


        Restriction on font sizes

                                    There is  limite d Chinese Web
                                    t ypography as it nee ds to
                                                                 0
                                    a cco m mo date at least 400
                                    in dividual characters.


                                                   http://www.flickr.com/photos/vlastula/300102949/

Monday, 27 June 2011
Limited font choices


        No way to emphasise font


        Restriction on font sizes   There is no fancy fonts
                                    available.
                                                               .
                                    Minimu m font size = 12px
                                    Smalle  r than that can create
                                    rea da bility problem (because
                                                               e
                                    Chinese characters can b
                                    quite co mplex)
                                                   http://www.flickr.com/photos/vlastula/300102949/

Monday, 27 June 2011
Must look complicated


                Must have lots of links       Just for now

                Links must open new windows

                        Must use flash     It’s how China econo my work
                                                                         s
                                                                       ly
                                          at  the mo ment - heavily re
                                          on   a dverts for revenue.
                  Must look busy
                                                                       t
                                          Fla sh is not necessarily wha
                                          Chinese users want.


Monday, 27 June 2011
Must look complicated


                Must have lots of links   Just for now

                Links must open new windows

                Must use flash

                       Must look busy



Monday, 27 June 2011
No
                                            Simplicity
         We always hear:                   ^
         Ch
         be
            inese DON’T like simplicit
            cause of the ‘the more t
                                       y
                                      he     in China?
         mer rier’ saying.

           Is that true?
                                            http://www.flickr.com/photos/fab_photos/2419404100/

Monday, 27 June 2011
Baidu - the biggest search
                             eng ine in China




         420 million users
Monday, 27 June 2011
Ba idu has the same page
                       de sign an d layo ut as Go ogle
                       (simple an d tidy layo ut design)




Monday, 27 June 2011
Go ogle search result page


Monday, 27 June 2011
Baidu se arch result page has
                                                   .
                       simpler layo ut as Go ogle’s



Monday, 27 June 2011
Weibo (Chinese equivalen
                                   t
        Tw itter) has 140 million u
                                    sers.
       It has similar page desig
                                 n as
       Tw itter.

Monday, 27 June 2011
What makes it po pular in
        China is not the busynes
                                   s of
       the site, it’s the function
                                   alities
       it pro vides that support
                                   what
       Chinese users want an d
                                  their
       social behaviors.


Monday, 27 June 2011
www.taobao.co m:
                       Chinese users like it not
                       beca  use of its colorful, long
                       pa g e. It’s all abo ut pro ducts
                                                         e
                       Chin  ese can buy fro m this sit
                       w ith ver y low price.

Monday, 27 June 2011
It’s more abo ut “ What the site
                       does  to the Chinese users
                       rath er than how it lo oks.”


Monday, 27 June 2011
“Don’t like Sina’s sport site. It feels messy
                                        and cluttered. Can’t find anything.”




                       “Really dislike local download sites. Thousands of download links.
                       The one you are looking for appears to be so small. Whereas those
                            messy adverts and rubbish tools are unnecessarily big.




                                               Chinese c o mplaine d abo ut a dverts
                                                                                     to
                                               an d that they are not being able
                                               fin d what they are after.
                                               (These ar e updates fro m Weibo -
                                               Ch inese equivalent Tw itter)

Monday, 27 June 2011
“The user experience of AirAsia
                                   website is really bad....”




                                     “It’s really painful to book flights through Shenzhen
                                        airlines site. It has rather bad user experience.”



    Chinese users care abo ut
    usability an d user exper
                              ien   ce.
                                             “Douban has the most comfortable adverts
   But, they have to put up                that I have ever seen on a website. Good user
                              w ith              experience can make adverts more
  designs which offere d to
                                                             acceptable.”
  them. They ’ve no cho ice
  because all co mpanies ar
                              e
  g iving them similar (ba d)
                              we b
  designs.

Monday, 27 June 2011
So, if Chinese don’t like h
                                  ow
      existing Chinese sites are
     being designe d an d want
     simple sites ( just like the
     West), then why we cons
                                 tantly
     see Chinese sites which a
                                 re
     designe d in similar patte
                                rns?
    There are a nu mber of
    reasons.

   http://www.flickr.com/photos/kareneliot/2710464400/


Monday, 27 June 2011
Part of it has to do w ith
   Confucius (a Chinese
   philoso pher die d 2.5 tho
                              usan d
   years ago).

  His teachings influence d
  Chinese culture an d socia
                            l
  behaviors.

 His teachings emphasise d
                            the
 important of social, mora
                          l
 order an d hierarchy.




http://www.flickr.com/photos/rob_web/466866299/
Monday, 27 June 2011
g
                       H ierarchy means respectin
                       an d liste ning to peo ple who are
                       o lder than yo u an d yo ur
                       superiors.
                       When b    osses say so mething,
                       it’s a co m man d, not a starting
                        po int for discussion.
                        E.g. If  they want to put a lot
                        of flash a dverts on a
                                                      ,
                        h o mepage to gain revenue
                        designe   rs have no cho ice but
                         to follow.
                                 http://www.flickr.com/photos/19779889@N00/4455072054/

Monday, 27 June 2011
Another Confucius teach
                                ing:
        collectivism

       China is a collectivist soc
                                  iety,
       hence social recognition
                                 is
       important.

       “Mian Zi” or Face (or pre
                                  stige)
      is important. Chinese wan
                                  t to
      gain an d maintain face in
                                    all
      aspects of their persona
                                 l,
      social an d business life.




Monday, 27 June 2011
How they are perceive d
                                  by
       society is important as
       society ’s en dorsement de
                                  fine
       their values.

      It’s co m mon co mpanies t
                                 r y to
     squeeze as much content
                                   as
     they can on their site to
                                  g ive
     users the impression tha
                                 t
     they ’re do ing well an d h
                                ave
     plenty to offer.

    Just like Chinese host of
                              ten
    order more fo o d than th
                              eir
    guests co uld possibly eat.




Monday, 27 June 2011
It can be quite hard for
         Westerners to grasp the
                                  idea
         of Face.

        This is a nice article abo
                                   ut
        Face an d the role it play
                                  s in
        Chinese society.




                       http://www.china-mike.com/chinese-culture/
                        understanding-chinese-mind/cult-of-face/
Monday, 27 June 2011
UX is still at the beg innin
                                      g
         stage in China.

        There is lack of UX or H
                                   CI
        relate d co urses or e duca
                                   tion
        program mes.



  http://www.flickr.com/photos/h4ck/4202513554/

Monday, 27 June 2011
Chinese client still don’t
                                                  un derstan d much abo ut t
                                                                             he
                                                  importance of UX.

                                                  It’s fine for now because
                                                 almost all Chinese sites a
                                                                             re
                                                 designe d in similar patte
                                                                            rns.
                                                 Chinese have no cho ice b
                                                                             ut to
                                                 put up w ith what they a
                                                                           re
                                                 g iven.

                                                  Once UX beco mes more
                                                 po pular an d more Chines
                                                                             e sites
                                                 pro vide not only go o d pr
                                                                            o ducts
                                                 but also go o d UX, Chines
                                                                             e w ill
                                                 be less forg iven for sites
                                                                              w ith
                                                 ba d UX.



  http://www.flickr.com/photos/h4ck/4202513554/

Monday, 27 June 2011
Also, Chinese designers h
                                    ave
           ver y low salaries.

          They bear a nu mber of
          responsibilities an d often
                                       are
         g iven ridiculo us timescale
                                      .
         Therefore they are likely
                                       to
         co py each other or exist
                                    ing
         sites.

        Hence, we ten d to see Ch
                                     inese
        sites w ith similar design
        patterns again an d again
                                   .


                                             http://www.flickr.com/photos/cbcastro/477856025/

Monday, 27 June 2011
These are the cur rent d
                                  esign
        tren ds in Chinese websit
                                  es. But
        it’s just a mo ment in Chin
                                    ese
        histor y.

        Things w ill change drast
                                  ically
        in the co ming few years.



                                            http://www.flickr.com/photos/cbcastro/477856025/

Monday, 27 June 2011
Design pattern:
                 Similarities . Differences

                             So, a re Western an d Chinese
                             we b sites ver y different in
                             ter ms of their design?

                             Let’s lo ok at these sites....




Monday, 27 June 2011
Th e NY Times ho mepage:
                       a busy, lo ng page w ith a lot of
                       links an d content.




Monday, 27 June 2011
The Sina news site
                       (www.news.sina.co m.cn):

                       If yo u put it into a w ireframe,
                       it has  tidier layo ut than the
                       NY Times ho mepage.


Monday, 27 June 2011
he
                       What  ’s important is not just t
                                                        at
                       site d esign, it’s more abo ut wh
                       yo ur  site does to the users.
                       It’s abo ut pro viding what
                       Chinese users want an d
                        suppo  rting their behaviors an d
                        social elements.

                        For example....

Monday, 27 June 2011
.
                       Chin a is a collectivist society
                                                        e
                       Shar ing an d participations ar
                       ver y important.

                         Chin ese leave co m ments in
                         almo st ever ything: blogs,
                         vide os, microblogg ing... much
                         more than the West.


                       http://www.flickr.com/photos/ben_grey/4582294721/




Monday, 27 June 2011
Chin a is also an expressive
                       society.
                                                          s
                       They   like an d use a lot of icon
                       - cute, animation icons.
                                                     t
                         Thes e seem to be unimportan
                         elem ents but they have big
                         impa ct on how Chinese use
                         yo ur site.

                          Yo u  nee d to pay attention to
                                                          ing
                          the  se elements when pro vid
                                                            r
                          a se  r vice to Chinese (via yo u
                          we b  sites or other means)

                       http://www.flickr.com/photos/ben_grey/4582294721/




Monday, 27 June 2011
You won’t learn about a
              country in one presentation.




Monday, 27 June 2011
Things will change                              Because a society w ill
                                                       change o ver time,
                                                       inclu ding its econo my, its
                                                       users’ behaviors, etc.


                                 Browsing behaviour                 Use of adverts and
                                                                       animations


           Internet speed
                                                China economy


                          Education &
                        experiences in UX
                                                      Font choice
                                                        options
                                                                             Use of
             Design quality &                                               graphics
               innovation


Monday, 27 June 2011
Make quick conclusions based on what
                          you see

                          Design your site by (blindly) following the
                          design of others Chinese sites




      Understand why and look into the
      reasons behind

      Understand how Chinese users would
      use your site
      (behaviour, culture, social, economy)


Monday, 27 June 2011
Some popular Chinese sites

    www.taobao.com : Online shopping site
    www.qq.com : Chinese web portal integrating news, entertainment and other
    basic web-based services
    www.sina.com.cn : Chinese infotainment portal integrating news, entertainment,
    blogs, microblogging (Sina Weibo) and so on
    www.douban.com : Online library for music, books, movies
    www.ctrip.com : Popular Chinese travel booking site
    www.baidu.com : China’s biggest search engine
    www.alipay.com : Online payment solution (Chinese equivalent PayPal)
    http://china.alibaba.com : online auction site (Chinese equivalent eBay)
    www.youku.com : Video hosting service
    www.tudou.com : Video site (Chinese equivalent YouTube)
    www.weibo.com: Microblogging site (Chinese equivalent Twitter)
    www.renren.com : Social network site (Chinese equivalent Facebook)
    www.sohu.com : Chinese portal website

      Additional slide (as requested)
Monday, 27 June 2011
Related links (Chinese culture)


    “China - Language, Culture, Customs and Etiquette”
    http://www.kwintessential.co.uk/resources/global-etiquette/china-country-profile.html


    “Chinese Customs, Manners and Etiquette”
    http://factsanddetails.com/china.php?itemid=114&catid=4&subcatid=19


    “Confucius 101: A key to understanding the Chinese Mind”
    http://www.china-mike.com/chinese-culture/understanding-chinese-mind/confucius/


    Chinese Cultural Values and Their Implications in Business”
    http://www.china-window.com/china_business/china_business_tips/chinese-cultural-values-
    a.shtml




      Additional slide (as requested)
Monday, 27 June 2011
Related links (in English) about Chinese web design:
    * Note that I personally DO NOT necessarily agree with all the discussions in these sites.



    “Showcase of Web Design in China: From Imitation To Innovation”
    http://www.smashingmagazine.com/2010/03/15/showcase-of-web-design-in-china-from-imitation-to-
    innovation-and-user-centered-design/


    “Why is Chinese Web Design So Bad?”
    http://thinkvitamin.com/design/why-is-chinese-web-design-so-bad/

    Quora: “Why are Chinese websites and software interfaces always
    complicated..."
    http://www.quora.com/Why-are-Chinese-websites-and-software-interfaces-always-complicated-and-
    English-language-websites-like-Google-LinkedIn-and-Twitter-much-simpler


    10 online advertising trends in China in 2010
    http://www.china-online-marketing.com/news/marketing/10-online-advertising-trends-in-china-in-2010/


     Additional slide (as requested)
     The insights in this presentation are from the combination of my Chinese background, my research
     experiences in China for my clients, my conversations with local Chinese users and local Chinese designers/
     UX practitioners, Chinese forums, Chinese discussion sites, etc.
     Please feel free to contact me: chuichui.tan@cxpartners.co.uk or tweet me @ChuiSquared if you’ve any
     specific questions.

Monday, 27 June 2011
chuichui.tan@cxpartners.co.uk

                         @ChuiSquared

                            chuichuitan



Monday, 27 June 2011

More Related Content

Viewers also liked

UX vs Artificial Intelligence
UX vs Artificial IntelligenceUX vs Artificial Intelligence
UX vs Artificial Intelligencecxpartners
 
Why UX #FAILS (with notes)
Why UX #FAILS (with notes)Why UX #FAILS (with notes)
Why UX #FAILS (with notes)Chris Feix
 
NFC & RFID on Android
NFC & RFID on AndroidNFC & RFID on Android
NFC & RFID on Androidtodbotdotcom
 
Xu Beihong - Painting as a nationalistic propaganda of enforcing China for po...
Xu Beihong - Painting as a nationalistic propaganda of enforcing China for po...Xu Beihong - Painting as a nationalistic propaganda of enforcing China for po...
Xu Beihong - Painting as a nationalistic propaganda of enforcing China for po...VincentKwunLeungLee
 
Origin of yuezhi tribe
Origin  of yuezhi tribeOrigin  of yuezhi tribe
Origin of yuezhi tribeAdesh Katariya
 
Hello, Joe. Hello, Mike; Hello, Robert.
Hello, Joe. Hello, Mike; Hello, Robert.Hello, Joe. Hello, Mike; Hello, Robert.
Hello, Joe. Hello, Mike; Hello, Robert.⌨️ Steven Proctor
 
Shane's Wuthering Heights
Shane's Wuthering HeightsShane's Wuthering Heights
Shane's Wuthering Heightsmsci123
 
Personality and soft skills development unit 1
Personality and soft skills development unit 1Personality and soft skills development unit 1
Personality and soft skills development unit 1saloni kalra
 

Viewers also liked (12)

UX vs Artificial Intelligence
UX vs Artificial IntelligenceUX vs Artificial Intelligence
UX vs Artificial Intelligence
 
Why UX #FAILS (with notes)
Why UX #FAILS (with notes)Why UX #FAILS (with notes)
Why UX #FAILS (with notes)
 
NFC & RFID on Android
NFC & RFID on AndroidNFC & RFID on Android
NFC & RFID on Android
 
Multimedia
MultimediaMultimedia
Multimedia
 
Hsk hanzi
Hsk hanziHsk hanzi
Hsk hanzi
 
Xu Beihong - Painting as a nationalistic propaganda of enforcing China for po...
Xu Beihong - Painting as a nationalistic propaganda of enforcing China for po...Xu Beihong - Painting as a nationalistic propaganda of enforcing China for po...
Xu Beihong - Painting as a nationalistic propaganda of enforcing China for po...
 
Origin of yuezhi tribe
Origin  of yuezhi tribeOrigin  of yuezhi tribe
Origin of yuezhi tribe
 
Hello, Joe. Hello, Mike; Hello, Robert.
Hello, Joe. Hello, Mike; Hello, Robert.Hello, Joe. Hello, Mike; Hello, Robert.
Hello, Joe. Hello, Mike; Hello, Robert.
 
Shane's Wuthering Heights
Shane's Wuthering HeightsShane's Wuthering Heights
Shane's Wuthering Heights
 
Personality and soft skills development unit 1
Personality and soft skills development unit 1Personality and soft skills development unit 1
Personality and soft skills development unit 1
 
OEP Scotland 19 March
OEP Scotland 19 MarchOEP Scotland 19 March
OEP Scotland 19 March
 
2015 full year China media scene
 2015 full year China media scene  2015 full year China media scene
2015 full year China media scene
 

More from cxpartners

Chi briding the relevance gap
Chi briding the relevance gapChi briding the relevance gap
Chi briding the relevance gapcxpartners
 
Putting people at the centre of design at the samaritans
Putting people at the centre of design at the samaritansPutting people at the centre of design at the samaritans
Putting people at the centre of design at the samaritanscxpartners
 
cxpartners customer centricity
cxpartners customer centricitycxpartners customer centricity
cxpartners customer centricitycxpartners
 
Designing Without Compromise
Designing Without CompromiseDesigning Without Compromise
Designing Without Compromisecxpartners
 
Practical Steps in Determining Your Product Vision (Product Tank Bristol - Oc...
Practical Steps in Determining Your Product Vision (Product Tank Bristol - Oc...Practical Steps in Determining Your Product Vision (Product Tank Bristol - Oc...
Practical Steps in Determining Your Product Vision (Product Tank Bristol - Oc...cxpartners
 
How to do the work you want to do - AKA neglect selling skills at your peril!...
How to do the work you want to do - AKA neglect selling skills at your peril!...How to do the work you want to do - AKA neglect selling skills at your peril!...
How to do the work you want to do - AKA neglect selling skills at your peril!...cxpartners
 
Customer Driven Digital Transformation
Customer Driven Digital Transformation Customer Driven Digital Transformation
Customer Driven Digital Transformation cxpartners
 
Research analysis: getting more from your data
Research analysis: getting more from your dataResearch analysis: getting more from your data
Research analysis: getting more from your datacxpartners
 
Transforming Care in Bristol
Transforming Care in BristolTransforming Care in Bristol
Transforming Care in Bristolcxpartners
 
Interaction designers vs algorithms
Interaction designers vs algorithmsInteraction designers vs algorithms
Interaction designers vs algorithmscxpartners
 
Beyond the touch screen - better accessibility for mobile apps
Beyond the touch screen - better accessibility for mobile appsBeyond the touch screen - better accessibility for mobile apps
Beyond the touch screen - better accessibility for mobile appscxpartners
 
Co design (NUX4)
Co design (NUX4)Co design (NUX4)
Co design (NUX4)cxpartners
 
How to ask a question
How to ask a questionHow to ask a question
How to ask a questioncxpartners
 
Photo ux nux 061014
Photo ux nux 061014Photo ux nux 061014
Photo ux nux 061014cxpartners
 
Photo content strategy (James Chudley, cxpartners)
Photo content strategy (James Chudley, cxpartners)Photo content strategy (James Chudley, cxpartners)
Photo content strategy (James Chudley, cxpartners)cxpartners
 
Psychology and the Perfect Design by @mrjoe
Psychology and the Perfect Design by @mrjoePsychology and the Perfect Design by @mrjoe
Psychology and the Perfect Design by @mrjoecxpartners
 
How Rapid Feedback improves the design process (Luke Jones, cxpartners)
How Rapid Feedback improves the design process (Luke Jones, cxpartners)How Rapid Feedback improves the design process (Luke Jones, cxpartners)
How Rapid Feedback improves the design process (Luke Jones, cxpartners)cxpartners
 
How to build a failsafe mobile usability testing set up
How to build a failsafe mobile usability testing set upHow to build a failsafe mobile usability testing set up
How to build a failsafe mobile usability testing set upcxpartners
 
Exploring the user experience through ethnography (Anna Wilkie, cxpartners)
Exploring the user experience through ethnography (Anna Wilkie, cxpartners)Exploring the user experience through ethnography (Anna Wilkie, cxpartners)
Exploring the user experience through ethnography (Anna Wilkie, cxpartners)cxpartners
 

More from cxpartners (20)

Chi briding the relevance gap
Chi briding the relevance gapChi briding the relevance gap
Chi briding the relevance gap
 
Putting people at the centre of design at the samaritans
Putting people at the centre of design at the samaritansPutting people at the centre of design at the samaritans
Putting people at the centre of design at the samaritans
 
cxpartners customer centricity
cxpartners customer centricitycxpartners customer centricity
cxpartners customer centricity
 
Designing Without Compromise
Designing Without CompromiseDesigning Without Compromise
Designing Without Compromise
 
Practical Steps in Determining Your Product Vision (Product Tank Bristol - Oc...
Practical Steps in Determining Your Product Vision (Product Tank Bristol - Oc...Practical Steps in Determining Your Product Vision (Product Tank Bristol - Oc...
Practical Steps in Determining Your Product Vision (Product Tank Bristol - Oc...
 
How to do the work you want to do - AKA neglect selling skills at your peril!...
How to do the work you want to do - AKA neglect selling skills at your peril!...How to do the work you want to do - AKA neglect selling skills at your peril!...
How to do the work you want to do - AKA neglect selling skills at your peril!...
 
Customer Driven Digital Transformation
Customer Driven Digital Transformation Customer Driven Digital Transformation
Customer Driven Digital Transformation
 
Research analysis: getting more from your data
Research analysis: getting more from your dataResearch analysis: getting more from your data
Research analysis: getting more from your data
 
Transforming Care in Bristol
Transforming Care in BristolTransforming Care in Bristol
Transforming Care in Bristol
 
Interaction designers vs algorithms
Interaction designers vs algorithmsInteraction designers vs algorithms
Interaction designers vs algorithms
 
Beyond the touch screen - better accessibility for mobile apps
Beyond the touch screen - better accessibility for mobile appsBeyond the touch screen - better accessibility for mobile apps
Beyond the touch screen - better accessibility for mobile apps
 
Co design (NUX4)
Co design (NUX4)Co design (NUX4)
Co design (NUX4)
 
How to ask a question
How to ask a questionHow to ask a question
How to ask a question
 
UX Leadership
UX LeadershipUX Leadership
UX Leadership
 
Photo ux nux 061014
Photo ux nux 061014Photo ux nux 061014
Photo ux nux 061014
 
Photo content strategy (James Chudley, cxpartners)
Photo content strategy (James Chudley, cxpartners)Photo content strategy (James Chudley, cxpartners)
Photo content strategy (James Chudley, cxpartners)
 
Psychology and the Perfect Design by @mrjoe
Psychology and the Perfect Design by @mrjoePsychology and the Perfect Design by @mrjoe
Psychology and the Perfect Design by @mrjoe
 
How Rapid Feedback improves the design process (Luke Jones, cxpartners)
How Rapid Feedback improves the design process (Luke Jones, cxpartners)How Rapid Feedback improves the design process (Luke Jones, cxpartners)
How Rapid Feedback improves the design process (Luke Jones, cxpartners)
 
How to build a failsafe mobile usability testing set up
How to build a failsafe mobile usability testing set upHow to build a failsafe mobile usability testing set up
How to build a failsafe mobile usability testing set up
 
Exploring the user experience through ethnography (Anna Wilkie, cxpartners)
Exploring the user experience through ethnography (Anna Wilkie, cxpartners)Exploring the user experience through ethnography (Anna Wilkie, cxpartners)
Exploring the user experience through ethnography (Anna Wilkie, cxpartners)
 

Recently uploaded

How to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPTHow to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPTThink 360 Studio
 
Construction Documents Checklist before Construction
Construction Documents Checklist before ConstructionConstruction Documents Checklist before Construction
Construction Documents Checklist before ConstructionResDraft
 
Create Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.comCreate Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.comjakyjhon00
 
The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024Alan Dix
 
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Ted Drake
 
Mike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtMike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtTeeFusion
 
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxWCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxHasan S
 
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Amil baba
 
Production of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxProduction of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxb2kshani34
 
High-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillHigh-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillCre8iveskill
 
Embroidery design from embroidery magazine
Embroidery design from embroidery magazineEmbroidery design from embroidery magazine
Embroidery design from embroidery magazineRivanEleraki
 
Cold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxCold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxSamKuruvilla5
 
Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Ed Orozco
 
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfBuilding+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfsaidbilgen
 
LRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfLRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfHctorFranciscoSnchez1
 
Designing for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsDesigning for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsBlock Party
 
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLMath Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLkenzukiri
 
Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...khushisharma298853
 
UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024mikailaoh
 

Recently uploaded (19)

How to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPTHow to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPT
 
Construction Documents Checklist before Construction
Construction Documents Checklist before ConstructionConstruction Documents Checklist before Construction
Construction Documents Checklist before Construction
 
Create Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.comCreate Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.com
 
The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024
 
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
 
Mike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtMike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy Shirt
 
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxWCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
 
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
 
Production of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxProduction of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptx
 
High-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillHigh-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkill
 
Embroidery design from embroidery magazine
Embroidery design from embroidery magazineEmbroidery design from embroidery magazine
Embroidery design from embroidery magazine
 
Cold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxCold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptx
 
Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...
 
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfBuilding+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
 
LRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfLRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdf
 
Designing for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsDesigning for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teams
 
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLMath Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
 
Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...
 
UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024
 

Chinese web design patterns: how and why they’re different (Chui Chui Tan)

  • 1. Chinese Web Design Patterns How and why they’re different Chui Chui Tan @ChuiSquared cxpartners http://www.flickr.com/photos/photolate/2452470259/ Monday, 27 June 2011
  • 2. I’m a Malaysian born Chinese, bro ug ht up follow ing Chinese cultu re an d tra ditions. I live Chui Chui an d w ork in UX for many years. I’ve t he a dvantages to see s fro m both sides an d http://www.flickr.com/photos/sacharules/2613374596/ thing om different perspectives. @ChuiSquared fr Monday, 27 June 2011
  • 3. Ho mepage of a Chinese - po p ular online sho pping site www.taobao.co m. n? W hat’s yo ur first impressio Monday, 27 June 2011
  • 4. H o mepage of a po pular C hinese web portal site - www.qq.co m. What’s yo ur first impression? Monday, 27 June 2011
  • 5. Busy? Complicated? Cluttered? Confusing? Colourful? Wow Any of these? Monday, 27 June 2011
  • 6. Must look complicated ? Must have lots of links ? Links must open new windows ? Must use flash ? It’s easy to just sites an d make lo ok at a few Chinese quick assu mptions an d nclusions abo ut them. ? co Must look busy Th ese are the most co m mo n assu mptions ma de abo ut Chinese sites. But are they true? If they are, then why? If they are not, then why? Monday, 27 June 2011
  • 7. Must look complicated Must have lots of links Links must open new windows Must use flash Must all Chinese sites lo ok Must look busy co mplicate d? Let’s think abo ut why they lo ok co mplicate d. Monday, 27 June 2011
  • 8. Yo u can see two things in one - a yo ung la dy an d an old la dy. It’s an illusion. Co uld t hose co mplex Chinese sites be co mplex an d simple? Monday, 27 June 2011
  • 9. n BBC News site: UK versio Tidy la yo ut, easily scanne d. Monday, 27 June 2011
  • 10. B BC News site: In donesian version Similar layo ut, same alphabets. But might lo ok a bit more co mplicate d. Monday, 27 June 2011
  • 11. BBC n ews site: Russian version Tidier layo ut, but lo ok more co mplicate d than the English version. Monday, 27 June 2011
  • 12. BBC news site: “COMPLIC ATED” Chinese version Is it really co mplicate d? Same amo unt of info as the other ver sions an d similar layo ut. Westerner s think it’s co mplicate d t because t hey don’t un derstan d wha they are lo oking at. Monday, 27 June 2011
  • 13. BBC news site: “COMPLIC ATED” Chinese version To C hinese users, it’s not co mplicate d. It’s as simple as the English ver sion because they are tak ing the same amo unt of infor mation as the West. Monday, 27 June 2011
  • 14. s O ther reason Chinese site often lo ok more co mplicate d is because of Chinese characters: Beautiful but co mplex http://www.flickr.com/photos/xiangxi/3308585857/ Monday, 27 June 2011
  • 15. Tan Chui Chui 11 8 15 15 strokes strokes strokes strokes Chinese characters are for me d by strokes. It can be fro m 1 stroke 64 36 to o ver 60 strokes. strokes strokes nàng (Snuffle) zhé (Verbose) My last name: kes Simplifie d Chinese: 8 stro Most strokes Most complex characters found kes Tra ditional Chinese :11 stro in modern Chinese dictionaries s each My first name: 15 stroke Monday, 27 June 2011
  • 16. Twitter “Tweet” “Follow” Facebook “Like” Twitter “Tweet” “Follow” Twitter e No capital letter in Chines writing. No spac e between characters. H ence, it lo ok more intense w ith less breathing ro o m. Monday, 27 June 2011
  • 17. Twitter “Tweet” “Follow” Facebook “Like” Twitter “Tweet” “Follow” Twitter But, it doesn’t lo ok co mplicate d to Chine se users because they are use d to rea d it. Monday, 27 June 2011
  • 18. Must look complicated Must have lots of links Links must open new windows It’s not co mpletely true that all Must use flash Chinese sites must lo ok co mplicate d. It’s an illusion yo ur brain create d when t. yo u don’t kno w what yo u are lo oking a s Must look busy It’s also beca use of Chinese character which can be co mplex an d Chinese writing which w itho ut space between characters. Monday, 27 June 2011
  • 19. Must look complicated Must have lots of links Links must open new windows Must use flash Must look busy Monday, 27 June 2011
  • 20. T hey DO use a lot of links. WHY? Monday, 27 June 2011
  • 21. Designers suggeste d it’s because typing in Chinese on an alph abet-base d keyboard is hard. He nce sites are designe d for clicking as o ppose d to searching. I DON’T agree. Monday, 27 June 2011
  • 22. Standard Chinese keyboard Chinese use the same keyboards as the West. T hey use ‘Pinyin’ to input Chinese characters using these a lphabet-base d keyboards. Monday, 27 June 2011
  • 23. *This page was modified to replace a video showing how to use ‘Pinyin to input Chinese characters. Beijing( ) Fei( ) Niuyue ( ) Monday, 27 June 2011
  • 24. There are shortcuts. In stea d of typing ‘beijing’, *This page was modified to Chinese c an just type ‘bj’ an d replace a video showing how to cho ose fro m the list. use shortcuts to input Chinese Sim ilarly for ‘Niuyue’ [New characters using ‘Pinyin’ Yo rk] where they can just type ‘ny ’. Monday, 27 June 2011
  • 25. It’s fast an d easy. It co uld be slow er for Chinese to type in English than in Chinese. Chin ese also co mplain abo ut not being able to fin d what they are after on a page due to t he o ver whelming content e an d links. Instea d, they cho os ip to u se the search box an d sk the ho mepage. Monday, 27 June 2011
  • 26. Must look complicated Must have lots of links Links must open new windows Must use flash A lot of links is what most Must look busy Chinese sites have. But it’s not what Chinese users like. Monday, 27 June 2011
  • 27. o L inks o pen new w in dows t g support Chinese’s browsin behavior: T hey lo ok at one w in dow w hilst waiting for other w in dows to loa d. http://www.flickr.com/photos/ryananderson/223193295/ Monday, 27 June 2011
  • 28. Average connection speed 15000 It’s because China has slow Int ernet connection spee d 12021 wh ilst it has the highest int ernet po pulation in the 10000 world. Kilobits/Second 5000 4684 3812 1271 695 0 South Korea USA UK Brazil China http://www.techknowtimes.com/web/global-downloads-speed-comparison/ Monday, 27 June 2011
  • 29. Average connection speed 15000 Ho wever, this is go ing to change. er 12021 Ch ina Teleco m aims to deliv 100 Mbps by 2013. o 10000 Ch ina Mobile is ho ping to d Kilobits/Second the same in 5 years. 5000 4684 3812 1271 695 0 South Korea USA UK Brazil China http://www.techknowtimes.com/web/global-downloads-speed-comparison/ Monday, 27 June 2011
  • 30. Must look complicated Must have lots of links Just for now Links must open new windows Must use flash Only for now where links o pen new w in dows. ill Must look busy Inte rnet connection spee d w g be in crease d in China in co min year s an d Chinese users’ . brow sing behavior w ill change Monday, 27 June 2011
  • 31. Must look complicated Must have lots of links Just for now Links must open new windows Must use flash Must look busy Monday, 27 June 2011
  • 33. [Go to sina.co m.cn - a in fotainment web portal co vering news, entertainment, games, blog s an d microblogg ing. sh L o ok at the nu mber of fla banners on the page.] Monday, 27 June 2011
  • 34. They are all a dverts. This is how China cur rent he econ o my situation is like at t e mo m ent. Their main profits ar fro m a dverts. The best way to get users’ atte ntion to these a dverts is via flash a dverts. Monday, 27 June 2011
  • 35. For example, T aobao’s main revenue is fro m its a dverts (more than th e profits they get fro m their ser vices). But it is starti ng to change now in China. Monday, 27 June 2011
  • 36. w Lo ok at www.do uban.co m - a ne Chinese online librar y site for b o oks, music, mo vies, etc. ut There’s no flash or no a dverts. B it ’s do ing well in China. Monday, 27 June 2011
  • 37. e “36 0 safeguard” is a Chines s We b security to ol. One of it fun ctionalities is to allow Ch inese to filter a dverts. It’s a po pular to ol in China. Ch inese want to see pages w it ho ut distracting a dverts. http://middle.blog.sohu.com/159409841.html Monday, 27 June 2011
  • 38. Fonts se A nother reason why Chine on designers often use flash w ebsites is because of ts. a vailable Chinese Web fon Monday, 27 June 2011
  • 39. Limited font choices No way to emphasise font Restriction on font sizes There is limite d Chinese Web t ypography as it nee ds to 0 a cco m mo date at least 400 in dividual characters. http://www.flickr.com/photos/vlastula/300102949/ Monday, 27 June 2011
  • 40. Limited font choices No way to emphasise font Restriction on font sizes There is no fancy fonts available. . Minimu m font size = 12px Smalle r than that can create rea da bility problem (because e Chinese characters can b quite co mplex) http://www.flickr.com/photos/vlastula/300102949/ Monday, 27 June 2011
  • 41. Must look complicated Must have lots of links Just for now Links must open new windows Must use flash It’s how China econo my work s ly at the mo ment - heavily re on a dverts for revenue. Must look busy t Fla sh is not necessarily wha Chinese users want. Monday, 27 June 2011
  • 42. Must look complicated Must have lots of links Just for now Links must open new windows Must use flash Must look busy Monday, 27 June 2011
  • 43. No Simplicity We always hear: ^ Ch be inese DON’T like simplicit cause of the ‘the more t y he in China? mer rier’ saying. Is that true? http://www.flickr.com/photos/fab_photos/2419404100/ Monday, 27 June 2011
  • 44. Baidu - the biggest search eng ine in China 420 million users Monday, 27 June 2011
  • 45. Ba idu has the same page de sign an d layo ut as Go ogle (simple an d tidy layo ut design) Monday, 27 June 2011
  • 46. Go ogle search result page Monday, 27 June 2011
  • 47. Baidu se arch result page has . simpler layo ut as Go ogle’s Monday, 27 June 2011
  • 48. Weibo (Chinese equivalen t Tw itter) has 140 million u sers. It has similar page desig n as Tw itter. Monday, 27 June 2011
  • 49. What makes it po pular in China is not the busynes s of the site, it’s the function alities it pro vides that support what Chinese users want an d their social behaviors. Monday, 27 June 2011
  • 50. www.taobao.co m: Chinese users like it not beca use of its colorful, long pa g e. It’s all abo ut pro ducts e Chin ese can buy fro m this sit w ith ver y low price. Monday, 27 June 2011
  • 51. It’s more abo ut “ What the site does to the Chinese users rath er than how it lo oks.” Monday, 27 June 2011
  • 52. “Don’t like Sina’s sport site. It feels messy and cluttered. Can’t find anything.” “Really dislike local download sites. Thousands of download links. The one you are looking for appears to be so small. Whereas those messy adverts and rubbish tools are unnecessarily big. Chinese c o mplaine d abo ut a dverts to an d that they are not being able fin d what they are after. (These ar e updates fro m Weibo - Ch inese equivalent Tw itter) Monday, 27 June 2011
  • 53. “The user experience of AirAsia website is really bad....” “It’s really painful to book flights through Shenzhen airlines site. It has rather bad user experience.” Chinese users care abo ut usability an d user exper ien ce. “Douban has the most comfortable adverts But, they have to put up that I have ever seen on a website. Good user w ith experience can make adverts more designs which offere d to acceptable.” them. They ’ve no cho ice because all co mpanies ar e g iving them similar (ba d) we b designs. Monday, 27 June 2011
  • 54. So, if Chinese don’t like h ow existing Chinese sites are being designe d an d want simple sites ( just like the West), then why we cons tantly see Chinese sites which a re designe d in similar patte rns? There are a nu mber of reasons. http://www.flickr.com/photos/kareneliot/2710464400/ Monday, 27 June 2011
  • 55. Part of it has to do w ith Confucius (a Chinese philoso pher die d 2.5 tho usan d years ago). His teachings influence d Chinese culture an d socia l behaviors. His teachings emphasise d the important of social, mora l order an d hierarchy. http://www.flickr.com/photos/rob_web/466866299/ Monday, 27 June 2011
  • 56. g H ierarchy means respectin an d liste ning to peo ple who are o lder than yo u an d yo ur superiors. When b osses say so mething, it’s a co m man d, not a starting po int for discussion. E.g. If they want to put a lot of flash a dverts on a , h o mepage to gain revenue designe rs have no cho ice but to follow. http://www.flickr.com/photos/19779889@N00/4455072054/ Monday, 27 June 2011
  • 57. Another Confucius teach ing: collectivism China is a collectivist soc iety, hence social recognition is important. “Mian Zi” or Face (or pre stige) is important. Chinese wan t to gain an d maintain face in all aspects of their persona l, social an d business life. Monday, 27 June 2011
  • 58. How they are perceive d by society is important as society ’s en dorsement de fine their values. It’s co m mon co mpanies t r y to squeeze as much content as they can on their site to g ive users the impression tha t they ’re do ing well an d h ave plenty to offer. Just like Chinese host of ten order more fo o d than th eir guests co uld possibly eat. Monday, 27 June 2011
  • 59. It can be quite hard for Westerners to grasp the idea of Face. This is a nice article abo ut Face an d the role it play s in Chinese society. http://www.china-mike.com/chinese-culture/ understanding-chinese-mind/cult-of-face/ Monday, 27 June 2011
  • 60. UX is still at the beg innin g stage in China. There is lack of UX or H CI relate d co urses or e duca tion program mes. http://www.flickr.com/photos/h4ck/4202513554/ Monday, 27 June 2011
  • 61. Chinese client still don’t un derstan d much abo ut t he importance of UX. It’s fine for now because almost all Chinese sites a re designe d in similar patte rns. Chinese have no cho ice b ut to put up w ith what they a re g iven. Once UX beco mes more po pular an d more Chines e sites pro vide not only go o d pr o ducts but also go o d UX, Chines e w ill be less forg iven for sites w ith ba d UX. http://www.flickr.com/photos/h4ck/4202513554/ Monday, 27 June 2011
  • 62. Also, Chinese designers h ave ver y low salaries. They bear a nu mber of responsibilities an d often are g iven ridiculo us timescale . Therefore they are likely to co py each other or exist ing sites. Hence, we ten d to see Ch inese sites w ith similar design patterns again an d again . http://www.flickr.com/photos/cbcastro/477856025/ Monday, 27 June 2011
  • 63. These are the cur rent d esign tren ds in Chinese websit es. But it’s just a mo ment in Chin ese histor y. Things w ill change drast ically in the co ming few years. http://www.flickr.com/photos/cbcastro/477856025/ Monday, 27 June 2011
  • 64. Design pattern: Similarities . Differences So, a re Western an d Chinese we b sites ver y different in ter ms of their design? Let’s lo ok at these sites.... Monday, 27 June 2011
  • 65. Th e NY Times ho mepage: a busy, lo ng page w ith a lot of links an d content. Monday, 27 June 2011
  • 66. The Sina news site (www.news.sina.co m.cn): If yo u put it into a w ireframe, it has tidier layo ut than the NY Times ho mepage. Monday, 27 June 2011
  • 67. he What ’s important is not just t at site d esign, it’s more abo ut wh yo ur site does to the users. It’s abo ut pro viding what Chinese users want an d suppo rting their behaviors an d social elements. For example.... Monday, 27 June 2011
  • 68. . Chin a is a collectivist society e Shar ing an d participations ar ver y important. Chin ese leave co m ments in almo st ever ything: blogs, vide os, microblogg ing... much more than the West. http://www.flickr.com/photos/ben_grey/4582294721/ Monday, 27 June 2011
  • 69. Chin a is also an expressive society. s They like an d use a lot of icon - cute, animation icons. t Thes e seem to be unimportan elem ents but they have big impa ct on how Chinese use yo ur site. Yo u nee d to pay attention to ing the se elements when pro vid r a se r vice to Chinese (via yo u we b sites or other means) http://www.flickr.com/photos/ben_grey/4582294721/ Monday, 27 June 2011
  • 70. You won’t learn about a country in one presentation. Monday, 27 June 2011
  • 71. Things will change Because a society w ill change o ver time, inclu ding its econo my, its users’ behaviors, etc. Browsing behaviour Use of adverts and animations Internet speed China economy Education & experiences in UX Font choice options Use of Design quality & graphics innovation Monday, 27 June 2011
  • 72. Make quick conclusions based on what you see Design your site by (blindly) following the design of others Chinese sites Understand why and look into the reasons behind Understand how Chinese users would use your site (behaviour, culture, social, economy) Monday, 27 June 2011
  • 73. Some popular Chinese sites www.taobao.com : Online shopping site www.qq.com : Chinese web portal integrating news, entertainment and other basic web-based services www.sina.com.cn : Chinese infotainment portal integrating news, entertainment, blogs, microblogging (Sina Weibo) and so on www.douban.com : Online library for music, books, movies www.ctrip.com : Popular Chinese travel booking site www.baidu.com : China’s biggest search engine www.alipay.com : Online payment solution (Chinese equivalent PayPal) http://china.alibaba.com : online auction site (Chinese equivalent eBay) www.youku.com : Video hosting service www.tudou.com : Video site (Chinese equivalent YouTube) www.weibo.com: Microblogging site (Chinese equivalent Twitter) www.renren.com : Social network site (Chinese equivalent Facebook) www.sohu.com : Chinese portal website Additional slide (as requested) Monday, 27 June 2011
  • 74. Related links (Chinese culture) “China - Language, Culture, Customs and Etiquette” http://www.kwintessential.co.uk/resources/global-etiquette/china-country-profile.html “Chinese Customs, Manners and Etiquette” http://factsanddetails.com/china.php?itemid=114&catid=4&subcatid=19 “Confucius 101: A key to understanding the Chinese Mind” http://www.china-mike.com/chinese-culture/understanding-chinese-mind/confucius/ Chinese Cultural Values and Their Implications in Business” http://www.china-window.com/china_business/china_business_tips/chinese-cultural-values- a.shtml Additional slide (as requested) Monday, 27 June 2011
  • 75. Related links (in English) about Chinese web design: * Note that I personally DO NOT necessarily agree with all the discussions in these sites. “Showcase of Web Design in China: From Imitation To Innovation” http://www.smashingmagazine.com/2010/03/15/showcase-of-web-design-in-china-from-imitation-to- innovation-and-user-centered-design/ “Why is Chinese Web Design So Bad?” http://thinkvitamin.com/design/why-is-chinese-web-design-so-bad/ Quora: “Why are Chinese websites and software interfaces always complicated..." http://www.quora.com/Why-are-Chinese-websites-and-software-interfaces-always-complicated-and- English-language-websites-like-Google-LinkedIn-and-Twitter-much-simpler 10 online advertising trends in China in 2010 http://www.china-online-marketing.com/news/marketing/10-online-advertising-trends-in-china-in-2010/ Additional slide (as requested) The insights in this presentation are from the combination of my Chinese background, my research experiences in China for my clients, my conversations with local Chinese users and local Chinese designers/ UX practitioners, Chinese forums, Chinese discussion sites, etc. Please feel free to contact me: chuichui.tan@cxpartners.co.uk or tweet me @ChuiSquared if you’ve any specific questions. Monday, 27 June 2011
  • 76. chuichui.tan@cxpartners.co.uk @ChuiSquared chuichuitan Monday, 27 June 2011