SlideShare a Scribd company logo
Fundamenten van mens-machine 
interactie 
! 
Introductie 
Prof. Erik Duval - @ErikDuval 
Dr. Joris Klerkx - @jkofmsk 
! 
Dept. Computerwetenschappen 
K.U.Leuven 
http://hci.cs.kuleuven.be 
1
http://erikduval.wordpress.com/2014/03/31/not-so-great-news/
6 st.p. oftewel +/- 180u 
! 
Vrijdag 14u00-18u00 
! 
groepswerk, reële uitrol 
! 
Geen examen 
3 
Topic: Casual Games
Removing friction between users and machines 
http://www.web42.com/badday/
Not (only) about usability 
Quality attribute of the UI, 
covering whether the system is 
easy to learn, efficient to use, 
pleasant, and so forth 
http://www.nngroup.com/articles/definition-user-experience/ 
Copyright © David Siegel - Dray and Associates. http://www.interaction-design.org/encyclopedia/usability_evaluation.html
Niet zo gemakkelijk… 
http://erikduval.wordpress.com/2008/09/10/laptop-fun/ 
http://www.popsci.com/gadgets/article/2013-07/one-laptop-childs-de-evolution
Niet onbelangrijk… 
http://www.ntk.net/nielsen2004/
Voorbeelden uit jullie leven?
Voorbeelden uit jullie leven?
“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 
CHI
http://www.uxpassion.com/services/usability/usability-evaluations 
Belangrijk…
Introduction - fundamentals of CHI
Introduction - fundamentals of CHI
Design Process 
Don’t design for yourself. 
You’re NOT the user! 
You’re probably clueless! 
Image from http://uxdesign.smashingmagazine.com/2010/10/05/what-is-user-experience-design-overview-tools-and-resources/
Introduction - fundamentals of CHI
"Typ hier een citaat." 
–Johnny Appleseed 
Technology 
Task 
User 
organisational & 
social 
CHI 
http://www.nngroup.com/articles/
NOT (only) about the user interface (UI) 
What if i want a book from a small publisher? 
TASKS
TECHNOLOGY 
http://healthdesignchallenge.com/showcase/method/method.pdf
USERS 
USER-CENTERED DESIGN 
Image from http://connectedsocialmedia.com/10134/inside-it-user-centered-it/
Introduction - fundamentals of CHI
Introduction - fundamentals of CHI
Usability 
The effectiveness, efficiency, and 
satisfaction with which specified 
users achieve specified goals in 
particular environments 
! 
This does not mean you have to create a “dry” design or something that is 
only good for novices – it all depends on your goals
Vuistregels
Hoe weet je dat een UI “goed” is?
The economist – oct. 2004 
To be truly successful, a 
complex technology 
needs to “disappear” 
The real test is always 
the mom test 
http://www.economist.com/displaystory.cfm?story_id=3307363
You are not the user! 
! 
(if you are the developer)
Know your users... 
Study their workflow & Habits
Know your users... 
Users cannot tell you what they need (Steve Jobs) 
Don’t ask for opinions 
Study behaviour not opinions
“logical analysis is not a good way to 
predict people's behavior (nor are focus 
groups or surveys): observation is the key” 
! 
“I caution that the time frame for adoption of 
new technologies is measured in decades, 
not the months everyone would prefer” 
Donald A. Norman
ALWAYS RIGHT 
If the user does something “wrong”, it is 
the fault of the system designer!
Usefulness! Usefulness! Usefulness!
Four Myths 
Only experts create good designs 
Ä experts faster, simple and effective techniques anyone can apply 
We can fix the user interface at the end 
Ä good design is more than just user interface 
Ä having right features, building those features right 
Good design takes too long / costs too much 
Ä simple and effective techniques can reduce total development 
time & cost (finds problems early on) 
Good design is just cool graphics 
Ä graphics part of bigger picture of what to communicate & how
Background...
studiebronnen 
http://www.designinginteractions.com/
• Ben Shneiderman, Designing the User Interface. 
Strategies for Effective Human-Computer 
Interaction. 
• Jakob Nielsen, Designing Web Usability. 
• Jakob Nielsen & Marie Tahir, Homepage Usability. 
• Donald A. Norman, The Invisible Computer & 
Emotional Design. 
• Jef Raskin, The Humane Interface. 
• Peter Morville, Ambient Findability. 
• Jennu Preece, Yvonne Rogers, David Benyon, 
Simon Holland & Tom Carey, Human-Computer 
Interaction. 
• Alan Dix, Janet Finlay, Gregory Abowd & Russell 
Beale, Human-Computer Interaction.
?
EXERCISE 
1. Vorm groepjes van 2 à 3 personen 
2. Evalueer www.nmbs.be & www.delijn.be 
3. Presenteer kort jullie resultaten in klas

More Related Content

PDF
Chi overview
PDF
20130219 chi chi-overzicht
PDF
CHI overzicht
PDF
An introduction to HCI
PDF
6 Rules of User Interface Design
PPTX
Usability & Design Principles
PDF
Human Computer Interaction - Course Presentation
PDF
Inleiding tot chi
Chi overview
20130219 chi chi-overzicht
CHI overzicht
An introduction to HCI
6 Rules of User Interface Design
Usability & Design Principles
Human Computer Interaction - Course Presentation
Inleiding tot chi

What's hot (20)

PDF
Final_USER_EXPERIENCE_Yale_V1
PPTX
UX The Bruce Lee Way
PPTX
UCD from across the pond - A case study in remote UX
PPTX
Usability engineering
PDF
Designer vs Developer - A Battle Royal v1.0
PPTX
How to design more ethically engaging experiences (UCD 2016)
PDF
MCC Technology Class (April 2012)
PDF
Creating a One-handed User Interface for Drones
PDF
HCID 2014: Designing Out The Screen. Steve Taylor, The Alloy.
PPTX
Introduction to user-centric design process
PDF
Designing Out[side] the Screen
PPTX
UX in Real Life
PDF
Psychology of Design (UX Intensive for MySkills4Afrika)
PPTX
Interaction Design Guest Lecture - UVA CS 3240
PDF
Storytelling & The Human Form (UX Intensive for MySkills4Afrika)
PPT
Usability--What is it?
PDF
Designing the Future of Work and Learning
PDF
Challenges and tools of multi-screen UX
PDF
20130221 ucd leuven_leuven
PPTX
11 Insightful Quotes From UX London 2016 (And How They Apply to Digital Agenc...
Final_USER_EXPERIENCE_Yale_V1
UX The Bruce Lee Way
UCD from across the pond - A case study in remote UX
Usability engineering
Designer vs Developer - A Battle Royal v1.0
How to design more ethically engaging experiences (UCD 2016)
MCC Technology Class (April 2012)
Creating a One-handed User Interface for Drones
HCID 2014: Designing Out The Screen. Steve Taylor, The Alloy.
Introduction to user-centric design process
Designing Out[side] the Screen
UX in Real Life
Psychology of Design (UX Intensive for MySkills4Afrika)
Interaction Design Guest Lecture - UVA CS 3240
Storytelling & The Human Form (UX Intensive for MySkills4Afrika)
Usability--What is it?
Designing the Future of Work and Learning
Challenges and tools of multi-screen UX
20130221 ucd leuven_leuven
11 Insightful Quotes From UX London 2016 (And How They Apply to Digital Agenc...
Ad

Viewers also liked (7)

PDF
ASPECT WP2 progress report Budapest
PDF
D3.js capita selecta
PDF
ARIADNE federation
PDF
44rd CEN WS/LT meeting PT social data
PDF
JTELSS - pimp your learning analytics with proper visualisation techniques
KEY
CEN WS-LT ARIADNE liaison report
PDF
Les 9 - Informatie Visualisatie
ASPECT WP2 progress report Budapest
D3.js capita selecta
ARIADNE federation
44rd CEN WS/LT meeting PT social data
JTELSS - pimp your learning analytics with proper visualisation techniques
CEN WS-LT ARIADNE liaison report
Les 9 - Informatie Visualisatie
Ad

Similar to Introduction - fundamentals of CHI (20)

PDF
inleiding tot chi
KEY
Inleiding tot CHI
PDF
Website Usability | Day 1
PDF
NYU Web Intensive - Week 3 Class 1
PDF
Top Three Modern Product Trends
PPTX
Ch 1 Introduction to User Interaction Design Mary Margarat
PDF
Chapter1. Introduction to Human Computer Interaction
PPT
ahsdjHDHVdjhvHDVSJADHSAVDHVNCDSHVJHVSJHCVASDHVJSAHVJSV
PPT
HCI 66.pptsgsdgdgwdgfsdfgsdfgsdfgsdgsdgsdgsdg
PPTX
Design process interaction design basics
PDF
01-Introduction to HCI.pdfxzcnkzdcdncnccn
PDF
Human computer and their interaction presentation
PPT
From a technical writer to a usability engineer
PDF
INTERACT 2019 'The Science Behind User Experience Design' Course
PPTX
Human Computer Interaction: Lecture 2: Interaction Design
PDF
HCI - 2 - Usability & User Experience.pdf
PDF
Introduction To Usability
ODP
User Experience Design Heuristics
PPTX
What is Interaction Design?
inleiding tot chi
Inleiding tot CHI
Website Usability | Day 1
NYU Web Intensive - Week 3 Class 1
Top Three Modern Product Trends
Ch 1 Introduction to User Interaction Design Mary Margarat
Chapter1. Introduction to Human Computer Interaction
ahsdjHDHVdjhvHDVSJADHSAVDHVNCDSHVJHVSJHCVASDHVJSAHVJSV
HCI 66.pptsgsdgdgwdgfsdfgsdfgsdfgsdgsdgsdgsdg
Design process interaction design basics
01-Introduction to HCI.pdfxzcnkzdcdncnccn
Human computer and their interaction presentation
From a technical writer to a usability engineer
INTERACT 2019 'The Science Behind User Experience Design' Course
Human Computer Interaction: Lecture 2: Interaction Design
HCI - 2 - Usability & User Experience.pdf
Introduction To Usability
User Experience Design Heuristics
What is Interaction Design?

More from Joris Klerkx (20)

PDF
Visualisatie - Module 3 - Big Data
PDF
Visualizing Reader Engagement
PDF
Les 8 - informatie visualisatie
PDF
Les 7 - informatie visualisatie - interactie
PDF
Workshop Designing Useful apps
PDF
Les 4 informatie visualisatie
PDF
Les 2 - Informatie Visualisatie
PDF
20160208 informatie visualisatie les 1
PDF
Visualisation - techniques, interaction dynamics, big data
PDF
Visualisation - introduction, guidelines, principles and design
PDF
Bring your own idea - Visual learning analytics
PDF
Quantified Self - LICT workshop - KU Leuven
PDF
Learning Analytics - Door data gestuurd leren
PDF
DM2E - Europeana Cloud
PDF
User experience
PDF
Multimedia les - intro tot informatie visualisatie
PDF
the EMurgency project - LICT workshop on ICT in health
PDF
intro to information visualization
PDF
Workshop on visualization in tel
PDF
EMuRgency project - LICT Industrial affiliation day
Visualisatie - Module 3 - Big Data
Visualizing Reader Engagement
Les 8 - informatie visualisatie
Les 7 - informatie visualisatie - interactie
Workshop Designing Useful apps
Les 4 informatie visualisatie
Les 2 - Informatie Visualisatie
20160208 informatie visualisatie les 1
Visualisation - techniques, interaction dynamics, big data
Visualisation - introduction, guidelines, principles and design
Bring your own idea - Visual learning analytics
Quantified Self - LICT workshop - KU Leuven
Learning Analytics - Door data gestuurd leren
DM2E - Europeana Cloud
User experience
Multimedia les - intro tot informatie visualisatie
the EMurgency project - LICT workshop on ICT in health
intro to information visualization
Workshop on visualization in tel
EMuRgency project - LICT Industrial affiliation day

Recently uploaded (20)

PDF
Empowerment Technology for Senior High School Guide
PPTX
B.Sc. DS Unit 2 Software Engineering.pptx
PDF
احياء السادس العلمي - الفصل الثالث (التكاثر) منهج متميزين/كلية بغداد/موهوبين
PPTX
Share_Module_2_Power_conflict_and_negotiation.pptx
DOC
Soft-furnishing-By-Architect-A.F.M.Mohiuddin-Akhand.doc
PPTX
History, Philosophy and sociology of education (1).pptx
PPTX
TNA_Presentation-1-Final(SAVE)) (1).pptx
PPTX
Introduction to pro and eukaryotes and differences.pptx
PDF
IGGE1 Understanding the Self1234567891011
PPTX
202450812 BayCHI UCSC-SV 20250812 v17.pptx
PDF
ChatGPT for Dummies - Pam Baker Ccesa007.pdf
PDF
Complications of Minimal Access-Surgery.pdf
PDF
Τίμαιος είναι φιλοσοφικός διάλογος του Πλάτωνα
PDF
Paper A Mock Exam 9_ Attempt review.pdf.
PDF
Vision Prelims GS PYQ Analysis 2011-2022 www.upscpdf.com.pdf
PDF
MBA _Common_ 2nd year Syllabus _2021-22_.pdf
PDF
Weekly quiz Compilation Jan -July 25.pdf
PPTX
Onco Emergencies - Spinal cord compression Superior vena cava syndrome Febr...
PPTX
CHAPTER IV. MAN AND BIOSPHERE AND ITS TOTALITY.pptx
PDF
FORM 1 BIOLOGY MIND MAPS and their schemes
Empowerment Technology for Senior High School Guide
B.Sc. DS Unit 2 Software Engineering.pptx
احياء السادس العلمي - الفصل الثالث (التكاثر) منهج متميزين/كلية بغداد/موهوبين
Share_Module_2_Power_conflict_and_negotiation.pptx
Soft-furnishing-By-Architect-A.F.M.Mohiuddin-Akhand.doc
History, Philosophy and sociology of education (1).pptx
TNA_Presentation-1-Final(SAVE)) (1).pptx
Introduction to pro and eukaryotes and differences.pptx
IGGE1 Understanding the Self1234567891011
202450812 BayCHI UCSC-SV 20250812 v17.pptx
ChatGPT for Dummies - Pam Baker Ccesa007.pdf
Complications of Minimal Access-Surgery.pdf
Τίμαιος είναι φιλοσοφικός διάλογος του Πλάτωνα
Paper A Mock Exam 9_ Attempt review.pdf.
Vision Prelims GS PYQ Analysis 2011-2022 www.upscpdf.com.pdf
MBA _Common_ 2nd year Syllabus _2021-22_.pdf
Weekly quiz Compilation Jan -July 25.pdf
Onco Emergencies - Spinal cord compression Superior vena cava syndrome Febr...
CHAPTER IV. MAN AND BIOSPHERE AND ITS TOTALITY.pptx
FORM 1 BIOLOGY MIND MAPS and their schemes

Introduction - fundamentals of CHI