Rosário Durão

Center for Comparative Studies, University of Lisbon

CEC / CEAUL

DESIGNING INFORMATION FOR ONLINE USERS.

Numbers. Profiles. Techniques.

ColloquiumUniversity of Lisbon, Faculty of Letters

March 3, 2011 – 6:00-8:00 pm – Room 5.2

2

• Center for Comparative Studies, Univ. of Lisbon

• Center for English Studies of the University of Lisbon

• Fundação para a Ciência e Tecnologia (Post Doctoral Grant ref. SFRH/BPD/43227/2008)

ACKNOWLEDGEMENTS

3

I – NUMBERS• Characteristics of online information

• Interfaces

• Users

II – PROFILES• Personas

III – TECHNIQUES• Worst and best practices

• Objectives of interface design

CONTENTS

4

• Interface components

• Designing information

• Designing information for online users

• Implications of “meaning” and universality

CONTENTS

5

“The dream behind the Web is of a common information space in which we communicate by sharing information. Its universality is essential: the fact that a hypertext link can point to anything, be it personal, local or global, be it draft or highly polished.”

Tim Berners-Lee, 7 Maio, 1998

6

NUMBERS

I

7

I. NUMBERSCharacteristics of online information

• What is online information?

• What is the purpose of online information?

• How does online information work?

8

I. NUMBERSCharacteristics of online information

• What is online information?

• A tool

• A predominantly visualmedium

• An artifact characterized by modular content

• An artifact where “Content is king!”

Sources: Galitz 4-5; Horton 1990

9

I. NUMBERSCharacteristics of online information

• What is the purpose of online information?

• To “satisfy the user’s needs, capabilities, and limitations in the most effective way possible.”

Source: (trad.) Galitz 4

10

I. NUMBERSCharacteristics of online information

• How does online information work?

• Engineers, manufacturers, authors, designers, and professional communicators produce material and graphic interafaces that “people can see, hear, touch, talk to, or otherwise understand or direct.”

• For most people, there is only the interface.

Source: Galitz, 4-5

11

I. NUMBERSCharacteristics of online information

• What type of interfaces?

• For what users?

• To do what?

• Where?

• How?

12

I. NUMBERSCharacteristics of online information

• What type of interfaces?

13

I. NUMBERSInterfaces

• Alternative input devices (keyboards, trackballs, touch screens, sip-and-puff devices, head daubers)

• Light emitting devices, touch typing devices,eye trackers

• Braille displays and embossers

• Speech recognition, speech synthethizers …

14

I. NUMBERSUsers

• For what users?

• Everyone

• Age

• Disability

• Culture

• Language

• Technological factors

15

• Age

• Increasing life expectancy

• Decreasing fertility

I. NUMBERSUsers

Source: United Nations 2001

16

I. NUMBERSUsers

Source: United Nations 2001; : CIA, The World Factbook; Moreira s/d

17

• Implications of age• Aging and work

• Aging and technologies

• Active population 40+ = 48% of active population (>68 million) (US 2003)

• Active population 45+: 69% plans to continue working after 65 (same job, another job, new career, own business) (US 2003)

• Active population with current computer skills retires later -> training

I. NUMBERSUsers

Source: Charness 2008; Mosner 2003

18

• Disability

• Concept

• Communicative (hearing, seeing, speaking difficulty/impossibility)

• Mental (learning difficulty; Alzheimer, ADD, autism, senility …)

• Physical (difficulty in walking 1 km, going up the stairs, holding objects, getting in and out of bed; using a cane, walker; arthritis, fractures; cancer; heart problems, paralysis (including cerebral) …)

I. NUMBERSUsers

Source: Americans With Disabilities: 2005, Census Bureau

19

• Disability rates by age

(UK 2000-2001)

I. NUMBERSUsers

Source: Charness e Jastrzembski 2009

20

Disability rates, by type, and age (US)

Disability rates, by type, and age (PT) (6/100 - c. 642.000)

I. NUMBERSUsers

Sources: National Health Interview Survey on Disability 1995-1995; Gonçalves 2001

21

• Implications

• Disability and technologies

I. NUMBERSUsers

“Many disabled people use extra gadgets to help them use the Web … Many, many other people who don’t necessarily define themselves as having a disability (such as older people) just soldier on without any assistance, peering at low-contrast, unscalable, 10-point type or trying to click tiny radio buttons on order forms.”

“Technological advances offer the promise of compensating for some of these declines, enabling older adults to lead not just longer, but healthier and more productive, lives.”

Source: Lawson 2006; Charness 2008

22

• Disability and work

I. NUMBERSUsers

Source: Brault 2008

23

• Culture

• Importance

“When users browse the Web pages, they will unconsciously apply their cultural preferences to evaluate the design of Web pages.”

I. NUMBERSUsers

Source: Sun 2001; Baack e Singh 2007

24

• Communication context• High vs. Low

context culture (HCC vs. LCC)

• Individualist vs. Collectivist culture (IC vs. CC)

HCC. Endogroup culture, inference (Japanese, Chinese, Arab, Latin-American)

LCC. Exogroup culture, explicit (Scandinavia, Germany)

(Edward T. Hall)

IC. Independence, little social cohesion (US, France, Germany, Canada)

CC. Strong social bonds, group loyalty (Japan, Mexico, Greece)

(Geert Hofstede)

I. NUMBERSUsers

Source: Hoft 1995

25

• Social organization

• High vs. Low power distance (HPD vs. LPD)

• Satus by adscription vs. By achievement (SAd vs. SAc)

HPD. Fear of talking to people that are hierarchically superior (Latin-America, Asia, Africa)

LPD. Interaction of heterogeneous groups (US, UK, Denmark, New Zealand, Israel)

(Geert Hofstede)

SAd. Tradition (Russia, Japan, Belgium, Spain, France)

SAc. Individual goals, competence (Norway, US, UK, Canada)

(Fons Trompenaars)

I. NUMBERSUsers

Source: Hoft 1995

26

• Concept of time

• Polychronic vs. Monochronic time (PT vs. MT)

PT. Simultaneous and co-occurring time: schedules as objectives, lifelong relationships, simultaneous tasks, distractions and interruptions (Middle Eastern, Latin-American, and Mediterranean cultures)

MT. Sequential and linear time: planning and scheduling, importance of work, brief relationships (time is money), one task at a time (cultures from North of Europe)

(Edward T. Hall)

I. NUMBERSUsers

Source: Honold 1999

27

Chinese and German cultural concepts of learning

I. NUMBERSUsers

Source: Honold 1999

28

• Language

• Language(s)

I. NUMBERSUsers

Source: International World Stats 2010

29

• Literacy

• Type

• %

I. NUMBERSUsers

Source: UNESCO Institute for Statistics

30

• Technological factors

• Connection type

• Connection speed and reliability

I. NUMBERSUsers

Sources: Henry 2006; ITU World Telecommunication/ICT Indicators Database

31

• Type of equipment

• Age of equipment

I. NUMBERSUsers

Sources: Henry 2006; Zickuh 2001; CIA, The World Factbook

32

• To do what?

• Computers

• Cell phones

• Talk to friends and other people

• Access the Internet

• View information, make choices and decisions

• Make transactions, and check bank statements

• Make appointments, hold meetings...

• Study and do research

• Send and receive email, messages, photos, documents…

• Take photographs

• Play games, listen to music, watch movies …

I. NUMBERSUsers

33

• Where?

• Anywhere in the world, in any context or situation

• Locale

• Context/situation

I. NUMBERSUsers

34

I. NUMBERSUsers

सु�रे�श(Suresh) Panaji, Goa IN

馮慧靈/ 冯慧灵 (Feng Huiling) Shanghai CN

GregAmes US

CésarSão Paulo BR

Abel Beira MZ

Luís Barcelos PT

Ирина(Irina) Moscow RU

نهى(Noha) Alexandria EG

HelgaWiesbaden DE / Lisbon PT / Tokyo JP

Margaret Auckland NZ

Joaquina Quelfes, Algarve PT

Duarte Lisbon PT

Florine Brussels BE

EstebanChihuahua MX

35

I. NUMBERSUsers

• How?

Source: Galitz 2007

“MAXIM People will spend many, many hours staring at your screens.”

Identify Decide Manipulate

CollectEvaluate and make decisionsneeds and

taskshow to do a task or find what we want

the keyboard, mouse, etc. to select an item from a list, press a command, enter data in text boxes...

the data and content we need, and exclude those we do not need

concerning the need or task

36

• Aesthetics and emotions

• Aesthetic decision: 50 milliseconds (1/20 second); rarely changes

• Attractive = easy, confidence, good; favorable to problem solvingNot attractive = rejection

I. NUMBERSUsers

Sources: Norman 2003; Lindgaard 2006; van der Geest e van Dongelen 2009

37

PROFILES

II

38

Imagine the personas in the next 14 profiles were real people, with real needs, activities, and expectations,

living in real cities and villages.

At this precise moment, all these ‘people’ could be

viewing this same page.

39

AbelStudent – 12

Abel lives in the city of Beira, in Mozambique. Abel goes to middle school. He also helps his mother in the fields and takes care of his younger brother and sister. His native language is Cyiao, his second language Portuguese. There are no computers at school, but his family has a cell phone. When it’s his turn to use it, Abel uses the phone to study, check the results of the football games, and take photographs. Whenever someone else asks him to use the phone, he proudly hands it over to them.

I want to be an engineer, so I have to be very good at Math, Portuguese and English – and the apps help me do that.

I wish there were more images on the screen.

II. PROFILESPersonas

Source: Vodaphone 2005

40

FlorineStudent – 15

Florine is in high school, but she does not like to study. She lives with her parents outside Brussels. Florine sings in a band. She loves technologies. She uses her Macs (Pro, Pad, Phone, and Pod) to be constantly in contact with her friends, listen to music, update the band’s website, and promote their songs on YouTube.

My Macs are my freedom. The Internet my extension – except when I went to Madeira. That really … me off!

II. PROFILESPersonas

Source: Norman 2011

41

CésarMechanic – 26

César lives in São Paulo, Brazil. He bought a new computer 6 years ago, which he uses to play games and listen to music. But he prefers his cell phone. You see, he’s more of a people person. He loves to be with his friends, and most of all his girlfriend.

I like a good story. I can’t stand waiting for things to happen on the computer. When something’s taking too long, I switch to another site.

When I find something interesting, I use the keyboard to move around – it’s faster.

II. PROFILESPersonas

Source: Thatcher 1999

42

نهىNohaResearcher – 29

Noha lives in Alexandria, Egypt. She speaks Arabic, and some English, French, and German. She divides her days between her family, and work. She is a religious person. She sympathizes with the democratic party. Noha uses the Internet every day at work. At home, she uses it to buy things for the family and talk to her friends.

The internet is very important for my research. To log data, and search for information. The laboratory where I work subscribes many journals, mostly in English. I read English well, but I need to speak it better. Much better. I want to go to the States to do a postdoc. And I need to write, and publish my own articles in well-known peer-reviewed journals.

II. PROFILESPersonas

43

DuarteBusinessperson – 33

Duarte is from Lisbon, Portugal. He speaks English very well. Duarte likes radical sports. Two years ago, he founded his own nanotechnology company, and he’s already selling his products to Asian countries, the States, and other European countries. He has 3 cell phones, and two laptops, one in the office. The other one is always with him.

The company is growing fast – and this is just the beginning. I’m looking for a good webdesigner, someone that can make the website appealing to all the markets.

II. PROFILESPersonas

44

馮慧靈 | 冯慧灵 | Feng HuilingManager – 38

Feng Huiling lives in Shanghai, China. She is very friendly, though reserved. She lives in small, simple apartment with her husband and daughter. She goes to work by bicycle every day. Feng Huiling is the manager of a restaurant in China. It is a very demanding job, requiring great effort and dedication on her part. There is nothing about the restaurant management business that she does not know. The restaurant has one computer, that everybody uses.

I asked my friend to make a site for the restaurant with a garden on the first page, not a ‘desktop’. It will be full of information. I like gardens. I like images and a lot of color, specially red. It’s my favorite.

II. PROFILESPersonas

Sources: Lo e Gong 2005; International Business Cultures

45

GregWriter – 42

Greg lives in the the States, in the small city of Ames. When he was 28, Greg had an accident that left him paralyzed from the neck down. He is married and has three children. He has a large network of friends, including the doctors, nurses, and other people that take care of him, but he likes to be as independent as possible. He is writing a book about his life, by himself on the computer.

I want to try the new sip-and-puff pen Maria told me about. A Portuguese man invented it, I believe, and he’s the only one selling it. Have to check out his website.

II. PROFILESPersonas

46

LuísClerk – 45

Luís is from Barcelos, in Portugal. He works as a clerk in an import-export company. Luís has photosensitive epilepsy. He finds it difficult to distinguish images on the screen, in spite of wearing glasses (which takes off when taking photographs).

I like my colleagues, and the work I do. But I can’t distinguish the colors and letters well. If only I had a bigger screen … but the situation is so bad, I don’t dare ask the boss for one.

When I retire, I might start my own business. Probably a webdesign company, but for people with disabilities. We badly need one in Portugal. I’ll never forget the day when I wanted to get my son a surfboard, but the letters were so small I could hardly see them, and the navigation was a total disaster. In any other place, I would have taken them to court.

II. PROFILESPersonas

47

Ирина | IrinaLibrary assistant – 48

Irina lives in Moscow, Russia. She is a library assistant at Moscow State University. The university became fully automated recently, but Irina found it easy to adapt because of the various training courses the university provided. A few months ago, she needed a consultant in customer service, and could not find one.

I suddently realized I could be the one to start a consulting firm and give courses in customer service. So I began searching the Internet. I saw what other people were doing in other countries, and I sent them emails and spoke with them. I learned a lot about starting a business.

II. PROFILESPersonas

48

EstebanFarmer – 53

Esteban has a farm, about 300 miles from the city of Chihuahua, in Mexico. Esteban lives with his large family, for whose well-being he feels totally responsible. He plants corn and soy. He does organic farming. He has been so successful that farmers from India and Africa often come to his farm to learn about his methods and results.

The new technologies help me keep up-to-date on my field, and talk to my family when I’m away.

I don’t like pages that are too crowded. They distract me from what I need to do.

II. PROFILESPersonas

49

HelgaInternational Professional Communicator – 56

Helga owns an international professional communication company, with offices in Frankfurt, New York, and Tokyo. She was born in Wiesbaden. Her husband is Portuguese. Helga hates wasting time and words. She believes in the value of clear, concise, objective writing. She plans everything to the last detail.

I don’t have time to waste. And neither do users.

Web interfaces have to be adapted to the different cultures and nationalities, but also to the more universal factors of perception and cognition.

I have rheumatism in my hands. Some days it’s a bit difficult to use a mouse.

II. PROFILESPersonas

Source: Kostelnick 1995

50

सु�रे�श | SureshCraftsman – 65

Suresh lives in Panaji, the capital of Goa, in India. Suresh makes handicrafts that are sold all over the world, gaining him a good income. His native languages are Konkani and Hindi. He also knows how to speak English and Portuguese. Suresh is very agile and energetic. He has a computer at home that he uses to talk to people wanting to buy his work.

The problem are the languages. In India, no one wants to buy my work. In Europe, the States, and other places, they do. I don’t know how to write English. And I can only write a little Portuguese. My grandchildren taught me how to speak to people through the computer, instead of writing. Like this, I don’t even need an intermediary. I sell my work directly to the clients.

II. PROFILESPersonas

51

MargaretRetired – 75

Margaret is from New Zealand. Margaret has some motor difficulties. She recently fractured her hip bone, and is recovering from the surgery. She is married and lives with her husband in a large house and grounds, a few miles away from Auckland. She has a desktop computer, a mobile phone, and an iPad. For some time now, she’s been using the computer for daily tasks, like making doctor appointments, checking her bank statements, and doing shopping.

I’m quite used to doing things online. And I don’t mind paying more for a computer that is the exact match for my needs. The iPad, for instance, has been a great help lately.

II. PROFILESPersonas

Source: Wright et al 2008

52

JoaquinaRetired – 85

Joaquina lives in the small village of Quelfes, in the Algarve, Portugal. Joaquina is retired. She had two years’ schooling when she was young. She has difficulty reading and writing because she spent all her life in the same out-of-the-way village in the hills. Joaquina is a wonderful storyteller. Every day, at the end of the day, she sits on a bench in front of her house, thinking about this and that, and chatting to anyone going by.

Now eveybody’s got a cell phone and a computer. I don’t understand any of that. The other day, I heard the government wants us to do everything on the Internet. I live by myself, and have a small pension. My neighbors too – we’re all on the same boat. I don’t know what I’m going to do… Nothing, I suppose…

II. PROFILESPersonas

53

TECHNIQUES

III

54

• Worst practices

• http://www.cm-lisboa.pt/

• http://www.impetusunderwear.com/

• Best practices

• http://www.clarity2010.com/

• http://www.universaldesign.ie/

III. TECHNIQUESWorst and best practices

55

• Reduce

• visual effort

• intellectual effort

• resourting to memory

• motor activity

Easeof use

• Minimize or eliminate

• tasks and instructions related to the equipments’ internal functioning

Invisibility

of the interface

III. TECHNIQUESObjectives of interface design

Source: Galitz 2007

56

• Every

• Element

• Control

• Alternative text

• Information chunk

• Emphasis

• Color

• Graphic

• Animation

• Message

• User reply

NEEDS to

• help users attain their objective(s)

• make sense for each user

cultural-semantic

III. TECHNIQUESInterface components

Source: Galitz 2007

57

• Figure/ground contrast

• Legible and scalable font

• Clear and correct, short and descriptive titles

• Information in chunks• Clear and simple

language• Clear and consistent

navigation• Good color selection• Good image selection

• Simple, pertinent, and clearly identified graphics and tables

• Pertinent hyperlinks• Style sheets (css)• Alternative text for

images, audio and video

• Alternative pages• Captions for audio

and video

III. TECHNIQUESDesigning information

Source: Charness 2007; Mosner 2003; Wright 2004; Thatcher 2006

58

… adapted to …

59

• Corporation

• Brand• Profitability…• Type of corporation• (Inter)national

operating strategy• Type of market• Type of

product/servicve

• Users

• Language(s)

• Learning style

• Communication style

• Visual literacy

• Technological literacy

• Computer literacy

• Equipment and interfaces

III. TECHNIQUESDesigning information for online users

Source: Hoft 1995

60

III. TECHNIQUESImplications of “meaning” and universality• Create

for differentiated users and equipament

• Adapt for universal reception and the situation of companies and

organizations in the world(translate – localize – design afresh)

• Testwith representative and differentiated users in

representative and differentiated situations and contexts with representative and differentiated equipament and interfaces

= a new approach

61

REFERENCES

62

REFERENCES

Baack, Daniel W., Nitish Singh (2007). Culture and web communications. Journal of Business Research, 60(3): 181-188.

Brault, Matthew W. (2008). Current Population Reports. Americans With Disabilities: 2005. Household Economic Studies. U.S.CensusBureau.

Charness, Neil (2008). Technology as multiplier effect for an aging workforce. In Social structures and aging individuals: Continuing challenges. Eds. D. Warner Schaie, and Ronald P. Abeles. New York: Springer.

Charness, Neil, and Tiffany Jastrzembski (2009). Gerontechnology. In Future interaction design II. Eds. Pertti Saariluoma, Hannakaisa Isomäki. London: Springer-Verlag London.

CIA, The World Factbook. https://www.cia.gov/library/publications/the-world-factbook/

63

REFERENCES

Galitz, Wilbert O. (2007). The essential guide to user interface design. An introduction to GUI design principles and techniques. Indianapolis, IN: Wiley, 3rd.

Gonçalves, Cristina (2001). Enquadramento familiar das pessoas com deficiência: Uma análise exploratória dos resultados dos Census 2001. Revista de Estudos Demográficos, 33: 69-94.

Henry, Shawn Lawton (2006). Understanding web accessibility. In Web Accessibility: Web standards and regulatory compliance. Eds. Jim Thatcher et al. Berkeley, CA: Apress.

Hoft, Nancy (1995). International Technical Communication. New York: Wiley.

64

REFERENCES

Honold, Pia (1999). Learning How to Use a Cellular Phone: Comparison Between German and Chinese Users. Technical Communication, 46(2): 196-205.

Horton, W. (1990). Visual rhetoric for online documents. IEEE Transactions on Professional Communication, 33(3), 108–114.

Kostelnick, C. (1995). Cultural adaptation and information design: two contrasting views. IEEE Transactions on Professional Communication, 38(4), 182-196.

Lawson, Bruce ((2006). Introduction. In Web Accessibility: Web standards and regulatory compliance. Eds. Jim Thatcher et al. Berkeley, CA: Apress.

65

REFERENCES

Lindgaard, et al (2006). Attention web designers: You have 50 milliseconds to make a good first impression. Behaviour & Information technology, 25(2), 115-126.

Lo, Panqun Gong (2005). Cultural impact on the design of e-commerce websites: Part I – site format and layout, Issues in Information Systems, 6(2): 182-188.

Moreira, Maria de Fátima Carvalho (s/d). O Envelhecimento da População e o seu Impacto na Habitação. Prospectiva Até 2050. Tese de mestrado, Universidade Nova de Lisboa, Instituto Superior de Estatística e Gestão de Informação.

Mosner, Ellen (2003). The convergence of the aging workforce and accessible technology. The implications for commerce, business and policy. Microsoft Corporation, and Age Light.

66

REFERENCES

Norman, Don (2011). I Have Seen the Future and I Am Opposed. Core77 design magazine & resource. http://www.core77.com/blog/columns/i_have_seen_the_future_and_i_am_opposed_18532.asp

Norman, Donald (2004). Emotional Design. Why we love (or hate) everyday things. New York: Basic Books.

Sun, Huatong (2001). Building a culturally-competent corporate web site: an exploratory study of cultural markers in multilingual web design. Proceedings SIGDOC '01 Proceedings of the 19th annual international conference on Computer documentation. ACM

67

REFERENCES

United Nations (2001). World Population Ageing: 1950-2050. United Nations Publications. http://www.un.org/esa/population/publications/worldageing19502050/

U.S. Census Bureau (2008). Americans With Disabilities: 2005. Household economic studies. U.S. Department of Commerce. http://www.census.gov/prod/2008pubs/p70-117.pdf

Thatcher, Jim et al. (2006). Web accessibility. Web standards and regulatory compliance. Berkeley, CA: Apress.

Types of Assistive Technology Products. Microsoft. http://www.microsoft.com/enable/at/types.aspx

68

REFERENCES

UNESCO Institute for Statistics (2010). Adult and youth literacy: Global trends in gender parity. UNESCO Institute for Statistics.

van der Geest , Thea, Raymond van Dongelen (2009). What is beautiful is useful – visual appeal and expected information quality. IPCC 2009 International Professional Communication Conference. IEEE Professional Communication Society.

Vodaphone (2005). Africa: The impact of mobile phones. The Vodaphone Policy Paper Series, 2.

Wright, P., Belt, S., Soroka, A. J., Pham, D. T., Dimov, S., DeRoure, D. C., et al. (2008). Cognitive support for older people from multimedia options. In: The 6th International Conference of the International Society for Gerontechnology (ISG 08), June 2008, Pisa, Italy, p. 241.

69

REFERENCES

Wright, P., & Belt, S. (2004). Fancy graphics can deter older users: a comparison of two interfaces for exploring healthy lifestyle options. People and computers, 1-12.

Zickuh, Kathryn (2011). Generations and their gadgets. Pew Research Center’s Internet & American Life Project. http://pewinternet.org/Reports/2011/Generations-and-gadgets.aspx

Images obtained from:• Dreamstime, freedigitalphotos, Imagebase, morguefile,

istockphoto, theFlashBlog, flickr, wikipedia, wikimedia commons

• http://newsthump.com/2010/11/04/bionic-eye-chip-treatment-to-be-denied-to-excessive-masturbators/

• Jorge Cardoso, Mashaba Mashala.

70

Thank you!

www.rosariodurao.net