Natuurlijke datapatronenOnderzoek naar een natuurlijk systeem voor datavisualisatie

door het schrijven van software

2

3

Natuurlijke datapatronenOnderzoek naar een natuurlijk systeem voor datavisualisatie

door het schrijven van software

Auteur:T. van Bree

Begeleiders:J.M. EerensJ.H.R.A MeijersJ.H.P Slager

Communication and Multimedia Design Deurne, 2012

4

VOORWOORD

Deze rapportage is onderdeel van mijn afstudeerproces van de opleiding Communication & Multimedia Design. Na het verdiepingsprofiel ‘Creative Technology’ gevolgd te hebben in het derde jaar van CMD ben ik gefascineerd geraakt door programmeren. Ik vind het heel interessant om uit mijn geschreven code (visuele) output te zien ontstaan. Ook spreekt het me erg aan om programmeren in te zetten in het ontwerpproces, om op die manier in plaats van een product juist het proces te ontwerpen.

In het begin van het vierde jaar heb ik gekozen voor de minor ‘Visualizing information’. Hiervoor heb ik verschillende datavisualisaties gemaakt, en vooral het inzichtelijk maken van complexe informatie of grote datasets sprak me erg aan. Ik wil hier graag nog mee verder gaan en daarom ga ik na mijn afstudeerproject de master ‘Information Design’ aan de Design Academy volgen, waarvoor ik in April ben aangenomen na een toelating.

Voor mijn afstudeerproject vond ik het erg belangrijk om totale vrijheid te hebben, om iets te gaan maken wat echt perfect aansloot bij mijn interesses. Daarom heb ik ervoor gekozen om software schrijven en datavisualisatie te combineren.

In andere ontwerpdisciplines wordt de natuur vaak als inspiratiebron gebruikt, maar in het recentelijk opkomende gebied van datavisualisatie is hier nog weinig mee gedaan. In het geval van software schrijven is het simuleren van natuur wel een vaker voorkomend

verschijnsel. Het is een uitdaging om organisch gedrag en de bijbehorende willekeurigheid met de computer te simuleren, maar aan de andere kant is de computer hier door het enorme rekenvermogen heel geschikt voor. De kracht van computers zit in het herhalen van processen, en juist ook in de natuur komt een specifieke vorm van herhaling, gelijkvormigheid, veel voor.

Omdat het gebied van datavisualisatie nog volop aan het ontwikkelen is bestaat de behoefte naar nieuwe manieren van visualisatie. Daarom leek het mij erg interessant om een onderzoek te doen naar een natuurlijk systeem voor datavisualisatie, door een natuurlijk proces te vertalen naar computer code en dit te laten beïnvloeden door een dataset.

Dit afstudeerproject is gericht op informatievormgevers, van wie ik hoop interesse te wekken met deze manier van datavisualisatie. Het is bedoeld als een opzet waar andere geïnteresseerden mee verder kunnen gaan; qua theorie, inspiratie of code.

Dan wil ik nu graag nog een aantal mensen bedanken voor hun bijdrage aan mijn afstudeerproces. Informatievormgever Jan Willem Tulp, voor zijn regelmatige inhoudelijke feedback en voor het schrijven van een evaluatie die in deze rapportage is opgenomen. Mijn afstudeerbegeleiders, Thijs Eerens, Jos Meijers en Johan Slager voor de begeleiding van mijn afstudeerproces. En klasgenoten, familie en vrienden voor het geven van steun en feedback.

5

SUMMARY

With the amount of online data doubling almost every two years, the recently emerged field of datavisualization became an important new design principle. But this field is still developing and it lacks a fundament of theory and taxonomy. Also, there is a need for new ways of making enormous datasets or complex information comprehendible.

The focus of this research is on developing a new method for visualizing data, by using inspiration from nature. A biological theory was translated into a set of rules for computer code, and this formed the base of a natural system. The simulated natural phenomenon of leaf venation was chosen, because of the possibilities with different vein-patterns. But also by anticipating the natural ability of the human visual system to see patterns. By simulating a natural process with written software, a complex system emerged. Influencing this system with data led to interesting visualisations.

The research contains a lot of information on three topics: datavisualization, software writing and simulation of natural processes. The information is then put into practice and the complete design process with corresponding design choices and improvements is described.

This results in a strong way of visualisation when used in combination with certain suitable datasets. For instance data that shows some kind of growth. Or data about a certain subject, that when combined with this form of visualization, has a metaphorical value. This method of visualization isn’t functional to show the exact values of the dataset. Instead the goal of the visualisation is to provide a representation, where the viewer can spot differences and similarities, and make general conclusions.

6

//TheorieInleiding

1. Datavisualisatie Waarom datavisualisatie?

Indeling van data Indeling van grafische elementen

Taxonomie Techniek

2. Software schrijven Waarom code?

Generatieve systemen

3. Simulatie van natuurlijke processen Simulatie van natuur met code

Modellen van computation voor natuursimulatie

//Praktijk4. Natuursysteem voor datavisualisatie

Ontwerpproces natuursimulatie Ontwerpproces datavisualisatie

Bevindingen Verbeteringen

//ReflectieConclusie

Aanbevelingen

Literatuurlijst

BijlagenEnquete

Visuele index

7

111214151617

192021

232425

2930364345

4749

51

5556

63

7

INLEIDING

Dit zijn slechts enkele voorbeelden die illustreren waarom er behoefte is aan datavisualisatie, ook wel informatievisualisatie of informatie ontwerp genoemd. Dit recentelijk opkomend ontwerp discipline heeft als doel het weergeven van kwalitatieve en kwantitatieve informatie, zodat de kijker patronen, trends, consistentie of variatie en uitschieters kan zien, op manieren die andere vormen zoals teksten en tabellen niet toelaten. De enorme hoeveelheid aan data blijft alleen maar toenemen, en verdubbeld zelfs elke twee jaar. Daarom is er behoefte aan nieuwe manieren van visualisatie, om inzicht in deze complexiteit te creëren.

Een ander belangrijk en ook recentelijk aan populairiteit winnend verschijnsel is het software schrijven. Door te leren programmeren sta je los van de beperkingen van bestaande programma’s, en creëer je mogelijkheden voor het maken van je eigen tools, maar ook systemen, omgevingen, of andere mogelijkheden van uitdrukking. Deze manier van werken heeft veel voordelen en kan ook ingezet worden voor het ontwerpen van datavisualisatie.

Het gebruik van natuurlijke verschijnselen als inspiratiebron wordt al tijden in verschillende ontwerp disciplines toegepast. Van de gulden snede in grafisch ontwerp en architectuur tot bijvoorbeeld de ‘bone furniture’ serie [Laarman, 2006] in product ontwerp. In het gebied van datavisualisatie is hier nog weinig mee gedaan. En omdat dit gebied nog volop aan het ontwikkelen is, is het erg interessant om een onderzoek te doen naar wat een natuurlijk proces voor datavisualisatie kan betekenen.

“The New York Times bevat op een gemiddelde zondag meer informatie dan waar een persoon uit de Renaissance tijd in zijn hele leven toegang tot had.” Richard Saul Wurman

“Een mens anno 2012 ziet op een dag meer beelden dan iemand uit de middeleeuwen in zijn hele leven.” Joost Zwagerman

Dit leidt tot de volgende onderzoeksvraag:

In hoeverre kan het simuleren van natuurlijke processen door middel van software schrijven bijdragen aan het ontwerpen van datavisualisatie?

- Welke vormen en technieken zijn er te onderscheiden in het ontwerpen van datavisualisaties?- Wat zijn de voor- en nadelen van software schrijven?- Hoe vertaal je een natuurlijk proces naar code?- Hoe kan de simulatie van het natuurlijk proces functioneren als datavisualisatie vorm?

Scope

Om een duidelijker kader aan dit afstudeerproject aan te brengen volgen hier wat randvoorwaarden:

Het doel van het onderzoek is het ontwikkelen van een systeem wat een natuurproces simuleert voor datavisualisatie door middel van code schrijven.

Als voorbeeld om het systeem te demonstreren worden er drie datasets gekozen. Deze tonen het resultaat van het systeem, een datavisualisatie, zonder het systeem aan één bepaald onderwerp te koppelen. Waardoor ook duidelijk wordt dat het systeem met verschillende datasets kan werken. Er moet wel opgemerkt worden dat het systeem geen tool voor alle

8

datasets is, en welke datasets wel en welke niet bruikbaar zijn wordt in deze rapportage uitgelegd.

Het doel van de visualisaties die gegenereerd worden door het systeem is op de eerste plaats om een globaal inzicht te geven, waardoor kijkers meteen conclusies kunnen trekken door vergelijkingen te maken, in plaats van het precies aflezen van specifieke data.

Opensource. Het systeem en de rapportage worden op internet opgeleverd, zodat geïnteresseerden in de doelgroep ermee aan de slag kunnen.

Onderzoeksmethoden

De methodiek die gebruikt is voor het onderzoek begon op theoretisch niveau: het verzamelen van informatie over de drie hoofdonderwerpen datavisualisatie, software schrijven en natuur simulatie. Daarna is gekozen voor een geschikt natuurlijk proces, en de bijbehorende biologische theorie is vertaald naar een set van regels voor een systeem.

Hierna heeft het onderzoek vooral op empirisch niveau plaatsgevonden: het verbeteren van het systeem door het toepassen van de informatie uit de eerste hoofdstukken, en het onderzoeken van de geschikte vorm.

Hierdoor is een prototype ontstaan, wat getest is met een gebruikerstest door te inventariseren hoe mensen reageerden op de visualisaties die gegenereerd zijn door het systeem. Daarnaast is ook over het systeem overlegd met de doelgroep: mensen uit het vakgebied. Met de feedback van deze twee bronnen is er nog een verbeterslag aan het systeem gemaakt. En hierna heeft nog een tweede enquête plaatsgevonden om deze verbetering te kunnen demonstreren.

Opbouw

Deze rapportage begint met informatie over de drie hoofdthema’s, datavisualisatie, software schrijven en natuursimulatie. Daarna wordt het ontwerpproces van het natuursysteem voor datavisualisatie beschreven en wordt al deze eerder genoemde informatie erbij gehaald om ontwerpkeuzes te verantwoorden.

Het eerste hoofdstuk met informatie over datavisualisatie begint met een korte inleiding, en bespreekt daarna de onderdelen van datavisualisatie die relevant zijn voor ontwikkeling van het afstudeerproduct: data, grafische elementen, taxonomie en techniek.

Het onderwerp techniek gaat het over in het hoofdstuk ‘software schrijven’. Hiervan worden verschillende aspecten besproken, en een voorbeeld met relevantie in het werkveld wordt gegeven. Dan wordt er nog even dieper ingegaan op een interessant aspect van software schrijven: generatieve systemen.

Daarna gaat de rapportage verder met het hoofdstuk over simulatie van natuurlijke processen. Eerst wordt uitgelegd hoe natuur te simuleren is door het schrijven van software. Dan wordt er een onderverdeling gemaakt in modellen van computation voor natuursimulatie.

In het laatste hoofdstuk wordt alle theorie in praktijk gebracht. Het ontwerpproces van het systeem wordt beschreven, aan de hand van informatie uit de eerste hoofdstukken in combinatie met resultaten uit de gebruikerstest. Eerst wordt het simuleren van de vertakking van nerven beschreven: volgens welke regels is dit opgebouwd, welke functies zijn belangrijke, etc. Dan wordt er ingegaan op de datavisualisatie-kant van het systeem. Hiervoor wordt weer informatie uit eerdere hoofdstukken aangehaald voor het verantwoorden van bepaalde ontwerpkeuzes, in combinatie met sommige resultaten uit de gebruikerstesten.

9

Hierna wordt de feedback benoemd die verkregen is door een enquête onder de eindgebruikers: bekijkers van de datavisualisatie. Maar ook feedback van de doelgroep wordt verwerkt: een evaluatie van informatievormgever Jan Willem Tulp. Na de feedback worden doorgevoerde verbeteringen beschreven.

En tenslotte worden er een conclusie getrokken. Hier wordt de onderzoeksvraag beantwoord en er volgen nog enkele aanbevelingen.

Dan volgen de bijlagen, waarin de vragen van de interviews zijn opgenomen. En een visuele index, waarin een selectie is opgenomen van screenshots die tijdens het ontwerpproces gemaakt zijn.

Vorm rapportage

De rapportage is met kleurcodering ingedeeld op een ‘theorie’, ‘praktijk’ en ‘reflectie’ gedeelte, naast de normale hoofdstukindeling. Op het titelblad van elk hoofdstuk zijn alle woorden weergegeven die in het betreffende hoofdstuk voorkomen, gerealiseerd door geschreven software. Hierbij is de grootte van de woorden gekoppeld aan de frequentie waarop ze voorkomen in de tekst. Dit geeft de lezer een globale indruk wat er dat hoofdstuk besproken zal worden.

11

1. DATAVISUALISATIE

12

Big data

Alleen al in het jaar 2011 is 1,8 zettabytes aan data gecreëerd [Mearian, 2011]. Dit getal is zo ongelooflijk groot dat het bijna te abstract is om voor te stellen. Een voorbeeld met variabelen waar een betere voorstelling bij te maken is: het equivalent van 1,8 ZB is de data die ontstaat wanneer elke Amerikaanse burger 3 tweets per minuut schrijft 26.976 jaar lang. Er wordt voorspelt dat de hoeveelheid data in 2012 naar 2,7 ZB zal groeien, wat 48% bovenop het getal van 2011 is [IDC, 2011]. Dit fenomeen wordt ‘big data’ genoemd.

Deze groei in data heeft verschillende oorzaken. Een belangrijke reden is de technologische ontwikkeling. Hoe meer computers en andere digitale apparaten, hoe meer data gegenereerd wordt. Daar komt ook nog eens bij dat de snelheid en opslagcapaciteit van computers ongeveer iedere twee jaar verdubbeld, volgens de wet van Moore.

Verder is er ook een oorzaak van data-toename in het bedrijfsleven te vinden, omdat informatie steeds meer een strategische rol in bedrijfsprocessen krijgt. Hierdoor is data ook toegankelijker geworden: steeds meer bedrijven, maar ook overheden maken hun data inzichtelijk en bruikbaar voor iedereen.

Het aantal mensen dat toegang heeft staat nu op ongeveer 2,3 miljard [Nielsen Online, 2011] en deze groep blijft ook toenemen. En omdat het aantal mobiele apparaten dat met het internet verbonden is sterk zal toenemen voorspelt Cisco dat het wereldwijde mobiele dataverkeer de komende vijf jaar met een factor 18 toenemen. [Cisco, 2012]

Een andere oorzaak is dat data die je deelt op internet niet verplaatst wordt, maar gekopieerd. En omdat het juist zo gemakkelijk is om data te delen via internet, staat er dus veel dezelfde data online.

Een andere trend is het verzamelen van persoonlijke data. Er komen steeds meer applicaties beschikbaar voor de smartphone waarbij het eigen gedrag van de gebruiker in kaart te brengen is. Van sportapplicaties die door middel van GPS je prestaties bijhouden en veranderingen hierin kunnen tonen, tot applicaties over je dataverbruik.

Om deze data te kunnen gebruiken is er behoefte aan manieren om de data te verkennen, en zinvol te kunnen communiceren. Digitale kunst en grafisch ontwerp studio Field over de mogelijkheden op het gebied van data:

“Data is the new universal language, its interaction with design appears in all forms and media. Aesthetically, data-driven design brings the potential for completely new forms and structures, infinite visual complexity. We combine data and code with art and design, into original processes that can have new kinds of results.”- Field

“Seeing it”

Mensen hebben een opmerkelijk vermogen om informatie te begrijpen als het weergegeven wordt als beeld. Zoals onderzoeker Stuart K. Card beschrijft, “To understand something is called ‘seeing’ it. We try to make our ideas ‘clear’, to bring them into ‘focus’, to ‘arrange’ our thoughts.” [Card, Mackinlay, Shneiderman, 1999, p. 1]

Dit komt omdat mensen visueel zijn ingesteld. Ongeveer zeventig procent van alle zintuiglijke receptoren in het menselijk lichaam zitten in de ogen [Marieb, Hoehn, 2007, p. 15]. Datavisualisatie-technieken die deze aangeboren kennis combineren met aangeleerde vaardigheden maken data beter te begrijpen.

Een voorbeeld uit The Visual Display of Quantitative Information door Edward Tufte,

WAAROM VISUALISATIE?

13

illustreert deze uitspraak [Tufte, 2007].

“Graphics reveal data. Indeed graphics can be more precise and revealing than conventional statistical computations. Consider Anscombe’s quartet: all four of these data sets are described by exactly the same linear model. And yet how they differ, as the graphical display of the data makes vividly clear:“

4

4

1

1

68 14 16 18

12

12

10

10

x

y 8

6

4

4

2

2

68 14 16 18

12

12

10

10

x

y 8

6

4

4

3

3

68 14 16 18

12

12

10

10

x

y 8

6

4

4

4

4

68 14 16 18

12

12

10

10

x

y 8

6

10.08.0

13.09.0

11.014.0

6.04.0

12.07.05.0

10.08.0

13.09.0

11.014.0

6.04.0

12.07.05.0

10.08.0

13.09.0

11.014.0

6.04.0

12.07.05.0

9.148.148.748.779.268.106.133.109.137.264.74

7.466.77

12.747.117.818.846.085.398.156.425.73

8.08.08.08.08.08.08.0

19.08.08.08.0

6.585.767.718.848.477.045.25

12.505.567.916.89

8.046.957.588.818.339.967.244.26

10.844.825.68

IX X X XY Y Y Y

II III IV

14

Het volgende classificatie schema heeft z’n oorsprong in de statistiek maar kan voor verschillende soorten informatie gebruikt worden en is dus ook geschikt om datasets voor datavisualisatie in te delen.

De meetschaal (Eng: levels of measurement) is een typering van een meetvariabele. Met deze meetschaal is het mogelijk de items van een dataset in te delen op (wiskundige) waarden en welke bewerkingen er op uit te voeren zijn. De verschillende niveaus van de meetschaal zijn hiërarchisch, dat betekend dat ze in volgorde van toenemende complexiteit staan, en dat het volgende niveau ook steeds de eigenschappen van het vorige niveau omvat. De volgende niveaus zijn te onderscheiden:

Kwalitatieve data

Nominaal: benoemenOrdinaal: ordening

Kwantitatieve data

Interval: gelijke intervallenRatio: intervallen met een absoluut nulpunt

Het nominale niveau is het eenvoudigste niveau, en hierbij gaat het om het benoemen van de naam van de items uit de dataset. Een voorbeeld van een dataset hiervan is bijvoorbeeld: geslacht (man/vrouw).

Metingen op ordinaal niveau kennen een natuurlijke ordening, zoals bijvoorbeeld beoordeling met cijfers in het onderwijs. In wiskundige termen zijn de items op ordinaal niveau met elkaar verbonden door relaties als kleiner dan of groter dan.

Een meting op interval niveau betreft een grootheid die wordt uitgedrukt in een numerieke waarde en een eenheid. De data is kan worden vergeleken door te kijken naar waarden met een even groot verschil, fixed interval. Naast de functies van de nominale en ordinale schaal, is het optellen en aftrekken van waardes van items in deze dataset een mogelijkheid. Een voorbeeld van een dataset zijn kalender jaren.

Het ratio niveau kent naast de kenmerken van een intervalschaal ook een absoluut nulpunt. Daarmee hebben ook verhoudingen van waarden op deze schaal betekenis. Voorbeelden hiervan zijn afstand en lengte. Veel natuurkundige grootheden hebben een ratioschaal, bijvoorbeeld massa in kilogram.

INDELING VAN DATA

15

Preattentieve variabelen zijn visuele attributen of grafische objecten die onbewust door menselijke waarneming worden opgemerkt. De volgende categorieën zijn te onderscheiden: grootte, vorm, uitlijning, oriëntatie, kleurtint, kleur helderheid, kleur verzadigdheid, textuur, zoals te zien op de onderstaande afbeelding.

Preattentieve variabelen komen voort uit de principes van de Gestalt psychologie. De Gestalt

benadering benadrukt dat we objecten als goed georganiseerde patronen waarnemen in plaats van afzonderlijke onderdelen. Volgens deze aanpak zien we als we onze ogen openen geen losse deeltjes wanorde, maar juist grotere gebieden met bepaalde vormen en patronen. Door preattentieve variabelen te gebruiken kun je bepaalde objecten binnen een serie eruit laten springen.

Grootte Kleur tint

Vorm Kleur helderheid

Uitlijning Kleur verzadiging

Oriëntatie Textuur

INDELING VAN GRAFISCHE ELEMENTEN

16

Zoals eerder genoemd is datavisualisatie nog een redelijk ‘nieuw’ gebied, en hierdoor ontbreekt een structureel fundament: een taxonomie. Er zijn veel mensen die geprobeerd hebben een taxonomie voor datavisualisatie aan te dragen en daaruit zijn de volgende drie het meest interessant.

In ’A Tour Through the Visualization Zoo’ worden verschillende vormen van visuele data representatie beschreven [Heer, Bostock, Ogievetsky, 2010]. Ze verdelen de verschillende grafieken, diagrammen, kaarten etc. onder in vijf globale categorieën: time series, statistical distributions, maps, hierarchies, networks.

Specifiek over de categorie netwerken heeft Manuel Lima in het boek ‘Visual complexity’ een aparte taxonomie gemaakt [Lima, 2011]. Hij onderscheidt de volgende “bouwstenen voor het vormgeven van een nieuwe visuele taal”: arc diagram, area grouping, centralized burst, centralized ring, circled globe, circular ties, elliptical implosion, flow chart, organic rhizome, radial convergence, radial implosion, ramification, scaling circles, segmented radial convergence, sphere.

Een hele heldere onderverdeling van display patterns heeft Christian Behrens gemaakt [Behrens, 2008]. Hij benoemde de volgende categorieën, gevolgd door de bijbehorende

patronen. Correlations: scatterplot, bubble chart. Continuous quantities: simple line chart, multiset line chart, stacked area chart, sparklines. Discrete quantities: simple bar chart, multiset bar chart, dot matrix, stacked bar chart, isometric bar chart, span chart. Proportions: simple pie chart, ring chart. Flows: sankey diagram, thread arcs. Hierarchies: tree diagram, treemap. Networks: tree diagram, relation circle, pearl necklet. Space: topographic map, thematic map.

Aan het eind van dit afstudeertraject publiceert visualizing.org, een toonaangevende website op het gebied van datavisualisatie, op 23 mei 2012 een artikel over een commonsense taxonomie voor datavisualisatie [Lee, 2012].

Zij benoemen ook de drie hierboven genoemde pogingen tot het opzetten van een taxonomie, en gebaseerd hierop en op een overzicht van hun eigen projecten komen ze met de volgende opzet voor een taxonomie. Chart, map, network, time series, hierarchy, flow, matrix, infographic.

In deze sectie zijn nu een aantal mogelijke categorieën voor een taxonomie genoemd, maar de taxonomie moet niet worden gezien als een vaststaande methodiek. Het gebied van datavisualisatie steeds verder zal blijven ontwikkelen, en daarom hoort een taxonomie mee te veranderen met de ontwikkelingen in het gebied.

TAXONOMIE

17

Er zijn verschillende technieken voor het realiseren van datavisualisaties: handmatig vormgeven, het gebruik van beschikbare tools en het schrijven van software.

Met het handmatig realiseren van datavisualisaties wordt het met de hand of digitaal vormgeven bedoeld. Puur met de hand vormgeven komt heel weinig voor in datavisualisatie, maar Stefanie Posavec is wel een interessante designer om te benoemen voor die manier van werken. Met digitaal vormgeven wordt werken met de computer bedoeld, met programma’s zoals Adobe Creative Suite. Nadeel van deze manier van werken is dat er echt een product (visualisatie) vormgegeven wordt, en wanneer de dataset over tijd verandert is, kost het weer veel werk om een nieuwe versie van de visualisatie te maken. Ook is er minder mogelijkheid voor interactiviteit. Voordeel is dat deze manier van werken vrij toegankelijk is, iedereen kan ermee aan de slag, soms na enige oefening met bepaalde programma’s.

Het is ook een mogelijkheid om datavisualisatie te maken door gebruik van beschikbare tools. Voorbeelden hiervan zijn: Tableau, Many eyes, Google chart tools. Voordelen hiervan zijn dat deze gratis te gebruiken zijn, en er steeds meer verschillende tools aangeboden worden. Nadeel is dat het instapniveau soms toch te hoog is omdat er enige programmeerkennis verwacht kan worden. En de mogelijkheden zijn toch beperkt tot wat de bepaalde tool te bieden heeft.

Het schrijven van nieuwe software is een minder conventionele aanpak voor datavisualisatie. Nieuwe visualisatie technieken ontstaan als ontwerpers software schrijven om aan de groeiende behoeft te voldoen. Programmeertalen om mee te werken zijn bijvoorbeeld Processing, R en c++. Voordelen zijn dat deze manier van werken geen beperkingen met zich mee brengt, alles is mogelijk. En de visualisatie is ook makkelijk aan te passen als de dataset verandert, sterker nog, als de data ‘ingeladen’ wordt gebeurd dit automatisch. Verder is er veel mogelijkheid om de datavisualisatie interactief te maken. Ook zijn er veel libraries beschikbaar die aan de geschreven software gekoppeld kunnen worden, om bepaalde functionaliteit toe te voegen. Een nadeel is echter wel dat er programmeerkennis nodig is.

Tegenwoordig zijn er veel mogelijkheden om dit zelf te leren door de uitgebreide documentatie en grote community. Het volgende hoofdstuk gaat verder in op de mogelijkheden die programmeren biedt en de manier van werken.

TECHNIEK

19

2. SOFTWARE SCHRIJVEN

20

Het kan voor sommigen tegenstrijdig lijken om een programmeertaal in te zetten voor een creatief ontwerpproces. Dit komt omdat programmeren geassocieerd wordt met logica, structuur en organisatie. Programmeren wordt vanuit traditie gebruikt voor het oplossen van problemen en uitvoeren van simulaties. Deze logische activiteiten maken programmeren in eerste opzicht onaantrekkelijk voor sommige ontwerpers. Daarom volgen nu een aantal argumenten die andere inzichten over programmeren bieden.

Merk-gebonden software producten, zoals de Adobe Creative Suite, zijn algemene tools ontworpen voor de productie van een specifiek type vorm. Hierdoor zijn gebruikers beperkt door de mogelijkheden die worden gecreëerd door het softwarebedrijf. Om verder dan deze beperkingen te komen is het nodig om bestaande applicaties aan te passen door programmeren of eigen software te schrijven.

Leren programmeren opent veel mogelijkheden, niet alleen voor het maken van producten, nieuwe manieren van expressie of eigen tools, maar ook systemen en omgevingen, hierover in de volgende sectie meer.

Door de software en technologie die tot onze beschikking staat is de mogelijkheid ontstaan om toegang te krijgen tot enorme hoeveelheden informatie en deze te verwerken. Maar het gebruik van software gaat niet alleen om het vergroten van het vermogen om met grote hoeveelheden informatie te werken, het zet ook aan tot een nieuwe en andere manier van denken.

De term procedural literacy wordt gebruikt om deze manier van denken te definiëren. Michael Mateas, beschrijft procedural literacy als “the ability to read and write processes, to engage procedural representation and aesthetics.” [Mateas, 2005] Onderdeel hiervan is het idee dat programmeren niet een strikt technische taak

is, het is een manier van communicatie en een symbolische vertegenwoordiging van de wereld. Het is niet statisch, het is een systeem van regels dat een ruimte van mogelijke vormen of acties definieert.

Om de hiervoor genoemde argumenten in een vakgebied context te plaatsten volgt nu een stukje van grafisch ontwerp studio LUST over software schrijven en het ontwerpproces:

“In our studio, form is a result of an idea, which is the result of a process. When approaching a project we try to be as open as possible. Through research and analysis we let the idea emerge from something already embedded in the project itself. Something that was perhaps already present, but that needed to be highlighted. From there we look for the best way to execute that idea, and in doing so develop the form and concept further.

Because we approach projects in this way, existing software/tools are often insufficient to properly execute an idea. We also tend to arrive at ideas that require new ways of thinking about how to deal with everything from typography to data to interactivity. In these cases the development of custom software and tools is a natural extension of the process, and can be instrumental in the development of the idea.

While designing in code is quite different from ‘traditional’ design methods, these kinds of processes have always been present in our work. Since we started our studio 15 years ago, we have adhered to a process-based methodology in which an analytical process leads eventually to an end-product that designs itself. This coincides very well with the idea of writing your own code and building your own tools. The transition to these kinds of working methods from more traditional approaches was a very natural one.

At a certain moment you realize that there is no other way to execute an idea than to build

WAAROM CODE?

21

it yourself from the ground up. This frees you from the constraints of pre-packed software and allows you to maintain a closeness to your ideas that wouldn’t be otherwise possible. While any medium will have an impact on the visual outcome of a project, we feel that building your own project-specific tools gives you back the opportunity to control and manipulate the inherent visual qualities of the tools your using. In the end, the visual quality of a work should be relevant to the project itself, rather than rooted in a particular approach or technique – the outcome should speak for itself.” [LUST, 2012]

Generatieve systemen gebruiken een aantal basisregels om modellen op te leveren. Afhankelijk van de regels kunnen deze modellen buitengewoon gevarieerd en onvoorspelbaar zijn, en in complexe output resulteren. Een bekend voorbeeld is Boids, hierover later meer.

Het maken van een generatief systeem kan ook een manier van werken zijn. Een idee wordt vertaald naar een set van regels, en dit wordt omgezet naar code. Hierdoor ontwerp je een proces, in plaats van aan één specifiek product te werken. Door aanpassingen te maken aan het systeem ontstaat een serie van verschillende resultaten. Hierdoor ontstaan verschillende interessante producten.

GENERATIEVE SYSTEMEN

23

3. SIMULATIE VAN NATUURLIJKE PROCESSEN

24

De schoonheid van de natuur heeft al eeuwen de aandacht van wiskundigen. Opvallende geometrische kenmerken zoals de rotationele symmetrie in bloemen en de spiraalvormige ordening van schalen in pijnappels zijn uitgebreid bestudeerd. Schoonheid is verbonden met symmetrie. Door het theoretische framework van onderzoek om te zetten naar computercode kan een visualisatie van natuurlijke structuren en processen ontstaan.

Het visualiseren van de code kan meerdere motivaties hebben. Het is een manier om het visuele model met het werkelijke model te vergelijken, en in dit geval is het dan een belangrijk component van validatie. Het kan ook gebruikt worden om bepaalde processen die in realiteit niet direct waarneembaar zijn weer te geven en hierdoor een educatief doel hebben. En vanuit een esthetisch oogpunt heeft de natuur een overdaad aan mooie vormen en structuren te bieden.

Een manier om code in te zetten voor de simulatie van natuurlijke processen is door middel van computation. Dit is een methode van een klein aantal oorspronkelijke handelingen, waarbij recursie en/of iteratie de meest fundamentele gedeelten van het proces omvatten.

Hierbij is iteratie het herhalen van het proces. Recursie is ook een soort herhaling, maar wat specifieker. Een functie is recursief als het een verwijzing naar zichzelf omvat als gedeelte van de functie. Een grap over de definitie van recursie die de omschrijving kan verduidelijken:

Recursion See “Recursion”

Een functie is computable wanneer het in elk geval met ja of nee beantwoord kan worden door een computer in een bepaalde tijd. In het gebied tussen computability en incomputability bestaan alle natuurlijke verschijnselen. Maar fenomenen die teveel bij een van deze twee extremen liggen zijn meestal oninteressant, omdat ze of te geordend of te ongeordend zijn. Echter, alles wat tussen deze twee extremen ligt vertoont een enorme variatie in verfijning, complexiteit en schoonheid, wat direct gerelateerd is aan de computable eigenschappen van deze systemen. In de volgende sectie wordt deze variatie van natuurlijke systemen uitgelegd aan de hand van een indeling in vier modellen.

SIMULATIE VAN NATUUR MET CODE

“From the standpoint of Taoist philosophy natural forms are not made but grown, and there is a radical difference between the organic and the mechanical. Things which are made, such as houses, furniture, and machines, are an assemblage of parts put together, or shaped, like sculpture, from the outside inwards. But things which grow shape themselves from within outwards—they are not assemblages of originally distinct parts; they partition themselves, elaborating their own structure from the whole to the parts, from the simple to the complex.“ Alan Watts

25

Gary William Flake onderscheid vier modellen van computation die natuurlijke verschijnselen simuleren in zijn boek ‘the computational beauty of nature’ [Flake, 1998]:

- Fractals- Chaos- Complexe systemen- Aanpassingsvermogen

Deze vier modellen worden nu uitgebreider behandeld. Eigenschappen en voorbeelden worden benoemd, maar er wordt niet te diep ingegaan op de wiskundige en natuurkundige theorieen, omdat dit specifieke informatie is, bestemd voor een kleine doelgroep en daarom niet belangrijk voor deze rapportage. Als de lezer toch bij die kleine doelgroep hoort en interesse heeft naar de formules en algoritmes achter bepaalde genoemde systemen, dan is dit boek zeker een aanrader.

Fractals

De term fractal is bedacht door Benoit Mandelbrot (wiskundige) om puur geometrische figuren, zoals vlakken, vierkanten of cirkels, te onderscheiden van een ander type figuren dat niet onder deze simpele classificatie valt.

Fractals hebben twee belangrijke eigenschappen. De eerste is dat ze zelfgelijkvormig zijn op meerdere schalen: een klein gedeelte van een fractal zal vaak lijken op het hele object. Hierdoor hebben fractals een ingebouwde vorm van recursie.

De tweede eigenschap is dat fractals een fractale dimensie hebben in plaats van een dimensie met hele getallen die geïdealiseerde objecten hebben. Hierdoor kan een fractal met de dimensie 1.5 bijvoorbeeld meer dan een lijn zijn maar minder dan een vlak.

In de natuur hebben fractale structuren een onderliggende functionele oorzaak. De natuur

minimaliseert materiaal-eisen, terwijl het de functionaliteit maximaliseert door middel van het veelvoorkomende gebruik van fractals. Een voorbeeld hiervan zijn de geplooide vouwen op de oppervlakte van de hersenen die de ruimte aan oppervlakte maximaliseren.

Computationele en redelijk bekende voorbeelden van fractals zijn: Brownian motion, diffusion limited aggregation, L-systems en de Mandelbrot en Julia set.

Sneeuwvlokjes zijn een natuurlijk voorbeeld van een fractal. Foto [Lenke, 2012].

Chaos

Chaotische systemen kunnen makkelijk verkeerd begrepen worden als willekeurigheid, ondanks het feit dat ze altijd op kort termijn voorspelbaar zijn. Het is onmogelijk om op lange termijn voorspellingen te doen met analoge waarden die ook maar iets minder zijn dan een oneindige en perfecte weergave. Abnormaal complexe systemen, bestaand uit duizenden of triljoenen units kunnen vaak samengevat worden als

MODELLEN VAN COMPUTATION VOOR NATUURSIMULATIE

26

patronen die beschreven kunnen worden met slechts enkele formules.

Alle chaotische systemen hebben de volgende twee eigenschappen:

Deterministisch: niet willekeurig.Gevoelig: verstoring van de beginwaarden zal de hele toekomst van het systeem verstoren.

Enkele voorbeelden van chaos systemen in computation zijn strange attractors en (roofdier-prooi)ecosystemen.

Een voorbeeld van een chaotisch systeem uit de natuur is het weer.

Complexe systemen

Complexe systemen bestaan uit veel gelijke en eenvoudige onderdelen. Vaak is het gedrag van een paar van die onderdelen gemakkelijk te begrijpen, maar het gedrag van het totale systeem is niet met een eenvoudige uitleg te beschrijven. Dit wordt omschreven met de term emergent gedrag. Voorbeelden van complexe systemen in de natuur zijn onder andere cellulaire regulatie, ‘super organismes’ zoals mierenhopen, bijenkorven en zwermen van vogels, en grotere verzamelingen van organismes zoals ecosystemen of samenlevingen.

Die onderdelen worden agenten genoemd. Onafhankelijke agenten zijn units die met hun omgeving (meestal andere agenten) interacteren, maar zelfstandig van andere agenten handelen: ze nemen geen opdrachten aan van een bepaalde leider en hebben geen idee van een globaal plan. Dit gedrag kun je terugzien bij bepaalde diersoorten: het gedrag van één agent kan oninteressant zijn, maar bij interactie met meerdere zelfde agenten kan de agent een enorme variëteit in gedrag laten zien. Dit is specifiek van toepassing op groepen dieren, zoals kuddes zwermen en scholen.

Craig Reynolds heeft een model voor dierlijke beweging ontworpen, genaamd ‘boids’, waarmee hij de beweging van een zwerm vogels heeft gesimuleerd. Met de volgende regels kon het doel al bereikt worden:

Vermijding, beweeg weg van de boids die te dichtbij komen, en verklein hiermee de kans op botsingen in de lucht.

Nabootsing, vlieg in de richting waarin de zwerm beweegt door rekening te houden met de gemiddelde snelheid en richting van de andere boids.

Centrum, verklein blootstelling van de buitenkant van de zwerm door naar het waargenomen centrum van de zwerm te bewegen.

Computationele voorbeelden zijn cellulaire automaten (Engels: cellular automata) en flocking algoritmes.

Een voorbeeld van een complex systeem uit de natuur is een mierennest. Deze afbeelding laat een verlaten mierennest zien dat is gevuld met cement, en daarna uitgegraven. In de documentaire wordt de omvang en complexiteit goed zichtbaar, te zien op deze link [Hölldobler, 2006].

27

Aanpassingsvermogen

Vanuit een evolutionair standpunt word aanpassingsvermogen vaak beschreven als de volgende vergelijking. Aanpassingsvermogen = variatie + erfelijkheid + selectie. In een meer algemene opvatting is aanpassingsvermogen een feedback proces waarin veranderingen van buitenaf gespiegeld zijn door compenserende veranderingen aan de binnenkant van een adaptief systeem.

Voorbeelden van aanpassingsvermogen in computation zijn genetische algoritmes, neurale netwerken, ecosystemen.

Een voorbeeld uit de natuur van dit model zijn omvangrijke systemen zoals natuurlijke selectie of het vermogen tot leren.

29

4. NATUURSYSTEEM VOOR DATAVISUALISATIE

30

Dan volgt nu een uitleg van gemaakte ontwerpkeuzes bij het simuleren van een natuurlijk verschijnsel met code. Op het systeem wat hieruit ontstaat wordt in de volgende sectie verder gewerkt aan de mogelijkheid tot datavisualisatie. Keuze natuurlijk proces

Het ontwerpproces om een natuurlijk proces te simuleren met het schrijven van software begon met een keuze maken voor een bepaald natuurlijk proces. Opties die overwogen zijn kwamen vooral neer op organismes zoals verschillende planten(onderdelen) en schimmels, maar ook verschijnselen als het reactie-diffusie proces, vorming van sneeuwvlokjes en simuleren van zwermen. Vooral de organismes waren een interessante optie, vanwege de vele mogelijkheden voor datavisualisatie. Concepten die meteen tot de verbeelding spraken waren bijvoorbeeld een dataset beïnvloeden met de regels voor ontwikkeling van een bepaald organisme, een data-organisme wat groeit (aan de hand van variabele ‘tijd’ in dataset) en hierdoor voorspellingen kan doen over jaartallen die niet in de dataset zijn opgenomen, en een digitaal organisme wat beïnvloed wordt door data.

Van de verschillende opties organismes is uiteindelijk gekozen voor het proces van de vertakking van de nerven in een blad, omdat beïnvloeding van dit proces veel verschillende nerven-patronen kan genereren, en zoals in hoofdstuk 1 uitgelegd, is het menselijke visuele systeem gevoelig voor het herkennen van patronen. Dit bleek ook uit het de laatste enquete: 82% van de deelnemers heeft alle visualisaties met het vertakkingspatroon goed begrepen. Slechts 18 % verwarde twee visualisaties die qua data erg dicht bij elkaar lagen. Over dit aspect later meer. Ook vanwege de optie dat er groei gesimuleerd kon worden, en het esthetische aspect is gekozen voor het proces van vertakking.

Model

Het model van computation voor natuursimulatie (uitgelegd in hoofdstuk 3) om te gebruiken is een complex systeem geworden, omdat dit beter bij het doel datavisualisatie paste dan de andere modellen. Fractals leken geen geschikt model door hun zelfgelijkvormigheid: een klein gedeelte van een fractal zal vaak lijken op het hele object. Hierdoor zou de variatie van de datavisualisatie te beperkt kunnen zijn. Chaos systemen zijn op korte termijn voorspelbaar, maar niet op lange termijn en worden hierdoor vaak verkeerd begrepen voor willekeur, en daarom ook niet functioneel voor datavisualisatie. Het model aanpassingsvermogen was wat te veel gericht op evolutie en genetica, en dus gerichter op het grotere geheel van natuur, zoals ecosystemen, in plaats van een specifiek natuurlijk proces. Het model van een complex systeem paste daarentegen heel goed bij het doel van datavisualisatie omdat een hoge mate van complexiteit kan hebben door verschillende taken van dezelfde agents. En ook bij de manier van software schrijven omdat er een systeem gemaakt wordt door een set regels op te stellen, oftewel een algoritme, en dit is zeer bruikbaar om te beïnvloeden met een dataset.

Techniek

Er zijn inmiddels een groot aantal verschillende programmeertalen/ libraries/ toolkits ontwikkeld. Een handig overzicht hiervan is op deze link [Datavisualization.ch, 2012] te vinden. Voor dit project is gekozen om open source programmeer taal en omgeving Processing te gebruiken, omdat Processing aan alle mogelijkheden voor dit systeem voldoet. En met deze programmeertaal was al ervaring door eerder projecten opgedaan door mij.

ONTWERPPROCES NATUURSIMULATIE

31

Theorie

Nadat deze keuzes duidelijk waren, was het van belang om de theorie te vinden die beschrijft hoe het natuurlijke proces van vertakking in z’n werk gaat. Hiervoor is een biologische paper gebruikt, genaamd ‘Modeling and visualization of leaf venation patterns’ [Runions, Fuhrer, Lane, Federl, Rolland−Lagan, Prusinkiewicz, 2005]. In deze paper wordt een wisselwerking tussen drie processen aangedragen: ontwikkeling van de nerven in de richting van bronnen van groeihormonen (auxin) die in het blad ingebed zijn, aanpassing van het groeihormoon als de nerven binnen een bepaalde nabijheid hiervan komen, en aanpassing van het nerven-patroon en de groeihormonen distributie door groei van het blad.

Systeem

Dan volgt nu een heel belangrijk onderdeel: het vertalen van de hierboven genoemde theorie naar een set van regels voor het complexe systeem. In de paper worden een aantal stappen omschreven die in een proces van herhaling moeten worden doorlopen om het vertakkingspatroon te creëren. Omgezet naar een set regels die te gebruiken zijn in code ziet dat er zo uit:

1. Definiëren van de grenzen.2. Groeihormonen (auxin) toevoegen in dit gebied (wat in stap 1 gedefinieerd is).3. Startpunt/startpunten (veinNode) toevoegen.4. Auxin-bronnen associëren met de veinNode (coördinaat nerf) wat het meest dichtbij is. 5. Elke nerf groeit, door een nieuwe veinNode toe te voegen in de gemiddelde richting van alle auxin-bronnen die met deze veinNode geassocieerd zijn. 6. Auxin-bronnen die binnen een bepaalde nabijheid van een veinNode zijn worden verwijderd, de zogenaamde ‘kill-distance’.

In dit proces worden de stappen 4, 5 en 6 herhaald tot alle auxin-bronnen verwijderd/ ‘gedood’ zijn.

De onderstaande illustratie is bedoeld als voorbeeld bij de beschreven regels. De groene bolletjes zijn de groeihormonen en de zwarte bolletjes zijn de coördinaten van de nerven.

1 2

3 4

5

5 6

4

32

Deze flowchart laat de aaneenschakeling zien waarop de belangrijkste functies uitgevoerd worden, door het beschrijven van het doel van de functie.

Variabelen

Een variabele is een parameter die van waarde kan veranderen. Er zijn vier variabelen in de code die van invloed zijn op de vorm van de visualisatie: straal, distanceBetweenVeinNodes, distanceBetweenAuxin en areaAuxinVeinNode. Door deze variabelen te veranderen ontstaan de verschillende vertakkingspatronen. straal is de variabele voor de grootte van de visualisatie, letterlijk is het de definitie van het grensgebied waar de auxin-bronnen in geplaatst worden. distanceBetweenVeinNodes is de variabele die de afstand tussen de coördinaten van de nerven bepaald, en hiermee effect heeft op het

vertakkingspatroon. distanceBetweenAuxin is de variabele die de afstand tussen de auxin-bronnen bepaald, en hiermee effect heeft op het vertakkingspatroon. areaAuxinVeinNode is de variabele die voor de zogenaamde ‘kill-distance’ staat: de afstand tussen nerf en auxin-bron, waarop de auxin-bron verwijderd/ ‘gedood’ wordt.

Belangrijke functies

Hieronder worden de belangrijkste functies van het systeem uitgelegd. In de eerste regel wordt het doel van de functie beschreven, en de rest van de uitleg gaat dieper in op technische aspecten. Het kan zijn dat hierbij soms wat kennis van code of wiskunde handig is, maar er is geprobeerd het algemeen begrijpelijk te maken.

addAuxin()Deze functie zorgt voor het positioneren van de auxin-bronnen: hoeveelheid, afstand tussen auxin, en in een grid in de vorm van een cirkel. Over de cirkelvorm in de volgende sectie meer. Deze functie wordt één keer aan het begin van het programma uitgevoerd. Belangrijk om op te merken is het grid: in eerdere versies werden de auxin-bronnen willekeurig in een cirkelvorm geplaatst. Maar in het kader van datavisualisatie is dat niet functioneel, omdat wanneer het systeem twee keer achter elkaar uitgevoerd wordt met dezelfde waarden, zal het er niet hetzelfde uitzien, omdat de locatie van de nerven iedere keer anders staat.

Daarom is er tot een betere methode gekomen, namelijk het gebruik van een grid waarbij alle punten op gelijke afstand van elkaar staan, in de vorm van een cirkel. Dat is bereikt door het checken of de vierkante wortel van de x en y binnen de vierkante wortel van de straal liggen. Als dat het geval is wordt een auxinpunt toegevoegd, en als dat niet het geval is niet. Op die manier krijgt het grid de cirkelvorm. Er is nog wel een pseudo-random toegevoegd met de randomSeed functie van Processing, omdat de vertakking anders niet kan groeien vanuit een

startpunt wordt toegevoegd

kijken of er nog auxinbronnen aanwezig zijn

dichtsbijzijnde auxinbronnen aan veinNode koppelen

groeihormonen (auxin) worden toegevoegd

veinNodes naar scherm tekenennieuwe veinNode wordt aan array toegevoegd

er wordt gekeken of auxinbronnen binnen bepaalde afstand van veinNode liggen

optioneel: teken grensgebied

ja

neeja

nee

stop

verwijder ze uit array

doe niks

33

startpunt in het exacte midden van een perfecte cirkel, omdat de gemiddelde richting van de auxin-bronnen waarnaar gekeken wordt gelijk zal zijn aan het startpunt. De randomSeedfunctie zorgt ervoor dat de auxin-bronnen een kleine ‘random’ afwijking hebben, dus ze staan niet perfect in het grid, maar wel elke keer als het systeem uitgevoerd wordt dezelfde ‘random’ afwijking toegewezen krijgen. In code zal de hierboven genoemde methode er zo uitzien:

randomSeed(0);for(int x = 0; x < width; x+= distanceBetweenAuxin) {for(int y = 0; y < height; y+= distanceBetweenAuxin) { if(sq(x-x) + sq(y-y) < sq(straal)){ int rX = x + int(random(0, 10)); int rY = y + int(random(0, 10)); auxin[b] = new Coordinate(rX,rY); }}}

divideAuxinToVeinNodes()Functie die alle auxin-bronnen aan dichtstbijzijnde veinNode koppelt aan de hand van nearest neighbour algoritme.

connectSourceToAuxin() Functie die de gemiddelde richting van de nieuwe veinNode bepaald, door het optellen van de x en y coördinaten van alle auxin-bronnen die hierop van invloed zijn.

addVeinNode()Functie die een nieuwe veinNode toevoegt aan de hand van de bepaalde gemiddelde richting bepaald door de connectSourceToAuxin-functie. In code wordt dat op de volgende manier aangepakt:

//coördinaat veinNode waar nieuwe aan gekoppeld gaat wordenPVector veinNode1 = new PVector (veinNode[numberVeinNode].x,

veinNode[numberVeinNode].y);//gemiddelde punt van alle auxin bronnenPVector veinNode2 = new PVector (averageDirectionAuxinx,averageDirectionAuxiny);//verschil tussen punten berekenenveinNode2.sub(veinNode1);//terug brengen naar waardes tussen 0 en 1veinNode2.normalize();//vermenigvuldigen naar bepaalde afstand tussen veinNodes (= variabele)veinNode2.mult(distanceBetweenVeinNodes);//verschil optellen bij startpositie= locatie nieuwe node veinNode1.add(veinNode2);int xNode = int(veinNode1.x);int yNode = int(veinNode1.y);veinNode[numberNewVeinNode] = new Coordinate(xNode, yNode);

killAuxin()Deze functie ‘dood’ het auxin wat zich binnen een bepaalde afstand van een nerf bevind: het wordt dan uit de array waar alle auxin-bronnen zijn opgeslagen verwijderd.

checkLiveAuxin()Deze functie controleert of er nog auxin ‘in leven’ is, dat wil zeggen dat de nerven het nog niet bereikt hebben. Dit is dus de functie die het hele systeem blijft herhalen tot de vorm volgroeit is: tot alle auxin-bronnen bereikt zijn door nerven.

drawVenation ()Dit is de functie die alles naar het scherm tekent. Zonder deze functie zou al het hierboven genoemde evengoed uitgevoerd worden, maar zou het niet zichtbaar zijn, omdat het niet visueel gemaakt wordt.

Dikte nerven

Nadat alle hierboven genoemde code functioneerde, produceerde het systeem al verschillende patronen van vertakking. Op de volgende pagina een paar afbeeldingen daarvan.

34

35

Links zijn dus allereerste werkende resultaten die uit het systeem kwamen te zien. Interessant is links-onder: hierbij stond de array die de coordinaten van de veinNodes opslaat nog op een te klein totaalaantal, en daarom ziet de vorm er zo half uit.

Daarna is de functionaliteit aan het systeem toegevoegd die uitrekent hoeveel vertakkingen uit een bepaalde nerf komen, ook wel hoeveel

‘children’ die nerf heeft, en aan de hand daarvan is lijndikte toegevoegd. Op die manier krijg het vertakkingspatroon een meer realistische vorm, waardoor de visualisatie eerder als vertakking van nerven herkent kan worden, in plaats van een set van lijnen. Dat leverde het onderstaande resultaat op.

36

In de vorige sectie is beschreven hoe het ontwerpproces van het vertakkings-systeem tot stand is gekomen. Dan wordt nu ingegaan op de datavisualisatie: het koppelen van data aan het vertakkings-systeem, kiezen van datasets en vorm, en feedback & verbetering.

Data

Het koppelen van de data aan het systeemIn het vertakkings-systeem worden vier variabelen gebruikt die het proces reguleren, deze zijn ook al in de vorige sectie uitgelegd. Nu wordt er ingegaan op beïnvloeden van deze variabelen met de waarden uit de dataset. Als voorbeeld wordt de dataset over verstedelijking genomen.

Data: adressen/km2 oppervlakte Amsterdam 6047 219s-Gravenhage 4674 98Rotterdam 3882 319Utrecht 3133 99Groningen 3104 84Tilburg 2556 119Nijmegen 2264 58Eindhoven 2182 89Breda 1895 129Almere 1576 249

Dit gebeurd door de waarde van een item uit de dataset zoals de grootte van een bepaalde stad te om te zetten van het minimum en maximum van waarden van die dataset, naar het minimum en maximum van de variabele van het vertakkingssysteem.

Een voorbeeld om dit te verduidelijken, met als onderwerp de grootte van Almere. Dat is een waarde van 249, zoals te zien is in de tabel met data. Deze waarde wordt dan ten opzichte van het minimum (58, Nijmegen) en maximum (319, Rotterdam) van waarden uit de dataset omgezet naar een waarde tussen het minimum (100) en maximum(300) van het systeem.

De oppervlakte (dataset) wordt gekoppeld aan de variabele straal en distanceBetweenVeinNodes, en de adressendichtheid wordt gekoppeld aan distanceBetweenAuxin en areaAuxinVeinNode.

De eerste resultaten van het vertakkingsalgoritme in combinatie met de data zijn te zien op de volgende pagina’s.

ONTWERPPROCES DATAVISUALISATIE

37

38

Aan deze resultaten is te zien dat de variabele voor de grootte goed overkomt. De kijker kan meteen conclusies trekken zoals dat Rotterdam een grotere oppervlakte heeft dan Amsterdam, en dat Almere zelfs ook iets groter is als Amsterdam.

Maar bij deze eerste resultaten was er aan adressendichtheid nog maar één variabele gekoppeld in plaats van twee, en daarom komen de verschillen in het patroon hier nog niet goed over. Dit is ook gebleken uit de resultaten van de eerste enquête, waarbij het niemand lukte om de juiste volgorde van de tien visualisaties te benoemen.

Daarna is de dichtheid van het nervenpatroon nog aangepast, en bij de tweede enquête had 82% procent van de deelnemers de volgorde helemaal goed, en 18% had één fout.

De resultaten van het vernieuwde vertakkingspatroon met aangepaste dichtheid zijn op deze pagina te zien.

39

Niveau

In hoofdstuk 1 is een meetschaal van data benoemd. Het is belangrijk om eerst vast te stellen welk niveau of niveaus van data goed werken met het systeem. Eigenlijk zou het systeem met alle genoemde niveaus van data kunnen werken, maar vooral de kwantitatieve data (interval en ratio) zal toch de meeste mogelijkheden geven. Omdat bij de kwalitatieve data eigenlijk alleen hoe vaak bepaalde items voorkomen in vergelijking met het totaal gebruikt kan worden voor visualisatie, en bij de kwantitatieve data kunnen juist de waarden van deze items gevisualiseerd worden.

Datasets

Het is wel belangrijk om op te merken dat het onderwerp van visualisatie in zekere mate ondergeschikt is aan het systeem, omdat het doel was onderzoek te doen naar de mogelijkheden van een natuurlijk systeem voor datavisualisatie. Het onderwerp van de dataset voor visualisatie dient ter illustratie/ als voorbeeld om het functioneren van het systeem te demonstreren. Daarom zijn de volgende drie datasets geselecteerd.

1. Verstedelijking van de tien grootste Nederlandse steden, variabelen: adressendichtheid, oppervlakte, stad en jaartal.

2. Koopkracht Nederland van 2002 – 2010.

3. Veel voorkomendheid van woorden in bepaalde tekst. Deze dataset is gekozen om ook data van de nominale schaal te visualiseren.

Het systeem is ontwikkeld op de dataset van de verstedelijking, daarom sluit de visualisatie hier ook goed bij aan. Vooral de metaforische waarde van de ‘dichtgegroeidheid’ van de visualisatie in combinatie met de verstedelijking van een bepaalde stad. En het groeien van steden in combinatie met een manier van visualiseren

die ‘groeit’. Maar ook weer de interessante tegenstrijd om een natuurlijk proces in te zetten voor de visualisatie van verstedelijking. De combinatie van een dergelijk onderwerp met een natuurlijk systeem zet de kijker ook aan het denken. De reacties in de enquête waren hierop ook zeer uiteenlopend. Enkelen vonden het geen goede combinatie omdat het tegenstrijdig was, terwijl anderen denken aan de ‘roots’ van de mens, of het uitbeelden van menselijkheid met een natuurlijke vorm, maar ook dingen als ‘abstract’ of ‘conflict’ worden genoemd. Deze vorm zou veelbelovend kunnen zijn, want datavisualisaties worden extra interessant als de kijker er een verhaal of mening bij vormt.

De volgende dataset over de koopkracht van Nederland is ook gekozen met een bepaalde metafoor in gedachten: de visualisatie van 2010 is heel ‘kaal’ in vergelijking met de rest. Dit refereert natuurlijk naar de financiële crisis. In 2010 is de koopkracht van de Nederlandse bevolking met 0,5 procent afgenomen. Dit is de grootste koopkrachtdaling sinds 1985. Het was ook mogelijk om deze negatieve waarde te visualiseren omdat het systeem werkt met een bepaald bereik: door een minimum en maximum aan te houden en weer te geven hoe de andere waarden zich hier tot verhouden.

In het algemeen kan het systeem dus werken met verschillende datasets, maar het is wel aangeraden om onderwerpen te kiezen die een bepaalde connectie hebben met de vorm van de visualisatie, omdat deze dan sterker over komt. Dus vooral kwantitatieve data, die een bepaalde groei doormaakt of een serie om een vergelijking te maken. En het is ideaal als er een achterliggend metafoor bij past.

Vorm

Indeling grafische elementenVan de preattentieve variabelen grootte, vorm, uitlijning, oriëntatie, kleurtint, kleur helderheid, kleur verzadigdheid en textuur (genoemd

40

in hoofdstuk 1) is gekozen de volgende te gebruiken. Grootte, om een bepaalde waarde uit de dataset te communiceren. In het geval van verstedelijk staat de grootte van de visualisatie voor de oppervlakte van de stad. Hierdoor is gekozen om juist geen verandering in vorm te creëren, want als er verschillende vormen gebruikt worden voor visualisaties is het voor mensen niet meer mogelijk om de grootte in te schatten. Textuur komt terug in de dichtheid van het vertakkingspatroon. Kleurtint word ook gebruikt om een waarde uit de dataset te communiceren, in het geval van verstedelijking is dat elke stad met een andere kleur wordt gevisualiseerd. En als laatste kleurhelderheid, deze wordt gebruikt om de nerven weer te geven. Op de aanhechtingspunten overlappen de nerven elkaar, door de helderheid is dit te zien. In visualisaties met een hogere dichtheid van nerven zitten deze aanhechtingspunten dichter op elkaar. En omdat dit zichtbaar is draagt het bij aan het begrip van het vertakkingspatroon.

Onderzoeksvragen

Verschillende onderzoeksvragen die zijn tegengekomen in het ontwerpproces van de vorm waren:

Hoeveel variabelen zijn er te visualiseren zonder dat het onoverzichtelijk wordt?

Omdat het systeem met vier variabelen werkt is het in theorie ook mogelijk om vier maatstaven van data hieraan te koppelen. Het is echter aangeraden om er twee te visualiseren, ondanks dat het systeem wel vier variabelen bevat die beïnvloed kunnen worden. De visualisatie wordt herkenbaarder als er meerdere variabelen van het systeem toegepast worden op één maatstaaf van data. Dit is ook gebleken uit de resultaten van het onderzoek: bij de eerste enquête herkende 95% van de deelnemers de visualisatie met de hoogste dichtheid, maar dat was dan ook het enige. Het was niet duidelijk genoeg voor de deelnemers om een bepaalde volgorde van

hoge dichtheid naar lage dichtheid te kunnen aangeven. Dit kwam omdat bij die visualisaties nog niet meerdere variabelen aan één bepaalde maatstaaf van data gekoppeld waren. Bij de tweede enquête zijn zelfs drie van de vier variabelen van het systeem aan de maatstaaf van de data gekoppeld. En hierbij werd in bijna alle gevallen (82%) de complete volgorde goed aangegeven. In een paar gevallen werden twee visualisaties van waarden van de data die erg dicht bij elkaar lagen door elkaar gehaald.

Welke vorm krijgt de visualisatie? Bijvoorbeeld: coördinaten, cirkel, bol, tekst: naam item uit dataset.

Om deze vraag te beantwoorden was het ook belangrijk om te bepalen of de vorm van de visualisatie herkenbaar moest zijn, zodat een bepaalde maatstaaf uit de dataset direct te herkennen was aan de corresponderende vorm. Er is toen bepaald dat herkenbaarheid door de vorm niet noodzakelijk was om een aantal verschillende redenen. Ten eerste omdat dit door andere preattentieve variabelen opgelost kan worden zoals kleurverschil. En het zou ook afdoen aan het organische gevoel van de visualisatie. Maar vooral omdat de grootte van de visualisatie ook een variabele is, en hierdoor moet de vorm voor elke visualisatie hetzelfde zijn, anders kan de gebruiker het verschil in grootte niet inschatten. Toen is gekozen voor een cirkel omdat deze van de geometrische vormen het meest natuurlijk overkwam. Uit de enquête bleek dat dit ook overeenkwam met de opvattingen van de deelnemers. Een kleine 80 % vond een cirkel de beste vorm voor visualisatie. Dit was nog verder onderverdeeld in 30% voor een cirkelvorm met startpunt onderaan in visualisatie, en 48% voor een cirkelvorm met centraal startpunt. Hierover zo meer.

Een of meerdere startpunten?

Één startpunt. Anders wordt er door de verschillende groepen vertakking gesuggereerd

41

dat er meerdere variabelen weergegeven worden, en het is niet handig om mogelijk verwarring te veroorzaken. Dit geeft wel aan dat er een mogelijkheid bestaat om verschillende groepen van vertakking in de datavisualisatie te creëren met dit systeem, en op die manier meerdere maatstaven van een dataset te visualiseren, wat ook kan resulteren in het visualiseren van grotere datasets. Hiervoor is nu bewust niet gekozen omdat die verschillende groepen vertakkingen dan door veel meer verschillende variabelen voor dichtheid van de vertakking beïnvloed moesten worden. Daar was nu geen behoefte aan en zou ook voor een te verwarrende visualisatie kunnen zorgen.

Waar komt de locatie van het startpunt?

In het midden, omdat dit voor een gelijkmatige verdeling van de vertakking zorgt, in vergelijking met als de locatie van het startpunt aan de rand van of buiten de vorm ligt. Hierdoor is de vertakkingsdichtheid beter te interpreteren. In een van de vragen uit de eerste enquête werd deelnemers gevraagd of ze verschil in dichtheid tussen twee visualisaties zagen. Bij deze visualisaties begon het startpunt in het midden onderaan, en ze waren gegenereerd met precies dezelfde variabelen. Op dit moment was de willekeurigheid nog niet uit het systeem gehaald dus de visualisaties zagen er verschillend uit doordat de vertakkingen andere locaties hadden, maar de dichtheid was precies hetzelfde. Toch zegt 42% verschil in vertakking te zien. Dit illustreert dat de locatie van het startpunt voor onduidelijkheid heeft gezorgd.

42

Esthetiek

Zoals eerder genoemd heeft de keuze van de dataset in combinatie met de vorm tot veel reacties bij de deelnemers van de enquete opgeroepen. Zo ook bij de vraag of deze visualisaties als esthetisch ervaren worden. In theorie zou dit wel het geval moeten zijn, omdat de verschillende aspecten van deze methode voor visualisatie nomaal op zichzelf al esthetisch zijn, namelijk de wiskundige kant, en veel hiermee samenhangend: de natuurlijke kant, maar ook het gebruik van een systeem. De reacties van de deelnemers zijn echter redelijk uiteenlopend: sommigen vinden het verniewend, anderen juist te abstract, maar het wordt ook mooi gevonden door structuur, verwijzing naar natuur en eenvoud.

Taxonomie

Als het systeem onderverdeeld in een bepaald gebied van datavisualisatie zou worden, dan past het niet in een van de genoemde categorieën voor taxonomie (zoals genoemd in hoofdstuk 1). Dit komt omdat er gewerkt wordt met een (natuurlijk) systeem, en dit is een totaal andere aanpak dan waarmee de datavisualisaties in de verschillende categorieën van taxonomie tot stand zijn gekomen. Maar ook omdat dit systeem geschikt is voor het genereren van een serie van visualisaties, en dit komt ook niet overeen met de genoemde categorieën.

Het is ook benoemd dat het belangrijk is dat de taxonomie mee te verandert met de ontwikkelingen in het gebied, daarom zou er een nieuwe categorie kunnen ontstaan waar dit systeem wel onder valt, als er nog meer interesse hiernaar is in het vakgebied en meer mensen hiermee gaan experimenteren.

43

ze een verschil zien en 58% dat het dezelfde dichtheid is.

Resultaten tweede enquête

82 % van de deelnemers kon alle visualisaties op volgorde van dichtheid van het vertakkingspatroon ordenen, en 18% maakte één fout, door twee visualisaties met dicht bij elkaar liggende waarde om te wisselen. [Enquête 2, 2012]

Feedback Jan Willem Tulp

“CodeLaat ik voorop stellen dat ik je code goed in elkaar vind zitten. Het is best ingewikkeld om een complex systeem te simuleren, dat heb je goed voor elkaar gekregen in code. Je hebt ook goed overal commentaar toegevoegd wat erg goed helpt bij het begrijpen van de code. Daarnaast heb je zinvolle variabele namen gebruikt (geen een-letterige afkortingen bijv.) waardoor het geheel ook goed leesbaar is. Een drietal dingen die me in eerste instantie opvallen waar je in de toekomst mogelijk wat mee zou kunnen doen:

1) gebruik vaker de PVector class: Dit zit standaard in Processing, en dan hoef je niet je eigen Coordinate class te maken, omdat PVector ook al een x- en y-coördinaat opslaat. Daarnaast zijn er handige functies om bijv. afstand te bepalen tussen 2 PVectors, dan hoef je dat zelf ook niet te doen

2) data: het ligt voor de hand om je data over steden gewoon in een apart tekstbestandje op te slaan. Zeker als je er een CSV van maakt, staat alles mooi bij elkaar in plaats van voor elke dimensie een aparte array te maken.

3) abstracties: je kunt meer gebruik maken van object-georiënteerd programmeren. Je code wordt nog begrijpelijker (en makkelijker om mee te werken) als je concepten in code vast legt als classes. Voor je data zou je bijv. een City class

Hier zullen de bevindingen van de onderzoeken samengevat worden. Daaronder vallen de globale resultaten van twee enquêtes. Hierna volgt de feedback uit het vakgebied van informatie vormgever Jan Willem Tulp.

Resultaten eerste enquête

De resultaten van de gesloten vragen worden hier onder procentueel weergegeven, om een algemene indruk te geven. De complete resultaten van de enquêtes zijn in te zien op de genoemde links omdat deze te groot waren om bij te voegen. De vragen van de enquêtes zelf zijn te vinden in de bijlagen. [Enquête 1, 2012]

Op vraag 2 “Welke vorm spreekt je het meeste aan?” antwoordt 30 % ronde vorm met beginpunt midden-onder, 30 % ronde vorm met beginpunt midden, 18 % ronde vorm met beginpunt midden (wat meer linear dan vorige), 14 % vorm met meerdere groepen vertakking, en 8 % de rechhoekige vorm met beginpunt in het midden.

Op vraag 4 “Als de verschillende ‘groepen’ vertakkingen voor verschillende data zou staan, denk je dat de data dan nog te onderscheiden is? Of is het te veel en beter dat het uit één groep vertakkingen bestaat?” antwoordt 33% één groep en 67% meerdere groepen vertakking mogelijk.

Op vraag 6 “Welke versie vind je bet er voor de vorm van het vertakkingspatroon? Beginpunt in het midden onderaan, centraal, asymmetrisch of buiten patroon waardoor er een kleine stam ontstaat?” antwoordt 17% midden onderaan, 40% centraal, 8 % asymmetrisch en 35% buiten patroon.

Op vraag 8 “Één of meerdere startpunten voor de vorm van het vertakkingspatroon?” antwoordt 73% één en 27% meerdere.

Op vraag 10 “Zie je hier verschil in de dichtheid van het vertakkingspatroon, of denk je dat de dichtheid het zelfde is?” antwoordt 42% dat

BEVINDINGEN

44

kunnen maken die verschillende properties heeft (inwoners, dichtheid, etc.). Voor je hele systeem kun je een System class maken, die weer z’n eigen gedrag kan hebben, bijv. om het systeem te starten of te stoppen. Een Node kan een class zijn, je kunt misschien een Configuration class hebben waarin je vastlegt hoe de System class zich moet gedragen, etc. Kortom, als je meer met classes en objecten werkt, deel je het meer op in kleinere stukjes die allemaal hun eigen verantwoordelijkheid, gedrag en eigenschappen hebben. Dan wordt het makkelijker, begrijpelijker, je code wordt minder snel 1 lap tekst, en de concepten uit het domein (het complexe systeem voor het simuleren van nerven, dus auxins, veins, etc.) komen ook sterker terug in je code.

ConceptIk vind het een erg leuk, innovatief en uitdagend idee. Het klopt dat er op dit moment in data visualisatie niet veel met complexe systemen wordt gedaan, maar misschien heeft dit ook wel een reden. Je ziet het bijv. wel meer terug in ‘data-art’, waar vormen eerder boven functionaliteit of informatie kunnen gaan. Als je puur kijkt naar het communiceren van informatie, en in dit geval de mate van verstedelijking van een aantal steden, dan is het gebruik van nerven minder effectief dan een cirkel egaal te vullen met een kleur. Door de nerven wordt de vorm van de cirkel niet meer expliciet gemaakt (impliciet wel, door Continuïteit vanuit de Gestalt principes), wat misschien al iets lastiger is dan expliciet de grootte van de cirkel aan te geven. Daarnaast is een niet egale vulling ook een iets ‘drukker’ beeld dan een wel egale vulling, en is de ‘waarde’ die de nerven representeren (door dikte van de nerven, hoeveelheid van de nerven en de vorm van de nerven) lastiger te zien.

Desalniettemin vind ik de vorm van nerven uitermate geschikt voor een visualisatie van verstedelijking, omdat het ook iets weg heeft van een stratenplan. En het is een originele manier om naar de data te kijken, dus ik ben er ook wel van overtuigd dat mensen hierdoor gefascineerd

kunnen zijn.

Ik ben nog wel benieuwd naar de finale versie, en wat voor medium er wordt gebruikt. Ik kan me goed voorstellen dat het een mooie poster kan opleveren, of mooie illustraties voor een boek. Maar ik kan me ook voorstellen dat dit als een soort installatie op een groot scherm wordt getoond, waarbij de nerven geanimeerd ontstaan. Dat lijkt me erg fascinerend voor het publiek, en geeft misschien nog sterker het effect van het complexe systeem weer, omdat je het dan ziet ontstaan (net zoals in de natuur gebeurt, maar dan wat sneller).

Samengevat zou ik zeggen dat het concept uitermate geslaagd is, en dat ik het zelf meer in de richting van data-art zou scharen dan data visualisatie, omdat naar mijn mening vorm meer aandacht krijgt dan het communiceren van informatie.

SysteemIk denk dat ik het systeem niet direct zou gebruiken. Een voor de hand liggende reden hiervoor is dat mijn werk bestaat uit het maken van maatwerk data visualisaties, en voor mij zou dat betekenen dat ik je werk gewoon zou kopiëren. Daarnaast vind ik het een erg mooie uitvoering, en ik hoop dat je hier uiteindelijk ook een mooie visuele presentatie van kunt maken in de vorm van poster / boek / tentoonstelling, etc. Waar ik het wel voor zou gebruiken is inspiratie op doen, en leren hoe jij dit hebt gemaakt. Ik heb zelf ook een grote interesse in complexe systemen, en dit zou een uitermate geschikt voorbeeld kunnen zijn voor hoe ik zelf zoiets zou kunnen aanpakken. Misschien zou ik zelf ook wel een koppeling met data maken, maar waarschijnlijk niet bedoeld om informatie te communiceren, maar meer als input om mooie vormen te kunnen krijgen. Dit is een goed voorbeeld van parametric design, iets wat tegenwoordig ook in architectuur erg populair is. Wellicht dat er in de architectuur toepassingen voor zouden kunnen zijn.“

45

Aan de hand van de resultaten uit de enqûetes en de feedback van Jan Willem Tulp zijn de laatste verbeteringen gemaakt. De data wordt via een los bestand ingeladen in plaats van dat het als een array in de code opgenomen is. Hierdoor is het veel makkelijker om van dataset voor de visualisatie te veranderen. Jan Willem Tulp benoemd ook dat de ‘waarde’ die de nerven representeren lastig te zien is en dat vorm meer aandacht krijgt dan het communiceren van informatie. Hierbij moet gezegd worden dat de visualisaties die door het systeem gegenereerd worden inderdaad niet bedoeld zijn voor het communiceren van specifieke waarden van data, maar eerder voor het geven van een overzicht van visualisaties, waaruit de kijker dan zelf conclusies kan trekken door vergelijkingen te maken.

Verder is de code meer OOP gemaakt, door het toevoegen van classes. Op deze manier is de code makkelijker om mee te werken, en kunnen bepaalde stukken hergebruikt worden. Ook is een functie toegevoegd voor het exporteren van afbeeldingen op hoge resolutie, zodat de visualisaties ook op posterformaat geprint zouden kunnen worden. En de optie kleur te gebruiken om verschillende waarden van de data te visualiseren is toegevoegd.

VERBETERINGEN

47

CONCLUSIE

48

In hoeverre kan het simuleren van natuurlijke processen door middel van software schrijven bijdragen aan het ontwerpen van datavisualisatie?

Het doel van dit onderzoek, het ontwikkelen van een natuurlijk systeem voor datavisualisatie door middel van code schrijven, is zeker geslaagd. Maar in hoeverre draagt het bij aan datavisualisatie?

De gebruikte aanpak is redelijk onconventioneel in vergelijking met de normale aanpak van datavisualisatie, omdat een complex systeem ontworpen is voor het genereren van output. Maar omdat er in het datavisualisatie gebied behoefte is aan nieuwe manieren van visualisatie is het zeker interessant om hiermee te experimenteren.

Het gebruik van een dergelijk systeem neemt een aantal voor- en nadelen met zich mee. De visualisaties die door het systeem gegenereerd worden zijn niet voor alle situaties geschikt, omdat het doel van deze manier van datavisualisatie niet gericht is op het exact weergeven van de waarde van de dataset. Het doel is juist om een weergave te maken, die in een oogopslag opvallende verschillen en overeenkomsten in de dataset kunnen communiceren, waardoor de kijker meteen globale conclusies kan trekken. Er is geconcludeerd dat dit systeem het beste ingezet kan worden om een serie van visualisaties van een dataset te genereren, die met elkaar vergeleken kunnen worden.

Met dit doel in gedachten én een juist gekozen dataset is deze manier van datavisualisatie heel veelbelovend. Omdat de visualisaties gegenereerd worden door een systeem is het mogelijk om aanpassingen te maken, en de visualisatie ‘finetunen’ op het onderwerp van de dataset. Maar het is ook belangrijk om de natuurlijke vorm van de visualisaties in te zetten als metafoor van het onderwerp van de data.

Hierdoor worden de visualisaties sterker. Daarom is deze manier van datavisualisatie heel bruikbaar om bijvoorbeeld voor datasets te gebruiken die een groei laten zien, of een interessant onderwerp hebben wat aansluit bij de natuurlijke vorm. Wanneer dit goed wordt uitgevoerd resulteert dit in een vorm van visualisatie die mensen aan het denken zet en tot de verbeelding spreekt, en in de meeste gevallen ook als esthetisch wordt ervaren.

CONCLUSIE

49

Ik denk dat het voor het datavisualisatie vakgebied zeker interessant is om verder te gaan met dit onderzoek op het gebied van natuurlijke systemen voor het genereren van visualisaties. Omdat het gebruik van deze systemen veel voordelen heeft, zoals herbruikbaarheid: door kleine aanpassingen kan dit systeem een grote variatie aan output genereren. Maar het biedt ook mogelijkheid voor het maken van interessante en geavanceerde visualisaties, omdat een van de eigenschappen van een complex systeem ‘het opstellen van een set basisregels die voor complex gedrag kunnen zorgen’ is. Ik ben benieuwd welke andere natuurlijke verschijnselen er nog meer geschikt zijn voor datavisualisatie.

Omdat het een systeem is met een vermogen tot groei, is er de mogelijkheid om dit aspect verder te ontwikkelen, waardoor het systeem voorspellende visualisaties zou gaan kunnen genereren van een bepaalde dataset.

Het lijkt mij ook interessant om te zien wat dit systeem aan mogelijkheden voor gebruik in andere ontwerpdisciplines te bieden heeft, zoals parametric design of data-art.

AANBEVELINGEN

50

51

LITERATUURLIJST

Boeken

[Card, Mackinlay, Shneiderman, 1999]

[Flake, 1998]

[Klanten, 2010]

[Lima, 2011]

[Marieb, Hoehn, 2007, p. 15]

[Pearson, 2011]

[Reas, McWilliams, LUST, 2010]

[Tufte, 2007]

[Behrens, 2008]

[Heer, Bostock, Ogievetsky, 2010]

[Mateas, 2005]

[Prusinkiewicz, Lindenmayer, 2004]

Card, S., Mackinlay, J., Shneiderman, B. (1999). Readings in Information Visualization: Using Vision to Think. San Francisco: Morgan Kaufmann.

Flake, G. (1998). The Computational Beauty of Nature: Computer Explorations of Fractals, Chaos, Complex Systems and Adaption. Cambridge: The MIT Press.

Klanten, R. (2010). Data Flow 2: Visualizing Information in Graphic Design. Z.pl.: Die Gestalten Verlag.

Lima, M. (2011). Visual Complexity: Mapping Patterns of Information. New York: Princeton Architectural Press.

Marieb, E., Hoehn, K. (2007). Human Anatomy & Physiology. San Francisco: Pearson Education.

Pearson, M. (2011). Generative art: A practical guide using processing. New York: Manning Publications.

Reas, C., McWilliams, C., LUST. (2010). Form and code: In design, art, and architecture. New York: Princeton Architectural Press.

Tufte, E. (2007). The Visual Display of Quantitative Information. Connecticut: Graphics Press LLC.

Behrens, C. (2008). The Form of Facts and Figures: Design Patterns for Interactive Information Visualization. Potsdam: Proefschrift Potsdam University of Applied Sciences.

Heer, J., Bostock, M., Ogievetsky, V. (2010). A Tour Through the Visualization Zoo. http://hci.stanford.edu/jheer/files/zoo/

Mateas, M. (2005) Procedural Literacy: Educating the New Media Practitioner. http://users.soe.ucsc.edu/~michaelm/publications/mateas-oth-2005.pdf

Przemyslaw Prusinkiewicz, P., Lindenmayer, A. (2004). The Algorithmic Beauty of Plants. http://algorithmicbotany.org/papers/abop/abop.lowquality.pdf

Publicaties

52

[Runions, Fuhrer, Lane, Federl, Rolland−Lagan, Prusinkiewicz, 2005]

[Cisco, 2012]

[Datavisualization.ch, 2012]

[Enquête 1, 2012]

[Enquête 2, 2012]

[Hölldobler, 2006]

[IDC, 2011]

[Laarman, 2006]

[Lee, 2012]

[Lenke, 2012]

[LUST, 2012]

[Mearian, 2011]

Runions, A., Fuhrer, M., Lane, B., Federl, P., Rolland−Lagan, A., Prusinkiewicz, P. (2005). Modeling and visualization of leaf venation patterns. http://algorithmicbotany.org/papers/venation.sig2005.html

Cisco. (2012). Cisco Visual Networking Index voorspelt 18-voudige groei mobiel internet dataverkeer in de periode 2011-2016. http://www.cisco.com/web/NL/news/berichten2012/news_persberichten_021412.html

Datavisualization.ch. (2012). Selected Tools. http://selection.datavisualization.ch/

van Bree, T. (2012). Resultaten eerste enquête. http://tannevanbree.nl/resultatenEnquete1.pdf

van Bree, T. (2012). Resultaten tweede enquête. http://tannevanbree.nl/resultatenEnquete2.pdf

Hölldobler, B. (2006). Ants: Nature’s Secret Power. Documentaire: vanaf minuut 46. http://topdocumentaryfilms.com/ants-natures-secret-power/

International Data Corporation. (2011). IDC Predicts 2012 Will Be the Year of Mobile and Cloud Platform Wars as IT Vendors Vie for Leadership While the Industry Redefines Itself. http://www.idc.com/getdoc.jsp?containerId=prUS23177411

Laarman, J. (2006). Bone furniture. http://www.jorislaarman.com/bone-furniture.html

Lee, E. (2012). A Taxonomy of Data Visualization. http://visualizing.org/stories/taxonomy-data-visualization

Lenke, M. (2012). Snowflake. http://www.flickr.com/photos/matthias_lenke/6841161133

LUST. (2012). Designing Programs. http://www.creativeapplications.net/theory/designing-programs-theory/

Mearian, L. (2011). World’s data will grow by 50X in next decade, IDC study predicts. http://www.computerworld.com/s/article/9217988/World_s_data_will_grow_by_50X_in_next_decade_IDC_study_predicts

Internetpagina’s

53

[Nielsen Online, 2011]

[Rosenber, 2012]

[Shiffman, 2011]

[Watz, 2012]

Nielsen Online. (2011). Internet usage statistics. http://www.internetworldstats.com/stats.htm

Rosenberg, J. (2012). Re: The Algorithm Thought Police. http://n-e-r-v-o-u-s.com/blog/?p=2262

Shiffman, D. (2011). The Nature of Code. http://www.shiffman.net/teaching/nature/

Watz, M. (2012). The Algorithm Thought Police. http://mwatz.tumblr.com/post/17552814317/the-algorithm-thought-police

54

55

BIJLAGEN

56

1. Wat zie je als je naar de afbeelding kijkt ?

Informatie:

Ik doe onderzoek naar het gebruik van natuurlijke processen (bijv. de groei van schimmels en vertakking van nerven)voor de vorm van datavisualisatie. Datavisualisatie is een ontwerp discipline wat statistische data en complexe informatie grafisch weergeeft. Het doel is om de informatie zo weer te geven dat mensen patronen, trends of juist uitschieters herkennen, op manieren die teksten of tabellen niet toelaten.

Door de groeiende vraag is er behoefte aan nieuwe vormen/ technieken voor datavisualisatie. Daarom is het interessant om te onderzoeken of het gebruik van natuurlijke processen bij kan dragen aan vorm van datavisualisatie.

Ik heb gekozen om het natuurlijke proces van de vertakking van de nerven in een blaadje te gebruiken voor de vorm, omdat dit met verschillende input verschillende vertakkingspatroon geeft.

Het onderwerp van visualisatie is verstedelijking. De tien grootste steden van NL worden gevisualiseerd door de data over oppervlakte (km2) en hoeveelheid adressen te koppelen aan de grootte van de visualisatie, en de dichtheid van het patroon. Je zou dus in een oogopslag kunnen zien wat de grootste stad van NL is en welke het meest verstedelijkt, en verder weer onderlinge vergelijkingen kunnen maken.

ENQÛETE 1

57

2. Welke vorm spreekt je het meeste aan?3. En waarom?

4. Als de verschillende ‘groepen’ vertakkingen (zie afbeelding) voor verschillende data zou staan, denk je dat de data dan nog te onderscheiden is? Of is het te veel en beter dat het uit één groep vertakkingen bestaat ?5. En waarom?

58

6. Welke versie vind je beter voor de vorm van het vertakkingspatroon? Beginpunt in het midden onderaan, centraal, asymmetrisch of buiten patroon waardoor er een kleine stam ontstaat?7. En waarom?

8. Één of meerdere start punten voor de vorm van het vertakkingspatroon?9. En waarom?

59

10. Zie je hier verschil in de dichtheid van het vertakkingspatroon, of denk je dat de dichtheid het zelfde is?

11. De grootte van de visualisatie staat nu voor de oppervlakte van de stad, en de vertakkingdichtheid voor het aantal adressen. Zet de nummers van de afbeeldingen op volgorde van hoog aantal adressen(dichtheid) naar laag. (gescheiden met een komma)

12. En doe het zelfde voor de oppervlakte van de stad: van hoog naar laag. (gescheiden met een komma)

60

13. Als er meerdere visualisaties van st eden worden getoond, hebben ze allemaal dezelfde vorm. Vind je het belangrijk om de verschillende st eden t e kunnen onderscheiden zonder legenda (bijv door variaties in de vorm van de te maken)? Of is het niet zo belangrijk voor je en vind je het ook goed als er een label met de naam van de stad bij staat ? En waarom?

14. Vind je het mooie visualisaties? En waarom wel/ niet ?

15. Wat vind je van de hoeveelheid informatie gevisualiseerd wordt (adressendichtheid en oppervlakte van de 10 grootste steden van NL over verschillende jaren)? Veel, weinig, goed, en waarom?

16. Wat vind je van de combinatie van het onderwerp van visualisatie ‘verstedelijking’ met deze natuurlijke vorm van visualisatie?

17. Product :Het definitieve product wordt een interactieve applicatie, waar je als gebruiker een stad kunt select eren en een jaartal, en dan op de witte achtergrond van de applicatie kan klikken, en op de locatie waar je met je muis geklikt hebt ‘groeit ’ dan de visualisatie van de betreffende stad. Dan is er de optie om de achtergrond te wissen, of juist een weer een stad en jaartal te kiezen, en op een andere locatie of dezelfde te klikken, en daar wordt dan de tweede visualisatie getekend. Op die manier kun je verschillende steden, of de zelfde stad in verschillende jaartallen naast elkaar zetten, of zelfs over elkaar, en de patronen goed vergelijken. Op die manier kun je zelf conclusies trekken.Wat vind je van het concept van deze applicatie? Klinkt het bruikbaar, of zou je bepaalde dingen anders willen zien ?

61

ENQÛETE 2

Kun je deze visualisaties op volgorde van dichtheid van de vertakking zetten? Van laag naar hoog. Je kunt het invoeren door de getallen te scheiden met een komma.

62

63

VISUELE INDEX

120422_213019.png120422_145919.png120421_233205.png

120424_195532.png120424_195353.png120423_150807.png

120420_224536.png120410_143156.png120410_133724.png

64

120515_162040.png

120516_194325.png

120507_211713.png

120515_155434.png

120516_193159.png

120502_111222.png

120515_152330.png

120515_172318.png

120429_154108.png

65

120517_094618.png

120518_162047.png

120516_195814.png

120516_222807.png

120517_202557.png

120516_195809.png

120516_221525.png

120517_201720.png

120516_195513.png

66

120529_111808.png

120529_124641.png

120518_162903.png

120529_110245.png

120529_124304.png

120518_162647.png

120519_110633.png

120529_121630.png

120518_162452.png

67

120529_161615.png

120601_213843.png

120529_142752.png

120529_161147a.jpg

120601_182721.png

120529_134501.png

120529_142847.png

120529_161658.png

120529_134425.png

69