Contextual design is the new black

19 augustus 2014 Inzichten /

Een ontwerp dat zich aanpast aan verschillende schermen is slim. Design dat de volledige context verwerkt tot de meest optimale gebruikservaring, da’s pas écht wijs. Of: waarom uw huidige website dom is hoe uw nieuwe website ass kan kicken.

Als het op het ontwerpen van websites aankomt, is het tegenwoordig al responsive design wat de klok slaat. Voor mensen die te lang onder een pixel hebben geleefd (of een filter hebben ingebouwd tegen digitale buzzwords): responsive design zorgt ervoor dat eenzelfde website zich naadloos nestelt op verschillende schermgroottes, zoals desktop, tablet en smartphone. Gedaan dus met tap-to-zoom-blessures of met een pincet op miniatuurknoppen duwen.

Bij Wijs zijn we al sinds jaar en dag serieuze believers in responsive design. Zo bouwden we voor Delta Lloyd de eerste responsive website in de Belgische bankenwereld, en wonnen we met Rock Werchter een Mixx Award voor de beste multi-screen experience. Ik zal zelfs meer zeggen: we bouwen tegenwoordig geen website meer of we maken dat beestje responsive.

Wat we daarbij geleerd hebben: responsive design is meer dan louter visueel gegoochel. Het dwingt ons om kritisch te zijn en - godbetert! - na te denken: als de schermruimte beperkt is, wat is dan het allerbelangrijkste om te tonen aan een bezoeker?

Momenteel wordt met dat gegeven al slim omgesprongen: op kleinere schermen wordt het menu verborgen om de inhoud te laten primeren, en op de mobiele contactpagina staat het telefoonnummer en adres gelukkig boven die gigantische foto van uw baas.

Maar: responsive design beperkt zich nog al te vaak tot slechts 1 variabele, namelijk het toestel (en de bijhorende schermgrootte). Jammer, want we leven meer dan ooit in een contextuele wereld waarbij tal van factoren een invloed hebben op ons gedrag: waar je bent, waar je naartoe gaat, wanneer, met welke bedoeling, …

Als we al deze factoren meenemen in het creatieproces, zouden onze website steeds het best mogelijke antwoord kunnen geven op een bepaalde use case. Response design.

Zonder al te technisch te gaan (en te klinken als een slecht sciencefiction scenario): welke contextuele variabelen kunnen we - vandaag de dag - gaan betrekken bij het ontwerpen van een betere website?

Of anders gezegd (en pas op, want we gaan het kind hier ook een naam geven):
Wat zijn de bouwstenen van contextual design?

1) Technology:

  • Device: het toestel waarop de bezoeker zich bevindt, blijft natuurlijk een van de meest bepalende factoren. Een website bekijken op een smartphone is helemaal iets anders dan op een Smart TV. Google Glass en een auto-dashboard zijn heel verschillende dingen, of toch niet? Beide tonen immers essentiële informatie met een minimum aan afleiding ...

    Voorbeeld: de website van VTM toont mij op smartphone best de TV-gids, op tablet ben ik wel te vinden voor second-screening, leuke videoclips of volledige afleveringen.
  • The Internet of Things: Will Smith in iRobot is niet voor direct, maar binnen enkele jaren zitten al onze toestellen wél al online. Niet om Candy Crush Saga te spelen op Facebook, maar om ons te voorzien van nog meer data. En data zijn de digitale drugs voor een marketeer.

    Voorbeeld: het badgesysteem van de fitness kan mij thuis perfect vertellen hoe druk het daar is, en mij aangeven wat gemiddeld gezien rustigere momenten zijn. Of wie weet leert mijn warenhuis wel communiceren met mijne frigo …

2) User:

  • Site behaviour: via goed ingestelde analytics zie je als snel persona’s ontstaan met eigen gedragingen, maar vooral: eigen noden en triggers …

    Voorbeeld: als ik op een bankenwebsite veel opzoekingen doe over lenen en woonverzekeringen, dan ben ik waarschijnlijk van plan mijn eerste huis te kopen. Nodig mij uit voor een persoonlijk gesprek en je hebt er misschien een levenslang loyale klant bij.
  • Source: een bezoeker die via een zoekmachine komt, geef je heel gerichte informatie. Een bezoeker die vanop Facebook/Twitter komt is meer gediend met hapklare brokjes. (Aangezien social een lean-back medium is)

    Voorbeeld: een nieuwsbericht dat gedeeld wordt via sociale media krijgt op een desktopcomputer ruimte voor een long-read met ettelijke kilo’s aan letters, op een tablet is een infografiek al gepaster en op mobile beperkt het artikel zich best tot bullet points in telegramstijl.
  • Quantified Self: wearables, slimme horloges, Bluetooth-polsbandjes, … lijken nu nog gadgets, maar zullen ons overspoelen met data van onschatbare waarde. Van slaap tot bloeddruk, ons lichaam zal geen geheimen meer kennen.

    Voorbeeld: als ik slecht heb geslapen, is er veel kans dat ik zal ingaan op uw mobiele coupon voor een Red Bull bij het tankstation op weg naar mijn werk.

3) World:

  • Time: het tijdstip zal al heel wat verraden over de reden van het bezoek.

    Voorbeeld: als ik op zondag naar de website van een supermarkt ga, wil ik gewoon weten of die open is op de Dag des Heeren. Op dinsdag om 19u32 (na het werk) hoop ik dan weer  dat ik nog tot 20u kan langskomen. En als we even commercieel denken: op zondag sta ik wel open voor lekkere ontbijtproducten, op een late weekavond wil ik uw delivery/pick-up dienst misschien wel ontdekken.
  • Place: waar je bent, bepaalt ook heel sterk of je in een verkennende/oriënterende fase zit, of on-the-spot iets wil doen of nodig hebt.

    Voorbeeld: als ik me in uw restaurant bevind, is dat het perfecte moment om vriendelijk te hengelen naar een positieve recensie (op Foursquare of Yelp). Als ik me thuis bevind, wil ik gewoon zien of er lekkere gerechtjes op het menu staan en vooral: het telefoonnummer om te reserveren.
  • Movement: iemand die on the go is, heeft heel andere verwachtingen van een website dan iemand die rustig op zijn stoel kampeert.

    Voorbeeld: als het duidelijk is dat ik mij aan het verplaatsen ben, kan de contactpagina van uw bedrijf mij maar beter uw adres tonen zodat ik het in mijn GPS kan rammen. Als ik nog niet ben vertrokken, zouden actuele reistijden van mijn naar uw kantoor wel sweet zijn.
  • Weather: vraag het maar aan Frank Deboosere; mensen gedragen zich helemaal anders wanneer de zon schijnt.

    Voorbeeld: als u mij dan toch een mobiele advertentie gaat voorschotelen tijdens mijn terrasbezoek (ik gebruik dan ook uw gratis WiFi), dan graag voor iets fris. Een kookwebsite doet er in de zomer ook beter aan om mij een licht slaatje te presenteren dan hutsepot die dikker is dan een winterjas. Of wat dacht u hiervan, nieuwswebsites aller lande: marketeer Dries ontdekte dat mensen vooral naar het weerbericht zoeken als het goed weer “zou moeten zijn”; als het slecht weer is weten de mensen dat al. Waarom “Het Weer” dan altijd zo prominent tonen?

Wat denkt u? Volstrekte mumbo-jumbo of de way to go? Zijn er nog zaken die kunnen bijdragen tot contextual design?

Wilt u uw website vleugels geven of hoort u graag wat context kan betekenen voor uw (digitale) marketing? ‘t is hier te doen.

 

Dessertje voor wie deze blogpost flink tot op het einde leest.

Hierbij alvast enkele zaken die we al in de praktijk kunnen gebruiken:

​Meer inspiratie nodig? ProgrammableWeb biedt een continue stroom aan API's. (API's laten systemen toe om met elkaar te communiceren; vertalers-tolken if you wish).

Lees meer

Nieuwsbrief

Doe zoals meer dan 1700 marketing en design experts en ontvang maandelijks onze nieuwsbrief vol inzichten, tips en verrassende nieuwigheden.