Cursus: GUI, webdesign, etc. psychologie en human efficiency

Cursus. Naar perfecte interfaces met harde psychologie over bewegen, waarnemen, taal, leren en denken. Beleving, bruikbaar, Design, experience, intuïtie, look and feel, marketing, persoonlijke meningen en techniek worden even opzij gezet. Concretisering: in requirements en honderden bekende interfaces en problemen, vooral die van cursisten.


Theoretische basis

Interface-design kan praktisch zijn met guidelines, normen, standaarden en dergelijke. Het cursusboek geeft er zo'n 260.

Veel problemen zijn inmiddels opgelost met gezond verstand en door vallen en opstaan. Maar net zo min als een arts een ernstige ziekte kan oplossen met gezond verstand en vallen en opstaan, zo kan een interface designer niet de interface problemen oplossen die er nu nog zijn.
Andere oplossingen komen in het vizier als de ontwerper beschikt over meer dan common sense, net als bij de professionele arts.
De aanpak van de psychologie is een andere dan: , gebruiks­vriendelijkheid, intuïtief, , mensgericht ontwerpen, persuasive design, , social interfaces, software ergonomie, usability, user centered design, en verplaatsen in de gebruiker. De invalshoek van de psychologie is vaak net iets anders:









Dat blijkt uit een analyse van de concepten: en


Wat de psychologie betreft gaat het onder andere om:

x
Psychologiefutur and history of applied cognitive psychology

PsychologieWhy designers cant understand their users applied cognitive psychology

Psychologie taal grammar for graphics icons pictograms signs infographics

Psychologie

Psychologietoekomst van de toegepaste cognitievecognitief denkpsychologie

Psychologie denkenicon design pictogram bord bewegwijzering

Psychologie denkentoegepaste cognitief denkpsychologie

Psychologie denkenhersenen denken emotie gedrag toegepaste cognitievecognitief denkpsychologie

Psychologie denkenmetaforen toegepaste cognitief denkpsychologie

Psychologie denkentoegepaste cognitief denkpsychologie

Psychologie emotietoegepaste cognitief denkpsychologie

Psychologie kennistesttest kennis psychologie

Psychologie kijkenaandacht trekken sturen met kleur geel rood oranje en geluid

Psychologie kijken

Psychologie leren onthoudenleren vergeten onthouden instampen

Psychologie leren verkortenleren onderwijzen tellen optellen aftrekken rekenen op de basisschool

Psychologie leren verkortenleren verkeersborden rijexamen toekomst

Psychologie leren verkortenleren onderwijzen tellen optellen aftrekken rekenen op de basisschool

Psychologie leren werkgeheugenwerkgeheugen vergeten onthouden stm

Psychologie taalgrammatica voor graphics icon pictrogram  beelden infographics

Psychologie taalduidelijk onduidelijk woorden termen jargon








Praktische toepassing

Kan een cursus met zo'n theoretische achtergrond wel praktisch zijn? Ja dat kan. Simpel omdat een goede theorie 'operatio­naliseer­baar en testbaar' moet zijn. Meestal betekent dit dat de psycholoog een theorie vertaalt in onderzoeksitems. Maar een psycholoog kan natuurlijk ook concretiseren in requirements en interfaces. Bovendien is een van de theoretische uitgangspunten van : niet constateren van performance maar construeren van performance. Dat is één.Ten tweede zijn er honderden voorbeelden van interfaces die ondubbelzinnig wel of niet in overeenstemming zijn met die theorie. Rechts op deze pagina staan zulke voorbeelden.
  • Het bekendste voorbeeld was de oorspronkelijke interface van de NS-treinkaartautomaat. De interface daarvan is door mij gespecificeerd. Deze specificaties zijn in het oorspronkelijke ontwerp vrijwel geheel door NS gevolgd en daarmee was de automaat naar mijn idee een goed voorbeeld van 'human efficiency'. Het openbaar vervoer kent iedereen en ik ben bij veel interfaces betrokken geweest. Dat levert zo nodig de hier gevolgde handelingstheorie de hier gevolgde handelingstheorie
  • Windows en Office leveren ook vele voorbeelden. Er zijn weinig voorbeelden van de Mac. Natuurlijk is de Mac mooier, werkt die technisch beter en zitten er minder knulligheden in de interface. Maar ook de Mac gebruikt een bureaublad, menu's en tabbladen, om maar eens wat te noemen. Daar zijn forse vraagtekens bij te plaatsen.
  •  
  • Verder zijn er voorbeelden die ik speciaal voor de cursus gemaakt heb. Deze voorbeelden zijn zuiver; ze tonen het psycho­logische punt zonder mitsen en maren en de inhoud is in enkele seconden te begrijpen.

  • Ook op deze site heb ik wat voorbeelden proberen te realiseren.
    (1) Zo is het aanraakveld zo groot mogelijk gemaakt. Dat werkt sneller en is RSI-onvriendelijk.
    (2) Donkerblauw betekent: klikbaar. Geen technisch en grafisch onderscheid in buttons, links, tabs, menu opties, etc.
    (3) Overigens ben ik psycholoog en geen designer.

    Verder heeft de browser het laatste woord, zo zijn er geen toetsshortcuts die de lezer voor RSI behoeden, soms is de uitlijning anders dan bedoeld en sommige browsers tonen de tooltips onhandig of niet.
  • Het belangrijkst is natuurlijk de concretisering naar de interfaces die de deelnemers inbrengen.

  • Veel voorbeelden komen uit mijn dertigjarige adviespraktijk.  
  • Naar top.



    Programma

    De inbreng van de gebruikers bepaalt welke van de volgende onderwerpen aan de orde komen.

    Welke uitgangspunten

    - De marketing als uitgangspunt.
    - De mening van de gebruiker als uitgangspunt.
    - User experience als uitgangspunt.
    - De ergonomie als uitgangspunt.
    - Usability als uitgangspunt.
    - Psycho­logische uitgangspunten.

    Efficiënte invoer

    - Hoe clicken te vereenvoudigen.
    - Hoe de reistijd van de cursor over het scherm te verminderen.
    - Hoe de toetsinvoer te verminderen: entry of selection.

    Waarnemen

    Sturing van de aandacht en herkennen van informatie
    - Gebruik afmeting, vorm, tekst, icons, vet, dimmed, kleur, knipperen

    Waar informatie plaatsen?

    Rustige schermen

    Waarnemen en tabellen

    - Inefficiënte tabellen.
    - Tabs, inspringen en gecentreerde teksten.
    - Wat in rijen en wat in kolommen, portret of landschap.
    - Het ontwerpen van tabellen.

    Taal

    - Waarom ingaan op taal?
    - Taal, een schat verborgen onder graphics.
    - Wat maakt woorden onduidelijk.
    - Welke IT woorden zijn jargon.
    - Wat is er mis metOK enClose.
    - Verwacht niet te veel vanvoice-input.

    Leren en onthouden

    - De ultimateAre you sure? interface.
    - De ultimate zandloper (progress indicator).

    Help
    - Kan Help helpen?
    - Wat is er mis met deTip van de dag?
    - Wat is er mis met wizards?
    - Wat is er mis met personal assistants?
    - Help die helpt.

    Guidelines, consistentie en standaarden
    - De beperkingen van guidelines, consistentie en standaarden.
    - Wat is beter dan consistentie.

    Metaforen
    - Waarom zijn metaforen (desktop, window, bar, gallery, etc) aantrekkelijk voor ontwerpers.
    - De beperkingen van metaforen.
    - Alternatieven voor metaforen.
    - Het paradoxale van metaforen.
    - Metaforen als valkuil.

    Denken

    Mentale belasting
    - Interfaces die mentale belasting vergroten.
    - Ontwerpen om mentale belasting te verkleinen.

    Aanpassen
    - Waarom aanpassen?
    - Het ontwerpen van interfaces voor aanpassing.

    Navigatie en het menu

    - Wat maakt een menu, een geografische en een virtuele structuur zo aantrekkelijk voor ontwerpers?
    - Wat maakt deze structuur zo onverteerbaar voor gebruikers?
    - Het conceptuele (en visuele ) ontwerp van verteerbare structuren .

    Naar top.



    Werkwijze

    Een programma-onderdeel begint met een anekdote of een klein experiment. Op deze wijze ontstaat er een link tussen de persoonlijke ervaringen van de deelnemers, de psycho­logische kennis en onderzoeks­gegevens. Concretisering volgt door de psycho­logische processen te vertalen in handelingen met interface elementen en in 'requirements' voor de interface.

    Vervolgens komt de test: hoe zijn deze requirements toegepast. We beginnen met ontwerpen van anderen en daarna op de ingebrachte interfaces. Ook de cursusleider legt zijn ontwerpen op tafel. Bij inbreng van eigen ontwerpen is er het risico dat iemands stokpaard sneuvelt. Ook het omgekeerde gebeurt trouwens: een schijnbaar misbaksel blijkt na en psycho­logische analyse een gouden ei te zijn. Een cognitief psycho­logische blik op interfaces is voor velen een eye opener. Technische, financiële en intellectuele hoogstandjes zijn daarbij vrijwel nooit nodig.
    Naar top.



    Unieke van deze cursus

    Niet gebruikelijke invalshoeken...
    Er zijn verschillende invalshoeken voor interface ontwerp.
    Nadat standaarden en richtlijnen niet bleken te leiden tot goede interfaces werd gebruiks­vriendelijkheid het sleutel­woord. Microsoft mikte even op social interfaces( ) en in de academische wereld werd user centered design populair ( Usability kwam daar voor in de plaats. Verder kregen we onder andere look and feel, intuïtieve interfaces en verplaatsen in de gebruiker. Rond het jaar 2000 Daarna kwam persuasion op.Dit zijn goede doelstellingen maar een eenduidige concretisering is lastig. Dat geeft teveel ruimte voor persoonlijke invulling en hobby's.
        ... maar psycho­logische handelingen.
    In deze cursus ligt het accent op inzicht in het menselijk handelen. Concretisering kan dan maar op één manier. Het visuele fixatie­gebied is bijvoorbeeld vijf graden en details die daar buiten vallen worden niet onderscheiden, welk amateur psycho­logisch verhaal de designer ook houdt.

    Motivatie en emotie zijn natuurlijk wel van belang maar komen niet aan de orde. Ten eerste is dat een heel ander psycho­logisch en fysiologisch verhaal. Ten tweede heeft het geen zin een gebruiker te vragen waarom hij het beeldscherm door het raam gooide wanneer de onderzoeker vooraf al kan weten dat de interface niet gebruiksvriendelijk is. Ten derde is, wat de interface betreft, de emotie niet meer relevant wanneer het systeem gebruiksvriendelijk is. Vraag je daar dan toch naar dan is het antwoord: Gebruiksvriendelijk? Man waar heb je het over, laat me toch rustig doorwerken, ik was net zo lekker bezig.
      Niet interface-elementen...
    Een gebruikelijke ingang bij interface design is kijken naar de technische grafische elementen op het scherm. Vaak zijn dat metaforische interface-element zoals: advanced, bar, button, desktop, graphic, help, menu, OK, personal assistant, tabs, tip of the day, window en wizard.
    ... maar handelingen met interface-elementen.
    Deze gebruikelijke interface-elementen worden in de cursus getoetst aan de psycho­logische handelingen die gebruikers er mee uitvoeren: vinger-, oog-, taal-, leer- en denkhandelingen. Toetsing is eenvoudig: de tijd die nodig is voor de handeling, het aantal gemaakte fouten wat de gebruiker betreft en de kosten en de kwaliteit van het product wat de taak betreft.

     

    Géén ontwerpstappenplannen...
    In deze cursus geen stappenplannen noch een bepaalde ontwerp­methodologie.
    ... maar inzicht.
    Het psycho­logisch inzicht dat de cursus biedt, past altijd in de werkwijze die men gewend is.
    Naar top.



    Het resultaat

    Het is even wennen niet uit te gaan van gebruikelijke concepten maar van concrete psycho­logische processen. Maar er zijn wel wat voordelen.
     
  • Psycho­logische processen zijn onafhankelijk van de interface-design techniek. De duurzaamheid van nieuwe modes, snufjes en technieken kan getoetst worden aan de psycho­logische processen.
  • De processen zijn tijdloos; welke interface-design begrippen er ook nog in de mode komen en welke verrassingen de techniek ook in petto heeft.
  •  
  • De processen zijn domeinloos. In deze cursus ligt de focus toevallig op GUI en webdesign. Tijdens de cursus wordt zo nodig moeiteloos geschakeld naar domeinen waar de cursusleider ervaring èn ontwerpvoorbeelden van heeft (public transport information systems, onderwijs, process en traffic operators, traffic users (automobilisten, schippers, voetgangers in een winkelcentrum en machinisten van hoge snelheidstreinen). Switchen naar het domein van de cursisten is eenvoudig, zelfs wanneer het gaat om complexe domeinen. De cursist kan van werkkring veranderen zonder opnieuw naar cursus te moeten: de vingers, de ogen, de taal, het geheugen en het denken van de gebruikers van zijn nieuwe werkomgeving functioneren op dezelfde wijze als die van zijn vorige werkomgeving.
  • De cursus geeft zicht op de interface evolutie die loopt van techniek­vriendelijke interfaces naar interfaces die geheel aangepast zijn aan de mens en zijn taak. Gebruiks­vriendelijk­heid is geen issue meer.
  • Naar top.



    Deelnemers

    Voor wie
    De cursus is voor interface-designers, software ontwikkelaars, managers van human-computer interface projecten en ergonomen. Ook psycho­logen volgen de cursus. De vertaling van psycho­logische processen naar interfaces is kennelijk erg lastig. Voor grafisch geschoolden kan de cursus een verrijking zijn omdat zij minder bekend zijn met psycho­logische overwegingen van ontwerpmogelijkheden. Ook de verbale en de conceptuele vormgeving heeft bij grafisch ontwerp soms minder aandacht.


    Nieuwe middelen als e-book, e-reader, iBook, iPad, iPhone, iPod, pda en allerlei 'smart' dingen zijn voor de vingers onhandiger en geven de ogen minder ruimte. Ontwerpers moeten zich dan extra precies houden aan wat er over het bewegen, waarnemen en denken in de cursus gezegd wordt.
    Voorkennis
    Programmeerkennis en psycho­logische kennis zijn niet noodzakelijk.

    Het is gebleken dat deelnemers de benadering uitdagend en onconventioneel vinden. Het is daarom gewenst dat de deelnemers open staan voor nieuwe ideeën.
    Naar top.



    Historie van de cursus

    Het begin: invoer en beeldscherm
    De cursus richt zich op de menselijke functies. Evolutionair gezien veranderen deze nauwelijks. Ook deze cursus verandert dus nauwelijks. Twintig jaar geleden werd deze cursus ook gegeven met MS-DOS voorbeelden. Toen GUIs en Windows opkwamen bleef de psycho­logie hetzelfde en werden alleen de voorbeelden vervangen.
    Nu: complexe systemen en navigeren
    Bij het ontwerpen van complexe systemen zoals wij die vandaag kennen, zijn taal, begrijpelijkheid, leren en denken belangrijk. Deze lastige onderwerpen zijn in de loop der jaren voor de cursus voldoende uitgewerkt.
    Naar top.






    Interfaces waaraan
    de trainer substantiëel
    bijdroeg en ontwerpen
    die besproken kunnen
    worden.

    Public transport
    Road traffic
    Road traffic signs

    Complex data

    De km-teller van de toekomst: Een technische teller van kilometers of informatie voor het denken van de bestuurder bij het uitvoeren van zijn speed control taak. Vooral bij de zelfrijdendeauto is het in de gaten houden van de techniek van belang.

    Klik voor meer daarover.


    complex process presentation
    Upper right red,
    Close to disaster

    complex process presentation
    All OK.

    complex process presentation
    Upper right yellow low,
    take care!

    complex process presentation
    Upper right yellow high,
    take care!
    Source: Verhoef Holslag,
    2010.

    leerroute beheers systeem
    Source: LBS/Holslag Verhoef.


    Sourrce: Holslag Verhoef


    How much information
    can be in one of these
    smiley?
    Source: Verhoef Holslag,
    2010.


    Design of tables





    Design of scales







    One variable,
    six parameters,
    233 milliseconds
    perception time.


    An effective problem solving
    tool.
    Source: Holslag & Verhoef.


    Portrait or
    landscape?

    train traffic control information portrait orientation
    What is better for a
    train traffic
    controler?
  • portrait ...
  • train traffic control information landscape orientation

  • ...landscape?

  • Source: Holslag & Verhoef.

    What is better
    for car driving?




    etcs ermts mmi dmi planning
  • abstract portrait ...?

  • Source: ETCS/Verhoef.

    Train traffic
    control


    How to present
    tracks and platforms?
    Presentation of tracks and platforms for train traffic controlers
  • This way?

  • Presentation of tracks and platforms for train traffic controlers
  • Or this way?

  • Source: NS/Verhoef.

    Public transport signs



    Design of train indicators



    OV-verstoringsinformatie kan niet (beter) want de OV-denk- en computersystemen gaan uit van een papieren jaardienstregeling. Dat spoorboekje kent geen verstoringen. Dit uitgangspunt is goed te zien op de huidige borden.

    More, click and go to: OV kan reizigers geen verstorings’informatie geven, volgens de psychologie




    Design ticket vending

    NS touch screen train ticket vending machine
    NS touch screen train
    ticket vending machine
    Routing problems
    solved using ...



    Ticket vending machine.
    Language optionfirst step
    (hierarchical solution)?
    Source: Belgium Railways.


    Ticket vending machine.
    Change language any time
    (parallel solution).
    Source: NS/ Verhoef.

    Netherlands Railways touch screen train ticket vending machine.

    It looks like a menu.
    However,
    no hierarchical steps.
    What is the structure?"

    Which button is
    to help whizzkids
    and it-specialists?
    Source: NS/Verhoef.


    coffee drink vending machine, use of gray out.
    The train ticket vending
    machine solution is general
    applicable. It also can
    be used for complex drink
    vending machines.
    Source: Verhoef.


    Waterway signing

    Current signs,
    European standard(Cevni)
    signs, experimental signs.


    Underwater tresshold
    in lock


    Several markers for
    keep clear from doors.
    Source: Lock Kiel canal, 2011.


    A clear text and sign for
    the cill problem.
    Keep clear from the door.
    Source: UK.


    An other clear sign
    for the cill problem.
    Keep 1 meter clear
    from the lock door.
    Source: experimental demo design,
    Verhoef, 2011




    . Underwater tresshold
    under bridge


    Source: Amsterdam,
    near Central Station, 2011.
    This is a Cevni sign.


    A lateral tresshold sign that is understood.
    Source: experimental demo design, Verhoef, 2011.




    Mooring sign


    Current sign.
    Source: Enkhuizen,
    The Netherlands, 2011.


    Redesign
    Source: Verhoef demo, 2011.


    Source: Vienna, 2011.


    Redesign
    Source: Verhoef demo, 2011.




    Dam sign


     
    What is the meaning
    of this Cevni sign?
    Source: Belgium Ardennes, 2011.

     
    This sign stands for:
    dam in 100 meter.
    Source: experimental demo design,
    Verhoef, 2011.




    Shallow shore sign



    What is the meaning
    of the black arrow
    pointing left and the
    white arrow
    pointing right?
    Source: Hamburg, 2011.
    Cevni sign.



    Keep 5 meter from shore,
    shallow shore.
    Source: experimental demo design,
    Verhoef, 2011.


    To top of this list of pictures.
    with pictures.
    To top of list of pictures.


    Meer toepassingen van de psychologie bij GUI en web
    x
    GUI and webgrammar graphics statistics futur next generation infographics

    GUI and webaandacht sturing trekken kleurgebruik geel rood oranje infographics

    GUI and webgrammar for graphics icons pictograms signs infographics

    GUI and webdesktop bureaublad

    GUI and webantropometrie handen hand vriendelijk in de hand houden

    GUI and webGUI graphical user interface command user commandline prompt MS-DOS

    GUI and webguidelines normen richtlijnen standaarden design usability

    GUI and webhandelingspsychologie Parreren leerpsychologie kwalitatief

    GUI and webpieptonen help leerpsychologie dimmen van opties

    GUI and webkeep is stupid simple kiss eenvoudig simpel

    GUI and webnavigatie met menu of tabel startpagina desktop

    GUI and web

    GUI and webtoekomst visuele auditieve tactiele communicatie sociale media ringtones trillen

    GUI and webopenbaar vervoer betalen ovchikpkaart toekomst infographics

    GUI and webtag clould psychologie gebruiksvriendelijkheid

    GUI and websturing trekken aandacht

    GUI and webskimmen pasfraude NS automaat beleving openbaar vervoer

    GUI and webtoetsen toetsenborden typen ergonomie

    GUI and websmartphone

    GUI and webmetaforen antropomorf denken begrijpen

    GUI and webduidelijk onduidelijk woorden termen jargon

    GUI and webhomepage startpageweb map structuur

    GUI and webtest kennis psychologie

    Naar top.



    Behalve psychologie voor GUI en web ook psychologie voor: x
    ects

      ERMTS hoge snelheidstrein hsl ATB experimenteel interface voor machinist ERMTS high speed train control driver mmi ERMTS hoge snelheidstrein hsl ATB experimenteel interface voor achinist ERMTS hoge snelheidstrein hsl ATB experimenteel interface voor achinist 






    gui



    x Invoer Morsesleutel Toekomst        multidimensionaal graphic   






    icon design



      3-d, perspectief,drie-dimensionaal verkeersbord toekomst parkeerverbod verkeersbord toekomst verboden inhalen verkeersbord toekomst maximum snelheid bepaalde 






    psychologie



    helderheid voor betrouwbaarheid hersenen limgisch systeem en cortex aandacht trekken en aandacht sturen gebruik van de kleuren rood oranje en geel gevoeligheid van het oog voor kleuren humunculus mensmetafoor een mens in de zaadcel 






    public



     NS treinkaart automaat b100 betalen openbaar vervoer NS treinkaart automaat b8060 betalen openbaar vervoer  IMO international maritime organisation muster station sign plattegrond IKEA water vaar verkeersbord maximaal hoogte water vaar verkeersbord maximaal drie dik aanleggen water vaar verkeersbord maximale doorvaart hoogte 3 meter experimenteel vertrektijden bord openbaar vervoer structuur openbare ruimten experimenteel vertrektijden bord openbaar vervoer atb etcs snelheidsbeheersing aandacht trekken water vaar verkeersbord verboden aanleggen water vaar verkeersbord maximale hoogte water vaar verkeersbord verboden 3 dik aanleggen met meer schepen trein vertrektijd perron NS CTA OV openbaar vervoer betalen ov-chipkaart toekomst grafische bestemmingen lijst metro ondergrondse lijn  structuur hoefijzer winkelcentrum 






    toekomst

              






    book

     






    rekenen

    leren rekenen basisschool MAB rekenblokken toekomst onderwijs leren lezen leren rekenen supermarkt leren rekenen basisschool tellen op de vingers aftellen leren rekenen vleksom puntsom rekenonderwijs basisschool tientallig stelsel tellen op de vingers rekenonderwijs basisschool computer diagnostiek remedial teaching graphics for quantitative data next generation 








    Naar top.






    Zoeken in humanefficiency.nl

    Contact

    +31 (653) 739 750
    Parkstraat 19
    3581 PB Utrecht
    Nederland

    leonardverhoef@gmail.com
    Kamer van koophandelnummer: 39057871, Utrecht.
    Naar top.