Bachelor Informatica

Een bruikbaar interface voorgeautomatiseerde online proc-toring

Steven Raaijmakers

June 26, 2018

Supervisor(s): Gosia Migut

Signed:

Informatica—

Universiteit

vanAmst

erdam

2

Abstract

Het onderwijs digitaliseert en daarmee stijt het aantal digitale tentamens. Belangrijk isdat bij deze digitale tentamens surveillance plaatsvindt om zo fraude te kunnen detecteren.Om digitale tentamens te surveilleren wordt online proctoring toegepast, waarbij meegekekenwordt op het computerscherm van de student. Deze vorm van digitale surveillance vindtplaats door een mens of door een algoritme (automatische proctoring). Momenteel bestaaner verschillende aanbieders van online proctoring applicaties, die nadelen kennen. In ditonderzoek wordt er een voorstel gedaan voor een interface van een automatische onlineproctoring applicatie die deze nadelen adresseert.

3

4

Contents

1 Introductie 71.1 Onderzoeksvragen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 8

2 Achtergrond 92.1 Digitaal onderwijs . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 92.2 Fraude in digitale tentamens . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 9

2.2.1 Werking online proctoring . . . . . . . . . . . . . . . . . . . . . . . . . . . 102.2.2 Nadelen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 12

2.3 Product ontwerp . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 122.3.1 Front-end ontwerp . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 132.3.2 Back-end . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 15

3 Methodologie 173.1 UvA online proctoring . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 173.2 Onderzoeksprotocol . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 173.3 Product implementatie . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19

3.3.1 Front-end . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 203.3.2 Back-end . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 20

4 Resultaat 234.1 Producteisen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 234.2 Product design . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 25

4.2.1 Front-end . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 254.2.2 Back-end . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 29

4.3 Evaluatie van het eindresultaat . . . . . . . . . . . . . . . . . . . . . . . . . . . . 29

5 Conclusie en Discussie 315.1 Antwoord op onderzoeksvragen . . . . . . . . . . . . . . . . . . . . . . . . . . . . 315.2 Voorgestelde experimenten . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 32

5.2.1 Interface toepassen op andere data . . . . . . . . . . . . . . . . . . . . . . 325.2.2 Incident definieren . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 32

5.3 Discussie . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 325.3.1 Vervolgonderzoek . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 325.3.2 Problemen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 32

6 Apendix 356.1 Aangepaste WEQ van Elling . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 35

5

6

CHAPTER 1

Introductie

Wanneer buitenlandse studenten aan een universiteit een master willen volgen kan er van destudent gevraagd worden of hij/zij eerst wil deelnemen aan een aantal vakken, in de vorm vaneen pre-master. Hiermee kunnen de vaardigheden van de student op voorhand getoetst worden.

Ook de Universiteit van Amsterdam (UvA) maakt gebruik van dergelijke pre-masters. Omdathet studenten betreft die woonachtig zijn in een land anders dan Nederland wordt deze pre-master volledig digitaal aangeboden. Hierdoor kan de pre-master op afstand gemaakt en voltooidworden. De vakinformatie, de colleges en de opdrachten zijn terug te vinden in de digitaleleeromgeving BlackBoard 1. Aan het eind van een vak wordt de opgedane kennis van de studentgetoetst middels een tentamen dat ook digitaal wordt afgenomen.

Belangrijk is dat hierbij gecontroleerd wordt of de resultaten op een eerlijke manier behaaldzijn. Bij traditionele tentamens vindt deze controle plaats met behulp van surveillanten in eententamenzaal waar studenten met pen en papier het tentamen maken. Hiermee wordt het aantalmanieren waarop fraude gepleegd kan worden zoveel mogelijk beperkt. Omdat digitale tentamensvia een computer worden gemaakt zijn er veel meer mogelijkheden om te kunnen frauderen, zekerwanneer het digitale tentamen op afstand plaatsvindt. Om dit toch te controleren wordt onlineproctoring toegepast. Met behulp deze digitale surveillance kan de authenticiteit en eerlijkheidvan een student tijdens digitale tentamens worden getoetst ([25]).

Doordat online proctoring steeds beter kan worden uitgevoerd kunnen tentamens vaker dig-itaal worden afgenomen waardoor het onderwijs kan flexibiliseren. Digitale tentamens biedennamelijk de mogelijkheid tot het volledige aanbieden van digitale cursussen. Dit heeft tot gevolgdat er onderwijs kan plaatsvinden dat zowel tijds- als plaatsonafhankelijk is. Dit biedt eenuitkomst voor gevallen waarbij studenten niet in staat zijn fysiek aanwezig te zijn doordat zijzich bijvoorbeeld in het buitenland bevinden of ziek zijn. Ook bieden digitale cursussen eenoplossing voor studenten die eerder of juist later een tentamen willen afnemen.

Ook kan online proctoring worden ingezet worden bij digitale tentamens waar studenten welfysiek aanwezig moeten zijn op een campus. Momenteel worden digitale tentamens afgenomen inspeciale digitale tentamenzalen waarbij surveillanten meerdere computerschermen tegelijk moni-toren. Hierbij maken de studenten gebruik van computers die de tentamenzaal aanbiedt waaropsoftware staat die bijvoorbeeld de toegang ontzegt tot bepaalde websites en de monitorbeeldenlive-streamt naar de surveillanten. Met de nieuwste ontwikkelingen op het gebied van onlineproctoring is het mogelijk om de studenten deze software op hun eigen pc te laten installerenwaardoor de digitale tentamens volgens het Bring Your Own Device (BYOD) principe kunnenworden afgenomen. Hierdoor zullen onderwijsinstellingen niet meer afhankelijk zijn van digitaletentamenzalen maar kunnen eenvoudige klaslokalen ingezet worden, zolang deze toegang biedentot stroom en een internetverbinding.

1Blackboard: http://www.blackboard.com

7

1.1 Onderzoeksvragen

In deze scriptie wordt onderzoek gedaan naar een interface voor automatiseerde online proc-toring. Het doel hierbij is de resultaten van het fraude detectie algoritme op een bruikbaremanier presenteren aan de gebruikers, de surveillanten. Hierbij wordt de volgende definitie aan“bruikbaar” - beschreven in Nielsen, 2006 [19] - toegekend:

... a quality attribute relating to how easy something is to use. More specifically, itrefers to how quickly people can learn to use something, how efficient they are whileusing it, how memorable it is, how error-prone it is, and how much users like usingit.

De onderzoeksvragen van dit onderzoek luiden als volgt:

1. Hoe wordt een bruikbaar interface ontwikkeld voor geautomatiseerde online proctoring?

(a) Welke producteisen moet een interface voor geautomatiseerde online proctoring hebben?

(b) Hoe kan door middel van feedback op een interface de kwaliteit verbeterd worden?

(c) Wat is de kwaliteit van het verbeterde interface volgens potentiele gebruikers?

8

CHAPTER 2

Achtergrond

2.1 Digitaal onderwijs

Het onderwijs digitaliseert [11]. Dit gebeurd op kleine schaal, waarbij colleges en opdrachtenonline kunnen worden teruggevonden, maar ook op grote schaal dankzij de Massive Open OnlineCourses (MOOCs) [27]. De afgelopen jaren hebben zich wereldwijd miljoenen studenten in-geschreven voor dit soort online cursussen [11]. Deze vorm van digitaal onderwijs biedt mensenover de hele wereld toegang tot hoogwaardig studiemateriaal van topuniversiteiten zoals Harvard1.

Omdat MOOCs volledig digitaal worden aangeboden is het lastig te controleren op fraude,met name bij het afnemen van de tentamens. Het is belangrijk dat hierop gecontroleerd omzo de waarde van het diploma te behouden. MOOCs bieden verschillende oplossingen voor ditprobleem. Zo bestaat de optie om de student het tentamen te laten maken op een hiervooraangewezen plek. De student zal dan onder toeziend oog van een surveillant het tentamen afne-men op bijvoorbeeld een ambassade of een lokaal tentamen-centrum. Dit is een relatief kostbareoplossing omdat men hierbij afhankelijk is van locaties en de beschikbaarheid van surveillanten.Daarom wordt online proctoring veel ingezet om fraude bij tentamens van MOOCs tegen te gaan.

2.2 Fraude in digitale tentamens

Doordat digitale tentamens op computers gemaakt worden ontstaan er veel nieuwe manieren omfraude te plegen. Een aantal hiervan worden benoemd in de whitepaper van Sietses, 2018 [25]:

• Internet toegang. Hierbij kunnen de antwoorden op de vragen opgezocht worden op hetinternet. Dit is echter makkelijk op te sporen door het scherm van de student gedurendehet tentamen op te nemen en te bekijken.

• Het tentamen wordt gemaakt door een ander persoon. Met behulp van een webcamvideozou de authenticiteit van de student [3] kunnen worden vastgesteld.

• Een tweede persoon speelt buiten het zicht van de camera antwoorden door. Dit zougedetecteerd kunnen worden door het gebruik van een microfoon [9] of het gebruik van eencamera waarbij de gehele ruimte is te zien [6].

• Gebruik van spiekbriefjes. Dit zou gedetecteerd kunnen worden door via de webcamvideode richting van de ogen te volgen [7].

• Een tweede persoon controleert de computer op afstand en vult de antwoorden in voor destudent. Dit is alleen te detecteren via een logger die kan controleren wat de toetsaanslagenzijn.

1HarvardX: https://www.edx.org/school/harvardx

9

• Het gebruik van een virtual machine (VM). Hierbij start de student een virtual machineop, dit is niet te detecteren via een schermvideo. Wel zou een tweede camera op het schermgericht kunnen worden zodat dit gedetecteerd kan worden.

2.2.1 Werking online proctoring

Er bestaan drie hoofdcategorieen bij online proctoring [25]:

1. Live online proctoring. Hierbij kijken de examinatoren tijdens het afnemen van het ten-tamen met de afnemers in real-time mee, zoals hierboven beschreven. Dit is de oudste enmeest bekende vorm van online proctoring. Een nadeel hiervan is dat het tentamen niettijdonafhankelijk kan worden afgenomen omdat er in real-time surveillanten beschikbaarmoeten zijn.

2. Achteraf online proctoring. Hierbij wordt met behulp van logs en videobeelden van destudent die het tentamen afneemt bepaald of er fraude wordt gepleegd. Voordeel hiervan isdat het tentamen zowel plaats- als tijdonafhankelijk kan worden afgenomen. Nadelig is datde surveillant niet kan ingrijpen tijdens het tentamen wanneer bijvoorbeeld de camera’sverkeerd zijn gepositioneerd.

3. Automatische online proctoring. Hierbij wordt de fraude detectie deels door een algoritmeovergenomen. Het algoritme detecteert fraude gevoelige momenten aan de hand van (au-diovisuele) data die vervolgens aan een surveillant gepresenteerd worden. Automatischeonline proctoring is daarom efficient en tijdsbesparend. Het nadeel is dat dit algoritmegemanipuleerd zou kunnen worden en dat het algoritme niet 100% accuraat kan zijn. Denadelen lijken echter niet op te wegen tegen de voordelen.

Verschillende bedrijven leveren applicaties voor online proctoring. Een grote gelijkenis tussende applicaties is het gebruik van een hardware opstelling die vaak tenminste een videocamerabevat. De taak van de aangeboden tools bestaat voornamelijk uit het filteren van grote hoeveel-heden (audiovisuele) data op fraudegevoelige incidenten. Sommige tools gebruiken hiervoor hetmenselijk oog, andere online proctoring tools claimen dit proces volledig te automatiseren. Debeslissing of er in de incidenten daadwerkelijk fraude wordt gepleegd wordt uiteindelijk gemaaktdoor een menselijke gebruiker. Sterker nog, in Nederland is het volgens de Wet Bescherming Per-soonsgegevens (WBP) [25] 2 verboden om dit soort beslissingen te automatiseren. Het beoorde-len van de incidenten gebeurd door surveillanten van de onderwijsinstelling, zoals examinatoren,docenten of vakassistenten. Deze digitale surveillanten zijn de gebruikers de online proctoringtools.

Twee voorbeelden van bedrijven die online proctoring applicaties aanbieden zijn ProctorExam- dat gebruikt wordt op de UvA - en ProctorU. Daarnaast worden in de papers van Li, 2015 [16]en Atoum, 2015 [1] onderzoeken aangedragen naar online proctoring die geautomatiseerd is.

ProctorExam

ProctorExam 3 controleert op fraude in digitale tentamens door gebruik te maken van videobeelden.Deze videobeelden betreffen een student tijdens het afnemen van het tentamen. Hierbij wordtgebruik gemaakt van verschillende video perspectieven (zie figuur 2.1):

1. Schermopname

2. Webcamvideo

3. Camera op afstand

In de meest basale versie wordt gebruik gemaakt van enkel het eerste video perspectief. Inde meest uitgebreide variant worden alle drie de perspectieven in beschouwing genomen. Hierbijmoet de student wel over de correcte hardware beschikken.

2WBP: http://wetten.overheid.nl/BWBR0011468/2018-05-013ProctorExam: https://www.proctorexam.com/

10

Figure 2.1: Verschillende video perspectieven van een student tijdens een tentamen

Aan de hand van de verschillende perspectieven wordt door een menselijk oog bepaald of er inde video’s fraudegevoelige momenten optreden. De fraudegevoelige incidenten worden vervolgensteruggekoppeld naar de gebruiker.

ProctorU

Een andere leverancier is ProctorU 4. Ze bieden verschillende tools aan waarbij gebruik gemaaktwordt van twee video perspectieven: een webcam en een schermvideo. Voordat het tentamenbegint worden gevraag een aantal acties te ondergaan. Hierbij wordt de student geverifieerdmiddels het tonen van een ID kaart aan de webcam. Deze wordt vervolgens gematcht aan hetgezicht van de student. Daarna moet de student zijn webcam 360 graden ronddraaien zodatde omgeving van de student gecontroleerd kan worden. Vervolgens kan het tentamen beginnenwaarna er detectie over de schermvideo zal plaatsvinden. In ProctorU live gebeurd dit middelstoeziend oog van een surveillant in dienst van ProctorU. Bij ProctorU auto vindt deze detec-tie geheel automatisch plaats. Tot slot zullen de bevindingen worden teruggekoppeld aan degebruiker.

Li, 2015

In Li, 2015 [16] wordt een voorstel gedaan tot Massive Open Online Proctor (MOOP). Een on-derdeel hiervan is automatische online proctoring, waarbij gebruik gemaakt wordt van verschil-lende hardware componenten. Anders dan bij de eerdere genoemde oplossingen is de schermvideogeen onderdeel van deze opstelling. Wel wordt er gebruik gemaakt van vier andere componentenin de vorm van twee video’s: een webcamvideo en een video die gericht staat op het profiel van

4ProctorU: https://www.proctoru.com/

11

de student, een EEG sensor 5 en een gaze tracker 6. Via de EEG sensor worden de hersengolvenvan de student vergeleken met patronen die verkregen zijn door big data analyse. Als de hersen-golven hiervan afwijken kan dit duiden op fraude. Dit kan gezien worden als een student dieop voorhand de tentamenantwoorden heeft en zich bij het invullen van de antwoorden verdachtweinig inspant. Aan de hand van de gaze tracker kan gekeken worden naar de richting van deogen zodat de student niet op een spiekbriefje kijkt of op zijn mobieltje.

Atoum, 2015

In Atoum, 2015 [1] wordt voortgeborduurd op onder andere het onderzoek van MOOP. Omdatde oplossing van MOOP slechts een beperkte set van fraude manieren kan detecteren stellenzijn Online Exam Proctoring (OEP) voor. Hierbij wordt gebruik gemaakt van drie verschillendecomponenten: de webcamvideo, een microfoon en een wearcam. De wearcam is een cameragemonteerd aan het frame van een bril die de student moet dragen. Hierdoor kan er gekekenworden wat er in het zichtveld van de student ligt. Middels het audiokanaal kan spraak gede-tecteerd worden en via de webcam kan de authenticiteit worden vastgesteld en het zicht wordengevolgd. Al deze detecties methodes vinden geautomatiseerd plaats, net als de fraude detectiein de schermvideo.

2.2.2 Nadelen

Aan het gebruik van de huidige online proctoring applicaties zitten enkele nadelen:

• Uit Brouwer, 2018 blijkt dat de terugkoppeling vanuit ProctorExam te wensen overlaat.Het fraude-rapport blijkt ondoorzichtig te zijn, en het navigeren door de incidenten om-slachtig. Daarnaast vindt de fraude detectie niet automatisch plaats waardoor het eenkostbaar proces is.

• Via de automatische proctoring van ProctorU kunnen niet alle manieren van fraude gede-tecteerd worden doordat de dataset beperkt is tot een webcam- en de schermvideo. Hier-door is bijvoorbeeld mogelijk dat een tweede persoon in de ruimte aanwezig is die antwo-orden op de vragen voor het computerscherm houdt. Dit is niet te detecteren via deschermvideo en ook is niet te detecteren dat de student zijn ogen niet op het scherm heeftgericht.

• De hardware opstelling die gebruikt wordt in Li, 2015 is voor veel studenten niet haalbaar.Ze moeten hiervoor namelijk een EEG sensor en een gaze tracker aanschaffen, die enkelehonderden euro’s kosten. Daarnaast richt het onderzoek zich op een beperkte set van fraudemanieren.

• De hardware opstelling uit Atoum, 2015 lijkt niet voor iedereen toegankelijk. Er moetnamelijk beschikking zijn tot een speciale wearcam.

Daarom wordt voorgesteld onderzoek te doen naar automatische online proctoring met behulpvan een (voor de student) toegankelijke set van hardware componenten. Het onderzoek uit dezescriptie zal zich richten naar een bijbehorend interface.

2.3 Product ontwerp

Omdat mens en machine vooralsnog niet zonder probleem kunnen communiceren worden in-terfaces ontwikkeld. Interfaces dienen als het communicatiemiddel tussen mens en machine.Hierdoor heeft de interface een prominente rol binnen een systeem en daarom een grote invloedop de bruikbaarheid [19] hiervan [12].

De gebruiker staat in de interface centraal [15] en daarom is belangrijk de interface te on-twerpen volgens de wensen van gebruikers. De wensen van gebruikers komen naar voren door

5Een EEG sensor kan hersengolven meten6Een gaze tracker wordt gebruikt om te zien waar de ogen naartoe kijken

12

gesprekken. De wensen kunnen vervolgens door productontwerpers omgezet worden naar eenproduct. Om dit proces te versnellen wordt aangeraden met leadusers te spreken in plaats vanreguliere gebruikers [13]. Leadusers zijn ervaren gebruikers van een product dat soortgelijk isaan het te ontwikkelen product en kunnen daarom meer informatie bieden dan reguliere gebruik-ers. Daarnaast kan er spraken zijn van een product eigenaar. De eisen van de product eigenaarworden door de product ontwerper voorgesteld aan leadusers om hierover feedback te krijgen.Hierdoor kunnen de eisen van de product eigenaar en de wensen van de leaduser in balans wordengebracht.

Er bestaan verschillende manieren om structuur te geven aan gesprekken met potentielegebruikers, die hieronder worden besproken.

Methode van Ulrich

Het extraheren van productwensen uit gesprekken met leadusers kan verlopen volgens een vijf-stappenplan beschreven in Product Design and Development [13]. Door deze stappen te volgenwordt er tevens structuur gegeven aan de productwensen zodat deze efficienter kunnen wordengeımplementeerd. De methode heeft voornamelijk betrekking op het ontwikkelen van productendie nog niet bestaan.

Als de eisen zijn geımplementeerd is het belangrijk om feedback te krijgen vanuit de potentielegebruikers. Hierdoor kan het product waar nodig verbeterd worden.

Think Aloud Protocol

Een veelgebruikte methode om de bruikbaarheid van een product te testen is middels het gebruikvan het Think Aloud Protocol [15]. Bij dit protocol wordt gebruikers gevraagd hardop te denkenterwijl ze een set van taken uitvoeren met het product. Deze uitgesproken gedachtes zeggen vaakmeer over de cognitieve capaciteiten van de gebruiker dan over het product zelf. Daarom is hetde taak aan de product ontwerpen dezee opmerkingen objectief om te zetten om ze zo te kunnenrelateren aan de bruikbaarheid van het product.

Op basis van feedback over de bruikbaarheid kan het product verbeterd worden waardoor dekwaliteit van het product verhoogd wordt.

Reflectie via enquetes

De kwaliteit websites kan worden getoetst aan de hand van enquetes. Het voordeel van enquetesis dat op een eenvoudige manier een groot publiek bereikt kan worden [8].

In de literatuur zijn er verschillende onderzoeken die technieken presenteren voor het afnemenvan online enquetes omtrent de bruikbaarheid van websites, waarvan er drie de volgende zijn:

1. Website Analysis Measurement Inventory (WAMMI) [14]

2. Website User Satisfaction questionnaire (WUS) [18]

3. Website Evaluation Questionnaire (WEQ) [8]

Deze enquetes bestaan allen uit een set van vragen waarmee websites worden geevalueerd aande hand van verschillende componenten.

2.3.1 Front-end ontwerp

Het frond-end ontwerp van een interface is het gedeelte dat zichtbaar is voor de gebruiker. Hetwordt daarom ook wel de userinterface (UI) genoemd. In de UI ontwerp wereld hebben deafgelopen 10 jaar drie grote stromingen plaatsgevonden. Typerend aan deze stromingen is datze ontstaan doordat grote technologiebedrijven bepaalde ontwerp-principes presenteren in hetontwerp van interfaces voor hun producten. Deze bedrijven worden gezien als trendsetters diegevolgd worden door duizenden, die deze principes overnemen bij het ontwerpen van hun eigeninterfaces.

13

Figure 2.2: Het oude uiterlijk van Apple Note

Skeuomorphisme

De eerste grote digitale ontwerpstroming betreft het skeuomoprhisme die zijn bekendheid danktaan Apple. Zij lanceerde met haar iPhone in 2007 een nieuw uiterlijk voor het besturingssysteemiOS. Het interface ontwerp van iOs was opvallend en werd als skeuomorphistisch [21] bestempeld.Hiermee doelde men op het feit dat een digitale omgeving kunstmatige eigenschappen krijgttoebedeeld uit de echte wereld, die geen functionaliteit bieden aan het systeem. Een voorbeeldhiervan is de oude interface van Apple Note (zie figuur 2.2), vormgegeven als een notitieblokzoals men deze kent uit de “echte wereld”. Waar de lijntjes op het papier in de echte wereldeen functie dragen, zijn ze in de digitale wereld overbodig. Deze kunstmatige eigenschappenworden toegevoegd om de mens kennis te laten maken met digitale interfaces en om deze telaten begrijpen op basis van herkenning met producten uit de echte wereld. Het gebruik van hetskeuomorphisme lijkt daarom een logische design aanpak te zijn aan het begin van de digitaalrevolutie.

Tegenwoordig bestaat de gebruiker van de digitale wereld steeds meer uit de zogeheten DigitalNatives [23]: personen die zijn opgegroeid in het digitale tijdperk. Een voorbeeld hiervan is eenzeven-jarig kind dat de smartphone van zijn moeder moeiteloos kan bedienen. De transitie functiedie skeuomorphisme biedt blijkt dus overbodig te worden.

Flat design

Met de lancering van Microsoft’s Metro desigomgeving - vanaf Windows 8 - lanceerde Microsofteen tegengeluid aan het skeuomorphistische interface ontwerp van Apple (zie figuur 2.3). Bij ditnieuwe type ontwerp wordt de digitale wereld omarmt zoals hij is [20]: twee-dimensionaal. Eris bij flat design daarom geen plek voor schaduwen en relief maar wel voor heldere kleuren enduidelijke lettertypes.

De invloed van flat design op de digitale design wereld was zo sterk dat Apple uiteindelijk ookomsloeg. Jarenlang werd Apple’s interface design gekenmerkt door het skeuomorphisme maar in2013 introduceerde zij hun eigen interpretatie van flat design.

14

Figure 2.3: Windows 8 met Metro UI

De kritiek op het flat design luidde dat het ontworpen is voor designers en niet voor gebruikers[20]. Hiermee wordt bedoelt dat flat design in verhouding tot bijvoorbeeld het skeuomorphismeaantrekkelijk wordt gevonden, maar minder gebruiksvriendelijk is. Het is bij flat design interfacesvaak niet meteen duidelijk met welke objecten interactie kan plaatsvinden 7.

Material Design

Material Design werd in 2014 aangekondigd door Google 2.4. Anders dan de eerder genoemdestromingen is Material Design afkomstig van een bedrijf (Google) die deze stroming reguleert.Deze regels beslaan de gehele digitale omgeving 8. Material design heeft veel kenmerken van flatdesign, en wordt daarom ook wel flat design 2.0 genoemd. Ook hier staan heldere kleuren enduidelijke lettertypes centraal, maar in tegenstelling tot flat design wordt bij Material Designgebruik gemaakt van een derde dimensie. Daarnaast ligt de focus van Material Design op re-sponsieve interactie. Een voorbeeld hiervan is bijvoorbeeld een knop die standaard een schaduwheeft zodat het duidelijk is dat hiermee interactie kan plaatsvinden. Wanneer de knop wordtaangeklikt zal de schaduw veranderen waardoor de illusie wordt gewekt dat de knop daadwerke-lijk is ingedrukt. Hiermee adresseert Material Design de tekortkomingen van flat design. Hetwordt daarom steeds vaker gebruikt in UI design.

2.3.2 Back-end

Naast de UI bestaat er ook een back-end waarin onder andere de functionaliteiten van de userinterface worden beschreven. Bij web interfaces wordt er gebruik gemaakt van verschillendeback-end tools.

NginX

NginX is een webserver [24] die gebruikt kan worden als een reverse proxy server voor onderandere HTTP. Het dient hierbij als communicatie tussen de gebruiker en de computer waarop

7Flat UI Elements Attract Less Atftention and Cause Uncertainty: https://www.nngroup.com/articles/flat-ui-less-attention-cause-uncertainty/

8Material Design principes: https://material.io/design/

15

Figure 2.4: Gmail app, ontworpen volgens de Material Design principes

de webserver zich bevindt. NginX werd ontwikkeld door Igor Sysoev met als doel het C10k 9

probleem op te lossen. Bij dit probleem wordt er een oplossing gezocht voor het optimaliserenvan netwerk sockets zodat ze 10.000 connecties tegelijk aankunnen. Dit is een relevant probleemdoordat steeds meer mensen toegang hebben tot het internet en grote websites vaak duizendenconnecties met gebruikers tegelijkertijd hebben lopen. Igor Sysoev biedt met NginX een oplossingvoor het C10k probleem.

NodeJS

NodeJS [26] is een door Ryan Dohl ontwikkelde Javascript omgeving die draait op de serverside,in tegenstelling tot andere Javascript applicaties die draaien op clientside. Hierdoor kan NodeJSlang-draaiende processen ondersteunen waardoor NodeJS zeer geschikt om een webapplicatiesmee op te zetten. NodeJS biedt net als NginX een oplossing voor het C10k probleem.

MongoDB

MongoDB is een in 2009 ontwikkelde database die documenten opslaat in de vorm van BSONobjecten [2]. BSON is een extensie van JSON en ondersteunt datatypes die JSON niet onders-teunt, zoals datums en kan objecten indexeren. Doordat MongoDB BSON objecten gebruikt ishet een flexibele database. Het wordt dan ook gerekend tot de NoSQL databases [10].

9Het C10k probleem wordt beschreven door Dan Kegel op http://www.kegel.com/c10k.html

16

CHAPTER 3

Methodologie

3.1 UvA online proctoring

Het onderzoek uit deze scriptie is onderdeel van een groep waarin onderzoek wordt gedaan naarde automatisering van online proctoring. Om dit proces te kunnen automatiseren maken wegebruik van audiovisuele data. Deze wordt verkregen door middel van een opstelling van driehardware componenten in de vorm van een schermvideo, een webcamvideo en een camera die opafstand wordt gepositioneerd. Via deze drie perspectieven kan een grote set van digitale tentamenfraude worden gedetecteerd. Daarnaast kiezen we voor videobeelden omdat deze lastiger zijn temanipuleren dan bijvoorbeeld logs waarin browser-geschiedenis wordt bij gehouden. De gekozenopstelling is relatief toegankelijk voor gemiddelde studenten omdat het hardware betreft die inhet bezit is van vele jongeren. Laptops hebben namelijk vaak een ingebouwde webcam en debeelden op afstand kunnen via een smartphone opgenomen worden.

Hoewel we uiteindelijk alle manieren van fraude automatisch willen detecteren hebben we onsbij dit onderzoek gefocust op het gebruik van een hardware component, de schermvideo. Hierdoorbeperken we de set van fraude-manieren en daarmee de functionaliteit van het fraude-detectiealgoritme. Hierbij stellen we volgende base case op:

“De student maakt op de campus op zijn eigen computer een tentamen waarbij com-municatie wordt gezien als fraude.”

Het fraude detectie algoritme zal dus voorlopig bestaan uit het herkennen van communicatieaan de hand van de schermvideo. Gebruik van alle websites is toegestaan zolang hier niet viagecommuniceerd wordt. Om het proces te versnellen wordt het algoritme niet uitgevoerd over degehele video maar over een gefilterde versie hiervan. In de gefilterde versie zijn irrelevante framesweggegooid, zoals frames waarin nauwelijks tot geen activiteit plaatsvindt. Tot slot moeten deresultaten van het algoritme gerepresenteerd worden aan de gebruiker (de surveillant) middelseen interface, waar het onderzoek uit deze scriptie zich toe richt (zie figuur 3.1).

3.2 Onderzoeksprotocol

Om een concreter beeld te krijgen van de interface zal eerst worden gesproken met de producteigenaar. Daarna zoeken we contact met leadusers. Dit betreft een groep docenten van deUvA die eerder met online proctoring applicaties hebben gewerkt. In alle gevallen gaat dit omProctorExam.

We delen het onderzoek naar de interface op in drie momenten. Bij elk moment is er contactmet leadusers waarbij steeds een andere methode uit de literatuur wordt gevolgd om data uit deleadusers te krijgen. De momenten bestaan uit:

1. De producteisen opstellen en implementeren

17

Figure 3.1: Verschillende componenten van het online proctoring onderzoek

2. Middels feedback op het ontwikkelde interface het product verbeteren

3. Evaluatie van het eindresultaat

Methode van Ulrich

Volgens de methode beschreven in Ulrich, 2012 [13] wordt het eerst gesprek met leadusers gevoerd.Aan de hand van dit gesprek ontstaan gebruikerswensen die de product ontwerper omzet naareisen voor het product. We kiezen voor de methode van Ulrich omdat deze beschrijft hoe eisenvan een nog niet bestaand product kunnen worden opgesteld. Daarbij hebben we de volgendestappen gevolgd:

1. Gather Raw Data from CustomersHet verzamelen van raw data van gebruikers kan plaatsvinden op drie verschillende manieren:interviews, focus groups en observing the product in use. Ook bestaat de mogelijkheid eenenquete af te nemen, wat echter wordt afgeraden omdat enquetes minder informatievoorzienendzijn. De leadusers is de optie tot een interview of een enquete aangeboden, die beidendezelfde structuur kennen.

2. Interpret Raw Data in Terms of Customer NeedsOp basis van raw data die hieruit volgt kunnen eisen aan het product worden opgesteld.Een probleem hierbij is dat verschillende product ontwerpers de raw data op verschillendemanieren kunnen interpreteren. Daarom is het belangrijk dat er zich meerdere ervarenproduct ontwerpers buigen over het omzetten van de raw data tot eisen.

3. Organize the Needs into a HierarchyDe verschillende eisen moeten worden gecategoriseerd op basis van een hierarchie. Eis Ykan onderdeel worden van eis X omdat ze betrekking hebben op elkaar en eis Y kan wordenafgeleid uit eis X.

4. Establish the relative importance of the needsDe eisen moeten genummerd worden op relevantie. Deze relevantie kan bepaald wordendoor de product ontwerpers of de product eigenaar. Omdat ook hier sprake is van eigeninterpretatie is het gebruikelijk de eisen terug te koppelen aan gebruikers zodat zij derelevantie bepalen.

18

Figure 3.2: Dimensie structuur van de WEQ

5. Reflect on the Results and the ProcessTot slot is het belangrijk te reflecteren op het resultaat en het proces, om eventuele toekom-stige processen beter te laten verlopen. Maar ook om de opgedane kennis in kaart tebrengen.

Nadat de eisen zijn opgesteld worden deze geımplementeerd tot een product. Om hetopgestelde product te verbeteren wordt nogmaals contact gezocht met de gebruikers om zo devoor- en nadelen hiervan in kaart te brengen.

Think Aloud Protocol

De bruikbaarheid van het geımplementeerde interface wordt getest volgens het Think AloudProtocol. De gebruiker wordt onder andere gevraagd door de website te navigeren naar bepaaldeomgevingen en daarbij zijn gedachtes over elke omgeving hardop uit te spreken. Op basis vandeze uitgesproken gedachte zullen verbeteringen aan de interface worden opgesteld die vervolgensworden geımplementeerd. We kiezen voor het Think Aloud Protocol omdat het een simpelprotocol is dat bruikbare informatie oplevert.

Evaluatie van het eindresultaat

Bij het derde moment wordt nogmaals contact gezocht met dezelfde leadusers, ditmaal via eenonline enquete. Deze online enquete wordt opgesteld volgens de WEQ van Elling [8] waarmee debruikbaarheid van zeven verschillende dimensies wordt gemeten. De volledig WEQ meet negendimensies 3.2 maar we kiezen ervoor om “search” en “speed” niet in beschouwing te nemen (zieapendix 6.1 voor de aangepaste versie). De WEQ is namelijk gericht op informatievoorzienendewebsites terwijl de interface voornamelijk een taakgerichte website zal zijn. We denken daaromdat er geen noodzaak is tot de implementatie van een zoek optie. Daarnaast is “speed” nog nietrelevant omdat we de bruikbaarheid testen van een interface dat nog niet in gebruik is. Functiesdie invloed hebben op “speed” zullen nog niet gebruikt worden. De vragen worden beantwoordaan de hand van een vijfpunts-Likertschaal [17].

We kiezen voor deze enquete omdat de resultaten uit het bijbehorende onderzoek veelbelovendzijn. Daarnaast bestaat de WEQ uit relatief weinig vragen waardoor hij gebruiksvriendelijker isdan bijvoorbeeld de WAMMI, die uit 60 vragen bestaat. Dit is onder andere belangrijk omdatde we werken met gebruikers die vrijwillig deelnemen.

3.3 Product implementatie

Het proces van het daadwerkelijke ontwerpen en implementeren van de interface bestaat uit tweedelen:

19

• De front-end

• De back-end

De interface wordt web-gebaseerd, oftewel een website. Hiervoor hebben we gekozen omdatwebinterfaces toegankelijker zijn dan bijvoorbeeld software applicaties, die gebonden zijn aanbesturingssystemen. We focussen in eerste instantie op de front-end van de interface, ook wel deuserinterface (UI) genoemd. Om de UI te ondersteunen met onder andere dynamische inhoudwordt er ook onderzoek gedaan naar een ondersteunend back-end.

3.3.1 Front-end

De front-end betreft alles wat grafisch en visueel is aan de webinterface. Hierbij zullen wegebruik maken van een bestaand front-end design framework zodat er gefocust kan worden op debruikbaarheid van de interface. Het opzetten van een volledige layout is namelijk een traag proces.We maken gebruik van een interface dat ontwikkeld is volgens de Material Design principesframework 1. Hiervoor is gekozen omdat Material Design de aantrekkelijkheid van flat designcombineert met de gebruiksvriendelijkheid van het skeuomorphisme.

Aan dit framework zullen we vervolgens meerdere design-elementen toevoegen ter onderste-uning van de informatierepresentatie. Dit doen we door het toevoegen van jQuery 2 scripts om dewebpagina interactief te maken, middels SASS 3 waarin we opmaak van de interface beschrijvenen via Pug 4 waarin de structuur van de UI wordt gedefinieerd.

3.3.2 Back-end

In de back-end zullen enkele functionaliteiten beschreven worden ter ondersteuning van de front-end van de interface. Omdat het een webinterface betreft wordt een webserver opgezet middelsNginX. NginX verwijst gebruikers van de website door naar de port waarop we een NodeJSwebapplicatie draaien. Hoewel NodeJS zelf ook HTTP kan ondersteunen is ervoor gekozen omNginX als reverse webproxy te gebruiken. NginX heeft namelijk een snellere uitvoering bij hetweergeven van statische content dan NodeJS [4]. Dit zijn bestanden zoals afbeeldingen, video’sen de stylesheet. NodeJS is aan de andere kant sneller als het gaat om dynamische content zoalsbijvoorbeeld gegevens die uit een database worden opgehaald. Door NginX te combineren metNodeJS worden kan geprofiteerd worden van de voordelen van beide applicaties.

Via NodeJS worden er twee verschillende processen gecreeerd. Het eerste proces betreft deeerder benoemde webapplicatie, waarop de visuele kant van de interface draait. Via dit proceskan worden gecommuniceerd met een database. Het tweede proces betreft een script dat hetvideofilter- en het fraude-detectie algoritme aan elkaar koppelt. Een combinatie van databasegegevens en deze algoritmes zorgt ervoor dat er daadwerkelijk incidenten worden aangemerkt opbasis van de schermvideo. Dit gaat als volgt te werk:

In de database staat een student, als onderdeel van een session, met de daarbij horendeschermvideo, in afwachting van het fraude detectie algoritme. Over deze schermvideo wordeneerst frames gefilterd waarna het fraude detectie algoritme wordt uitgevoerd. Het resultaat vandit algoritme zal een lijst zijn met framenummers en een daarbij horend percentage dat de fraudegevoeligheid aanduidt. Aan de hand van deze framenummers knippen we de video op in kleinerestukken. Deze kleinere stukken bestaan uit een video’s beginnend vanaf X seconde voordat eenincident plaatsvindt tot een Y aantal seconde nadat het incident heeft plaatsgevonden. Hierdoorkan de gebruiker een duidelijk beeld krijgen over het desbetreffende incident.

Over de videobeelden kunnen naast het filteren en fraude detecteren ook andere algoritmesworden uitgevoerd. Middels Optical Character Recognition (OCR) [22] en Natural Language Pro-cessing (NLP) [5] zou kunnen gevolgd worden waar student X zich op moment Y mee bezighoudt.Met behulp van deze informatie kunnen we een tijdlijn creeren.

1Material Admin Free: https://www.bootstrapdash.com/product/material-design-template-free/2jQuery: https://jquery.com/3SASS: https://sass-lang.com/4Pug: https://pugjs.org/api/getting-started.html

20

Verder biedt de back-end ondersteuning aan de front-end in de vorm van de stylesheet omdatde SASS files gecompileerd moet worden tot een CSS file. Hetzelfde geldt voor de Pug bestandendie door de NodeJS webapplicatie worden omgezet tot HTML bestanden.

21

22

CHAPTER 4

Resultaat

4.1 Producteisen

Er is in totaal gesproken met een beperkte groep van drie personen, waarvan twee leadusers eneen productowner. Uit de gesprekken met hen en de product eigenaar zijn de volgende eisen aanhet product opgesteld:

• De interface dient eenvoudig te bedienen zijn

– Het moet mogelijk zijn eenvoudig door de schermvideo te navigeren op basis van eentijdlijn

– De informatie moet logisch ingedeeld worden

• De interface dient een optie te hebben voor live online proctoring

– Het moet mogelijk zijn om te kunnen communiceren met de student tijdens het livetentamen

• De interface dient een optie te hebben tot achteraf online proctoring

– De interface dient statistieken van het tijdverbruik van het tentamen weer te geven

– De interface dient statistieken van het tijdverbruik van een student per proctor sessieweer te geven

• De interface dient voor elk fraude geval (incident) de mogelijkheid te bieden aan de ge-bruiker tot het reviewen hiervan.

– Per incident moet aangegeven worden wat de zekerheid is van het fraude detectiealgoritme

De producteisen beslaan niet de gehele interface. Uit de gesprekken komt bijvoorbeeldniet naar voren welke informatie precies moet worden weergegeven naast de fraude inciden-ten. Gekozen is om deze details toe te voegen op basis van de interface uit Brouwer, 2018.Hieraan is informatie aan toegevoegd waarvan we denken dat die relevant is, zoals bijvoorbeeldhet studentnummer en de vakcodes.

Uit de producteisen zijn de volgende componenten opgesteld:

Session

De interface bestaat uit verschillende sessions, waarbij elke session is gelinkt aan een digitaaltentamen. Een session beschikt over een of meerdere studenten en bevat informatie over dedeadline en de duur van het tentamen.

Er zijn twee verschillende session types:

23

• Achteraf: zodra het fraude detectie algoritme de videobeelden heeft geanalyseerd zullendeze bevindingen gerepresenteerd worden in de achteraf-omgeving. Deze bevindingenmoeten per student beoordeelt worden door de gebruikers.

• Live: de live session wordt gebruikt wanneer het tentamen door de studenten op een vasttijdstip moet worden afgenomen. Door gebruik van deze optie ontstaat de mogelijkheidvoor de examinatoren om live mee te kijken met de studenten. Wanneer een live sessionis afgelopen, ontstaat er voor een live session een achteraf-omgeving, waar naderhand alleincidenten bekeken kunnen worden. De live optie valt niet binnen de eerder benoemdebase case omdat erbij wordt uitgegaan van een vast tijdstip. De live optie bleek echter eeninteressante toevoeging waardoor er is gekozen om deze functionaliteit toe te voegen.

Chat

Bij een live session moet de docent de mogelijkheid hebben om te communiceren met de afne-mers van het tentamen, zodat de docent eventuele vragen ter verduidelijking van tentamen kanbeantwoorden. Hiervoor is een chat ontwikkeld binnen de live-omgeving.

Tijdlijn

De videobeelden zijn in eerste instantie net zo lang als dat de student aan het tentamen besteedheeft. Om makkelijk te navigeren door een video van enkele uren is een tijdlijn ontwikkeld.Hierop worden verschillende events van de video chronologisch weergegeven. Wanneer gekliktwordt op een event verschijnt de bijbehorende video. Deze events bestaan uit incidenten dieworden opgemerkt uit het fraude detectie algoritme en andere gebeurtenissen die kunnen wordendoor OCR en NLP toe te passen op de videobeelden. Het automatiseren hiervan is echter niettoegepast omdat de gebruikte schermvideo een dermate lage resolutie had.

Statistieken

Omdat vanuit de events informatie over het tentamen van de student beschikbaar zou kunnenzijn is het ook mogelijk te achterhalen hoelang een student spendeert aan een vraag. Omdatdeze mogelijkheid bestaat is bij de leadusers gepolst hoe zij hier tegenover staan waaruit bleekdat zij dit een interessante toevoeging vinden. De statistieken kunnen weergegeven worden persession, zodat gemiddeldes naar voren komen, of per student, zodat deze statistieken kunnenworden uitgezet tegenover het gemiddelde. Ook uit de statistieken zou fraude kunnen wordenachterhaald wanneer bijvoorbeeld een student een hoog cijfer heeft gehaald maar opvallend snelklaar is.

Uit de combinatie van de producteisen en de functies zijn verschillende omgevingen gemaaktwaarvan de volgende drie de belangrijkste zijn:

• Session overview:

In de sesion overview omgeving staat alle informatie met betrekking tot die session. Zoalsbijvoorbeeld de studenten die hieraan deelnemen, de session gegevens maar ook de statistieken.

• Review student:

In de review omgeving wordt een student weergegeven uit de bijbehorende sessie. Hierbijzal een tijdlijn weergegeven worden met de daarin events. Door het klikken op events kangenavigeerd worden door de schermvideo. Deze omgeving bevat ook statistieken.

• Live session:

In de live omgeving is per sessie live te zien voor welke studenten incidenten optreden. Ookbiedt de live omgeving een chat functie waarbij de studenten met een online surveillantkunnen communiceren.

24

Figure 4.1: Overzicht van een session

Naast deze hoofd-omgevingen zijn er enkele andere omgevingen ontwikkeld ter ondersteuning.Bijvoorbeeld voor het aanmaken van een session, het navigeren door verschillende sessions eneen login- en registreer omgeving.

4.2 Product design

4.2.1 Front-end

Uit de gesprekken waarin het Think Aloud Protocol werd gevolgd twee bleek dat de leadusersover tevreden waren met versie 1, waardoor het verschil tussen versie 2 en versie 1 miniem is. Erwordt daarom enkel het resultaat van versie 2 weergegeven met hierbij telkens de veranderingenten opzichte van versie 1.

De Material Design kenmerken komen terug in bijvoorbeeld de sidebar die een schaduw heeft.Deze sidebar kan worden ingeklapt zodat de rest van de pagina meer ruimte kan innemen. Ookhebben de knoppen animaties wanneer ze worden ingedrukt.

Session overview

In de session overview (figuur 4.1) wordt alle data weergegeven die betrekking heeft tot dedesbetreffende sessie, zoals statistieken omtrent het gemiddelde tijdverbruik, welke studentenhebben deelgenomen aan deze session en andere data over deze session. Door middel van badgeswordt extra belangrijke informatie uitgelicht, zoals de “review status” of het aantal “incidents”.

De deelnemers zijn onder aan de pagina te vinden in een tabel die gesorteerd kan worden.Standaard wordt deze tabel gesorteerd op het aantal incidenten zodat de urgentie tot het reviewenhiervan duidelijk is. De “status” van een rij geeft weer of de gebruiker alle bijbehorende incidentenheeft beoordeelt. Totdat alle incidenten van alle studenten zijn beoordeelt zal de status van desession “Uncompleted” weergeven.

De jQuery effecten zijn terug te vinden in de functionaliteit van de tabel 1 en de tabs waaron-der verschillende statistieken staan.

1DataTable: https://datatables.net/

25

Figure 4.2: Review omgeving voor een student van een session

Verschil met versie 1

In de session overview worden aan de rechterkant de statistieken gerepresenteerd. Uit de gesprekkenbij het tweede moment bleek echter voor een enkele leaduser het niet duidelijk dat er binnen deinterface geen optie was tot het beoordelen van de antwoorden op de vragen. Dit lijkt te wijtenaan het feit dat de statistieken in versie 1 ook betrekking hadden op het aantal behaalde puntenper vraag. In versie 2 is er daarom voor gekozen een duidelijk scheiding hiertussen te makendoor alle informatie die betrekking is op het cijfer van de student te verwijderen.

Student review

In de student review omgeving (figuur 4.2) kunnen de daadwerkelijke incidenten beoordeeltworden. Door de tijdlijn kan middels jQuery genavigeerd worden door de video. Het geselecteerdeevent op de timeline correspondeert met de video die aan de linkerkant wordt weergegeven.Incidenten worden op de tijdlijn weergegeven door middel van een badge, anders dan de normaleevents. Wanneer een incident geselecteerd is verschijnt de grijze box aan de onderkant van detijdlijn. In deze grijze box kan het incident beoordeelt worden en kan er een verklaring hiervoorworden bijgevoegd. Rechtsboven is de optie tot het filteren van de events toegevoegd via jQuery.Tot slot is onder aan de pagina data te vinden over de student en statistieken omtrent hettijdverbruik.

De videospeler biedt de optie tot het afspelen van de video in fullscreen zodat er beter gekekenkan worden naar het event. Daarnaast kan de video ook versneld of vertraagd afgespeeld worden.

26

Figure 4.3: Live session omgeving

Verschil met versie 1

De informatiedichtheid op de tijdlijn bleek te hoog te zijn. Daarom is de optie tot het filterenvan de events op de tijdlijn ontwikkeld, wat in versie 1 dus nog niet mogelijk was. Door detoevoeging hiervan is het mogelijk om slechts de incidenten weer te geven op de tijdlijn waardoorer eenvoudiger genavigeerd kan worden.

Ook bleek uit de het tweede moment van gesprekken dat de optie tot het verklaren van debeoordeling miste. Daarom is de “description” toegevoegd.

Live session

In de live session (figuur 4.3) is gekozen voor een soortgelijke structuur als de tijdlijn van de sessionoverview. Aan de rechterkant zijn de events te zien, met daarin chatberichten en de berichtendie het systeem meld zoals “connection with student X is lost”. Linksboven bevinden zich devideobeelden van studenten die het tentamen afnemen. Over deze beelden moet in real-time eenalgoritme uitgevoerd worden. Daarom is ervoor gekozen om links enkel de studenten weer tegeven waarbij het algoritme fraude detecteert. De surveillant kan dan ingrijpen door middel vaneen chatbericht. Bovenaan de events wordt weergegeven hoeveel studenten er deelnemen aan hettentamen en hoeveel tijd er resteert.

Verschil met versie 1

In versie 1 bestond de optie tot het filteren van de events nog niet. Dit is toegevoegd nadat bleekdat de tijdlijn van de session overview te veel informatie bevatte. Een logische stap was daaromom de events in de live omgeving ook te filteren aangezien de informatiedichtheid zal toenemennaarmate de tijd vordert.

Andere omgevingen

Naast deze hoofd-omgevingen zijn nog een aantal andere omgevingen ontwikkeld ter onders-teuning van de interface, zoals het overzicht van alle sessions in figuur 4.4. In versie 2 zijn“uncompleted sessions” en “completed sessions” in een box weergegeven. Uit de feedback opversie 1 kwam namelijk naar voren dat het verschil tussen een “uncompleted”- en “upcomingsessions” niet duidelijk was. Ook is in versie 2 de knop “create a new session” toegevoegd aan“upcoming sessions” omdat hiernaar behoefte bleek te zijn.

De loginpagina (figuur 4.5) biedt de mogelijkheid de gebruikers in te loggen tot hun account.Zonder inloggen is het niet mogelijk de rest van de interface te bekijken. Ook biedt de loginpaginaeen registratiefunctie.

27

Figure 4.4: Overzicht van alle proctoring sessies

Figure 4.5: Login pagina

28

4.2.2 Back-end

UI web applicatie

Door het gebruik van Pug en SASS is de structuur van de webpagina overzichtelijk een gemakke-lijk aan te passen. We gebruiken een NodeJS web applicatie genaamd Express, die bepaaldeGET- en POST-requests afhandelt. De UI web applicatie is op het internet geplaatst via eendomeinnaam en een gehuurde server, zodat de leadusers op afstand om feedback gevraagd kanworden. Op de gehuurde server is NginX geınstalleerd die de domeinnaam doorverwijst naar hetpoort nummer (8080) waarop de UI web applicatie draait. We maken gebruik van een NodeJSprocess manager (PM2) die ervoor zorgt dat de web applicatie automatisch zal blijven draaien.Hierdoor kunnen we tegelijkertijd andere NodeJS applicaties draaien omdat we applicaties niethoeven af te sluiten voordat we een andere kunnen opstarten.

Fraude detectie applicatie

De fraude detectie applicatie is een NodeJS proces waarbij twee verschillende pythonscripts wor-den aangeroepen. De verschillende pythonscripts bestaan uit respectievelijk het filter van devideo en het daadwerkelijke detecteren van de fraude hieruit. In deze applicatie kunnen de algo-ritmes met elkaar communiceren. Op basis van de output van het filter-algoritme wordt namelijkhet fraude-detectie algoritme aangeroepen. Als resultaat van het fraude-detectie algoritme krij-gen we per frame twee percentages die aangeven hoe groot de kans is dat het frame bij de klasse“geen fraude” of de klasse “wel fraude” hoort. De taak is aan de applicatie om vervolgens viaeen bepaalde drempelwaarde te bepalen wanneer we van een relevant incident spreken.

Over de schermvideo kon geen OCR worden toegepast omdat de resolutie te laag blijkt.Hierdoor konden we ook geen NLP gebruiken. Omdat het filter-algoritme filtert op basis vanverandering van de scene kan de tijdlijn wel worden ingedeeld op de verschillende scenes, alleenis het niet mogelijk via een algoritme te zeggen wat de student precies doet in deze scene.

4.3 Evaluatie van het eindresultaat

De WEQ is ingevuld door respondenten in de vorm van de eerder gesproken leadusers. Aan dehand van de antwoorden hierop is de kwaliteit van de zeven dimensies in kaart gebracht:

1. Relevantie: de relevantie van de interface bleek goed te zijn. De relevantie slaat hier oponder andere de statistieken en andere toegevoegde informatie zoals de studentnummers ofde vakcodes.

2. Comprehensibility: uit de antwoorden op de vragen van deze dimensie wordt aangetoonddat ook de taal en informatie begrijpelijk zijn en een ruime voldoende scoren.

3. Comprehensiveness: uit de antwoorden op de comprehensiveness vragen bleek dat de in-terface op dit vlak niet helemaal voldoet. Er blijkt dat bepaalde informatie mist in deinterface.

4. User friendliness: op gebruiksvriendelijkheid scoort de interface een voldoende.

5. Structure: ook de structuur van de interface bleek voldoende hoewel er wordt aangegevendat het niet altijd duidelijk is in welke omgeving de gebruiker zich precies bevindt.

6. Hyperlinks: de link teksten blijken ook representatief te zijn voor de omgeving waar zenaartoe verwijzen.

7. Layout: op het gebied van design scoort de interface goed. De gebruikers geven aan delayout aantrekkelijk te vinden.

Omdat het hierbij een enquete betreft en geen dialoog kan er niet concreet worden aangegevendoor de gebruikers waarom sommige dimensies lager scoren. Doordat het dankzij de enquete nuduidelijk is welke dimensies goed scoren kunnen eventuele vervolggesprekken gestuurd worden

29

zodat de problemen uit lager beoordeelde dimensies worden toegelicht. Hierdoor zouden devervolg gesprekken gestructureerd kunnen plaatsvinden waardoor de verbeterpunten efficienterbenoemd kunnen worden. Er zou in een vervolggesprek dan niet worden gefocust op bijvoorbeeldde Layout maar op de Comprehensibility of de Structure.

30

CHAPTER 5

Conclusie en Discussie

Er is onderzoek gedaan naar een interface voor automatische online proctoring. Aan de handvan literatuur zijn gesprekken met gebruikers georganiseerd. Op basis van gesprekken met deproduct eigenaar en de eerste gesprekken met leadusers zijn vervolgens productwensen opgesteld.Deze zijn omgezet tot een functionerende interface. Hierbij is veel gebruik gemaakt van eigeninterpretatie.

Deze interpretatie bleek goed te zijn want uit de tweede gesprekken met leadusers bleek dat zijtevreden waren met versie 1. Er bleken echter nog verbeteringen mogelijk te zijn die vervolgensin versie 2 naar voren komen.

Over versie 2 is uiteindelijk feedback gevraagd in de vorm van een aangepaste WEQ. Hieruitbleek dat de interface voldoende scoort maar dat er verbeterpunten zijn omtrent de Comprehen-siveness en de Structure.

5.1 Antwoord op onderzoeksvragen

De vraag hoe een bruikbaar interface ontwikkeld kan worden voor een geautomatiseerde onlineproctoring is beantwoord aan de hand van verschillen deelvragen.

Welke producteisen moet een interface voor geautomatiseerde online proctoring hebben?

We hebben als eerst producteisen opgesteld aan van een methode uit de literatuur. Wehebben hierbij gesproken met leadusers die gebruikerswensen hadden. Deze zijn omgezet tot eeninterface waarin deze worden verwerkt. Omdat deze wensen niet het volledig interface beslaanzijn er veel dingen toegevoegd op basis van ervaring vanuit de product ontwerper.

Hoe kan door middel van feedback op een interface de kwaliteit verbeterd worden?

Aan de hand van de geımplementeerde interface hebben we dezelfde leadusers gevraagd hungedachte hardop uit te spreken bij het uitvoeren van bepaalde taken bij de interface. Hieruitbleek dat er enkele functionaliteiten misten en de structuur verbeterd kon worden.

Wat is de kwaliteit van het verbeterde interface volgens potentile gebruikers?

Op basis van een aangepaste WEQ [8] is getoetst wat de kwaliteit van de interface was binnenzeven verschillende dimensies. Hieruit bleek dat de interface een gemiddeld een voldoende scoortmaar dat er ruimte is voor verbetering binnen de Comprehensiveness en de Structure van deinterface.

Door het gebruik van verschillende methodes is de interface gemaakt waarna de kwaliteit enbruikbaarheid van de interface in kaart zijn gebracht. Hoewel door het volgen van deze methodeser veel informatie over de interface is verzameld dient deze data geınterpreteerd te worden doorde ontwerper. Daarnaast dient de ontwerper dingen toe te voegen die relevant zijn voor hetproduct op basis van eigen ervaring.

31

5.2 Voorgestelde experimenten

5.2.1 Interface toepassen op andere data

De videobeelden die we in dit onderzoek hebben gebruikt zijn schermvideo’s van twee personendie twee verschillende tentamens afleggen. Deze vier schermvideo’s zijn gebruikt om de interfacemee te voorzien van (test)data. Via een experiment kunnen we aantonen dat de interface ookwerkt voor andere schermvideo’s. Deze nieuwe schermvideo’s zullen worden gemaakt aan de handvan het opnemen van meerdere kandidaten terwijl zij een digitaal tentamen afnemen volgens eenbepaald script. Hierdoor kunnen we de gebeurtenissen eenvoudig annoteren. Daarna kunnenwe via de NodeJS applicatie - die de pythonscripts over de video’s runt - kijken of de interfaceook voldoet bij nieuwe data. Hiermee testen we de werking van het filter algoritme, het fraudedetectie algoritme en functie van het de interface hierbij.

5.2.2 Incident definieren

Het fraude detectie algoritme geeft resultaat terug in de vorm van een frame nummer met daar-bij twee percentages. De percentages slaan op de zekerheid waarmee gezegd kan worden of hetframenummer bij de klasse ”geen fraude” en “wel fraude” hoort. Omdat deze percentages nietvan elkaar afhankelijk zijn kan er worden geexperimenteerd naar bij welke percentages we ietsbeschouwen als een fraude gevoelig moment. Bij dit experiment zoeken we de juiste drempel-waarde waaraan beiden klassen moeten voldoen om ze te bestempelen als incident.

5.3 Discussie

5.3.1 Vervolgonderzoek

De testvideos die we hebben gebruikt bij dit odnerzoek betroffen het .mkv formaat. Het prob-leem bij dit formaat is dat het niet door HTML wordt ondersteund. Omdat de interface eenwebapplicatie is zouden de videobeelden van een formaat moeten zijn dat ondersteund wordt inHTML, zoals .mp4.

Hiernaast ontbreken enkele functies die onderdeel van de interface zijn maar vooralnsog nietzijn ontwikkeld. Zoals een applicatie waarmee de student zijn videobeelden verstuurt naar deinterface. Hierin zouden we moeten zorgen dat de videobeelden van een formaat zijn dat doorHTML wordt ondersteunt.

Bij dit onderzoek is alleen gebruik gemaakt van de schermvideo waardoor het aantal fraudemanieren dat gedetecteerd kan worden beperkt is. Door het toevoegen van twee andere hardwarecomponenten in de vorm van een webcam en een camera op afstand kan er in de toekomstmeer audiovisuele data worden verzameld waaruit meerdere manieren van fraude kunnen wordengedetecteerd.

Daarnaast ontbreekt het proces dat moet plaatsvinden wanneer de gebruiker een incident alsfraude markeert. Er zou bijvoorbeeld automatisch een rapport kunnen worden opgemaakt datnaar de examencommissie wordt verstuurd.

5.3.2 Problemen

Tijdens het onderzoek bleek de groep leadusers kleiner dan verwacht. Het aantal leadusers datbereid was mee te werken aan het onderzoek bleek echter nog lager. In een vervolgonderzoekzou met meer leadusers gesproken moeten worden om zo uiteindelijk een grotere groep tevredenkunnen te stellen. Opvallend was dat uit de gesprekken met leadusers functionaliteiten naar vorenkwamen waar in eerste instantie niet bij was stil gestaan, zoals de chatfunctie in de live-omgeving.

32

Bibliography

[1] Yousef Atoum et al. “Automated online exam proctoring”. In: IEEE Transactions on Mul-timedia 19.7 (2017), pp. 1609–1624.

[2] Kyle Banker. MongoDB in action. Manning Publications Co., 2011.

[3] Manuele Bicego et al. “On the use of SIFT features for face authentication”. In: ComputerVision and Pattern Recognition Workshop, 2006. CVPRW’06. Conference on. IEEE. 2006,pp. 35–35.

[4] Ioannis K Chaniotis, Kyriakos-Ioannis D Kyriakou, and Nikolaos D Tselikas. “Is Node. jsa viable option for building modern web applications? A performance evaluation study”.In: Computing 97.10 (2015), pp. 1023–1044.

[5] Gobinda G Chowdhury. “Natural language processing”. In: Annual review of informationscience and technology 37.1 (2003), pp. 51–89.

[6] Navneet Dalal, Bill Triggs, and Cordelia Schmid. “Human detection using oriented his-tograms of flow and appearance”. In: European conference on computer vision. Springer.2006, pp. 428–441.

[7] Andrew T Duchowski. “Eye tracking methodology”. In: Theory and practice 328 (2007).

[8] Sanne Elling, Leo Lentz, and Menno De Jong. “Website evaluation questionnaire: devel-opment of a research-based tool for evaluating informational websites”. In: InternationalConference on Electronic Government. Springer. 2007, pp. 293–304.

[9] Stefaan Van Gerven and Fei Xie. “A comparative study of speech detection methods”. In:Fifth European Conference on Speech Communication and Technology. 1997.

[10] Cornelia Gyorodi et al. “A comparative study: MongoDB vs. MySQL”. In: Engineeringof Modern Electric Systems (EMES), 2015 13th International Conference on. IEEE. 2015,pp. 1–6.

[11] Starr Roxanne Hiltz and Murray Turoff. “Education goes digital: The evolution of onlinelearning and the revolution in higher education”. In: Communications of the ACM 48.10(2005), pp. 59–64.

[12] Monique WM Jaspers et al. “The think aloud method: a guide to user interface design”.In: International journal of medical informatics 73.11-12 (2004), pp. 781–795.

[13] Steven D. Eppinger Karl T. Ulrich. Product Design and Development. McGraw Hill, 2012.

[14] Jurek Kirakowski, Nigel Claridge, and Richard Whitehand. “Human centered measures ofsuccess in web site design”. In: Proceedings of the Fourth Conference on Human Factors &the Web. 1998.

[15] Clayton Lewis and John Rieman. “Task-centered user interface design”. In: A PracticalIntroduction (1993).

[16] Xuanchong Li et al. “Massive open online proctor: Protecting the credibility of MOOCscertificates”. In: Proceedings of the 18th ACM conference on computer supported cooperativework & social computing. ACM. 2015, pp. 1129–1137.

[17] Rensis Likert. “A technique for the measurement of attitudes.” In: Archives of psychology(1932).

33

[18] Steve Muylle, Rudy Moenaert, and Marc Despontin. “The conceptualization and empiri-cal validation of web site user satisfaction”. In: Information & management 41.5 (2004),pp. 543–560.

[19] Jakob Nielsen and Hoa Loranger. Prioritizing web usability. Pearson Education, 2006.

[20] David Oswald and Steffen Kolb. “Flat Design vs. Skeuomorphism–Effects on Learnabilityand Image Attributions in Digital Product Interfaces”. In: DS 78: Proceedings of the 16thInternational conference on Engineering and Product Design Education (E&PDE14), De-sign Education and Human Technology Relations, University of Twente, The Netherlands,04-05.09. 2014. 2014.

[21] Tom Page. “Skeuomorphism or flat design: future directions in mobile device User Interface(UI) design education”. In: International Journal of Mobile Learning and Organisation 8.2(2014), pp. 130–142.

[22] Chirag Patel, Atul Patel, and Dharmendra Patel. “Optical character recognition by opensource OCR tool tesseract: A case study”. In: International Journal of Computer Applica-tions 55.10 (2012).

[23] Marc Prensky. “Digital natives, digital immigrants part 1”. In: On the horizon 9.5 (2001),pp. 1–6.

[24] Will Reese. “Nginx: the high-performance web server and reverse proxy”. In: Linux Journal2008.173 (2008), p. 2.

[25] Lex Sietses. “White Paper Online Proctoring: Questions and answers about remote proc-toring”. In: (2018).

[26] Stefan Tilkov and Steve Vinoski. “Node. js: Using JavaScript to build high-performancenetwork programs”. In: IEEE Internet Computing 14.6 (2010), pp. 80–83.

[27] Jochen Wulf et al. “Massive open online courses”. In: Business & Information SystemsEngineering 6.2 (2014), pp. 111–114.

34

CHAPTER 6

Apendix

6.1 Aangepaste WEQ van Elling

• Relevance

– The information in this website is of little use to me.

– This website offers information that I find useful.

• Comprehensibility

– The language used in this website is easy to me.

– I find the information in this website easy to understand.

– I find many words in this website difficult to understand.

• Comprehensiveness

– Certain information I was looking for was missing in this website.

– The website provides me with sufficient information.

– I find the information in this website precise.

• User friendliness

– I find this website easy to use.

– I consider this website user friendly

• Structure

– I know where to find the information I need on this website.

– I always know where I am on this website.

– I find the structure of this website clear.

– The convenient set-up of the website helps me find the information I am looking for.

• Hyperlinks

– It is clear which hyperlink will lead to the information I am looking for.

– Under the hyperlinks, I found the information I expected to find there.

• Layout

– I think this website looks unattractive

– I like the way this website looks.

– I find the design of this website appealing.

35