Академический Документы
Профессиональный Документы
Культура Документы
COM719M1
Module Information
http://www.infm.ulst.ac.uk/~joan
Recommended Reading
See Specific Reading List for various texts and journals UU library My library of books Internet
Module Topics
Weeks 1 to 6
Lectures on specific topics:
Weeks 7 and 8
Individual Project Presentation/Demos
Human Capabilities HCI Accessibility Tasks and Contexts Participatory Systems Design Usability Evaluation
Weeks 9 to 11
Group Presentations
Week 12
Revision for exam
Module Assessments
Assignment 1: Prototype (30%)
Individual project: Design and implement a simple interactive system Individual presentation Prototype and Report Submission during week 6 Presentations run weeks 7 and 8 Examples from previous years:
Belfast Shipping Ltd Quoting System Commissions Management: Hotel Bookings Investment Banking - The Client On-Boarding Process - Financial product setup URLoans Loans system Credit Agreement System
Module Assessments
Assignment 2: Group Critique Report (20%)
Group work: Critical evaluations and comparison of selected individual projects Group presentation Presentations run weeks 9, 10 and 11 Report Submission during week 12
Module Assessments
Exam
3 hour Examination
50%
Theory, experimental psychology, reflection Cognitive theories / psychology Computing / interface design Reflect and develop critical analysis Individual presentation skills Group work Based on practical / theoretical knowledge
Lecture 1 Overview
Human Capabilities; People; Technology
HCI and Cognitive Frameworks Perception Attention / Memory Knowledge / Conceptual Models Learning
Seeing isn t done by the eyes but the brain
What is HCI?
Cognitive Computing and its applications in HCI
What is HCI?
HUMAN
actions
CONTEXT MACHINE
functions
GOALS
Approach: User-Centred
Users should not have to adapt to the interface Interface should be intuitive/natural to learn/use.
Behavioural
Development of the interaction component COGNITION
Constructional
Development of the interface software e.g. PRINCIPLES
Human - Computer
Usability
Learnability Efficiency Memorability Errors Satisfaction
Relationship between users goals - required actions results must be meaningful, not arbitrary Therefore VISIBLE or TRANSPARENT
Visibility
User Goals
User Actions
Results
Feedback
Normans defines affordance as .. A technical term that refers to the properties of objects what sorts of operations and manipulations can be done to a particular object Perceived affordance do
Increased mistakes in data entry / system operation Inaccessible functionality User frustration: low productivity and/or under utilisation System failure because of user rejection
Nearly half of entire software development effort relates to the user interface. (Myers and Rosson, 1992)
Perceiving learning remembering Controlling actions Thinking - Emotion Planning Imagining Creating Understanding language and others Communicating with others Making decisions Solving problems
Brain viewed as three interacting subsystems (each with memory store and processor)
Perceptual system (storage of signals from senses e.g. images, sounds; brief time memory = sensory register) Cognitive system ( think , analyse, recall from LTM; storage in STM/working memory) Motor system (called on when physical response is required transmit signals to muscles) (Card, Moran and Newell, 1983)
Perceptual organisation
Understanding of how we put together the basic features (edges, colours, motion, depth etc.) to see a coherent organised world of things/surfaces.
Perception in Computing
Fundamental for HCI Perceive info presented at/through interface Theories of perception influence interface design Present info in easily understandable/unambiguous manner i.e. user-centred Active process
Visual art/music/gourmet cuisine engage sensory system in ways that we find pleasurable Understanding perception allows us to heighten our sensory experiences.
Visual Perception:
Perceptual world can be different from real world! Human system is capable of perceiving objects
brightest of sunlight/darkest of night rapidly moving objects/rapidly decaying events Bullet being shot / Plant growing / Infrared light
So we can obtain info from displays which vary in quality, size and other characteristics but not with uniform efficiency across whole spectrum and all speeds
Properties of Vision
People draw distinctions between what is seen
Object recognition This could mean is this a fish or a bicycle? It could mean is this George Washington? It could mean is this poisonous or not? It could mean is this slippery or not? It could mean will this support my weight? Great mystery
How to build programs that draw useful distinctions based on image properties.
Vision application:
Pedestrian finding
many pedestrians look like lollipops (hands at sides, torso wider than legs) most of the time classify image regions, searching over scales But what are features? MAKE computer perceive pedestrians as lollipops?
Figure from, A general framework for object detection, by C. Papageorgiou, M. Oren and T. Poggio, Proc. Int. Conf. Computer Vision, 1998, copyright 1998, IEEE
Figure from, A general framework for object detection, by C. Papageorgiou, M. Oren and T. Poggio, Proc. Int. Conf. Computer Vision, 1998, copyright 1998, IEEE
grouping can be seen in terms of allocating some elements to a figure, some to ground (Muller-Lyer etc)
Picture: http://whalen.psych.udel.edu/cognition/perception.html
Did you see Dalmatian dog? How long did it take you? Can you now see picture as anything else? Interpretation due to prior knowledge of Dalmatian
Picture: http://whalen.psych.udel.edu/cognition/perception.html
Visual Field
a - Sharp vision b - Unsharp vision c - Only movement seen
three layers:
Picture: http://guide.discoveronline.org/discover/guide01/1sec1a.htm Picture: http://www.medicinenet.com/black_eye/page4.htm
divided into 2 chambers contains iris, pupil, and lens muscles control motions.
Vision is most acute at macula, located at center of retina When we look directly at an object, its image is centered within macula
Involuntary movements prevent our eyes from standing still This is important for vision, because stable retinal images disappear
Muscles in eye
Frontal eyes: Depth perception. Lateral eyes: See more of world at once
S e n s Sensitivity i t i v i t y
Most sensitive
Sensitive
Least sensitive
Violet Blue Green Yellow Orange Red
Cone response e.g.17:44:39 is blue, 61:39:0 is yellow, 50:45:5 is white 8% males, 0.4% females Red/green blindness is most common
Use other symbolic forms of coding - Shape, size, texture, symbols E.g. Traffic lights use position/brightness as well as colour!
Different colours bent by different amounts when light passes through lens of eye
Difficult for eye to focus on all colours in object at same time Can lead to eye strain red (most bent) and blue (least bent) green and magenta Use pastel or darker shades for large areas
Colour Pairs
avoid extremes
ADD WHITE
Some ways to get this sensation include pressure on eyelids, dreaming, hallucinations, etc. Main way to get it is response of visual system to presence/absence of light at various wavelengths.
Color appearance is strongly affected by (at least): other nearby colors, adaptation to previous views state of mind Several demonstrations follow.
Colours look brighter and larger against black Colours look darker and smaller against white
STROOP EFFECT
(Colour naming is affected by more than just physics)
Read ALOUD and FAST 1) colour names of XXXs 2) colour names of RHS 3) colours of RHS 4) words of centre 5) colours of centre
Adaptation phenomena:
Changing operating point of receptors
Response of color system depends on
Common example:
walk inside from a bright day everything looks dark for a bit then takes its conventional brightness.
How `tightly packed text is on screen Measure of amount of White Space in relation to amount of text High density = lots of text and little white space
Text Density
70% of page covered in text Readable but on computer screen would be difficult
Way text is structured also very important (e.g. search info) E.g. phone directory in tabular form to make easier to search
Longer text passages are easier read using standard capitalization rules rather than using all capital letters READING ALL CAPITAL LETTERS CAN TAKE LONGER AS WORDS LOSE CHARACTERISTIC SHAPE WORDS BECOME RECTANGULAR
Some font styles might look decorative but they are not necessarily legible
Stick to common fonts Rule: don t use >3 fonts and font sizes per document
If yu mst use abbrev mke sre th usrs r famlr wth thm Keep text lines short
Differing Intensity (brightness, lightness) Shape e.g. box frame (recognise/pickout) Colour and/or shading Underlining (not recommended in printed text slow reading) Character size and font Movement e.g. micons Sound and/or synthesized speech
can
(Source: http://www.cs.umd.edu/projects/hcil/chi96/paper/cps1txt.htm)
(Source: http://www.cs.umd.edu/projects/)
Old PCs didn t have power/RAM to use colour; Falling costs Colour on computer screens?
Aesthetically pleasing (prefer to Black/White) Improve human efficiency by adding extra coding dimension Easier to find / distinguish e.g. search for targets - characters, words etc Memory better Provides (useful) redundant coding e.g. Standard background colour for screens
Limited advantage over monochrome display only add colour to enhance interface should function without it Can be misused e.g. Inappropriate colours/ colour pollution
Help user search/distinguish between items Used to segment screen into related info Relates separate fields of info
i.e. same type = same colour Actual and projected figures More or less recent data Caption or data field User or computer provided data Status - correct or error, normal or urgent
Don t use too many colours (<4/5) Use colour coding to support user s task (not hinder) Identify similar instances Exceptional instances e.g. warnings (bright to emphasise) Common coding scheme
Green - normal or OK Orange - caution Red problem/danger/hot in chemical plant, red colour might just mean hot in West black = mourning, in China white = mourning
Colour coding scheme must be relevant and known to user Enables selective attention
Be consistent
User will notice these regardless of whether they have task-related meaning. If no meaning then user wastes time trying to work out meaning
Choose carefully
Irrelevant colour increases search time red on blue vibrate Red yellow on blue pale at edges Yellow red on green or yellow on blue shadows Red
Optimal Colour Combinations chart Which colours can be used effectively against which background colours
Lecture 1: Review
HCI and Cognitive Frameworks Perception Attention / Memory Knowledge / Conceptual Models Learning