Introductie

In deze casestudy staat beschreven hoe ons project proces verlopen is. 
Zo komen de verschillende fases aan bod en worden de hoogtepunten van deze fases uitgelicht. Gebruik de knoppen hierboven om snel te kunnen navigeren binnen deze pagina. 

Het Vraagstuk

Hoe kan Ideate de informatie die zij vergaren uit experimenten, op een interactieve, visuele en overzichtelijke manier inzichtelijk maken voor de publieke sector?

De opdrachtgever waar wij een project voor gaan uitwerken is Ideate. Dit is een bedrijf dat ontwerpt voor verandering, complexe vraagstukken ontrafelen en verbinden en op deze manier mensen met mogelijkheden.

Ideate ontwerpt op een onderzoekende manier gedragsinterventies vanuit een menselijk perspectief volgens de Design Thinking methode en ervaringen vanuit eerdere experimenten.

De aanleiding komt voort uit het probleem dat de ingewonnen data niet op een overzichtelijke en duidelijke manier gepresenteerd en overgebracht wordt. Ideate is op zoek naar een visuele interactieve manier waarop deze data wel logisch gepresenteerd kan worden.


Image

Het Onderzoek

Uit ons onderzoek is gebleken dat het gebruik van sto-rytelling helpt bij het behalen van een bepaald doel. Het zorgt ervoor dat er op een effectieve manier gecommuniceerd kan worden met de doelgroep.

De hersenen slaan informatie voor een groot deel op via het visuele kanaal. Ook wordt door middel van verhalen de sympathie hormonen gestimuleerd wat effect heeft op de beleving van mensen. Dit is een belangrijk punt om mee te nemen in de visualisatie van de data die Ideate via hun experimenten verzameld. Omdat de programmaman-agers van Ideate de data die zij hebben verzameld zo overzichtelijk en begrijpelijk over willen brengen op de klant.

Een ander punt wat we uit het onderzoek kunnen halen is dat een goed verhaal bestaat uit een begin, midden en eind. Hierbij kan gebruik gemaakt worden van de twaalf stappen van storytelling om een verhaal aantrekkelijker en dynamischer te maken.

De archetypen zijn persoonlijkheden die je terug kunt laten komen in een verhaal en kunnen hier vorm aan geven. Op dit punt weten we nog niet of en hoe we invulling gaan geven aan het verhaal. Er kan hier in een later stadium wel naar gekeken worden. Storytelling in combinatie met User interaction Design wordt ook wel visual design genoemd. Dit kan helpend zijn bij het begrijpelijk maken van bijvoorbeeld een website, maar ook datavisualisaties, infographics etc.


Image

Responsive Design

Om de informatie en data op alle mogelijk manieren aan zoveel mogelijk mensen te kunnen tonen en overbrengen is het belangrijk om de webapplicatie een responsive design te geven. 

Image

Data afschermen

Informatie moet betrouwbaar kunnen zijn. Hierbij is het belangrijk dat alleen de juiste personen bepaalde informatie moeten kunnen inzien. Daardoor is de omgeving afgesloten met een login scherm.

Image

Experimenten vergelijken

Wanneer er resultaten van meerdere experimenten of tijdstippen beschikbaar zijn moet het mogelijk zijn om deze sets met data tegenover elkaar te kunnen vergelijken om zo conclusies te kunnen trekken.

Image

Storytelling

Informatie kan best saai zijn voor mensen die zich niet bewust zijn van de context of relevantie. Hiervoor is een Storytell functionaliteit aangebracht waarmee informatie op een interactieve manier aangeboden kan worden.

Design Principles

Image

Overzicht

Overzicht zorgt voor nieuwe inzichten.
Het is ons doel om  alle data overzichtelijk op te stellen.

Image

Perspectieven

Het is goed om het een verhaal van meerdere kanten te bekijken.
Wij willen ervoor zorgen dat elk perspectief aan bod komt.

Image

Data Visualisatie

Je kunt data pas echt laten spreken als je het zichtbaar maakt.
De data visueel zichtbaar maken voor de eindgebruiker.

Image

Toegankelijk

We willen het gebruik zo makkelijk mogelijk maken door te ontwerpen met een responsive design.
Op deze manier kan het op elk smart device gebruikt worden.

Image

Privacy

Waardevolle data moet goed beschermd worden.
Gebruikers en data privacy veiligstellen is van groot belang.

3 Concepten

Nadat we ons onderzoek afgerond hadden, hebben we de volgende 3 concepten bedacht vanuit verschillende brainstorms en inzichten uit de het onderzoek dat we naast elkaar gelegd hadden. Waarbij elk concept overeen moet komen met de design principles.


Fascia

Fascia is een dashboard tool die speciaal voor ideate bedacht is. Ideate is op zoek naar een dashboard tool die duidelijk en overzichtelijk is. Door middel van deze tool kan ideate heel makkelijk zijn experimenten met transities verzamelen in 1 ruimte en deze ook delen met de klant. 

Hiervoor hebben we onderzoek gedaan naar de huidige werkwijze van ideate en hebben dit in verband gebracht met een dashboard. Van de werknemers van Ideate hebben wij vernomen dat ze een voortgangsdashboard (hoe ver in de transitie) en een effectiviteits dashboard (resultaten van transitie) willen hebben. 

Image

Image

Scenema

Het concept dat we Scenema hebben genoemd is voortgekomen uit ons onderzoek naar data visualisatie en storytelling. Dit zijn twee belangrijke componenten die gebruikt (kunnen) worden in het maken van een dashboard.

Uit het onderzoek is gebleken dat data storytelling neerkomt op het effectief communiceren van informatie dat is afgestemd op een bepaald publiek. Hiermee kunnen we een narratief creëren en deze zelfs een stem geven. Ook weten we nu dat door het gebruik van een karakter, de doelgroep aan de hand kan worden meegenomen door het verhaal heen. Zo wordt de verhalende informatie nog persoonlijker.

Het ontwerp is gemaakt op basis van de doelgroep: de publieke sector. Omdat dit erg breed was hebben we een klant gekozen van ideate waar we ons op richten. Dit is (zoals eerder genoemd) Rijkswaterstaat. Hiervoor hebben we een persona gemaakt.


Virtual Dash

Virtual reality (VR) heeft de afgelopen jaren de technische krantenkoppen gedomineerd met zijn vermogen om zijn gebruikers onder te dompelen in een virtuele, maar veilige wereld. Gaming is een van de meer bekende VR-toepassingen, maar het potentieel stopt daar niet.

Het doel van het concept Virtual Dash is om een uitgebreide visuele en auditieve beleving te creëren voor de klant. Het voordeel van het gebruik van VR is dat je jouw klanten naar elke locatie kunt nemen in een handomdraai. Denk aan verschillende landen, steden, huidige situaties, gewenste situaties, enz.

Deze unieke manier van het tonen van data zal de klant minder snel vergeten omdat het een ervaring voor ze is.

Image

Narrativ


Het nieuwe concept dat we hebben bedacht heeft als basis het dashboard idee vanuit het Fascia concept. Het ontwerp zal een responsive design hebben.

Vanuit het Scenema concept wordt het storytelling gedeelte geïmplementeerd. Hiermee bedoelen we dat het doornemen van de data kan worden gedaan door naar een verhaal te luisteren. Het is een optie die niet verplicht is maar kán worden gebruikt. De data kan ook via het dashboard worden bekeken waardoor de gebruiker zelf kan bepalen naar welke experimenten en grafieken gekeken wordt.

Tot slot, het concept Virtual Dash. Het VR gedeelte willen we meenemen in het concept maar wordt teveel werk om nog uit te werken in ons prototype. Om deze reden hebben we ervoor gekozen om de optie wel aan te bieden maar zullen we de uitwerking hiervan in het adviesrapport beschrijven.


Bekijk het prototype
Image

Case Video

Prototype


Dashboarding

Informatie opslaan kan al snel onlogisch worden wanneer er geen logisch verband is aangebracht. Om dit op te lossen hebben wij de behoefte van de klant in kaart gebracht en deze functioneel toegepast in het prototype. Zo kan er in de gestructureerde data worden gezocht en gefilterd.
Image

Image

Experimenten vergelijken

Wanneer je een set met data hebt verteld dit maar één kant van het verhaal. Door verschillende sets met data tegenover elkaar te houden kunnen er verbanden worden gevonden . Deze verbanden leveren op zichzelf conclusies op die nodig zijn om succes te kunnen meten.

Storytelling

Verhalen zorgen ervoor dat er op een effectieve manier gecommuniceerd kan worden en zo tot betrokkenheid van de doelgroep en resultaten te komen. Bij veel grafieken of feiten en cijfers haken mensen al snel af (Van Iersel, 2020). De kracht van storytelling ligt vooral bij het invullen van beelden wanneer een verhaal wordt verteld (Van Iersel, 2020). Dit is een erg belangrijk onderdeel omdat onze hersenen informatie voor een groot deel via het visuele kanaal verwerken. 
Image

Styleguide

Voor het maken van Narrativ hebben wij voor de volgende kleuren en lettertypes gekozen. Zo staat oranje voor speels en warm. Blauw staat voor stabiliteit en vertrouwen. 

Lato staat bekend om zijn ronde randen en de benaderbare warmte die het de lezer geeft. Daarnaast heeft het Lato font originele eigenschappen wanneer deze in het groot worden gebruikt. 

Open Sans is ontworpen met open vormen en een neutrale, maar vriendelijke uitstraling. Het is geoptimaliseerd voor print-, web- en mobiele interfaces en heeft uitstekende leesbaarheid kenmerken in de lettervormen.

Image
#2a2a77
Image

#f16622

Image
#2a2a77
#2a2a77
#2a2a77
#2a2a77

Lato

H1

Italic

Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet

H2

Italic

Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet

H3

Italic

Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet

H4

Italic

Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet

H5

Italic

Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet

Open Sans

Regular

ABCDEFGHIJKLMN
OPQRSTUVWXYZ

abcdefghijklmn
opqrstuvwxyz

1234567890!@#$%

Bold

ABCDEFGHIJKLMN
OPQRSTUVWXYZ

abcdefghijklmn
opqrstuvwxyz

1234567890!@#$%


Testen

Om naar een sterk concept toe te werken hebben wij in verschillende fases getest. Hierbij hebben wij 3 concepten onderzocht en getest. Uit de resultaten is een eindconcept gekomen, namelijk "Narrativ". Om de gebruiksvriendelijkheid te testen hebben wij het concept omgezet in een wireframe. De resultaten van deze test hebben uiteindelijk geholpen om tot een visueel dashboard prototype te komen.

Hieronder staan de drie verschillende testmethodes uitgelicht.


Image

Card sorting

We hebben voor de cardsorting methode eerst hoofdpagina's gemaakt waarvan wij vinden dat die in het dashboard moeten komen en hebben de respondenten de pagina's in laten vullen. Dus wat denken de respondenten tegen te komen op de pagina en wat zijn daar de verwachtingen bij op UX/UI gebied. Tijdens de test kwamen we er achter dat ondanks de opdracht en de context uitgelegd is, het voor de respondenten toch nog lastig was om de pagina's in te vullen.
Image

Paper prototyping

Na de cardsorting methode hebben we samen met de respondenten een paperprototype test gedaan. Hier hebben we de respondenten gevraagd de navigatie die ze in de cardsorting methode hebben gemaakt visueel te maken op schermen die we in een miro omgeving hebben klaargezet. Ook voor deze methode hadden we eerst een eigen invulling gegeven aan de test, een soort hypothese, en hebben deze na alle testen gekeken wat de overeenkomsten en verschillen waren.
Image

Useability

Op basis van de usability tests die we hebben uitgevoerd kunnen we concluderen dat de flow van de schermen in het prototype goed werkt. Testpersonen kunnen alles gemakkelijk terug vinden.Wel zijn er nog een aantal kleine aanpassingen die gedaan moeten worden om het prototype te finetunen. Na het implementeren van deze kleine aanpassingen kunnen we stellen dat het prototype dusdanig is getest bij de doelgroep, dat het een goed werkend prototype is dat we kunnen presenteren aan Ideate.

Team Crane

Hey!
Team Crane is een groep met ieder zijn eigen kwaliteiten. Op deze manier vullen we elkaar goed aan.
Wij van team Crane hebben in samenwerking met Ideate Narrativ op de wereld gebracht.
Hiervoor hebben we gebruik gemaakt van een human centered designproces.


Image

Ryan van Winden

Visual Designer

Image

Jordy Houwaart

Prototype & Technologies

Image

Nikki Mast

Interaction designer

Image

Hanno op den Brouw

UX Research & Testing