[ht] human computer interaction 2
TRANSCRIPT
![Page 1: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/1.jpg)
IDM BLOK Eopen data
HT 1 periode 4vak HCI
HUMAN COMPUTERINTERACTIONKlaas Jan Mollema MSc
IDMDENHAAGInformatieDienstverlening &informatieManagement
HTDENHAAGHuman Technology
2
![Page 2: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/2.jpg)
meet the elements -‐ the five planesstappenplan voor een compleet ID/UXd product
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
SURFACE PLANEwhat you see
SKELETON PLANEplacement of buttons etc.
STRUCTURE PLANEthe infrastructure
SCOPE PLANEfunctionality
STRATEGY PLANEwho whants what?
![Page 3: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/3.jpg)
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
meet the elements -‐ the five planesstappenplan voor een compleet ID/UXd product
![Page 4: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/4.jpg)
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
meet the elements -‐ the five planesstappenplan voor een compleet ID/UXd product
![Page 5: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/5.jpg)
College 1 : INTRODUCTIE HCI & OUTLINE JESSY JAMES GARRETT
College 2 : STRATEGY PLANE & SCOPE PLANE
College 3 : STRUCTURE PLANE & SKELETON PLANE
College 4 : SKELETON PLANE (patterns) & SURFACE PLANE
College 5 : USABILITY TESTEN
IDM BLOK Eopen data
HT 1 periode 4vak HCI
IDMDENHAAGInformatieDienstverlening &informatieManagement
HTDENHAAGHuman Technology
![Page 6: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/6.jpg)
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
STRATEGY PLANEwho whants what?
meet the elements -‐ the five planesstappenplan voor een compleet ID/UXd product
- Site Objectives- User needs
Oftewel:- Wat willen de makers met de site bereiken?- Wat willen de gebruikers met de site bereiken?
En: formuleer je eisen zo duidelijk mogelijk: SMART
![Page 7: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/7.jpg)
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
SCOPE PLANEfunctionality
meet the elements -‐ the five planesstappenplan voor een compleet ID/UXd product
“Defining the scope: a valuable process that results in a valuable product”
Oftewel:Bepaal de omvang en grootte van je project en dat hangt weer af van de tijd en middelen die je hebt
![Page 8: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/8.jpg)
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
meet the elements -‐ the five planesstappenplan voor een compleet ID/UXd product
![Page 9: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/9.jpg)
IDM BLOK Eopen data
HT 1 periode 4vak HCI
STRATEGY PANEthe user needs
IDMDENHAAGInformatieDienstverlening &informatieManagement
HTDENHAAGHuman Technology
STRATEGY PLANEwho whants what?
![Page 10: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/10.jpg)
strategy panethe user needs
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
input:- de gebruikers zelf- aansluiten bij wat ze nu al doen
![Page 11: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/11.jpg)
strategy panethe user needs
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
output:- user needs vormen samen met site objectives een visie of strategie document
>> geen opsomming van doelen, maar een ‘verhaal’
![Page 12: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/12.jpg)
strategy panethe user needs
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
moeilijkheden:- gebruikersgroepen zijn vaak erg divers- segmenteren om te focussen (doelgroepanalyse)
![Page 13: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/13.jpg)
stakeholdersbelanghebbenden
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
primary usersDe doelgroep voor je applicatie. Diegenen die er daadwerkelijk mee aan de slag gaan.
secundary usersandere betrokkenen. Diegenen die door het systeem beïnvloed worden of die het systeem beïnvloeden.
![Page 14: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/14.jpg)
doelgroepwat is dat?
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
een groep mensen met ongeveer dezelfde eigenschappen (gebruikerskenmerken)
![Page 15: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/15.jpg)
doelgroependrie aspecten
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
- wie zijn er aan het werk en wat zijn dat voor mensen --> gebruikers- Wat doen ze en hoe doen ze dat --> taak (afhankelijk van het doel van de gebruiker)- Onder welke omstandigheden werken ze --> taakcontext
![Page 16: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/16.jpg)
doelgroependrie aspecten
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
- wie zijn er aan het werk en wat zijn dat voor mensen --> gebruikers- Wat doen ze en hoe doen ze dat --> taak (afhankelijk van het doel van de gebruiker)- Onder welke omstandigheden werken ze --> taakcontext
![Page 17: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/17.jpg)
doelgroependrie aspecten
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
- wie zijn er aan het werk en wat zijn dat voor mensen --> gebruikers- Wat doen ze en hoe doen ze dat --> taak (afhankelijk van het doel van de gebruiker)- Onder welke omstandigheden werken ze --> taakcontext
![Page 18: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/18.jpg)
doelgroependrie aspecten
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
- wie zijn er aan het werk en wat zijn dat voor mensen --> gebruikers- Wat doen ze en hoe doen ze dat --> taak (afhankelijk van het doel van de gebruiker)- Onder welke omstandigheden werken ze --> taakcontext
![Page 19: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/19.jpg)
gebruikerscharacteristics vs needs
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
CharacteristicsUser needs
![Page 20: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/20.jpg)
gebruikerscharacteristics vs needs
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
CharacteristicsUser needs
![Page 21: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/21.jpg)
gebruikers segmenterenhoe segmenteer je de doelgroep
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
doelbegrijpen hoe gebruiker daadwerkelijk een applicatie zullen gaan gebruiken
segmenteer op basis van- doelen- gedragspatronen- houding
![Page 22: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/22.jpg)
gebruikers segmenterenhoe segmenteer je de doelgroep
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
per segment beschrijf je- demografische kenmerken (leeftijd, sexe, inkomen, etc)- computerervaring- motivatie- attitude- lichamelijke beperking
![Page 23: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/23.jpg)
gebruikers segmenterenhoe segmenteer je de doelgroep
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
per segment beschrijf je- demografische kenmerken- computerervaring- motivatie- attitude- lichamelijke beperking
![Page 24: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/24.jpg)
gebruikers segmenterenhoe segmenteer je de doelgroep
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
per segment beschrijf je- demografische kenmerken (leeftijd, sexe, inkomen, etc)- computerervaring- motivatie- attitude- lichamelijke beperking
![Page 25: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/25.jpg)
persona’s en scenario’shoe segmenteer je de doelgroep
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
een persona is een concrete omschrijving van een gebruiker en wat die precies wil bereiken:- fictief maar precies (naam, leeftijd, etc.)- specifiek maar steriotype (geldend voor een bepaalde (doel)groep)
![Page 26: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/26.jpg)
persona’s en scenario’shoe segmenteer je de doelgroep
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
beschrijf een persona in termen van:- doelen met de applicatie- doelen in het leven algemeen (voor zover relevant)- vaardigheden- achtergronden- interessegebieden
![Page 27: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/27.jpg)
![Page 28: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/28.jpg)
![Page 29: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/29.jpg)
persona’s en scenario’shoe segmenteer je de doelgroep
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
stappenplan persona- verzamel informatie statistische gegevens, literatuur, interviews, observeren --> tabel
- analyseer informatie conclusie trekken uit data
- segmenteer doelgroep segmenteren op doelen, gedragspatronen en/of houding
- benoem persona’s kiezen van primaire persona’s en maken grove beschrijvingen
- beschrijf persona’s persona’s volledig uitwerken
![Page 30: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/30.jpg)
opdrachthoe beschrijf je Koos Werkeloos (43 jaar) ikv de website van het UWV?
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
stappenplan persona- verzamel informatie statistische gegevens, literatuur, interviews, observeren --> tabel
- analyseer informatie conclusie trekken uit data
- segmenteer doelgroep segmenteren op doelen, gedragspatronen en/of houding
- benoem persona’s kiezen van primaire persona’s en maken grove beschrijvingen
- beschrijf persona’s persona’s volledig uitwerken
![Page 31: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/31.jpg)
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
THE USER IS ALWAYS RIGHT
persona’s en scenario’shoe segmenteer je de doelgroep
![Page 32: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/32.jpg)
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
PERSONA’S SCHERPEN AAN
persona’s en scenario’shoe segmenteer je de doelgroep
![Page 33: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/33.jpg)
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
PERSONA’S ZORGEN VOOR CONSENSUS
persona’s en scenario’shoe segmenteer je de doelgroep
![Page 34: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/34.jpg)
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
PERSONA’S ROEPEN SYMPATHIE OP
persona’s en scenario’shoe segmenteer je de doelgroep
![Page 35: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/35.jpg)
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
PERSONA’S CREËREN EFFICIËNTIE
persona’s en scenario’shoe segmenteer je de doelgroep
![Page 36: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/36.jpg)
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
persona’s en scenario’shoe segmenteer je de doelgroep
tip: gebruik life-size cut-outs
![Page 37: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/37.jpg)
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
the strategy planesite objectives
specifieker dan business goals
brand identityvisuele en interactie elementen zijn belangrijke pijlers in het communiceren van de merkidentiteit
success metricsindicatoren die aangeven of de website die ontwikkeld is ook de gestelde doelen behaalt
![Page 38: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/38.jpg)
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
the strategy planesite objectives
specifieker dan business goals
brand identityvisuele en interactie elementen zijn belangrijke pijlers in het communiceren van de merkidentiteit
success metricsindicatoren die aangeven of de website die ontwikkeld is ook de gestelde doelen behaalt
![Page 39: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/39.jpg)
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
the strategy plane > scope planesite objectives
site objectives + user needs > functionele eisen en content eisen
![Page 40: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/40.jpg)
IDM BLOK Eopen data
HT 1 periode 4vak HCI
SCOPE PLANEfunctionaliteiten in gebruik en inhoud
IDMDENHAAGInformatieDienstverlening &informatieManagement
HTDENHAAGHuman Technology
SCOPE PLANEfunctionality
![Page 41: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/41.jpg)
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
the scope planefunctionaliteiten in gebruik en inhoud
requirementseen waardevol proces eindigt in een waardevol product- Beschrijven van de requirements is nodig om eventuele conflicten op te sporen- Het product beschrijven is nodig voor de aansturing van je projectteam
![Page 42: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/42.jpg)
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
the scope planefunctionaliteiten in gebruik en inhoud
SCOPE PLANEfunctionality
functionalspecifications
contentrequirements
opstellen functionele eisenzo specifiek mogelijk- be positive- be specific- avoid subjective language
![Page 43: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/43.jpg)
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
the scope planefunctionaliteiten in gebruik en inhoud
SCOPE PLANEfunctionality
functionalspecifications
contentrequirements
opstellen functionele eisen- systeemeisen zijn geordend op prioriteit- systeemeisen zijn genummerd- systeemeisen zijn altijd in enkelvoud opgesteld (geen dit én dit)- systeemeisen kunnen worden ingedeeld in categorieën
![Page 44: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/44.jpg)
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
the scope planefunctionaliteiten in gebruik en inhoud
SCOPE PLANEfunctionality
functionalspecifications
contentrequirements
opdracht: functionele eisen
1. De applicatie biedt geen ondersteuning aan gehandicapte mensen
2. De gebruiker kan adresgegevens vastleggen van een klant3. Er zijn afbeeldingen in te zien die bij de gegevens horen4. Het is onmogelijk om een foto op te slaan bij de
persoonsgegevens5. De applicatie toont mooie plaatjes van de school6. De gebruiker kan oefenen met het bouwen van een
nomadentent7. De applicatie toont virtuele tours van de school
![Page 45: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/45.jpg)
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
the scope planefunctionaliteiten in gebruik en inhoud
SCOPE PLANEfunctionality
functionalspecifications
contentrequirements
prioriteringMOSCOW methode- Must have- Should have- Could have- Would have / Won’t have
![Page 46: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/46.jpg)
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
the scope planefunctionaliteiten in gebruik en inhoud
SCOPE PLANEfunctionality
functionalspecifications
contentrequirements
het doel van contenteisenContenteisen hebben vaak functionele implicaties
De opsteller van de content heeft een richtlijn voor de aan te leveren content
![Page 47: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/47.jpg)
IDM-‐ E open dataINTERACTION DESIGN
HT 1 periode 4HCI
the scope planefunctionaliteiten in gebruik en inhoud
SCOPE PLANEfunctionality
functionalspecifications
contentrequirements
het doel van contenteisenContenteisen hebben vaak functionele implicaties
De opsteller van de content heeft een richtlijn voor de aan te leveren content
![Page 48: [Ht] human computer interaction 2](https://reader034.vdocuments.net/reader034/viewer/2022051400/55a70bf41a28ab100b8b48d8/html5/thumbnails/48.jpg)
IDM BLOK Eopen data
HT 1 periode 4vak HCI
HUMAN COMPUTERINTERACTIONKlaas Jan Mollema MSc
IDMDENHAAGInformatieDienstverlening &informatieManagement
HTDENHAAGHuman Technology