ORRNXQLTXHÝ
3.1 Het doel
,QWUR
Om een goede combinatie te maken WXVVHQGDWDYLVXDOLVDWLHHQLQÁXHQFHU
marketing is gekeken naar een drietal aspecten die van toepassing zijn op het uiteindelijke product:
Het doel; waar moet je op letten bij het maken van visualisaties.
Type visualisatie; welke soorten visualisaties zijn er en bij welk doel passen ze.
Frameworks; welke programmeer frameworks kun je gebruiken voor het visualiseren van data.
+HWGRHO
Het doel is de essentie van je visualisatie.
:DDURPLVGHYLVXDOLVDWLHQRGLJ":HON
YHUKDDOPRHWMHYLVXDOLVDWLHYHUWHOOHQ"
1DWKDQ<DX vat het als volgt samen:
“When designing infographics, do
analyze and understand the data.
'RQ·WVDFULÀFHDFFXUDF\FODULW\DQG
ultimately, an interesting story just to make something look unique.”
Dit is iets wat op het moment vaak verloren gaat. Artikelen van 6PDVKLQJ
Magazine & &UD]\(JJ beschrijven de hype van infographics en hoe vaak het doel van een infographic verloren gaat. De focus ligt te veel op het maken van een mooi plaatje voor het oog. Duidelijkheid en helderheid zouden nooit ten koste mogen gaan van de vormgeving. Ze geven echter ook te kennen dat het maken van een datavisualisatie geen eenvoudige klus LVHQMXLVWGHÀMQHOLMQWXVVHQHHQVDDLH
JUDÀHNHQHHQPRRLHLQIRJUDSKLFKHW]R
moeilijk maakt.
7LSV
Gelukkig geeft &UD]\(JJ een aantal
tips voor het maken van een goede visualisatie:
Schetsen; zorg ervoor dat je voor je aan je visualisatie begint, een aantal schetsen maakt om te kijken welke vorm van visualisatie het beste past bij de data die je hebt.
Ken de lijn tussen te saai en te veel poespas; het gaat altijd om het goed visualiseren van data, en niet om het PDNHQYDQHHQFKLTXHSODDWMH
Zorg ervoor dat je de visualisatie niet te minimalistisch maakt en het op een mooi presenteerblaadje DÁHYHUW
Houd het doel van de visualisatie in gedachte.
Houd een lijst bij van wat werkt;
tijdens het maken van visualisaties merk je welke soort data bij welke type visualisatie past. Creëer hiervan je eigen lijst, zodat je iets hebt om op terug te vallen wanneer je iets nieuws probeert.
7\SRJUDÀHLVYRRUGHOXLH
ontwerper; bij het maken van een infographic moet je je data visualiseren, en niet alleen opleuken met een font en een mooi kleurtje.
(HQYHUKDDO
In het boek 9LVXDOL]H7KLVlegt Nathan Yau de waarde van het verhaal achter je data uit:
Data is meer dan een saaie reeks getallen. Elke data-set is een vorm van representatie van het echte leven.
Wanneer je data goed bestudeert en de betekenis achter de getallen duidelijk wordt, zal het verhaal achter de data ook duidelijk worden.
Dit moet ook altijd het uitgangspunt zijn van een visualisatie. Design-elementen moeten altijd in dienst
7\SHYLVXDOLVDWLHV
9LVXDOL]H7KLV geeft een aantal
voorbeelden van betekenissen die achter een datareeks kunnen zitten:
Een patroon over een bepaalde tijd.
Proportionele verschillen.
Relaties tussen de individuele punten.
Om een beeld te krijgen over hoe deze betekenissen zich manifesteren in een YLVXDOLVDWLHKHELNHHQHLJHQÀFWLHYH
datareeks in een aantal visualisaties omgezet. Vervolgens is beschreven
wat voor soort verhaal de visualisaties vertellen.
Uit deze vergelijking blijkt dat de standaard staaf- en balkdiagram heer en meester zijn in het onderling vergelijken van de waarde van datapunten. Taart- en donutdiagrammen zouden gebruikt kunnen worden om data-elementen relatief in beeld te brengen. Zodat je ziet of een bepaalde waarde niet alleen hoog is, maar ook een groot percentage van het geheel is.
)UDPHZRUNV
Je zou het boek 9LVXDOL]H7KLV als een beginners bijbel kunnen zien voor datavisualisatie, want ook over visualisatie frameworks biedt het de de nodige informatie. Het geeft drie opties voor het ontwikkelen van visualisaties op het web, welke hieronder staan beschreven:
)ODVK$FWLRQVFULSW
9RRUÁDVK]LMQHUDOYHHOYLVXDOLVDWLH
libraries ontwikkeld. Het installeren van een framework en het opzetten van een standaard document wijkt af van de meeste programmeertalen.
PHP
Kies je voor PHP, dan ben je afhankelijk van je server. Hier moet HHQJUDÀVFKHHQJLQHRSGUDDLHQ
Deze genereert vanaf de server de visualisaties. Gelukkig zijn de meeste servers voorzien van een dergelijke engine.Het nadeel is dat de server die visualisaties moet uitrekenen,
en dit niet op de computer van de gebruiker gebeurt. Met andere woorden: hoe meer gebruikers hoe trager de applicatie.
+70/&66-DYDVFULSW
Deze type visualisaties zijn de laatste tijd in opkomst. Het loopt nog achter RSÁDVKTXDKHWDDQWDOEHVFKLNEDUH
OLEUDULHVPDDUELHGWÁH[LELOLWHLW
met zowel statische als interactieve visualisaties. Daarnaast draait het in elke moderne browser. Dit is een voordeel ten opzichte van Flash, waarvoor de gebruiker een plug-in geïnstalleerd moet hebben. Ten opzichte van PHP is het voordeel dat de visualisatie op de computer wordt gegenereerd, en niet door de server. Een bijkomend voordeel is dat je extra functionaliteit kan toevoegen door een visualisatie library te combineren met bijvoorbeeld jQuery.
De keuze voor het maken van de visualisatie ging dus vooral tussen Flash en Javascript. Op basis van het bovenstaande koos ik voor de laatste.
Een persoonlijke pré is dat ik javascript in de toekomst vaker zie terugkomen in mijn beroepsveld dan Flash.
&DQYDVYHUVXVHOHPHQWV
Nu de keuze voor javascript is gemaakt, zijn we er nog niet. Hierin bevinden zich namelijk nog twee soorten visualisaties:
Canvas
Elements
Om het verschil hiertussen te verduidelijken kijkt u hiernaast naar de afbeelding. Het verschil is goed zichtbaar. Kies je voor een framework dat de visualisatie op canvas maakt, dan zit je vast aan één object. Kies je voor een library welke losse elementen genereert, dan kan je verschillende elementen
YDQHHQJUDÀHNQRJORVDDQURHSHQ
Om interactie mogelijk te maken is hier gekozen voor de optie met losse elementen.