Department of Computer Science Misr International University Lecture 1 Introduction Class Information 12 Lecturer Dr Mai Elshehaly maya70vtedu Teaching assistant Lab demonstrator TBD ID: 782788
Download The PPT/PDF document "CSC 341 Human-Computer Interaction" is the property of its rightful owner. Permission is granted to download and print the materials on this web site for personal, non-commercial use only, and to display it on your personal computer provided you do not modify the materials and that you retain all copyright notices contained in the materials. By downloading content from our website, you accept the terms of this agreement.
Slide1
CSC 341Human-Computer Interaction
Department of Computer Science
Misr
International University
Lecture
1
Introduction
Slide2Class Information (1/2)
Lecturer: Dr. Mai
Elshehaly
maya70@vt.eduTeaching assistant/ Lab demonstrator: (TBD)Lecture: Time: Monday 8:30 – 10:30 (G1); 13:00 – 15:00 (G2) Office Hours: Monday 11:00 – 12:30Lab hours: check your section’s schedule
© Mai Elshehaly
Slide3Class information (2/2)
Main Reference:
Interaction Design: Beyond Human-Computer Interaction, 3
rd edition. By: Yvonne Rogers, Helen Sharp, and Jenny PreecePublisher: John Wiley & SonsCourse website (will be available 18-Sep-2017): www.vaqua.org/mai/hci
© Mai Elshehaly
Slide4Duties
3 Analytic thinking assignments (as homework)
3 Lab assignments (to be solved in lab)
1 project 3 deliverables © Mai Elshehaly
Slide5Project deliverables
Deliverable 1: Requirements
analysis
20% of project gradeProblem statementStakeholders
Observations & interviews
User goals and tasks
Deliverable 2:
Design
30
% of project grade
Scenario
Sketches of alternative designs
Prototype implementation
Deliverable
3: Evaluation & Final
report
50
% of project grade
Pilot testing
Summary of all project phases (analysis, design, implementation)
Reflection
Slide6Collaboration policy
Collaboration
You
may discuss problems and solutions but DO NOT copy-pasteEach student must write their own code/answersYou MUST write on your homework the names of everyone with whom you collaborateZero tolerance on plagiarismNeither ethical nor in your best interestDon’t cheat. We will find out.
© Mai Elshehaly
Slide7How to do well in this class
Attendance is very important
Ask a LOT of questions
Interact with classmates and instructor(s)Love your project! You’re more likely to succeed if you care about what users want to achieve© Mai Elshehaly
Slide8Today’s class
What is Human-Computer Interaction (HCI)?
What is Interaction Design (ID)?
Components of good designWhat is User Experience (UX)?What is Usability Engineering? Project announcementHW1 announcement
Slide9Today’s class
What is Human-Computer Interaction (HCI)?
What is Interaction Design (ID)?
Components of good designWhat is User Experience (UX)?What is Usability Engineering? Project announcementHW1 announcement
Slide10What is Human-computer interaction (HCI)?
The Human
Single user, groups, I/O channels, memory, reasoning, problem solving, error, psychology
The ComputerDesktop, embedded system, data entry devices, output devices, memory, processingThe InteractionDirect/indirect communication, models, frameworks, styles, ergonomics
Slide11Definition
“Human-computer interaction is a discipline concerned with the design, evaluation and implementation of interactive computing systems for human use, and with the study of major phenomena surrounding them
.”
-ACM SIGCHI
Slide12Dr Ayman Ezzat modified version of Dr, Frank Kriwaczek
12
Slide13example
User wants to find a home to buy
Slide14example
User wants to find a home to buy
Slide15Today’s class
What is Human-Computer Interaction (HCI)?
What is Interaction Design (ID)?
Components of good designWhat is User Experience (UX)?What is Usability Engineering? Project announcementHW1 announcement
Slide16What is Interaction Design?
Slide17What is Interaction Design?
Slide18What is the aim of Design?
Slide19Interaction designers
Their goal is to design
interactive systems
that are enjoyable to use, that do useful things and that enhance the lives of the people who use them.They want their interactive systems to be accessible, usable and engaging.In order to achieve this they believe that the design of such systems should be human-centered. That is, designers need to put people rather than technology at the center of their design process.
Slide20Design
The creative process of specifying something
new
The representations that are produced along the way – e.g site map, blueprints, sketches, etc.It typically involves much iteration –both problem and solution evolve during designOur focus is on
interactive systems
– such
as cameras, phones, web sites,
DVDs, computer
applications… any device or system that
is
interactive
Dr Ayman Ezzat modified version of Dr, Frank Kriwaczek
20
Slide21Interactive systems
Slide22Mac OS – Ubuntu and Win 10
Dr Ayman Ezzat modified version of Dr, Frank Kriwaczek
22
Slide23Modern mp3 players
Dr Ayman Ezzat modified version of Dr, Frank Kriwaczek
23
Slide24Sony AIBO
Dr Ayman Ezzat modified version of Dr, Frank Kriwaczek
24
Slide25Smart Home
Dr Ayman Ezzat modified version of Dr, Frank Kriwaczek
25
Slide26Elements of Interactive Systems
Technologies
- what can technology do?
What content does something have?People - who will use it, who will be affected by it?Activities and contexts - what will people have to do in what circumstances?Dr Ayman Ezzat modified version of Dr, Frank Kriwaczek
26
Slide27Interactive Systems
The term we use to describe the technologies
that interactive
systems designers work with.They are components, devices, products and software systems concerned with processing information.They deal with the transmission, display, storage or transformation
of information that people can
perceive and
that respond to people’s actions
That
includes such things as phones, web sites
and washing
machine
controllers and
increasingly clothes,
jewelry
and buildings!
Dr Ayman Ezzat modified version of Dr, Frank Kriwaczek
27
Slide28Human-centered design
Make the user integral to the design process
Focus on the experience “inside out” of their moving through the software and interacting with its various components.
Slide29People and Technologies
Dr Ayman Ezzat modified version of Dr, Frank Kriwaczek
29
Slide30People Centered View
Dr Ayman Ezzat modified version of Dr, Frank Kriwaczek
30
Slide31User Interface (UI)
All those parts of the system we come into contact with…
Physically we might interact with a device by pressing buttons or moving levers and the interactive device might respond by providing feedback through the pressure of the button or lever.Perceptually the device displays things on a screen, or makes noises which we can see and hear.Conceptually we interact with a device by trying to
work out
what it does and what we should be doing. The
device provides
messages and other displays which are
designed to
help us do this.
Dr Ayman Ezzat modified version of Dr, Frank Kriwaczek
31
Slide32Input / Output
Input
Methods
are needed to enter commands (tell the system what we want it to do)We also need to be able to navigate through the commands and the content of the systemWe need to enter data or other content into the systemOutputSo the system can tell us what is happening – provide feedbackSo the system can display
content
to us.
Dr Ayman Ezzat modified version of Dr, Frank Kriwaczek
32
Slide33Designing interactive system
…. is more than just designing the user interface
…. is
more than designing the input, output and contentIt is about designing the whole human-computer interaction It is about designing the human-human interaction that is often enabled through devicesIt is about designing whole environments of interlinked
devices
and
objects
Think
of designing museum exhibits, or an
amusement park, an
airport, a hotel lobby or a shopping
mall
Common goal:
to improve the
user experience
Dr Ayman Ezzat modified version of Dr, Frank Kriwaczek
33
Slide34Being Human Centered
We take a
human-centered
approach to designing interactive systems. That means…thinking about what people want to do rather than just what the technology can dodesigning new ways to connect people with peopleinvolving people in the design processdesigning for diversityDr Ayman Ezzat modified version of Dr, Frank Kriwaczek
34
Slide35Some History
• 1950s - computers invented
• 1960s - first screen and mouse developed
• 1970s - business start to take up computers seriously.First internet created• 1980s - Arrival of microchip and micro-computers• 1984 - Apple Macintosh (Xerox Star). Gamesconsoles arrive. First conferences on HCI• 1990s - World Wide Web arrives•… and so on to Ubiquitous Computing
Dr Ayman Ezzat modified version of Dr, Frank Kriwaczek
35
Mark Weiser 1999
Slide36Today’s class
What is Human-Computer Interaction (HCI)?
What is Interaction Design (ID)?
Components of good designWhat is User Experience (UX)?What is Usability Engineering? Project announcementHW1 announcement
Slide37Components of Good Design
http://discovery.ucl.ac.uk/7150/1/7150.pdf
Slide38Past PC
Not considering users who used the PC
Systems developed by programmers who used computers for everyday work
Designers played computer games for yearsDr Ayman Ezzat modified version of Dr, Frank Kriwaczek38
Forgetting how difficult and obscure some of their designs can be to people who have not had these experience
Slide39Now PC
Web and mobile dramatically changed the age of HCI
E-commerce
E-GuidingE-LearningE………….Before the immediacy of e-commerce, usability problems were only discovered after purchase.If you bought a nice looking MP3 player and brought it home only to find it was difficult to use, you could not take it back!The shop would say that it delivers its functions, all you had to do was to learn how to operate it properly. (read the manual)
Dr Ayman Ezzat modified version of Dr, Frank Kriwaczek
39
Slide40Bad designs
Dr Ayman Ezzat modified version of Dr, Frank Kriwaczek
40
http://www.baddesigns.com/
Slide41Today’s class
What is Human-Computer Interaction (HCI)?
What is Interaction Design (ID)?
Components of good designWhat is User Experience (UX)?What is Usability Engineering? Project announcementHW1 announcement
Slide42Experience-based Design (EBD)
What?
“A user-focused design process with the goal of making user experience accessible to the designers, to allow them to conceive of designing experiences rather than designing services.”
How?Identify key moments and places:Where people come into contact with the serviceWhere subjective experience is shapedWhere the desired emotional and sensory connection needs to be establishedWork with front-line people who bring alive these touch points in the journey
Slide43Principles of Co-Design
The user
rather than being a passive recipient of a product or service, becomes an active co-designer of the product or service
Slide44Today’s class
What is Human-Computer Interaction (HCI)?
What is Interaction Design (ID)?
Components of good designWhat is User Experience (UX)?What is Usability Engineering? Project announcementHW1 announcement
Slide45The Goal of HCI
Usability
People are trying to accomplish their tasks in life. (system independent)
Introduce
a
system: User
Interface should
maximize
their ability.
task
system
person
Slide46Usability Engineering
Reqs Analysis
Evaluate
Design
Develop
A process for HCI production to ensure usability goals are met
Slide47Usability Engineering
Reqs Analysis
Evaluate
many iterations
Design
Develop
Slide48Usability is hard
People (users) are all different
People are unpredictable
Design skill isn’t enoughEvaluation with users is requiredDesigner’s prideNew ways to think, break out of the boxProgrammers stink at Usability
Slide49Programmers stink at Usability
don’t think like ‘normal’ people
know the software internals, technology first
enjoy systems more than peoplearrogant (my software!)Usability is hard
Slide50Goals of course
Understand HCI theory and practice
Perform informed and
critical evaluation of computer-based technologyFocus on
User-oriented
perspective
, rather than system-oriented, with two thrusts: human (cognitive, social) and technological (input/output, interactions styles, devices).
Design
guidelines,
evaluation
methods, participatory design,
communication
between users and system developers.
Today’s class
What is Human-Computer Interaction (HCI)?
What is Interaction Design (ID)?
Components of good designWhat is User Experience (UX)?What is Usability Engineering? Project announcementHW1 announcement
Slide52Project announcement
Preliminary topics and team formation
Before next lecture:
Send project group names and brainstorming ideas to maya70@vt.edu When you propose an idea, identify: Target users The problem that your interactive system will solveUser goalsOne person who can act as a customerMore details will be made available on the website
Deadline for Phase 1 (requirements analysis): 1
st
of October 2017.
Slide53Today’s class
What is Human-Computer Interaction (HCI)?
What is Interaction Design (ID)?
Components of good designWhat is User Experience (UX)?What is Usability Engineering? Project announcementHW1 announcement
Slide54HW1: hall of fame and shame
Identify one good example and one bad example of User Interface design
Write
no more than 500 words describing why the first design is good and the second is badThe interface can be for any system including: desktop software, web applications, smartphone apps, consumer devices, car dashboards, building entrances, traffic intersections, shower controls, etc. Refer to “Components of good design” (Slide 37) to explain your answer. You may include figures or screenshotsHow to turn in your HW?
Hand one printed page with your name and answer to the class instructor on Monday 18/09/2017.