22
www.monash.edu.au IMS5401 Web-based Systems Development Topic 3: Development for the web 3(d) User Interaction

Www.monash.edu.au IMS5401 Web-based Systems Development Topic 3: Development for the web 3(d) User Interaction

Embed Size (px)

Citation preview

Page 1: Www.monash.edu.au IMS5401 Web-based Systems Development Topic 3: Development for the web 3(d) User Interaction

www.monash.edu.au

IMS5401Web-based Systems Development

Topic 3: Development for the web

3(d) User Interaction

Page 2: Www.monash.edu.au IMS5401 Web-based Systems Development Topic 3: Development for the web 3(d) User Interaction

www.monash.edu.au

2

Agenda

1. From interface design to interaction design

2. Guidelines and processes for interaction design

3. Specialised usability and interaction issues

4. Conflict and compromise in interaction design

Page 3: Www.monash.edu.au IMS5401 Web-based Systems Development Topic 3: Development for the web 3(d) User Interaction

www.monash.edu.au

3

1. From interface design to interaction design

• History• Human factors and ergonomics• Screen design• Interface design• HCI

• Aims of HCI• Safety• Utility• Effectiveness• Efficiency• Usability• Appeal

Page 4: Www.monash.edu.au IMS5401 Web-based Systems Development Topic 3: Development for the web 3(d) User Interaction

www.monash.edu.au

4

Fundamental issues in interaction design

• Human senses and perception• What do we see/(hear)?• How do we connect/relate things we see and hear?

• Human cognition and memory• How do we interpret what we see/hear?• What do we retain and recall of what we see/hear?• Patterns/metaphors/mental models

• Focus on functional elements (form vs function)• User-centred design: What does my user

see/hear? (not what do I see/hear)

Page 5: Www.monash.edu.au IMS5401 Web-based Systems Development Topic 3: Development for the web 3(d) User Interaction

www.monash.edu.au

5

‘New’ issues for web-based interaction design

• Users and the nature of their use• User motivation (do you want to change it)?• Range of user types and experiences?• Frequency/purpose of site usage?

• The web as a medium• Data-oriented vs page-oriented design• Forms of representation – numeric/text to multimedia• Design technology – browsers, HTML, scripts, etc

• The development environment• User-developer relationship?

Page 6: Www.monash.edu.au IMS5401 Web-based Systems Development Topic 3: Development for the web 3(d) User Interaction

www.monash.edu.au

6

Scope of interaction design

• User interaction with site may be affected by all design elements• Content (quantity, type, form, etc)• Layout and organisation of content (site structure,

page structure, etc)• Appearance and graphic design (fonts, colours, styles,

etc)• Architecture and navigation

• Contribution of design elements to user interaction is specific to site type, site purpose, and site user

Page 7: Www.monash.edu.au IMS5401 Web-based Systems Development Topic 3: Development for the web 3(d) User Interaction

www.monash.edu.au

7

2. Guidelines and processes for interaction design

• Interaction design has many aspects, many of which are highly specialised

• Importance of interaction design and its different aspects varies enormously from function to function (eg games design as an extreme: function= interaction design)

• Extensive (and expanding) literature on each of these aspects

• Some “gurus” in particular aspects of interaction design

Page 8: Www.monash.edu.au IMS5401 Web-based Systems Development Topic 3: Development for the web 3(d) User Interaction

www.monash.edu.au

8

Some gurus of aspects of interaction design

• Visual representation of information - Edward Tufte

• Design principles - Donald Norman• Computer interface design - Ben Shneiderman• Web site graphic design style - David Siegel,

Lynda Weinman• Web site usability - Jakob Nielsen• Web site architecture and navigation - Louis

Rosenfeld & Peter Morville• Which guru should you follow? Depends on

your purpose and the particular aspect of interaction design which matters

Page 9: Www.monash.edu.au IMS5401 Web-based Systems Development Topic 3: Development for the web 3(d) User Interaction

www.monash.edu.au

9

Key basic elements of interaction design process

• Understanding the users and what they want • Developing alternative designs• Prototyping designs• Evaluating designs• Iterative development

Page 10: Www.monash.edu.au IMS5401 Web-based Systems Development Topic 3: Development for the web 3(d) User Interaction

www.monash.edu.au

10

Interaction design methods

• Still not much around• Ideas/approaches tend to be biased towards the

site purpose (and the relevant guru) • See references for examples• You may find others you like (better?)

Page 11: Www.monash.edu.au IMS5401 Web-based Systems Development Topic 3: Development for the web 3(d) User Interaction

www.monash.edu.au

11

3. Specialised usability and interaction issues

• Does your site have to work with special types of audiences with particular characteristics?

• Some common specialised audiences:• People with physical problems with interaction• Internationalised or globalised audience• Inexperienced audiences• Personalised audiences

Page 12: Www.monash.edu.au IMS5401 Web-based Systems Development Topic 3: Development for the web 3(d) User Interaction

www.monash.edu.au

12

Designing for physical limitations or disabilities

• Common types of disability:• Blindness, limited vision, colour blindness• Limited mobility• Deafness

• Design considerations• User comprehension of content• Facilities for user input and control

• Guidelines• W3C

Page 13: Www.monash.edu.au IMS5401 Web-based Systems Development Topic 3: Development for the web 3(d) User Interaction

www.monash.edu.au

13

Designing for global audiences

• Issues with content• Making the site content fit with local needs and

customs (dates, times, places, currency, people, relevance, etc)

• Issues with language and layout• Language and meaning• Fluency, expressions and idiom• Translations and multi-lingual sites

• Issues with colours, icons, images• Meaning and symbolism

• Internationalisation versus localisation

Page 14: Www.monash.edu.au IMS5401 Web-based Systems Development Topic 3: Development for the web 3(d) User Interaction

www.monash.edu.au

14

Designing for inexperienced audiences

• Who are they likely to be and what will they want?

• Site content - how familiar?• Web conventions and standards - how self-

explanatory?• Guidance and direction• Help and explanations

Page 15: Www.monash.edu.au IMS5401 Web-based Systems Development Topic 3: Development for the web 3(d) User Interaction

www.monash.edu.au

15

Designing for personalised audiences

• Personalising the interface and the content - how important?

• Finding out about the user - direct methods• Finding out about the user - indirect methods

(cookies, etc)• Establishing trust - user identification and

privacy issues• Conversational interfaces(?)

Page 16: Www.monash.edu.au IMS5401 Web-based Systems Development Topic 3: Development for the web 3(d) User Interaction

www.monash.edu.au

16

4. Conflict and compromise in interaction design

• Conflicting needs for web site interaction design arise from the blend of:• The amount of information a site contains• The range of users a site attracts• The variety of information purposes a site supports

• Any interaction design solution (content, style, architecture) must normally be a compromise between these conflicting needs

• (Note difference to traditional interface design)

Page 17: Www.monash.edu.au IMS5401 Web-based Systems Development Topic 3: Development for the web 3(d) User Interaction

www.monash.edu.au

17

Design compromises and user needs

• How does a designer decide where the compromises need to be made?• Which information comes first?• Which user group comes first?• Which information use comes first?

• Good design involves identifying and articulating the conflicts and establishing a basis for deciding on the trade-offs

Page 18: Www.monash.edu.au IMS5401 Web-based Systems Development Topic 3: Development for the web 3(d) User Interaction

www.monash.edu.au

18

User profiles as a basis for determining design trade-offs

• User profiling is a technique used to help articulate design needs and priorities

• Concept originally comes from graphic design• Aims to identify and describe the main ‘typical’

users, information needs and usage patterns which the site aims to support

• Use these as the basis for identifying conflicting design needs and deciding what compromises have to be made

Page 19: Www.monash.edu.au IMS5401 Web-based Systems Development Topic 3: Development for the web 3(d) User Interaction

www.monash.edu.au

19

Building user profiles

• Develop outlines of key characteristics of the main user groups for the site

• Typically expressed as descriptions of imaginary individuals representing key user groups

• Characteristics may relate to things such as:• personal attributes (age, gender, income, job, etc)• preferences (tastes, attitudes, etc),• life experiences (maturity, interests, etc),• specific information needs and interests• usage patterns for information needs

• Use market research techniques (focus groups, etc) to develop and test

Page 20: Www.monash.edu.au IMS5401 Web-based Systems Development Topic 3: Development for the web 3(d) User Interaction

www.monash.edu.au

20

Examples of user profiles: Monash or SIMS web sites

• Who are the ‘typical’ users?• Categories of students, etc

• What are their ‘typical’ information needs?• Types of information needed, etc

• What are their ‘typical’ usage patterns?• Time/frequency of usage, etc

• How do they ‘typically’ like that information to be presented?• Style, structure, architecture, etc

• See tute exercise

Page 21: Www.monash.edu.au IMS5401 Web-based Systems Development Topic 3: Development for the web 3(d) User Interaction

www.monash.edu.au

21

Using user profiles

• Profiles are used by designers to:• Identify the site design features which are likely to appeal to

each user;• In cases of conflict, decide which user/usage pattern is most

important

• Develop storyboards for each user – tracking how they will travel through the site

• Identify points of commonality and difference• Determine design compromises as required• Test against typical ‘real’ users

Page 22: Www.monash.edu.au IMS5401 Web-based Systems Development Topic 3: Development for the web 3(d) User Interaction

www.monash.edu.au

22

Creativity and compromise

• ‘Standardisation’ (‘commodification’) of web site design is a controversial topic in interaction design

• Creative designers (form-oriented) hate compromise which destroys design elegance

• Functional designers hate disfunctional design which spoils user interaction

• Will standards kill web design? (or will non-standard designs kill web applications?)

• Return to Sydney Opera House/Federation Square/etc