Cross-cultural human-computer interaction and user experience design : a semiotic perspective

203 Pages·2015·9.395 MB·English

by  Jan Brejcha

Ergonomics and Human Factors B Cross-Cultural
r
e
j
c
“Jan Brejcha has captured succinctly and eloquently the essentials of semiotics and h
a
of user-experience, and shown how to combine them in a manner that helps readers
Human-Computer
significantly to describe, analyze, evaluate, and design cross-cultural interaction C
r
and user experiences. … usable, useful, and appealing content that is effective, easy o
s
to understand, and easy to apply.”
s
—Aaron Marcus, Principal, Aaron Marcus and Associates - Interaction and
C
u
“… a practical book … includes useful examples and illustrations of how semiotic l
t
u
concepts can be appropriated by HCI professionals and, in this way, contribute to r
a User Experience
improve and expand the design of the users’ experience.” l

H
—Clarisse Sieckenius de Souza, PUC-Rio
u
(Pontifical Catholic University of Rio de Janeiro) m
a Design
n
The semiotic perspective of Human-Computer Interaction (HCI) can give you insight -
C
into values, beliefs, and reference systems of the users that often go unnoticed when o
m
using traditional HCI approaches. Cross-Cultural Human-Computer Interaction
p
and User Experience Design: A Semiotic Perspective focuses on the semiotic u
t
approach in product, services, and system design, and emphasizes the semiotic and e
linguistic aspects in HCI and user experience (UX). The book shows you how to r A Semiotic
I
n
leverage these insights when creating useful, usable, and appealing user interfaces.
t
e
r Perspective
a
Although extensive research has been done in HCI semiotics and the cultural c
t
aspects of HCI, this book differs by exploring how these fields are informed by i
o
the linguistic perspective. It presents a novel approach to cross-cultural HCI/UX, n

covers the latest research in the field, and brings a set of tools and methods to benefit a
n
the design process by taking a semiotic perspective. It also supplies a set of design d

guidelines for developing more usable, useful, and appealing products, services, U
s
and systems. e
r

E
x
p
e
r
i
e
n
c
e

D
K24618 e
s
6000 Broken Sound Parkway, NW ISBN: 978-1-4987-0257-7 i
Suite 300, Boca Raton, FL 33487 g
90000
711 Third Avenue n
New York, NY 10017
an informa business
2 Park Square, Milton Park
www.crcpress.com Abingdon, Oxon OX14 4RN, UK
9 781498 702577
w w w.crcpress.com
Jan Brejcha

P1:RAZI
December18,2014 14:53 K24618 K24618˙Book
P1:RAZI
December18,2014 14:53 K24618 K24618˙Book
P1:RAZI
December18,2014 14:53 K24618 K24618˙Book
CRC Press
Taylor & Francis Group
6000 Broken Sound Parkway NW, Suite 300
Boca Raton, FL 33487-2742
© 2015 by Taylor & Francis Group, LLC
CRC Press is an imprint of Taylor & Francis Group, an Informa business
No claim to original U.S. Government works
Version Date: 20140829
International Standard Book Number-13: 978-1-4987-0258-4 (eBook - PDF)
This book contains information obtained from authentic and highly regarded sources. Reasonable efforts
have been made to publish reliable data and information, but the author and publisher cannot assume
responsibility for the validity of all materials or the consequences of their use. The authors and publishers
have attempted to trace the copyright holders of all material reproduced in this publication and apologize to
copyright holders if permission to publish in this form has not been obtained. If any copyright material has
not been acknowledged please write and let us know so we may rectify in any future reprint.
Except as permitted under U.S. Copyright Law, no part of this book may be reprinted, reproduced, transmit-
ted, or utilized in any form by any electronic, mechanical, or other means, now known or hereafter invented,
including photocopying, microfilming, and recording, or in any information storage or retrieval system,
without written permission from the publishers.
For permission to photocopy or use material electronically from this work, please access www.copyright.
com (http://www.copyright.com/) or contact the Copyright Clearance Center, Inc. (CCC), 222 Rosewood
Drive, Danvers, MA 01923, 978-750-8400. CCC is a not-for-profit organization that provides licenses and
registration for a variety of users. For organizations that have been granted a photocopy license by the CCC,
a separate system of payment has been arranged.
Trademark Notice: Product or corporate names may be trademarks or registered trademarks, and are used
only for identification and explanation without intent to infringe.
Visit the Taylor & Francis Web site at
http://www.taylorandfrancis.com
and the CRC Press Web site at
http://www.crcpress.com
P1:RAZI
December18,2014 14:53 K24618 K24618˙Book
Contents
ListofFigures .........................................................vii
ListofTables ...........................................................xi
Preface..................................................................xiii
Acknowledgments .....................................................xv
AuthorBiography.......................................................xvii
Chapter1 Introduction...................................................1
PART I Semiotics of Interaction
Chapter2 SemioticFoundationsofHCIandUXDesign.....................9
2.1 Signs,data,information...................................10
2.2 Actors,audiences,paradigms..............................12
2.3 Ideology,persuasion......................................14
2.3.1 Cognitivepower..................................17
2.3.2 Evaluativepower.................................19
2.3.3 Actionorientation................................19
2.3.4 Logicalcoherence................................21
2.4 UIlanguages.............................................23
2.4.1 Visiblelanguage.................................28
2.4.2 Interactionlanguage..............................28
Chapter3 SemioticDesignandEvaluationFramework.....................31
3.1 UIlanguagecomponents..................................31
3.1.1 Discreteelements................................31
3.1.2 Interactionsentences..............................32
3.1.3 Narration........................................36
3.1.4 Rhetoricaltropes.................................37
3.1.5 Patterns.........................................38
3.2 UIannotation............................................38
3.3 UIcorpus................................................40
Chapter4 CaseStudy:ExpertEvaluationsofComplexUIs ................. 45
4.1 UIannotationandanalysis................................45
4.1.1 Red-eyeremoval.................................45
4.1.2 Barreldistortion..................................50
v
P1:RAZI
December18,2014 14:53 K24618 K24618˙Book
vi Contents
4.1.3 Eliminateanobject...............................57
4.1.4 Cloneobjectsinperspective.......................62
4.1.5 CustomizetheUI.................................69
4.2 Globalsemioticanalysis..................................74
4.3 Expertevaluationresults..................................75
Chapter5 Discussion...................................................77
PART II Culture of Interaction
Chapter6 UILanguageComponentsandCulturalMarkers ................. 81
Chapter7 Cross-CulturalDesignandEvaluationFramework................83
7.1 Researchmethods........................................83
7.1.1 Phasesofresearch................................85
7.1.2 Initialquestions..................................85
7.2 Hypothesesandquestionnaire..............................86
Chapter8 CaseStudy:Cross-CulturalPreferenceofUILanguage
Components,CulturalMarkers.................................87
8.1 Interviewandresultsanalysis..............................87
8.1.1 Personaldata .................................... 87
8.1.2 Layout..........................................94
8.1.3 Color..........................................119
8.1.4 Symbols........................................131
8.1.5 Lookandfeel...................................145
8.2 ProposedguidelinesforChineseUIdesign.................151
Chapter9 DiscussionandConclusion....................................153
ConclusionandFutureWork ..........................................159
PART III Appendices
AppendixA HeuristicEvaluation........................................163
AppendixB SemioticAnalysis..........................................167
AppendixC Hypotheses................................................169
References ...........................................................173
Index ................................................................183
P1:RAZI
December18,2014 14:53 K24618 K24618˙Book
List of Figures
2.1 Sovietposterdedicatedtothe5thanniversaryoftheOctoberRevolu-
tionandIVCongressoftheCommunistInternational.Theimagecon-
tainsallofthefourideologycomponentsdefinedbyMullins,1972.
Source: http://commons.wikimedia.org/wiki/File:
CominternIV.jpg,cit.2009-05-02....................................17
2.2 AGoogleEarthscreenshotdepictinghistoricalcenterofPragueina
veryrealisticway.Mapdata(cid:2)c 2008Google,(cid:2)c2014GEODISBrno,
SIO,NOAA,U.S.Navy,NGA,GEBCO.GoogleandtheGooglelogo
areregisteredtrademarksofGoogleInc.,usedwithpermission..........20
2.3 OrderofSubject,ObjectandVerb.Source:http://wals.info/
feature/81A?z1=2435&v2=cd00&v1=c00d&s=20&v3=
cff0&v4=dff0&v5=dd00&v6=d00d&v7=cccc&z5=2989&z6=
2996&z7=2811&z4=2975&z2=2512&z3=2905&tg_format=
map&lat=31.653381399664&lng=8.7890625&z=2&t=m,
cit.2013-05-01.ReprintedwithpermissionfromMatthewDryerand
MartinHaspelmath..........................................................24
2.4 Kayak air ticket finder. Source: http://www.kayak.com,cit.
2013-05-18.KAYAKscreenshotreprintedwithpermissionfromKAYAK
SoftwareCorporation. ......................................................25
2.5 SpatialmapforassessingthelayoutsemioticsaccordingtoKressand
vanLeeuwen.................................................................26
3.1 Adobe Photoshop splash screen. Source: Adobe Photoshop CS2.
Adobeproductscreenshot(s)reprintedwithpermissionfromAdobe
SystemsIncorporated. ......................................................41
3.2 GIMPsplashscreen.Source:TheGIMP2.6.7. ...........................43
4.1 AdobePhotoshopmenubar.Source:AdobePhotoshopCS2.Adobe
productscreenshot(s)reprintedwithpermissionfromAdobeSystems
Incorporated.................................................................45
4.2 AdobePhotoshopredeyetool.Source:AdobePhotoshopCS2.Adobe
productscreenshot(s)reprintedwithpermissionfromAdobeSystems
Incorporated.................................................................46
4.3 GIMPredeyetool.Source:TheGIMP2.6.7..............................48
4.4 GIMPredeyeremoval.Source:TheGIMP2.6.7. ........................49
4.5 Adobe Photoshop lens correction. Source: Adobe Photoshop CS2.
Adobeproductscreenshot(s)reprintedwithpermissionfromAdobe
SystemsIncorporated. ......................................................52
4.6 AdobePhotoshoplenscorrectionwindow.Source:AdobePhotoshop
CS2. Adobe product screenshot(s) reprinted with permission from
AdobeSystemsIncorporated...............................................53
4.7 GIMPperspectivefunctionwindowwithaffordanceboxes.Source:
TheGIMP2.6.7.............................................................55
4.8 GIMPperspectivetransformationwindow.Source:TheGIMP2.6.7....55
vii
P1:RAZI
December18,2014 14:53 K24618 K24618˙Book
viii ListofFigures
4.9 Adobe Photoshop healing brush. Source: Adobe Photoshop CS2.
Adobeproductscreenshot(s)reprintedwithpermissionfromAdobe
SystemsIncorporated. ......................................................57
4.10 Adobe Photoshop healing dialog. Source: Adobe Photoshop CS2.
Adobeproductscreenshot(s)reprintedwithpermissionfromAdobe
SystemsIncorporated. ......................................................57
4.11 Adobe Photoshop healing process. Source: Adobe Photoshop CS2.
Adobeproductscreenshot(s)reprintedwithpermissionfromAdobe
SystemsIncorporated. ......................................................58
4.12 GIMPhealtool.Source:TheGIMP2.6.7. ................................60
4.13 GIMPhealstatusbar.Source:TheGIMP2.6.7. ..........................60
4.14 AdobePhotoshopvanishingpointmenu.Source:AdobePhotoshop
CS2. Adobe product screenshot(s) reprinted with permission from
AdobeSystemsIncorporated...............................................63
4.15 AdobePhotoshopvanishingpointresult.Source:AdobePhotoshop
CS2. Adobe product screenshot(s) reprinted with permission from
AdobeSystemsIncorporated...............................................63
4.16 GIMPperspectiveclonemenu.Source:TheGIMP2.6.7.................66
4.17 GIMPperspectivecloneplaneandtool.Source:TheGIMP2.6.7. ......67
4.18 Adobe Photoshop customize UI. Source: Adobe Photoshop CS2.
Adobeproductscreenshot(s)reprintedwithpermissionfromAdobe
SystemsIncorporated. ......................................................69
4.19 Adobe Photoshop customize keyboard. Source: Adobe Photoshop
CS2. Adobe product screenshot(s) reprinted with permission from
AdobeSystemsIncorporated...............................................70
4.20 GIMPcustomizeUImenu.Source:TheGIMP2.6.7. ....................72
4.21 GIMPcustomizeshortcut.Source:TheGIMP2.6.7......................73
8.1 Ageofrespondents..........................................................88
8.2 Genderofrespondents. .....................................................88
8.3 Originofrespondents.......................................................90
8.4 LevelofEnglishlanguageinrespondents. ................................91
8.5 Computerlevelofrespondents. ............................................92
8.6 Applicationsusagefrequency...............................................93
8.7 Websiteusagefrequency....................................................94
8.8 Layoutmatrix................................................................95
8.9 Placement of important information on the matrix in the Chinese
sample. ......................................................................96
8.10 PlacementofimportantinformationonthematrixintheCzechsam-
ple............................................................................97
8.11 PlacementofnewinformationonthematrixintheChinesesample. ....98
8.12 PlacementofnewinformationonthematrixintheCzechsample. ......98
8.13 PlacementoffamiliarinformationonthematrixintheChinesesam-
ple............................................................................99
8.14 PlacementoffamiliarinformationonthematrixintheCzechsample. 100
8.15 PlacementofgeneralinformationonthematrixintheChinesesample.101
8.16 PlacementofgeneralinformationonthematrixintheCzechsample.. 101