Human computer interaction 01-09-2022
Voorbereiding week 2:
- Lezen Interaction Design: Beyond Human-Computer Interaction (e-book): 3.5, 7.2.1, 7.2.2, 7.2.3,
7.2.20, 7.3 (+ optioneel andere delen H3)
- 2 mini hoorcolleges (zie Canvas)
Het ontwerpen, driehoek:
- gebruiker
- ontwerper
- publiek
Toetsing
- 40 procent: herontwerpen bestaand mediaproduct
- 60 procent: individueel examen
verplichte cursusliteratuur, wekelijkse colleges en minicolleges
voorbeeldvragen beschikbaar op canvas
Groepsopdracht
- maatschappelijk probleem en bestaand nieuwemediaproduct dat het probleem (deels) probeert op
te lossen
- analyseer het product en reflecteer kritisch: in hoeverre slaagt het nieuwmediaproduct er in om het
probleem daadwerkelijk op te lossen
- stel een goed herontwerp voor van het nieuwemediaproduct (verbeterde versie) -> gebruik
literatuur etc daarvoor
Elementen
- kort voorstel (pass/fail)
- eindverslag (cijfer)
- video (pass/fail)
Deadlines (stappen 1 en 2)
- inleveren voor peer feedback: 28 september
- inleveren voor docentenfeedback: 7 oktober
Eindverslag
- beschrijf stappen 1, 2 en 3: goed wetenschappelijk onderbouwd (dmv theorieën en literatuur)
template op Canvas
- deadline: 25 november
Video
- ongeveer 2 minuten, MAAK HET NIET SAAI, laat het effect zien van iemand die het gaat gebruiken
- Cursushandleiding voor meer info
Groepen maken: people -> groepsopdracht
Groepsopdracht (09/09/2022)
- Selecteer een maatschappelijk relevant probleem en een bestaan nieuw mediaproduct dat
ontworpen is om (een deel van) het probleem op te lossen
,Interactietypes en user interface trends
- productontwerp is niet gelijk aan interactieontwerp
beide: vorm, materiaal, ergonomie, esthetiek
verschillen: communicatie tussen gebruikers, output system, input gebruiker
User Interface
- de interface (intermediair) waar de interfaces tussen de computer en mens plaatsvinden
- input: controle elementen voor het uitvoeren van acties
- output: informatie vanuit het systeem
-> user interface = input + output
Interactietypes
- Instructing
opdrachten geven aan computer en opties selecteren (input computer)
éénrichtingsverkeer
- Conversing
interactie met een systeem alsof je een gesprek voert (vinden relevante informatie)
tweerichtingsverkeer tussen computer en mens
- Manipulating
objecten in een virtuele of fysieke ruimte verplaatsen (doe-taken)
- Exploring
bewegen door een virtuele of fysieke ruimte (handig bij architectuur)
- Responding
door de computer geïnitieerde interacties waarop gebruikers kunnen reageren
(veranderingen bijhouden)
-> vaak méér interactietypes in één interactie
User interface trends
Waves van HCI
- Piek ‘60
Context: (één) mainframe computers bediend door meerdere gebruikers
HCI doel: optimaliseren van aansluiting tussen computer en gebruiker (bediening mogelijk)
Onderzoek: informatica
- Piek ‘80
Context: PC’s (personal computer) gebruikt op de werkvloer
HCI doel: Ondersteunen van werkgerelateerde taken (efficiëntie)
Onderzoek: Cognitiewetenschappen (usability)
- Piek ’00 (deze eeuw)
Context: mobiele apparaten gebruikt in het dagelijks leven (privé-doeleinden en in openbaar)
HCI doel: ondersteunen van taken in het dagelijks leven, plezier en zelfexpressie (user
experience)
Onderzoek: culturele studies, ethnografie
- Periode: nu
Context: Hypermobiliteit (ubiquitous computing)
HCI doel: Ontwerpen voor het grotere geheel/algemeen belang, sociale verantwoordelijkheid
Onderzoek: Waarden
, Wave1
Ponskaart computers (’50) – user interface (lay-out)
- Input: gebruikers ponsen gaatjes in kaarten (binaire gegevens), kaarten worden ingevoerd in
computer
- Output: ponskaarten (of geprinte rapporten)
-> interactietype: instructing
Command-line interfaces (’60-’70) – user interface
- Input: test commando’s via toetsenbord (commando typen -> opdracht geven)
- Output: tekst op het scherm (unicolour)
-> interactietype: instructing
Wave 2
Grafische user interfaces (grafische beelden, widgets en tekst -> niet alleen instructing)
-> Van informatievoorziening ook naar cognitieve benadering
-Input: tekst via toetsenbord; beweeg cursor en klik met muis om een selectie te maken uit het menu
- Output: grafisch en tekst via het scherm
-> voordelen: minder beroep op cognitieve vaardigheden, meer logische en intuïtieve navigatie, laat
multitasking toe, esthetiek mogelijk
-> nadelen: hogere ontwikkelingskosten en computercapaciteit, hoger (visuele) complexiteit
(aandachtseisen, afleiding), 3 handen nodig, vrijwel onbeperkte mogelijkheden (hoe begeleid je
gebruiker?)
-> interactietype: instructing
WYSIWYG (what you see is what you get)
-> ontwerp is hetzelfde als het uiteindelijke gepubliceerde resultaat
Widespread introduction of the PC
Verdere ontwikkelingen (’80-’90)
- Full colour, introductie multimedia, decreasing hardware costs (groter geheugen, sneller systeem)
- draagbaarheid: minder vermogen nodig (batterij), kleiner scherm
- introductie internet: GUI software -> geheel van beelden, folders en menu's waarmee je de
computer bedient, structuur van het uiterlijk
-> interactietype: exploring
Wave 3
Revolutie: web 2.0 (1999-2004)
- Participatieve of sociale web, gebruikers genereren zelf content (ipv alleen als bron)
- Rijke user experience
Natuurlijke user interfaes (NUI)
- interacteren met computers op dezelfde manier als we met de fysieke wereld interacteren
- voordeel: alledaagse vaardigheden gebruiken die mensen toch al kennen
praten, schrijven, gebaren, lopen, objecten oppakken (meer intuïtief, natuurlijker)
-> interactietype: instructing, manipulating (conversing, exploring)
Wave 4
Ubiquitous computing (alomvertegenwoordigd)
- Slimme smart objects
processoren, sensoren, verbonden (internet), communicatie
-> interactietype: manipulating, responding
- artificial intelligence: computers die hun omgeving waarnemen, acties ondernemen om hun doelen
te bereiken
virtuele assistenten en chatbots
aanbevelingssystemen
Voorbereiding week 2:
- Lezen Interaction Design: Beyond Human-Computer Interaction (e-book): 3.5, 7.2.1, 7.2.2, 7.2.3,
7.2.20, 7.3 (+ optioneel andere delen H3)
- 2 mini hoorcolleges (zie Canvas)
Het ontwerpen, driehoek:
- gebruiker
- ontwerper
- publiek
Toetsing
- 40 procent: herontwerpen bestaand mediaproduct
- 60 procent: individueel examen
verplichte cursusliteratuur, wekelijkse colleges en minicolleges
voorbeeldvragen beschikbaar op canvas
Groepsopdracht
- maatschappelijk probleem en bestaand nieuwemediaproduct dat het probleem (deels) probeert op
te lossen
- analyseer het product en reflecteer kritisch: in hoeverre slaagt het nieuwmediaproduct er in om het
probleem daadwerkelijk op te lossen
- stel een goed herontwerp voor van het nieuwemediaproduct (verbeterde versie) -> gebruik
literatuur etc daarvoor
Elementen
- kort voorstel (pass/fail)
- eindverslag (cijfer)
- video (pass/fail)
Deadlines (stappen 1 en 2)
- inleveren voor peer feedback: 28 september
- inleveren voor docentenfeedback: 7 oktober
Eindverslag
- beschrijf stappen 1, 2 en 3: goed wetenschappelijk onderbouwd (dmv theorieën en literatuur)
template op Canvas
- deadline: 25 november
Video
- ongeveer 2 minuten, MAAK HET NIET SAAI, laat het effect zien van iemand die het gaat gebruiken
- Cursushandleiding voor meer info
Groepen maken: people -> groepsopdracht
Groepsopdracht (09/09/2022)
- Selecteer een maatschappelijk relevant probleem en een bestaan nieuw mediaproduct dat
ontworpen is om (een deel van) het probleem op te lossen
,Interactietypes en user interface trends
- productontwerp is niet gelijk aan interactieontwerp
beide: vorm, materiaal, ergonomie, esthetiek
verschillen: communicatie tussen gebruikers, output system, input gebruiker
User Interface
- de interface (intermediair) waar de interfaces tussen de computer en mens plaatsvinden
- input: controle elementen voor het uitvoeren van acties
- output: informatie vanuit het systeem
-> user interface = input + output
Interactietypes
- Instructing
opdrachten geven aan computer en opties selecteren (input computer)
éénrichtingsverkeer
- Conversing
interactie met een systeem alsof je een gesprek voert (vinden relevante informatie)
tweerichtingsverkeer tussen computer en mens
- Manipulating
objecten in een virtuele of fysieke ruimte verplaatsen (doe-taken)
- Exploring
bewegen door een virtuele of fysieke ruimte (handig bij architectuur)
- Responding
door de computer geïnitieerde interacties waarop gebruikers kunnen reageren
(veranderingen bijhouden)
-> vaak méér interactietypes in één interactie
User interface trends
Waves van HCI
- Piek ‘60
Context: (één) mainframe computers bediend door meerdere gebruikers
HCI doel: optimaliseren van aansluiting tussen computer en gebruiker (bediening mogelijk)
Onderzoek: informatica
- Piek ‘80
Context: PC’s (personal computer) gebruikt op de werkvloer
HCI doel: Ondersteunen van werkgerelateerde taken (efficiëntie)
Onderzoek: Cognitiewetenschappen (usability)
- Piek ’00 (deze eeuw)
Context: mobiele apparaten gebruikt in het dagelijks leven (privé-doeleinden en in openbaar)
HCI doel: ondersteunen van taken in het dagelijks leven, plezier en zelfexpressie (user
experience)
Onderzoek: culturele studies, ethnografie
- Periode: nu
Context: Hypermobiliteit (ubiquitous computing)
HCI doel: Ontwerpen voor het grotere geheel/algemeen belang, sociale verantwoordelijkheid
Onderzoek: Waarden
, Wave1
Ponskaart computers (’50) – user interface (lay-out)
- Input: gebruikers ponsen gaatjes in kaarten (binaire gegevens), kaarten worden ingevoerd in
computer
- Output: ponskaarten (of geprinte rapporten)
-> interactietype: instructing
Command-line interfaces (’60-’70) – user interface
- Input: test commando’s via toetsenbord (commando typen -> opdracht geven)
- Output: tekst op het scherm (unicolour)
-> interactietype: instructing
Wave 2
Grafische user interfaces (grafische beelden, widgets en tekst -> niet alleen instructing)
-> Van informatievoorziening ook naar cognitieve benadering
-Input: tekst via toetsenbord; beweeg cursor en klik met muis om een selectie te maken uit het menu
- Output: grafisch en tekst via het scherm
-> voordelen: minder beroep op cognitieve vaardigheden, meer logische en intuïtieve navigatie, laat
multitasking toe, esthetiek mogelijk
-> nadelen: hogere ontwikkelingskosten en computercapaciteit, hoger (visuele) complexiteit
(aandachtseisen, afleiding), 3 handen nodig, vrijwel onbeperkte mogelijkheden (hoe begeleid je
gebruiker?)
-> interactietype: instructing
WYSIWYG (what you see is what you get)
-> ontwerp is hetzelfde als het uiteindelijke gepubliceerde resultaat
Widespread introduction of the PC
Verdere ontwikkelingen (’80-’90)
- Full colour, introductie multimedia, decreasing hardware costs (groter geheugen, sneller systeem)
- draagbaarheid: minder vermogen nodig (batterij), kleiner scherm
- introductie internet: GUI software -> geheel van beelden, folders en menu's waarmee je de
computer bedient, structuur van het uiterlijk
-> interactietype: exploring
Wave 3
Revolutie: web 2.0 (1999-2004)
- Participatieve of sociale web, gebruikers genereren zelf content (ipv alleen als bron)
- Rijke user experience
Natuurlijke user interfaes (NUI)
- interacteren met computers op dezelfde manier als we met de fysieke wereld interacteren
- voordeel: alledaagse vaardigheden gebruiken die mensen toch al kennen
praten, schrijven, gebaren, lopen, objecten oppakken (meer intuïtief, natuurlijker)
-> interactietype: instructing, manipulating (conversing, exploring)
Wave 4
Ubiquitous computing (alomvertegenwoordigd)
- Slimme smart objects
processoren, sensoren, verbonden (internet), communicatie
-> interactietype: manipulating, responding
- artificial intelligence: computers die hun omgeving waarnemen, acties ondernemen om hun doelen
te bereiken
virtuele assistenten en chatbots
aanbevelingssystemen
