Infovis van de week – 5

Gert-Jan

Deze week kies ik voor een visualisatie die de zelfde boodschap als ons  wil overbrengen. Er is getracht de historische geolocatie te koppelen aan het stemgedrag van de landen. De auteur heeft voor volgende 4 categorieën gekozen.

  • Scandinavië
  • West Europa
  • Voormalig Oostblok
  • Voormalig Joegoslavië

Capture.PNG

De grijze lijnen stellen voor op wie het land gemiddeld het meeste stemt. We zien dat Scandinavië en Joegoslavië onderling sterk op elkaar stemmen, maar dat Europa en de Oostbloklanden vrij verspreid liggen op grafiek.

De kaart heeft ook interactie. Wanneer er op een land wordt geklikt zie je de stemmen van elk land, voor dit ene land. Er is ook een toggle voorzien om de uitgedeelde stemmen te tonen. Wanneer we België selecteren zien we het volgende.

Capture.PNG

Het is onmiddellijk duidelijk dat we onze meeste stemmen uitdelen aan Nederland. Wie de ranglijst aanvult is niet duidelijk zonder eerst over de landen te hooveren en de exacte waarden te vergelijken. Er is wel met kleurschakeringen gewerkt om een globaal beeld te vormen.

  • Donker blauw -> Ver boven het gemiddelde
  • Licht blauw -> Boven het gemiddelde
  • Grijs -> Gemiddeld
  • Rood -> Onder het gemiddelde

Persoonlijk vind ik dit een mindere keuze, op het eerste zicht zou ik zeggen dat blauw de gegeven punten zijn en rood de ontvangen. Maar hiervoor moeten we naar de kant van de pijl kijken; te vinden op het einde van elke lijn.

Na het selecteren van een land is het ook niet meer duidelijk welke landen bij elkaar horen, de buitencirkel en kleur van het lettertype behouden wel de juiste kleur maar dit is niet opvallend genoeg.

Uiteindelijk gaan we het zelfde idee willen overbrengen, al gaan wij dit dit doen met een cirkelweergave en kijken naar de rechtstreekse buurlanden.

Bron: http://www.zeit.de/kultur/musik/2015-05/eurovision-song-contest-points-award

Michael

Voor de visualisatie van deze week heb ik net zoals vorige week voor een visualisatie gekozen die data van het Eurovisie songfestival representeert. Maar ook omdat het gemaakt is met dc.js die achterliggend wel d3.js gebruikt om de visualisaties te realiseren.

Het eerste en belangrijkste deel van de representatie bestaat uit een matrix waarbij al de landen weergegeven worden op beide assen. Elke kruising stelt het gemiddelde aantal stemmen die elk land ontvangt. Een minpunt hier is dat het initieel niet echt duidelijk is in welke richting we de data moeten interpreteren.

Capture

Door de toevoeging van de tekst bij de 2 balkgrafieken aan de rechterzijde wordt het uiteindelijk wel duidelijk. De matrix geeft dus het aantal punten weer dat een land op de verticale as ontvangt van elk van de landenop de horizontale as.

Het is mogelijk om de landen in de matrix voorstelling te rangschikken volgens het aantal punten of de naam. Op zich heeft dit niet echt een toegevoegde waarde wanneer we de data proberen te interpreteren.

Wanneer er met de muis over een kruising gaat wordt de data in de balkgrafieken dynamisch aangepast. Er vormt zich wel een ander probleem want het is niet altijd eenvoudig om het correct gegeven aantal punten af te lezen doordat de grafieken relatief klein zijn en de punten op de verticale as dicht op elkaar liggen.

Men zou het gebruik van beide grafieken kunnen vergemakkelijken door de mogelijkheid te geven om een punt te selecteren op de eerste grafiek en dit vast te zetten. Hiermee kan er eventueel met de muis over de balkgrafiek gegaan worden om de data af te lezen zonder dat het geselecteerde land wijzigt wanneer de muis zijn focus verliest. Of eventueel gewoon de waarden zelf op de balkgrafiek tonen.

De balkgrafieken op zich zijn wel een leuke en belangrijke toevoeging aangezien het gemiddeld aantal stemmen niet altijd even correct is. Wanneer we bijvoorbeeld het aantal stemmen gaan vergelijken die Rusland en Oekraïne aan elkaar geven is er een daling te zien op de balkgrafieken in 2014. Dit kan hoogstwaarschijnlijk gelinkt worden aan de militaire spanningen die rond die periode tussen beide landen ontstaan is. Wanneer we enkel op de matrix kijken, zouden we verwachten dat beide landen nog steeds vaak op elkaar stemmen. De balkgrafiek is dus zeker een nuttige toevoeging om de data in de matrix beter te interpreteren.

Dit alles toont aan dat sommige visualisaties extra ondersteuning nodig hebben om de data op een correcte manier te interpreteren. Ook het feit dat sommige grafieken  relatief klein worden afgebeeld in vergelijking met de weergave tijdens het individuele ontwerp en hiermee de leesbaarheid ervan wordt verminderd.

Bron: http://ramblings.mcpher.com/Home/excelquirks/d3/dceuro

Sebastiaan

Om de nu schijnbaar wekelijkse traditie voor te zetten heb ik dus weer voor een interactieve visualisatie gekozen. Hij is wel wat anders dan de voorgaande, maar ik heb hem gekozen om de populariteit van het eurosongfestival to tonen in elk land. Dat wordt gedaan door het aantal tweets dat de hashtag #eurovision2014 hebben gebruikt op de dag van de finale te tellen. Die worden dan weer getoond op een wereldkaart.

infovis4

Door de grote wit-paarse blob zien we meteen dat het Verenigd Koninkrijk veruit het actiefst bezig was op Twitter. Maar wat me ook opviel is dat onze Amerikaanse vrienden het ook op de voet aan het volgen waren.

Wat ik al zeker goed vind aan de visualisatie is dat de tweets verbonden zijn aan een plaats en niet desnoods hun land. Je ziet zo convergenties rond de grotere steden. Moest je de landsgrenzen even kunnen wegdenken of met een knop afzetten zou ik dit nog interessanter gevonden hebben.

Om dat nog verder te staven is er zelfs een zoekfunctie voorzien om je favoriete stad te volgen doorheen de nacht. Zelfs in mijn klein dorpje waren er toch een tiental paarse kringetjes.

Wat ik eventueel nog mis is de optie om de tweets te lezen. Het kan zijn dat een tweet ironisch bedoeld is en daar wordt nu geen onderscheid onder gemaakt.

Als conclusie vind ik dit een zeer goede visualisatie voor wat hij moet dienen. De vraag hier was “hoeveel werd er getweet rond eurovisiesong op de dag van de finale” en die vraag is duidelijk beantwoord.

Bron: http://srogers.cartodb.com/viz/a17b7da4-d8c6-11e3-a6f8-0e73339ffa50/embed_map?title=true&description=true&search=true&shareable=true&cartodb_logo=true&layer_selector=false&legends=false&scrollwheel=true&fullscreen=true&sublayer_options=1|1&sql=&sw_lat=31.87755764334002&sw_lon=-14.0625&ne_lat=56.607885465009254&ne_lon=41.30859375

Infovis van de week – 4

Gert-Jan

Deze week werd gevraagd om een relevante visualitie voor te stellen. Hierop ben ik opzoek gegaan naar een alternatieve visualisatie van onze dataset.

Onderstaande afbeelding toont de scores van Rusland, de punten die ze hebben mogen ontvangen in het blauw, de gegeven punten in het rood.

Capture

Ik vind dit een minder geslaagd ontwerp. Het is onoverzichtelijk (teveel lijnen) en het is me niet onmiddelijk duidelijk wat de grafiek wilt overbrengen. Het lijkt ook dat de dikte van de lijnen het aantal punten voor stelt. Maar dit werkt niet omdat alle lijnen vrijwel niets verschillen.

Conclusie: we gaan het beter doen 🙂

Bron: http://www.kevin.ie/archives/eurovision/

Michael

De opdracht voor de infovis van deze week was dat deze relevant moest zijn voor ons project. Dus deze week heb ik gekozen voor een infographic van het eurovisiesongfestival.

Capture

(Dit is slechts een deel van de infographic, de volledige weergave  kunt u bekijken op de onderstaande website, bron)

Het is niet direct de manier waarop we de data willen visualiseren maar
de infographic biedt ons wel enkele nieuwe ideeën. Namelijk enkele andere relevante vergelijkingen die we kunnen maken met
de data die we ter beschikking hebben.

Zelf vind ik infographics zeker een leuke manier om data te visualiseren in vergelijking met klassieke grafieken die gewoonlijk gebruikt worden.

Bron: https://s-media-cache-ak0.pinimg.com/736x/2f/41/93/2f419316ce19997c6ef17d661f74d812.jpg

Sebastiaan

Deze week zet ik weer mijn traditie voort om interactieve visualisaties te kiezen. Deze keer echter heeft het te maken met onze keuze om het Eurovisie songfestival te visualiseren.

infovis3

We hadden voor we dit zagen al een idee over een land in het midden van een cirkel te zetten en de relevante landen daar dan mee te verbinden. Deze website toont dan ook meteen dat het haalbaar is. Enkele aspecten kunnen we daar dan nog op verbeteren zoals:

  • Geen overdadige animaties gebruiken
  • Buurlandrelaties aangeven
  • Meerdere jaarresultaten tegelijk tonen
  • Zoekfunctie voor een bepaald land te vinden

Wat we al wel zeker kunnen gebruiken is de dubbele pijl met de score in. Eventueel ook de grootte van de vlaggen voor de ranking, maar daardoor is de winnaar niet altijd even duidelijk. Dit kan bijvoorbeeld opgelost worden door een soort kroontje op de winnaar te plaatsen.

Bron: http://datos.rtve.es/eurovision/

Infovis van de week – 3

Gert-Jan

Deze week een visualisatie die ongetwijfeld elke computer science student al wel eens heeft tegen gekomen.

1276_Lines_of_code_Sep2015_FB

We zien hier het aantal lijnen code waaruit een programma bestaat gevisualiseerd, beginnende van een simpele Iphone app tot het gigantische Google. Opeen volgende iteraties van een programma worden verbonden door een halve cirkel,  met als label de procentuele groei.

Wat me vooral verbaasde in de data zelf is dat het aantal lijnen code in ‘car software’ zo gigantisch is. De reden hiervoor ga ik in de toekomst nog nader bekijken.

Ik vind het een geslaagde voorstelling van de data. Een leuke toevoeging zou de mogelijkheid zijn om de software onderling van plaats te wisselen. Dit zou het makkelijker maken om twee entries met elkaar vergelijk die niet samen op het scherm zichtbaar zijn.

 

Sebastiaan

Deze week heb ik nog eens gekozen voor een interactieve visualisatie, getiteld “The flow towards Europe”. Het toont een kaart van Europa waar de vluchtelingenstroom op wordt getekend. Er zijn twee weergaven: Algemeen en specifiek per land. Bovenaan is er een slider waar de verschillende maanden van de afgelope 4 jaar op staan. Je ziet daar ook dat het aantal vluchtelingen enorm toeneemt tegen 2015/2016.

infovis1

Algemene weergave

De algemene weergave is nog duidelijk voor de eerste paar maanden, maar naarmate het dichter bij het heden komt is het een grote boel van streepjes dat mijn computer doet haperen. Ze hebben het wel goed opgelost door er dan een balkweergave nog extra bij te zetten, zodat je het overzicht niet compleet verliest.

infovis2

Specifiek voor België

De detailpagina vind ik het interessantste. Je kan het zo duidelijk koppelen aan de gebeurtenissen die de afgelope maanden in het nieuws zijn gekomen, zoals Polen dat bijna geen vluchtelingen aanvaardt.

Het enige wat me echt stoort aan de grafiek is dat hij moeilijk te bedienen is op mijn 1366×768 scherm. De hele kaart past er niet op en de tijdslider had ik zelfs eerst niet gezien. Het is zo wel indrukwekkender.

Bron

Michael

 

De visualisatie voor deze week is niet per se een visualisatie waar men veel uit kan concluderen. Het is eerder een leuke manier om de linke tussen verschillende websites weer te geven. In de visualisatie representeert elke bol een website. Het aantal linken naar elkaar bepaald hoe dicht ze bij elkaar gepositioneerd zullen zijn. De hoeveelheid bezoekers van elke website bepaald de straal voor een bol.

Het is mogelijk om naar je favoriete website te zoeken. Het is mogelijk om extra informatie over de website te verkrijgen door op een bol afzonderlijk te klikken.

Capture

 

Een nadeel aan de grafiek is het traag laden van extra datapunten wanneer er verder wordt ingezoomd. Maar zoals hierboven reeds vermeld is de grafiek niet echt gemaakt om zaken aan te tonen. Buiten het feit dan dat Facebook, Youtube en Google nog steeds veel gebruikt worden.

Bron: http://internet-map.net/

 

37 & 75

Tijdens de les kregen we de opdracht om de getallen 37 en 75 te visualiseren zonder enige context. We zijn er in geslaagd om 17 representaties te bedenken gedurende 20 minuten.

  1. Klassieke weergave m.b.v. turven
  2. Voluit geschreven
  3. Graden in hoek (Origineel, al zeggen we het zelf)
  4. Arabische getalvoorstelling
  5. Romeinse getalvoorstelling
  6. Elk symbool stelt een bepaalde hoeveelheid voor
  7. Taartvoorstelling
  8. 2 cirkels, met respectievelijke grootte in straal
  9. Zelfde idee als 8, enkel zijn de cirkels op elkaar geplaatst.
  10. Cumulatieve staafvoorstelling.
  11. Simpele staafvoorstelling
  12. Hetzelfde als 11, maar met 3D-effect.
  13. Staafvoorstelling waar het aantal keer dat een getal voorkomt op de y-as staat.
  14. Lijndiagram.
  15. Hetzelfde als 14, maar met geïnverteerde y-waarde.
  16. Staafdiagram waar wordt geteld hoeveel gelijke tekens er zijn.
  17. Hetzelfde als 10, maar dan horizontaal.

Scan (2)

Zo kunnen we besluiten dat we in zeer korte tijd al veel voorstellingen hebben gevonden. Dit ging ook zo gemakkelijk omdat we het op papier hebben getekend. Moesten we meer tijd hebben gehad zouden we er nog meer kunnen vinden.

Omdat we geen context kregen over de twee getallen was het mogelijk om elke visualistie te gebruiken.

Wanneer we onze initiële prototypes gaan schetsen voor ons project gaan we dat ook op papier doen, net omdat het zo snel gaat.