Het kan heel interessant zijn om op een andere manier naar je sociale netwerken te kijken. Slimme programmeurs experimenteren met visualisaties van vrienden op bijvoorbeeld Facebook, Last FM en LiveJournal met soms schitterende resultaten. In ieder geval bieden ze weer eens een nieuw perspectief. Zo ontwikkelde Sebastian van Sande de Facebook Visualiser.

Als een organisch geheel vormen zich sociale netwerken om een geselecteerde vriend. Je ziet meteen welke vrienden bij elkaar horen, welke subgroepen van vrienden zijn ontstaan om een bepaalde vriend of vriendin, en er kunnen filters toegepast worden op je netwerk. Een andere visualisatie is die van Daniel Claren, hij ontwikkelde de Mutual Friend Network Visualisation.

Toegevoegde waarde

Wanneer voegt zo’n interactieve netwerkvisualisatie echt iets toe? Gaat het vooral om een ontdekkend navigeren, het kijken naar data vanuit een nieuw perspectief? Bij een bestaand netwerk waarbij je zelf vrienden hebt toegevoegd, biedt het een nieuwe blik op je bestaande connecties. Je weet al grotendeels welke gezamenlijke vrienden er zijn en welke gedeelde interesses je hebt. Het is een leuke speelse manier om naar je vriendengroep te kijken.

Bij een netwerk waar je bij hoort vanuit interesse of professie, biedt een dergelijke visualisatie meer voordelen. Zoek je iemand met bepaalde kennis of vaardigheden binnen je bedrijf? Dan kan je snel zien wie de meest relevante kennis heeft, wie dichtbij je staan in je netwerk, wie je kan introduceren aan die persoon. Dit kan handig zijn voor grote bedrijven en overheidsinstellingen waar werknemers nog al eens langs elkaar heen werken. Helemaal als je kan filteren bepaalde interesses en kennis. Persoonlijk gebruik ik nooit ‘friend suggestions’ op Facebook of andere sociale netwerksites. Maar in een context van werk of hobby kan ik me voorstellen dat netwerksuggesties interessant zijn.

Een mooi voorbeeld is een visualisatie van ED-MEDIA die ontwikkeld is voor de World Conference on Educational Multimedia, Hypermedia & Telecommunications. De visualisatie laat auteurs zien die verbonden zijn met elkaar door citaten in wetenschappelijke publicaties. En wil je jouw favoriete muziek ontdekken op een andere manier dan Last.fm je biedt, kijk dan eens op Tuneglue.

Platenmaatschappij EMI lanceerde in 2006 een website genaamd Tuneglue waar muziekliefhebbers nieuwe artiesten kunnen ontdekken die aansluiten bij hun smaak. In plaats van een lijstje ‘similar artists’ kan je per artiest gerelateerde artiesten zien in een netwerk. Helaas doet de link naar releases het niet (je zou hiermee direct naar Amazon verwezen moeten worden) en is er ook geen link met Last.fm om aanvullende informatie over de artiest te lezen. De app werkt verder erg mooi, leuk om doorheen te klikken en nieuwe artiesten te ontdekken.

Persoonlijk lijkt een interactieve visualisatie me interessant als extra view op een bepaald netwerk. Worden ze nu nog vaak als aparte applicaties ontwikkeld voor bestaande netwerken, ik zou graag in LinkedIn willen kunnen wisselen naar een netwerk visualisatie, of bij Last.fm een artiest direct kunnen zien in de Tuneglue omgeving. Ik ben benieuwd of dit soort applicaties in de toekomst aan bestaande netwerksites toegevoegd gaan worden.

Meer inspiratie voor netwerk visualisaties is te vinden op de website Visual Complexity.

Ontwerpen voor de mobiele gebruikscontext

Waar het bij een gewone website redelijk goed te voorspellen is in welke omgeving de gebruiker zich bevindt wanneer hij de site bezoekt, kan het bij mobiel zo ongeveer overal zijn. In een volle tram, op de fiets, op het toilet en ga zo maar door.
De tijd en aandacht die gebruikers hebben voor de mobiele site of applicatie is daardoor zeer beperkt. Bovendien kan het gebruik onderbroken worden doordat gebruikers worden afgeleid door andere taken of impulsen vanuit de omgeving. Daarom is het van belang de structuur zo simpel mogelijk te houden en de navigatie zo te ontwerpen dat het gebruikers voldoende houvast biedt.
Om tegemoet te komen aan de beperkte tijd en aandacht van mobiele gebruikers is het aan te raden zoveel mogelijk te focussen op hun behoeften en alleen die informatie aan te bieden die zijn in hun mobiele context nodig kunnen hebben. Anders dan achter een computer zijn in de mobiele gebruikscontext ook (en vooral) tijd- en plaats-gerelateerde zaken van belang. Mobiele gebruikers zijn vaak op zoek naar informatie die hen op die plaats, op dat moment uit de spreekwoordelijke brand helpt. Laat dat ook net hetgeen zijn waar mobiel goed in is; veel mobiele telefoons kunnen met GPS bepalen waar je bent, je draagt je telefoon bijna altijd bij je en in slechts enkele seconden heb je een browser (of app) opgestart.
Kortom, de mobiele gebruikerscontext stelt hele andere eisen aan het ontwerp en het volstaat dus niet om een bestaande website met een soort handheld stylesheet geschikt te maken voor mobiel. Het is belangrijk voorafgaand aan het ontwerpen je te verdiepen in de mobiele behoeften van je doelgroep. Het gebruik van scenario’s en/of persona’s helpt bij het selecteren van de juiste functies en informatie voor de beste mobiele user experience.

Ontwerpen voor mobiele devices

Hoewel het ontwerpen voor de desktop ook vele onzekerheden kent kunnen we er eigenlijk altijd wel vanuit gaan dat een schermresolutie van 1024×768 pixels ondersteund wordt, dat we weten waar de vouw van de pagina ongeveer terechtkomt en dat gebruikers een muis en een keyboard tot hun beschikking hebben. Bij mobiel is dit lastiger; mobiele devices verschillen sterk in schermgroottes, er zijn verschillende inputmogelijkheden (numerieke toetsen, ‘pointers’, qwerty-toestenborden, touchscreens, etc.), verschillende besturingssystemen en dito browsers.
Gelukkig is het niet nodig voor ieder device dat op de markt is een apart ontwerp te maken. Ook hier is het van belang je te verdiepen in de doelgroep om de mogelijke devices die gebruik gaan maken van de site of applicatie te achterhalen (zeker als je overweegt een applicatie te maken omdat dit je doelgroep nog smaller maakt). Ook bij mobiele sites vallen sommige devices al snel af vanwege hun beperkte of verouderde mogelijkheden en zelfs als je het aantal beperkt houdt kun je toch snel een groot gedeelte van de doelgroep voorzien.
Om het ontwerpproces eenvoudiger te maken kun je de geselecteerde devices indelen in categorieën. Omdat bij mobiele devices de schermbreedte van het scherm belangrijker is dan de lengte kun je dit als basis gebruiken voor de categorisering. Natuurlijk spelen ook de inputmogelijkheden en rol hierbij.

Meer weten?

Wil je meer weten over hoe wij ontwerpen voor mobiel of heb je hulp nodig bij het neerzetten van de beste mobiele user experience neem dan contact met ons op!

Naast recensies van zo’n 1000 bijzondere, onderscheidende restaurants, bevat de nieuwe site een dagelijkse blog met vers nieuws voor foodies en een webshop met culinaire boeken. Later deze zomer zal specialbite.com nog worden uitgebreid met de onderdelen Travel en Events.

Om bezoekers meer bij de site te betrekken zijn er verschillende mogelijkheden voor interactie tussen SpecialBite, de sitebezoekers en de eetfanaten die restaurants selecteren en recenseren, ook wel SpecialBite-spotters genaamd. Deze spotters hebben een profiel op de site, zodat de bezoekers ze leren kennen. Bovendien kunnen de bezoekers eigen ervaringen en waarderingen toevoegen én – met een eigen profiel – een persoonlijke restaurantgids samenstellen.

‘De zomer van 2009 wordt gebruikt voor doorontwikkeling van de site: het fine tunen van de zoekmogelijkheden, het toevoegen van nieuwe functionaliteiten – zoals het volgen van je favoriete spotters – en het uitbreiden van het informatieaanbod,’ zegt Mireille Derks, uitgever van SpecialBite.

Om een goed beeld te krijgen van wat allemaal kan met Microsoft Surface, kijk even naar deze lijst van Surface killer apps van dit moment, samengesteld door Fast Company. Eén van mijn persoonlijke favorieten is de schitterende DaVinci app van Razorfish, die natuurwettten toepast op de virtuele wereld. De Surface kan gebruikt worden in retail, financiële diensten, gezondheidszorg, onderwijs, de publieke sector en in de horeca. De toepassingen voor de Surface zijn zoals gezegd eindeloos. Niet in de lijst van killer apps, maar wel een goed voorbeeld van een Microsoft Surface is deze wijnbar applicatie:

Wat de Microsoft Surface uniek maakt

• Directe manipulatie: weg met die muis, gebruik je handen om informatie te bewerken.
• Multi-user: Surface is sociaal, meerdere mensen kunnen om de tafel staan en deze gezamenlijk gebruiken.
• Multi-touch: de Surface kan op tientallen aanrakingen tegelijk reageren.
• Objectherkenning: door tags te gebruiken kan de tafel een specifiek object zoals bijvoorbeeld een visitekaartje, boek of telefoon herkennen.

Het interessante voor ons is natuurlijk om alle nieuwe ontwerpoplossingen uit te proberen. Hoe zorg je er bijvoorbeeld voor dat een applicatie vanaf alle kanten gebruikt kan worden? Bijvoorbeeld door alle schermen draaibaar te maken, en iconen te ontwerpen die vanaf alle kanten herkenbaar zijn. En hoe ontwerp je feedback? Audio feedback zoveel mogelijk gebruiken, maar niet als dit verwarrend wordt bij meerdere gebruikers bezig zijn met een applicatie.. want bij welke interactie hoort de feedback?

Dienstverlening krijgt een nieuwe dimensie

De Microsoft Surface kan enorm veel toevoegen aan de ervaring van een klant in een winkel, hotel of museum, want deze kan precies dat bieden waar klanten nu om vragen: online diensten vertaald naar de echte wereld (zie ook onze vorige blogpost). Microsoft zelf verwijst naar de waarde van super realisme: het imiteren van interacties in de echte wereld en dit verrijken met digitale mogelijkheden. Zoals bijvoorbeeld in de wijnbar applicatie.

De Surface zal natuurlijk moeten passen in het totale plaatje van communicatie en dienstverlening – naast bijvoorbeeld print, online en mobiel. Maar gebruik van de Surface zal zeker bijdragen aan de klantervaring, cross sell en up sell van producten, vergelijken van product aanbiedingen, en het verminderen van de kosten van dienstverlening. Op de WPC Wodwide Partner Conference werd al gesproken over de impact van Microsoft Surface op de ROI. We zijn uiteraard erg nieuwsgierig naar de eerste cijfers als die beschikbaar komen. En hopen natuurlijk in de toekomst met een mooie Surface toepassing een plaats te veroveren tussen de nieuwste killer applicaties!

Contextmapping

Contextmapping is een methodiek voor het uitvoeren van contextueel onderzoek met gebruikers, waarin kennis wordt verworven over de gebruikerscontext van producten.
Zowel gebruikers als stakeholders nemen actief deel aan het ontwerpproces, zodat het ontwerp en gebruik van een product goed bij elkaar aansluiten. Behalve bij productontwerp is deze methodiek natuurlijk ook erg interessant bij het uitvoeren van service design trajecten. Uitgangspunten bij contextmapping zijn onder andere dat gebruikers de experts van de belevingen zijn, en dat context van productgebruik zo divers is dat een map nodig is.

Liz Sanders illustreerde dit door te vertellen over haar ervaringen bij architectenbureau NBBJ bij het ontwerpen van een ziekenhuiscampus voor veteranen. Sanders benoemde de overgang van ontwerpen voor o.a. communicatie, ruimte, interieur en informatie naar het ontwerpen van o.a. ervaringen, emotie, interactie en transformatie. Ook onderscheidt zij vormen van ontwerpvisualisaties voor verkopen en vertellen aan de klant (3D, fly-throughs), en visualisaties voor maken met als doel stappen nemen in het ontwerpproces (persona’s, experience models). Enkele voorbeelden van co-creatie methodes:

Visioning workshop

Scoping binnen een project van klant en gebruikers door woorden en beelden op een collage-achtige wijze in een grote cirkel te plakken. Ideeën binnen de bullseye zijn het belangrijkste.

Experience timelines

Een chronologische visualisatie van gebeurtenissen. Bijvoorbeeld zusters die de ervaring van een patiënt gedurende een bepaald tijdsverloop in beeld brengen.

2D participatory modeling

Voormalig patiënten bedenken de layout van de patiëntenkamer door gebruik van geschaalde 2D modellen. Met visualisaties van emoties en uitgebreide toolkits voorzien van klittenband.

3D participatory modeling

Hypothetische scenario’s uitspelen of maken van geschaalde 3D ontwerpen. Zo liet men verpleegsters de inrichting van een patiëntenkamer bedenken met poppenmeubels en meer abstracte onderdelen. Verpleegsters richten de kamers binnen 8 minuten in en vertelden hun verhaal aan de hand van de poppen in de kamers.

Lessons learned die Liz Sanders noemde zijn onder andere het belang van een cultuur waarbij ontwerpers open staan voor de inbreng van gebruikers en klant, en een bijpassende mindset. Nodig het ontwerpteam uit bij de co-creatie sessies, en geef ze het liefst een rol zoals aantekeningen maken of video opnemen. Betrek ze ook bij de voorbereiding. Het communiceren van resultaten als ontwerpers niet aanwezig zijn kan door een samenvatting te geven op een manier met impact, bijvoorbeeld video, en alleen met resultaten die op dat moment relevant zijn voor het team.

Na Liz Sanders vertelde Jacob Buur van het SPIRE research centre over ethnografische provocatie, een van de 7 onderzoeksgebieden van SPIRE. Jacob vertelde over de veldstudies die werden uitgevoerd bij het herontwerp van de ‘wastewater treatment plants’. Grootste obstakel bij het herontwerp was het verschil in inzicht hoe het werk verricht moest worden en hoe nieuwe oplossingen binnen bestaande werkculturen kon worden ingepast. Controleurs wilden liever buiten rondlopen dan de controle applicaties binnen in een controlekamer te bedienen.

Froukje Sleeswijk Visser heeft als eerste PhD. in contextmapping kort haar doctoral werk uitgelegd, waarbij in haar thesis 7 best practices worden benoemd. Tenslotte kwamen in de pecha kucha presentaties nog veel interessante voorbeelden van contextmapping voorbij. 10 oud-studenten vertelden over hun afstudeerproject en huidige professie in relatie met contextmapping.

Meer

Wil je meer lezen over context mapping, dan kan dat bij het ID-StudioLab.

Zie ook de doctoraal thesis van Froukje Sleeswijk Visser: ‘Bringing the everyday life of people into design
Aanvullend een impressie van De Waag van het TU symposium met een aantal handige do’s en don’ts bij contextmapping.

Analyse

Voor on site interviews met eindgebruikers was geen tijd binnen dit project. Wat we wel konden doen is het in kaart brengen van de wensen en behoeften van DSM Dyneema. Daarom hebben we wat ‘huiswerk’ toegestuurd. We vroegen naar hun mening over vergelijkbare websites, waarbij ook sprake is van ‘ingredient marketing’. Zoals bijvoorbeeld Intel, en Kevlar handschoenen. Hierdoor kregen we alvast een goed beeld over wensen voor navigatie en presentatie.

Hoe werkt een cardsort sessie?

Om binnen beperkte tijd de grote hoeveelheid content en functionaliteit in de website een goede plaats te geven, hebben we een cardsort sessie gedaan met DSM Dyneema. Hierdoor konden we snel een goede sitemap creëren als startpunt voor het ontwerp.

Stap 1: Consensus over de inhoud

De inhoud van de projectdocumentatie en de huidige website hebben we vertaald naar steekwoorden op kaarten. Deze flinke stapel kaarten namen we eerst door, samen met DSM Dyneema. Eén voor één neemt iemand een kaart, en beschrijft wat volgens hem of haar bedoeld wordt met het steekwoord. Bijvoorbeeld: CONTACT, wordt dit een pagina met contactgegevens, of een contactformulier? Komt er een algemeen emailadres, of verschillende per afdeling een aparte? Misschien moeten klanten contact op kunnen nemen met een representant in hun regio?

Stap 2: Groeperen van kaarten

Nadat overeenstemming is bereikt over de onderdelen die in de website aanwezig moeten zijn, en wat deze betekenen, kunnen de kaarten in groepjes gesorteerd worden in een menustructuur. Aan het einde van de cardsort sessie hadden we een duidelijk beeld gekregen van de inhoud en structuur van zowel de eindgebruiker websites als de licentiehouders community. Resultaten werden door deelnemers in de sessie toegelicht en we legden ze vast op foto zodat we ze konden  vertalen naar een sitemap.

Ontwerp

Dankzij de inbreng van DSM Dyneema konden we nu een sitemap en homepage ontwerp maken, waar iedereen zich betrokken bij voelde.

Sitemap

De sitemap is een visualisatie van de sitestructuur en daarmee een goed middel om te controleren of de inhoud juist en compleet is.

Homepage en navigatie

Tegelijkertijd met de sitemap werd de eerste versie van de homepage voor zowel Dyneema DSM eindgebruikers als voor de licentiehouder community ontworpen. In schetsstijl werd de eerste versie vastgelegd, zodat de feedback zou gaan over navigatie en layout en niet over de details van het ontwerp.

Met de feedback van DSM Dyneema konden we verder met het ontwerp van een finale versie van de sitemap en het ontwerp van de homepage en overige pagina’s.

Prototype

Om iedereen in het projectteam een goede indruk te geven van het ontwerp zijn beide websites vertaald naar een klikbaar prototype. Daarnaast is het ontwerp beschreven in een interactie document met specificaties voor de ontwikkelaars.

Resultaat

Met het visuele concept van Southparc vertaald vertaald door Resoluut, hier dan uiteindelijke resultaat: Gloves with Dyneema

De opdracht was uitdagend:

Ontwerp een interface voor het nieuwe paradepaardje van Eurologics; Een “Car Entertainment System” dat geheel bediend wordt met een 7 inch touchscreen. De toekomstige gebruiker is meestal tussen de 6 en 14 jaar oud, en zal voornamelijk DVD’s kijken. Maar… het komt natuurlijk ook voor dat een minister tussen twee afspraken even het laatste NOS journaal aanzet. De bediening moet dus kinderlijk eenvoudig zijn, maar wel klasse uitstralen. Vanaf de achterbank kijk je naar films, digitale TV en fotos. Vanaf een DVD, CD of USB stick. Natuurlijk kan je ook luisteren naar muziek, allerlei voorkeuren instellen en tal van andere functies aantikken die ik hier voor het overzicht even niet noem.
Het ontwerp moet binnen drie weken gereed zijn…

Card-sorting met iconen

Dat is even doorwerken, maar voor ons natuurlijk niet de eerste keer dat we zoiets doen. Na de briefing begonnen we met een sketchboard sessie met drie van mijn collega’s om de eerste interactieprincipes te ontwerpen. Het een en ander werd snel uitgewerkt in een aantal flows en wireframes. Deze werden besproken met de product managers van Eurologics en het ontwikkelteam in Azie. We maakten een eenvoudige mock-up van de interface met daarin de belangrijkste schermen. Deze mockup werd samen met een set iconen getest in een gebruiksonderzoek met een paar kids uit de doelgroep. Genoeg informatie om samen met Resoluut het grafisch ontwerp in de derde week af te ronden. Net voor de deadline konden we nog 360 iconen exporteren en de documentatie opstellen voor de ontwikkelaars in Korea.

Reactie van bezoekers op de RAI

Benieuwd naar het resultaat? Vraag naar een Vision Touch systeem bij aankoop van uw nieuwe slee, of neem contact op met Eurologics om dit product te laten installeren in uw wagen. U wilt het gratis? Dan moet u zich even melden op de autovakRAI, daar wordt er 1 verloot.

Eurologics stond op de RAI dit jaar en hier een leuk filmpje van de reacties van het publiek.

Toch kwamen ze met een briljante oplossing.

In alle plasbakken zou voortaan een klein, zwart vliegje in het porselein worden meegebakken. Onderin. Aan de binnenkant van de pot. En dat bleek te werken. Plassers hadden nu iets om op te mikken, waardoor het een stuk droger is geworden op het terrein van de luchthaven.

Nudge
Zo’n vliegje is een typisch voorbeeld van een ‘nudge’: een duwtje in de goede richting. En ‘nudgen’ is wat de overheid veel meer zou moeten doen. Niemand beperken. En iedereen helpen om de juiste keuzes te maken.

Maar kunnen we zelf dan niet de juiste keuzes maken? Nee, zegt Thaler.

We kunnen niet kiezen
Dat we niet kunnen kiezen, komt ten eerste omdat ons brein nog uit de oertijd stamt. Een tijd waarin andere keuzes handig waren. Zoals: alles eten wat je voor ogen komt. Dat was toen handig omdat je geen idee had of je ooit nog nieuw voedsel zou tegenkomen. Tegenwoordig heb je daar niets aan, tenzij je Sonja Bakker heet.

Dat we niet kunnen kiezen, komt ten tweede omdat je niets weet over bijna alles.

Dat we niet kunnen kiezen komt ten derde omdat we vaker met onze voortplantingsorganen denken, dan met onze hersenen.

En ten vierde kunnen we niet kiezen omdat we de effecten op de korte termijn veel belangrijker  vinden dan de effecten op de lange termijn.

Wie helpt ons?
Alle reden dus voor de overheid om te helpen. Om haar diensten zo te ontwerpen dat mensen vanzelf de juiste keuzes maken. Is dat goed? Geen idee. Wel weet ik dat neutraal design niet bestaat: alle design beïnvloed. En, laten we de Nederlandse term maar gebruiken, het ontbreken van ontwerp beïnvloedt het allermeest. Daar wordt je hartstikke chagrijnig van. Vraag voor een slecht humeur maar eens een parkeervergunning aan in Amsterdam.

Mini’s worden ontworpen. MP3-spelers worden ontworpen. Zelfs gevulde koeken worden ontworpen. Tijd dat ook de diensten van bijvoorbeeld de overheid worden ontworpen.

Zin om een goed boek te lezen? Lees ‘Nudge’.

—–

Ook:

• Boek: Nudge: Improving Decisions About Health, Wealth, and Happiness by Richard H. Thaler (Author), Cass R. Sunstein (Author)
• Richard Thaler over Urinoirs en sociale zekerheden

• Authors@Google: Richard Thaler, een lezing op video