Product Biografie

Algemene informatie

Gebruik per activiteit (WG en zelfstandig) de volgende opzet:

Introductie: vraag en doel

Onderzoeksmethode; waarom?

Onderzoek; hoe heb je het aangepakt inclusief verzameld materiaal: video, fotoverslag, artefacten, notities, schetsen, modellen, diagrammen, etc.

Analyse/Inzichten

Resultaat; Is het doel bereikt en je vraag beantwoord?

Week 1 (wo 6 febr. 2018)

Werkgroep 1

  • Introductie Visual Research

  • Design brief: 'Target Tracking Snakes'

  • Citizen Science

  • Identity Memo

Voorbereiden voor de volgende les

  • Maak een online Product Biografie aan en stuur de url naar docent

  • Literatuuronderzoek over Citizen Science

  • Uitbreiden Persona

  • Moodboard

  • "Predator in the city"

Designer/Research Identity Memo

Wat zijn jouw eerste gedachten rondom "citizen science"?

  • Positieve en negatieve gedachten

  • Vooroordelen? Aannames?

  • Vragen rondom dit onderwerp

  • Meta- en detailniveau

Maak mindmap/sketchnotes over "citizen science".

Ophangen mindmaps en in de pauze bekijken.

Foto's maken en plaats op Product Biografie.

Opdracht 1: Literatuuronderzoek

Bron 1: TU Delft: Wat is Citizen Science?

Wie is de auteur?

Technische Universiteit Delft

Behoort zij/hij tot een bepaalde denktrant?

Ja het is een universiteit en als universiteit ben je altijd samen met onderzoekers, studenten en bedrijven bezig met het onderzoeken van verschillende thema's/onderwerpen. Een universiteit is een plek waar kennis wordt vergaard, geleerd en gedeeld.

Waarom schrijft zij/hij dit?

TU Delft geeft in deze bron informatie over wat Citizen Scince inhoudt en wat onderzoekers er aan hebben in opdracht van een water onderzoek van WaterLab.

Wat voor type bron is dit?

Het is een online bron met tekst en een uitlegvideo op de officiële website van de TU Delft. Op de pagina staat ook een link naar de "ten principles of citizen science".https://ecsa.citizen-science.net/sites/default/files/ecsa_ten_principles_of_citizen_science.pdf

Bron 2: TEDxGreensboro Citizen Science: Everybody Counts, Caren Cooper https://www.youtube.com/watch?v=G7cQHSqfSzI

Doelgroep: Studenten en burgers.

Wie is de auteur?

Caren Cooper (TEDxGreensboro)

Behoort zij/hij tot een bepaalde denktrant?

TED is een platform waar mensen van allerlei velden hun verhaal kwijt kunnen aan de wereld. TED is een non-profit organisatie die als doel heeft mensen te informeren over een groot aantal verschillende onderwerpen. De vertellers zijn meestal mensen uit het werkveld, onderzoekers, wetenschappers, amateurs etc.

Waarom schrijft zij/hij dit?

Om mensen te informeren dat je zelf ook een wetenschapper kan worden door middel van Citizen Science. Omdat wetenschap ook als een hobby wordt gezien.

Wat voor type bron is dit?

Het is een video van TEDx Talks op youtube.

Doelgroep: geïnteresseerde personen in het onderwerp van middelbare leeftijd, studenten.

Opdracht 1.2: Inzichten map

Inzichten map

Opdracht 1.3: Persona

Opdracht 1.4: Moodboard

Moodboard

Opdracht 1.5: Predator in the city

Zwaan grasveld bij een parkeerplaats in de avond
Kraai grasveld bij een fietspad in de ochtend
Kraai grasveld in de ochtend
Eend bij rand van sloot in de ochtend
? op looppad in de ochtend

Week 2 (wo 13 febr. 2019)

  • Lezing door dr. Henry Astley via Skype

  • Verzamelen

Voorbereiden voor de volgende les

  • Debriefing

  • Programma van Eisen

  • Keuze voor een visual methode

  • Verzamelen

  • Plaats alle opdrachten op je Product Biografie

Aantekening lezing dr. Henry Astley

onderzoeker en voornamelijk in slangen, het onderzoeken van snakelocomotion (slangenbeweging en slangenpatronen).

er lijkt een samenhang te zijn met de patronen en de levensstijl en beweging van de slagen. Bij gestreepte slangen is het lastig om ze te vangen in het wild omdat ze snel bewegen in vegetatie en eigenlijk geen patronen hebben waardoor ze niet opvallen.

concept voor spel: snelle slagen met strepen testen op snelheid en simpele achtergronden (laat de gebruiker de slang vastpakken), langzame en gecamoufleerde slangen testen op zichtbaarheid met drukke achtergrond (gebruikers moeten kijken of ze de slang kunnen zien)

Aan de hand van de data van de gebruikers vergelijken hoe de scores zijn bij de verschillende slangen.

achtergrond: bos wallpaper,

Slangen hebben een pad die ze volgen op hun patroon alles is dus op elkaar aangesloten.

voorbeelden: temple run, ant snatcher.

Opdracht 2: Verzamelen

Hoe zetten dingen/materiaal aan tot emotie, gedrag of herinneren?

Die betrouwbaarheid uitstralen

Die je wilt delen

Waar je wel eens tegen praat

Die je welkom heten

Die je helpen om mee te doen

Die je begroeten

Die je verdrietig/vrolijk maken

Waar je je wel eens op hebt afgereageerd

Waar je liever niet naar kijkt

Opdracht 2.1: Keuze Visual method

Mijn keuze voor visual method/ tools en bronnen worden hieronder aangegeven. De reden voor mijn keus is gebaseerd op waar ik zelf het meest ervaring mee heb en waar ik zeker van weet dat ik de resultaten kan krijgen waar ik naar opzoek ben.

Visuele methodes/tools:

  • Observeren

  • Fotograferen

  • Schetsen

  • Metaforen inzetten

Visuele bronnen:

  • Foto's

  • Materiaal

  • Beeldende kunst

  • Natuur

Opdracht 2.2: Debriefing

Dr. Henry Astley is een onderzoeker/wetenschapper die zich bezig houdt met het onderzoeken van de beweging en patronen van bepaalde slang soorten(snakelocomotion). Door middel van het onderzoek probeert dr. Henry Astley een logisch en direct verband te vinden tussen de beweging van slagen en hun patronen en levensstijl van de slangen en of de patronen iets kunnen vertellen over het soort slang (giftig of wurgslang). Hij wilt uiteindelijk ook de functie van de verschillende patronen in kaart brengen en beschrijven wat voor invloed de beweging en de patronen van bepaalde slangen hebben op prooien, mensen, omgeving en andere slangen.

Volgens Dr. Henry Astley is namelijk al het onderzoek wat gebaseerd is op dit onderwerp gericht op overeenkomsten en patronen van de slangen en niet gericht op de oorzaak. Zoals hij zelf zei corelation is not causation. Om Dr. Henry Astley te helpen bij dit onderzoek is aan ons gevraagd om doodmiddel van een game app te mappen hoe mensen deze patronen en bewegingen van de slangen waarnemen. Om vervolgens de verzamelde data te kunnen gebruiken voor zijn onderzoek.

De app zal dus gericht zijn op de waarnemingen van mensen zowel mannen als vrouwen van verschillende leeftijdscategorieën. De app moet in de vorm van een speel gebruikt kunnen worden waarin de bewegingen, patronen en habitat van de verschillende slangen centraal staan.

Samenvatting:

  • Game app ontwerpen

  • Data verzamelen van scores

  • Scores vergelijken

  • Waarneming deelnemers testen

  • Snelheid en camouflage testen

  • App zowel voor mannen als vrouwen van verschillende leeftijdscategorieën

Opdracht 2.3: Programma van eisen

1.Vijf belangrijkste schermen incl. introductie van de app

2. gebruikersdata: leeftijd, man/vrouw en beroep

3. Statische versus bewegende patronen met verschillende achtergronden

4. Beweging van slangen patronen:

a. Hoeveelheid vervaging

b. Soorten vormen: vierkant, cirkel, rechthoek liggend

c. Hoeveelheid vormen

5. Achtergronden:

a. Minimaal drie: Natuur, stad, abstract

b. Dag en Nacht

c. Hoog contrast en bijna geen contrast in kleur

6. Verschillende hoeveelheden patronen op één scherm: 2, 4, 8, 16

7. Verschillende snelheden: 15 km per uur?

8. Basiskleuren 11: zwart, wit, grijs, bruin, blauw, groen, rood, geel, roze, paars en oranje.

9. Basisvormen 3: vierkant, cirkel, rechthoek liggend

10. Basispatronen 9: stippen positief en negatief, strepen verticaal en horizontaal, vlekken.

Introductie en doel:

Het doel is om data te verzamelen van hoe mensen de patronen van slangen herkennen/zien zowel in beweging als op statische beelden. Deze data wordt verzameld aan de hand van een interactieve game app in opdracht van onderzoekr en wetenschapper: Dr. Henry Astely.

Voor wie is het?

De app zal voor het vermaak gemaakt worden van zowel mannen als vrouwen van verschillende leeftijdscategorieën dit is dus een brede doelgroep.

Hoe en wat?

Een interactief prototype (vijf belangrijkste schermen en introductie app) van een game app ontwerpen aan de hand van een aantal regels waaronder: statische en bewegende beelden, verschillende achtergronden, verschillende patronen, verschillende vormen, dacht en nacht, verschillende kleuren en verschil in het contrast. De exacte benodigdheden staan in de hierboven genoemde punten vermeld.

Waarom?

  • Data verzamelen

  • Data vergelijken

  • Bijdragen aan Citizen Science

  • Dr. Henry Astley ondersteunen bij zijn onderzoek

  • Waarneming van mensen op slangen beweging en patronen in kaart brengen.

Week 3 (wo 27 febr. 2019)

Werkgroep 3 Mapping

Visual analyses

Beeld/Foto's

  • Texture analyses

  • Gestalt principles

  • Kijkrichting

Voorbereiden voor de eerste feedback ronde

  • Schetsen

  • Concepten

  • Visual analyses

  • Styleguide op basis van moodboard

  • Eigen methode uitvoeren

  • Plaats alle opdrachten op je Product Biografie

Opdracht 3: Ordenen, categoriseren en selecteren

Verpakkingen van snoep en snacks hebben bijna altijd een kleurvolle verpakking.

Veel deurmatten hebben en patroon.

Afbeeldingen, foto's en viuals worden bijna altijd in een hoekige vorm getoond.

Introductiescherm: Orden beelden op sterkte

Die je welkom heten: Deurmat

Die je helpen om mee te doen: Game

Die je begroeten: Een verjaardagskaart

Opdracht 3.1: Mapping

Formeel criterium

  • Hoekig: Telefoon, deurhendel, deurmat, verjaardagskaart, dvd's, laptop, zak, platen, agenda, laptop.

  • Rond: Hond, snoepjes, deurslot, game controller, magnetron plaat.

  • Groot: Oven, kast.

Kwalitatief criterium

  • Kostbaar: Telefoon, hond, ps3, laptop, platen, oven.

  • Nuttig: E.dentifier, telefoon, laptop, bokshandschoenen.

  • Ouderwets: Snoepjes, deurhendel, deurmat, verjaardagskaart, ps3, popcorn, platen, agenda.

Poëtisch criterium

  • Tevreden: Hond, snopejes, deurmat, ps3, dvd's, popcorn, platen.

  • Achterbaks: Snoepjes, popcorn.

Opdracht 3.2: Concept

Het concept voor de game app is een interactieve spel waarbij de speler zoveel mogelijk opdrachten goed moet uitvoeren binnen een bepaalde tijd. Hoe meer goede keuzes hoe hoger de score en hoe hoger de score des te meer kans om naar een nieuw, moeilijker level te kunnen.

De basis van de game zal bestaan uit een mix van statische beelden en bewegende beelden. De statische beelden zullen bestaan uit een slang en een achtergrond die bijna niet van elkaar te onderscheiden zijn. Het is aan de speler om de slang in het plaatje te herkennen of een gedeelte van de slang. De bewegende beelden bestaan uit slangen die van onder het scherm snel naar boven bewegen. het is aan de speler om op deze slangen te drukken voordat ze uit het scherm verdwijnen.

De vormgeving en de beelden van de app zullen minimalistisch zijn en zeer functioneel. Zodat de aandacht van de gebruiker volledig gefocust wordt op de opdrachten binnen het spel.

Opdracht 3.3: Schetsen

Welkomsherm
Welkomscherm
Statisch beeld game
Bewegend beeld game

Opdracht 3.3: Feedback gesprek wo 6 maart

  • Duidelijk maken aan de gebruiker hoe die de app moet gebruiken (introductie scherm).

  • XD als programma gebruiken voor de prototype.

  • Kijkrichting bepalen voor prototype.

Opdracht 3.4: Visual analyses achtergrond

Achtergrond 1

Natuur, dag
  • kleur: Bruin, donkerbruin, zwart en grijs.

  • contrast: Hoog contrast maar wel dezelfde kleuren.

  • saillantie: Een achtergrond die overeenkomt met de habitat van sommige slangen. Een slang zou in een achtergrond als deze niet zo goed opvallen.

Achtergrond 2

Stad, dag
  • kleur: Grijs, donkergrijs, lichtgrijs, zwart.

  • contrast: Hoog contrast mede door de lichte en donkere kleuren combinatie.

  • saillantie: De omgeving is van een stad maar heeft daar aan tegen wel vloeiende en organische vormen. De achtergrond lijkt al op een groep slangen die over de stoep bewegen.

Achtergrond 3

Stad, dag
  • kleur: Groen, zand, bruin, creme.

  • contrast: Hoog contrast mede door het groene gras, deze komt naar voren door de natuurlijke en zachte kleuren van de stenen.

  • saillantie: Dit achtegrond is een soort mix van stad en natuur hte is duidelijk ontworpen door mensen maar door het gras zit er ook een beetje natuur in.

Opdracht 3.5: Styleguide

Styleguide Citizen Science
Styleguide

Week 4 (wo 6 mrt. 2019)

Opdracht 4: Testplan Eyetracking met Kijkrichting

Kijkrichting startscherm
Kijkrichting welkomscherm
Kijkrichting level scherm

Taak 1: Start de game.

Taak 2: Ga naar level 2.

Taak 3: Ga terug naar het welkom scherm.

Opdracht 4.1: Prototype 0.8

Developer
Snake brake prototype 0.8
Snake brake

Week 5 (wo 13 mrt. 2019)

Voorbereiden voor de laatste feedback gesprekken

Opdracht 5: Analyse van de Eye tracking test

Testpersoon 1

eyetracking test video testpersoon 1

Gazeplot

Gazeplot.1

Scherm 1 gazeplot, kijkduur: 3,6 sec. plots: 9

Gazeplot.2

Scherm 2 gazeplot, kijkduur: 5,4 sec. plots: 10

Gazeplot.3

Scherm 3 gazeplot, kijkduur: 3,9 sec. plots: 14

Gazeplot.4

Scherm 4 gazeplot, kijkduur: 2 sec. plots: 4

Gazeplot.5

Scherm 5 gazeplot, kijkduur: 2,9 sec. plots: 7

Gazeplot.6

Scherm 6 gazeplot, kijkduur: 0.9 sec. plots: 3

Gazeplot.7

Scherm 7 gazeplot, kijkduur: 2,5 sec. plots: 8

Gazeplot.8

Scherm 8 gazeplot, kijkduur: 1,4 sec. plots: 1

Heatmap

Heatmap.1

Scherm 1 heatmap, count: 1, kijkrichting: midden rechts naar beneden

Heatmap.2

Scherm 2 heatmap, count: 1.76, kijkrichting: boven naar beneden

Heatmap.3

Scherm 3 heatmap, count: 1, kijkrichting: boven naar beneden

Heatmap.4

Scherm 4 heatmap, count: 1, kijkrichting: midden

Heatmap.5

Scherm 5 heatmap, count: 1, kijkrichting: midden naar beneden

Heatmap.6

Scherm 6 heatmap, count: 1, kijkrichting: midden

Heatmap.7

Scherm 7 heatmap, count: 1,12, kijkrichting: midden

Heatmap.8

Scherm 8 heatmap, count: 1, kijkrichting: midden

Cluster

Cluster.1

Analyse van de Eye tracking test 1

  • Bestudeer de dataflows en datapoints door letterlijk te beschrijven: de gebruiker kijkt naar [onderdeel scherm] voor [tijd]. Neem ook mee waar de gebruiker niet naar kijkt.

  • Wat valt op? Interessante dingen en problemen.

  • Vergelijk de dataflows en datapoints met je Kijkrichting, beschrijf overeenkomsten en verschillen.

  • Verbeter de schermen.

Testpersoon 2

eyetracking test testpersoon 2

Gazeplot

Gazeplot.1

Scherm 1 gazeplot, kijkduur: 7,1 sec. plots: 6

Gazeplot.2

Scherm 2 gazeplot, kijkduur: 4 sec. plots: 11

Gazeplot.3

Scherm 3 gazeplot, kijkduur: 2 sec. plots: 4

Gazeplot.4

Scherm 4 gazeplot, kijkduur: 9 sec. plots: 2

Gazeplot.5

Scherm 5 gazeplot, kijkduur: 4,3 sec. plots: 7

Gazeplot.6

Scherm 6 gazeplot, kijkduur: 1,7 sec. plots: 4

Gazeplot.7

Scherm 7 gazeplot, kijkduur: 2,6 sec. plots: 8

Gazeplot.8

Scherm 8 gazeplot, kijkduur: 2,1 sec. plots: 6

Heatmap

Heatmap.1

Scherm 1 heatmap, count: 1, kijkrichting: links beneden in een boog naar het midden

Heatmap.2

Scherm 2 heatmap, count: 1, kijkrichting: boven in het midden en beneden bij de button

Heatmap.3

Scherm 3 heatmap, count: 1, kijkrichting: van het midden naar boven

Heatmap.4

Scherm 4 heatmap, count: 1, kijkrichting: alleen in het midden

Heatmap.5

Scherm 5 heatmap, count: 1, kijkrichting: alleen in het midden

Heatmap.6

Scherm 6 heatmap, count: 1, kijkrichting: in het midden en bij de titel

Heatmap.7

Scherm 7 heatmap, count: 1, kijkrichting: midden

Heatmap.8

Scherm 8 heatmap, count: 1, kijkrichting: links beneden richting het midden van het scherm

Analyse Eyetracking test

De testpersonen werd gevraagd de drie taken uit tevoren zoals aangegeven voor dat de eyetracking test gestart werd. De drie opdrachten waren als volgt: Start de game, probeer level 2 te halen en ga terug naar het welkom scherm. Aan de hand van deze opdrachten konden de testpersonen met de test beginnen. De testpersonen hadden zelf de vrijheid om door het prototype heen te gaan zoals zij dit prefereerde terwijl de eyetracking test gestart werd. De eyetracking test heeft ongeveer 4 minuten per test geduurd. Hieronder per scherm beschreven hoe lang de testpersonen naar het scherm keken per scherm en welke kijkrichting dominant was.

De testpersonen keken voornamelijk in de kijkrichtingen die ik voorspeld had voor de test. Hier en daar is wel een afwijking maar niet zodanig dat het ontwerp van het scherm volledig veranderd moet worden. Het valt op dat de testpersoon niet langer dan gemiddeld 2,5 secondes naar elk scherm kijkt. De plekken op de schermen die het minst worden bekeken zijn de uiterste hoeken, wat vrij logisch is want hier zijn geen visuele elementen die de aandacht trekken.

De overeenkomsten met de kijkrichting voorspelling komen zeer overeen, wel zijn er bepaalde zaken die opvielen zoals het feit dat de eerste testpersoon niet lang naar de “start game” button keek terwijl de tweede testpersoon hier wel aanzienlijk langer naar keek. De button is wel volgens veel gebruikte en voorkomende design patterns ontworpen, dus deze blijft zo als die is. Voor de rest van de schermen valt niet heel veel te veranderen hooguit een aantal details. Kortom de gebruikers konden de opdrachten foutloos uitvoeren en zijn correct door alle schermen gegaan. In dit opzicht was het een succesvolle test.

Opdracht 5.1 Aanpassingen prototype n.a.v. test

Aan de hand van de eyetracking test resultaten zijn er een aantal dingen veranderd aan het ontwerp van het prototype. Zo zijn er een aantal schermen bijgekomen en is er rekening gehouden met waar de focus lag van de resultaten uit de eyetracking test. Zo is ervoor gekozen om het font van de headers wat kleiner te maken om meer rust te creëren in het ontwerp.

De start en het beginschermen zijn er bij gekomen. Deze leiden de gebruiker door de app heen en informeren daarnaast over wat Citizen science inhoudt en waar ze voor staan. Het prototype is ook uitgebreid in de levels, er zijn nu namelijk twee nieuwe levels bijgekomen.

Wat ook opviel aan de testresultaten was dat er soms nog lang naar een scherm werd gekeken terwijl de handeling al gedaan was. Hier heb ik tussen de levels door een scherm voor ontworpen die de gebruiker feliciteert met zijn/haar prestaties en het is tegelijkertijd een introductie scherm naar de volgende level. Kortom er is veel veranderd en er zijn nieuwe schermen toegevoegd, maar het hoofdconcept is nog steeds intact.

Nieuw level
Nieuw level
Tussenscherm

Opdracht 5.2: Gestalt analyse

Nabijheid

In het ontwerp van de registratie (account) scherm van de app heb ik gebruik gemaakt van het gestalt principe van nabijheid. Oftewel dingen die zich dicht bij elkaar bevinden worden door de kijker (gebruiker) als groep gezien. Ik heb dit principe toegepast in de invulvelden van het registratie scherm. De gebruiker moet namelijk drie velden invullen. In de invulvelden wordt gevraagd naar leedtijd, geslacht en beroep, omdat dit allemaal met elkaar te maken heeft liggen de velden dicht onder elkaar en vormen samen eigenlijk één visuele blok. Op deze manier is het voor de gebruiker duidelijk dat deze velden bij elkaar horen en dus ook contextueel met elkaar te maken hebben. Namelijk het invoeren van je gegevens om je te kunnen registreren.

Registratie scherm

Gelijkheid

Gelijkheid is een erg belangrijk principe die in meerdere vormen terugkomt in de verschillende schermen van het prototype. Gelijkheid is te zien in bijvoorbeeld dezelfde soort terugkomende button. Maar ook in kleurgebruik en de grootte en type van het gebruikte font. Alle koppen zijn dik gedrukt en alle sub-koppen zijn veel kleiner qua formaat.

Er is dus per element duidelijke gelijkheid zichtbaar. Dit zorgt voor duidelijkheid bij de gebruiker en is daarnaast consistent voor de rest van het ontwerp. Wat weer bijdraagt aan de uitstraling en betrouwbaarheid van de app. Aangezien de app is ontworpen voor een hoogopgeleide doelgroep, die graag bijdraagt aan de wetenschap is betrouwbaarheid een erg belangrijk factor.

Disclaimer

Voortzetting

Dingen die in een doorgaande lijn of kromming zijn geplaatst, worden door onze waarneming gegroepeerd.

Voortzetting komt ook voor in de ontwerpen, zo heb je de bovenste header die telkens terugkomt op dezelfde plek. Zo lijkt het net of dit statisch is en niet per scherm veranderd. De vorm en kijkrichting van de gebruiker en de hiërarchie van de verschillende schermen wordt op deze manier voortgezet. Het begin scherm van de app is zo vorm gegeven dat de tekst, afbeelding en logo in één duidelijk doorgaande lijn gevolgd kunnen worden door de ogen van de gebruiker. Dit scheelt tijd met het verwerken van de informatie. Hierdoor kan het scherm ook weer sneller uit beeld en is de gebruiker sneller door het start scherm heen.

Startscherm

Week 6 (wo 20 mrt. 2019)

Opdracht 6: Prototype 1.0

Snake Brake prototype 1.0

Einde productbiografie

Last updated

Was this helpful?