Cs365 hci
1 / 33

CS365 - HCI - PowerPoint PPT Presentation

  • Uploaded on

CS365 - HCI. Prof. Ahmed Sameh. Week 2. Reflections. How long should it take to learn a new web development tool i.e. Dreamweaver or Microsoft’s’ new Expression Studio? 20-30 mins to become productive - What is meant by “usability?” Effective to use Efficient to use Safe to use

I am the owner, or an agent authorized to act on behalf of the owner, of the copyrighted work described.
Download Presentation

PowerPoint Slideshow about 'CS365 - HCI' - alisa-battle

An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.

- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript
Cs365 hci

CS365 - HCI

Prof. Ahmed Sameh

Week 2


  • How long should it take to learn a new web development tool i.e. Dreamweaver or Microsoft’s’ new Expression Studio?

  • 20-30 mins to become productive -

  • What is meant by “usability?”

    • Effective to use

    • Efficient to use

    • Safe to use

    • Having good utility

    • Easy to learn

    • Easy to remember

  • Can you decide what people “experience” when they are satisfied with the interface?

Problem solving
Problem solving

  • Process of finding solution to unfamiliar task using knowledge.

  • Several theories.

  • Gestalt

    • problem solving both productive and reproductive

    • productive draws on insight and restructuring of problem

    • attractive but not enough evidence to explain `insight' etc.

    • move away from behaviourism and led towards information processing theories

Problem solving cont
Problem solving (cont.)

Problem space theory

  • problem space comprises problem states

  • problem solving involves generating states using legal operators

  • heuristics may be employed to select operators e.g. means-ends analysis

  • operates within human information processing system e.g. STM limits etc.

  • largely applied to problem solving in well-defined areas e.g. puzzles rather than knowledge intensive areas

Problem solving cont1
Problem solving (cont.)

  • Analogy

    • analogical mapping:

      • novel problems in new domain?

      • use knowledge of similar problem from similar domain

    • analogical mapping difficult if domains are semantically different

  • Skill acquisition

    • skilled activity characterized by chunking

      • lot of information is chunked to optimize STM

    • conceptual rather than superficial grouping of problems

    • information is structured more effectively

Errors and mental models
Errors and mental models

Types of error

  • slips

    • right intention, but failed to do it right

    • causes: poor physical skill, inattention etc.

    • change to aspect of skilled behaviour can cause slip

  • mistakes

    • wrong intention

    • cause: incorrect understanding

      humans create mental models to explain behaviour.

      if wrong (different from actual system) errors can occur


  • Various theories of how emotion works

    • James-Lange: emotion is our interpretation of a physiological response to a stimuli

    • Cannon: emotion is a psychological response to a stimuli

    • Schacter-Singer: emotion is the result of our evaluation of our physiological responses, in the light of the whole situation we are in

  • Emotion clearly involves both cognitive and physical responses to stimuli

Emotion cont
Emotion (cont.)

  • The biological response to physical stimuli is called affect

  • Affect influences how we respond to situations

    • positive  creative problem solving

    • negative  narrow thinking

      “Negative affect can make it harder to do even easy tasks; positive affect can make it easier to do difficult tasks”

      (Donald Norman)

Emotion cont1
Emotion (cont.)

  • Implications for interface design

    • stress will increase the difficulty of problem solving

    • relaxed users will be more forgiving of shortcomings in design

    • aesthetically pleasing and rewarding interfaces will increase positive affect

Individual differences
Individual differences

  • long term – sex, physical and intellectual abilities

  • short term – effect of stress or fatigue

  • changing – age

    Ask yourself:will design decision exclude section of user population?

Psychology and the design of interactive system
Psychology and the Design of Interactive System

  • Some direct applications

    • e.g. blue acuity is poor blue should not be used for important detail

  • However, correct application generally requires understanding of context in psychology, and an understanding of particular experimental conditions

  • A lot of knowledge has been distilled in

    • guidelines

    • cognitive models

    • experimental and analytic evaluation techniques

User experience goals
User experience goals

• satisfying • aesthetically pleasing

• enjoyable • supportive of creativity

• engaging • supportive of creativity

• pleasurable • rewarding

• exciting • fun

• entertaining • provocative

• helpful • surprising

• motivating • enhancing sociability

• emotionally fulfilling • challenging

• boring • annoying

• frustrating • cutsey

Usability and user experience goals
Usability and user experience goals

  • Selecting terms to convey a person’s feelings, emotions, etc., can help designers understand the multifaceted nature of the user experience

  • How do usability goals differ from user experience goals?

  • Are there trade-offs between the two kinds of goals?

    • e.g. can a product be both fun and safe?

  • How easy is it to measure usability versus user experience goals?

Design principles
Design principles

  • Generalizable abstractions for thinking about different aspects of design

  • The do’s and don’ts of interaction design

  • What to provide and what not to provide at the interface

  • Derived from a mix of theory-based knowledge, experience and common-sense


• This is a control panel for an elevator

• How does it work?

• Push a button for the floor you want?

• Nothing happens. Push any other button? Still nothing. What do you need to do?

It is not visible as to what to do!

From: www.baddesigns.com


…you need to insert your room card in the slot by the buttons to get the elevator to work!

How would you make this action more visible?

• make the card reader more obvious

• provide an auditory message, that says what to do (which language?)

• provide a big label next to the card reader that flashes when someone enters

• make relevant parts visible

• make what has to be done obvious

What do i do if i am wearing black
What do I do if I am wearing black?

  • Invisible automaticcontrols can make it more difficult to use


  • Sending information back to the user about what has been done

  • Includes sound, highlighting, animation and combinations of these

    • e.g. when screen button clicked on provides sound or red highlight feedback:



  • Restricting the possible actions that can be performed

  • Helps prevent user from selecting incorrect options

  • Physical objects can be designed to constrain things

    • e.g. only one way you can insert a key into a lock

Logical or ambiguous design
Logical or ambiguous design?

  • Where do you plug the mouse?

  • Where do you plug the keyboard?

  • top or bottom connector?

  • Do the color coded icons help?

From: www.baddesigns.com

How to design them more logically
How to design them more logically

(i) A provides direct adjacent mapping between icon and connector

(ii) B provides color coding to associate the connectors with the labels

From: www.baddesigns.com


  • Design interfaces to have similar operations and use similar elements for similar tasks

  • For example:

    • always use ctrl key plus first initial of the command for an operation – ctrl+C, ctrl+S, ctrl+O

  • Main benefit is consistent interfaces are easier to learn and use

When consistency breaks down
When consistency breaks down

  • What happens if there is more than one command starting with the same letter?

    • e.g. save, spelling, select, style

  • Have to find other initials or combinations of keys, thereby breaking the consistency rule

    • e.g. ctrl+S, ctrl+Sp, ctrl+shift+L

  • Increases learning burden on user, making them more prone to errors

Internal and external consistency
Internal and external consistency

  • Internal consistency refers to designing operations to behave the same within an application

    • Difficult to achieve with complex interfaces

  • External consistency refers to designing operations, interfaces, etc., to be the same across applications and devices

    • Very rarely the case, based on different designer’s preference

Keypad numbers layout
Keypad numbers layout

  • A case of external inconsistency

(a) phones, remote controls

(b) calculators, computer keypads





















Affordances to give a clue
Affordances: to give a clue

  • Refers to an attribute of an object that allows people to know how to use it

    • e.g. a mouse button invites pushing, a door handle affords pulling

  • Norman (1988) used the term to discuss the design of everyday objects

  • Since has been much popularised in interaction design to discuss how to design interface objects

    • e.g. scrollbars to afford moving up and down, icons to afford clicking on

What does affordance have to offer interaction design
What does ‘affordance’ have to offer interaction design?

  • Interfaces are virtual and do not have affordances like physical objects

  • Norman argues it does not make sense to talk about interfaces in terms of ‘real’ affordances

  • Instead interfaces are better conceptualized as ‘perceived’ affordances

    • Learned conventions of arbitrary mappings between action and effect at the interface

    • Some mappings are better than others


  • Physical affordances:

    How do the following physical objects afford? Are they obvious?


  • Virtual affordances

    How do the following screen objects afford?

    What if you were a novice user?

    Would you know what to do with them?

Usability principles
Usability principles

  • Similar to design principles, except more prescriptive

  • Used mainly as the basis for evaluating systems

  • Provide a framework for heuristic evaluation

Usability principles nielsen 2001
Usability principles (Nielsen 2001)

  • Visibility of system status

  • Match between system and the real world

  • User control and freedom

  • Consistency and standards

  • Help users recognize, diagnose and recover from errors

  • Error prevention

  • Recognition rather than recall

  • Flexibility and efficiency of use

  • Aesthetic and minimalist design

  • Help and documentation

Key points
Key points

  • Interaction design is concerned with designing interactive products to support the way people communicate and interact in their everyday and working lives

  • It is concerned with how to create quality user experiences

  • It requires taking into account a number of interdependent factors, including context of use, type of activities, cultural differences, and user groups

  • It is multidisciplinary, involving many inputs from wide-reaching disciplines and fields