De QRcode op de Jodenbreestraat (de QRcode werkt ook vanaf het scherm)

De verborgen culturele schatten van de IJdijken

Enkele eeuwen geleden is er begonnen met de aanleg van een serie dijken die het gebied rond de rivier ‘t IJ moest beschermen tegen het water. In de loop der jaren is er in het gebied veel gebeurd, deze verhalen zijn recentelijk digitaal verzameld en een selectie van deze verhalen is ondergebracht in een route die langs een deel van de IJdijken loopt.

De Opdracht

Recentelijk kregen wij via Sparked de opdracht een mobiele website te ontwerpen om deze verhalen te ontsluiten. Het interessante aan deze opdracht was dat de website locatie specifiek moet zijn en twee dingen goed moet kunnen. Enerzijds moet de website mensen langs de route kunnen leiden en daarnaast moest deze de op detail niveau de verhalen ontsluiten. Onderdeel van de opdracht was dat het moet werken op Android en iPhone en een beperkte ondersteuning geeft aan overige toestellen.

Langs de route zijn op de fysieke locaties borden uitgezet, die de gebruiker naar de website verwijzen. Door het invoeren van een korte URL of het scannen van de QRcode komt men direct op de website van de specifieke locatie.

Eerste conceptuele schetsen

Het ontwerpproces

In het ontwerp kreeg iedere locatie op de route een eigen website waar vanuit de gebruiker de bijbehorende verhalen kan ontdekken. We hebben gekozen de locaties in een simpele kaart weer te geven zodat de gebruiker inzicht heeft in de plaats waar hij of zij zich bevind. Op deze kaart worden de verhalen als locatie markers weergegeven.

Scan de code om de demo op je mobiel te zien.

Vanwege het visuele karakter van de verhalen, hebben we ze als korte sideshows ontworpen waar de gebruiker doorheen kan swipen. Na het maken van een demoversie, konden we verder met het visuele ontwerp (in samenwerking met Resoluut) en het maken van het uiteindelijke product (door MediaBunker).

Het resultaat

De IJdijkenroute die nu staat uitgezet loopt van het Pontplein in Velsen naar de Jodenbreestraat in Amsterdam en is ongeveer 40 km lang. De route kan in beide richtingen gelopen/gefietst worden, zie de ijdijkenroute website voor aanvullende informatie.

Uiteraard maakten we bij het ontwerpproces gebruik van onze favoriete tools:

• Fireworks voor wireframes en visueel ontwerp
• TAP voor prototyping
• InDesign voor documentatie

Op zaterdag 28 mei keerde Achmea, naar aanleiding van haar 200 jarig bestaan, terug naar de wortels van haar bedrijf en organiseerde in het Friese dorpje Achlum de Conventie van Achlum. Maanden van voorbereiding gingen vooraf aan dit evenement en ook wij hebben vanaf oktober gewerkt aan de website en mobiele site.

Aangezien het hier ging om een site voor een evenement, moest de site flexibel zijn en ruimte bieden aan verschillende informatie op verschillende momenten. We zijn daarom begonnen met het in kaart brengen van alle informatie en functionaliteiten die geïntegreerd moesten worden binnen de site en hebben deze ingedeeld in verschillende fases. Vervolgens hebben we de site structuur opgezet, waarbinnen alle informatie en functionaliteiten een plekje kregen. Met deze structuur als uitgangspunt zijn we per fase te werk gegaan.

Zo bestond de eerste fase en hiermee de eerste release van de site uit de vooraankondiging van de conventie en kon men een eerste indruk krijgen van wat deze dag in zou gaan houden. In volgende fases ontwierpen we onder andere de mogelijkheid je aan te melden voor de conventie, een interactief blokkenschema waarmee je je persoonlijke programma kon samenstellen en een brainstorm waarbij je kon reageren op verschillende stellingen omtrent de toekomst van Nederland. Op de dag van de Conventie konden degenen die niet in Achlum aanwezig waren de live stream volgen via de site.

Voor degenen die wel aanwezig waren in Achlum ontwierpen we ook de mobiele site van de Conventie. Hiermee kon je de meest recente tweets met #achlum volgen, snel even je persoonlijke programma bekijken of de plattegrond raadplegen om snel je weg te vinden in Achlum.

Ondanks de kou en regen werd het een succesvolle dag met als onderwerp van gesprek ‘De staat en de toekomst van Nederland’. Een groot aantal sprekers kwam voorbij, waaronder voormalig Amerikaans President Bill Clinton, Hans Wiegel, Femke Halsema en Geert Mak.

Nu de Conventie geweest is, kan je op de site nog terecht voor de laatste nieuwsberichten, conclusies en (video)verslagen.

UNITiD was verantwoordelijk voor het interactie ontwerp voor beide sites, Resoluut voor het grafisch ontwerp en TechTribe voor de technische realisatie.

Sociaal op Stap (SoS) bestaat uit een website en Android applicatie voor jongeren met autisme. De website is erop gericht deze jongeren te helpen met sociale situaties. Iemand begroeten of iemand troosten is namelijk nog niet zo makkelijk als je een vorm van autisme hebt. “Sociaal op Stap” is een gezamelijk initiatief  van de CED-groep en het Landelijk Netwerk Autisme en heeft gisteren een IPON stimuleringsaward gewonnen. Deze award wordt uitgereikt aan ICT producten voor het onderwijs die zich onderscheiden in innovatie, kwaliteit en originaliteit. De genomineerden zijn beoordeelt op gebruik, ontwerp, toegankelijkheid en prijs, waarbij SociaalOpStap als beste uit de bus kwam. Een award om trots op te zijn dus. Bij deze feliciteren wij daarom de CED groep en het Landelijk Netwerk Autisme.

SociaalOpStap bestaat uit stappenplannen die je helpen in sociale situaties. Hoe geef je iemand een compliment bijvoorbeeld? Op de website kunnen jongeren de stappenplannen aanpassen. Omdat sociale situaties zich meestal niet afspelen achter je desktop, is er ook een mobiele website en Android app. UNITiD was verantwoordelijk voor het interactie ontwerp. Het grafisch ontwerp is gemaakt door Resoluut. Elements interactive heeft de technische realisatie voor zijn rekening genomen.

Het ontwerpen voor jongeren met autisme vraagt om inlevingsvermogen en kennis van de doelgroep. Voor mijn afstudeerproject (DfI, TU Delft) heb ik ook een mobiele applicatie ontworpen voor autistische jongeren en had daarom al veel onderzoek gedaan naar de doelgroep. Voor SoS hebben we ook een aantal prototypes getest met jongeren, wat uiteindelijk tot een mooi resultaat heeft geleid. Wij denken dat toepassingen met (mobiele) technologie een enorm verschil kunnen maken voor jongeren met een beperking, mits deze goed aansluiten bij de verwachtingen en specifieke situaties van de gebruikers.

Bol.com, één van de meest populaire internetwinkels in Nederland heeft sinds kort een nieuwe mobiele site. UNITiD verzorgde het interaction design en The Mobile Company was verantwoordelijk voor de implementatie.

Via deze mobiele winkel, m.bol.com, vinden klanten ruim 3,8 miljoen artikelen met behulp van de zoekmachine of door te bladeren door de verschillende product-categorieën. Naast het assortiment kunnen gebruikers zaken zien als sterrenbeoordelingen, toplijsten en tiplijsten. Dit helpt hen ook onderweg een goede keuze te maken uit het brede assortiment. Artikelen kunnen worden besteld (betaling via acceptgiro) of toegevoegd worden aan een verlanglijstje. Verder kunnen klanten, na inloggen, hun bestelstatus en het verlanglijstje zien.

Ontwerp

Op basis van assumptieve persona’s zijn verschillende gebruiksdoelen gedefinieerd, welke als basis dienden voor wireframes en user flows. Na analyse van de eigenschappen en mogelijkheden van de meest populaire toestellen en browsers zijn verschillende varianten van de wireframes uitgewerkt. De site past zich automatisch aan aan het mobiele toestel van de bezoeker waardoor altijd de best mogelijke mobiele winkelervaring gegarandeerd is.