Interaction Design in vier stappen

Stap 1: Onderzoek

De werkwijze bij Interaction design verschilt niet veel van die bij UX design. Ook bij Interaction design is onderzoek de basis van de designstrategie. Het gaat dan om onderzoeken wie de doelgroep is en wat de doelgroep belangrijk vindt in de interactie met een website of app. Moeten aankopen bijvoorbeeld snel gedaan kunnen worden? Of is het belangrijker dat ze veilig gedaan worden en dat het proces duidelijk is? Het onderzoek loopt volgende de volgende vier stappen:

• Opstellen van wensen en doelen van de gebruiker
• User scenarios en job stories uitwerken
• Opstellen van flowcharts
• Opstellen van de sitemap

Naast onderzoek gebruikt de Interaction designer hiervoor ook guidelines, zoals de human interface guidelines van Apple of het Material Design van Google.

Stap 2:  Designstrategie

Onderzoek en guidelines leiden tot een designstrategie voor het Interaction design. In de strategie worden vragen beantwoord zoals:

• Welke interacties zijn nodig?
• Wat is het doel van de interactie? Welk probleem moet er opgelost worden?
• Hoe gaat de gebruiker die acties aan?
• Hoe weet de gebruiker van tevoren welke interactie hij aangaat?
• Hoe bruikbaar is het interface? Hoe makkelijk kun je leren om ermee om te gaan? Hoe snel kun je taken volbrengen?
• Welke bekende formats maken de functie makkelijk om te begrijpen?
• Welke feedback krijgt de gebruiker?
• Hoeveel tijd zit er tussen actie en feedback?
• Welke uiterlijke kenmerken helpen de gebruiker? Denk aan vormen, kleuren en tekst.
• Helpen foutmeldingen bij het oplossen van een eventueel probleem?

Stap 3: Interactie visualiseren

Daarna is de tijd aangebroken om de interactie te visualiseren in een model, zoals een paper prototype of wireframe. Dit model wordt weer getest en vervolgens aangepast. Het designen is hierdoor een iteratief proces waarin het design steeds verbeterd wordt, maar ook steeds gedetailleerder uitgewerkt.

Bij het visualiseren van het Interaction design wordt rekening gehouden met een viertal elementen.

Woorden

Denk bijvoorbeeld aan labels op buttons. Deze moeten makkelijk te begrijpen zijn en de gewenste informatie geven zonder te overwelmen. ‘Klik hier’ is nietszeggend, want je weet niet wat er gebeurt als je klikt. ‘Klik hier om verder te gaan met het afrekenen van de producten in je winkelmandje’ is weer wat overdreven.

Visuals

Denk bijvoorbeeld aan iconen. De iconen vullen de woorden aan. Sommige herkenbare iconen, zoals een play-knop kunnen ook zelfstandig functioneren.

Fysische objecten

Welke objecten worden ingezet voor de interactie? Toetsenbord, muis of touch screen? Over het algemeen is het goed om navigatie met meerdere opties mogelijk te maken: gebruikers kunnen namelijk verschillende devices gebruiken. Houd ook rekening met de ergonomie. Denk bijvoorbeeld aan design voor duimen voor mobiele websites of apps.

Gedrag

Interactie gaat om actie en reactie. Het is dus belangrijk om een beeld te hebben van hoe bezoekers reageren op triggers op de website of in de app. Denk ook aan emotionele reacties. Die zijn afhankelijk van kleuren, lettertype en animaties. Je wilt dat deze reacties zo positief mogelijk zijn. Het gaat hierbij dus om subtielere interactie dan het invullen van een formulier, maar dat maakt het niet minder belangrijk.

Stap 4: Het definitieve design

Na verschillende iteraties waarbij de interacties steeds verbeterd zijn op basis van de resultaten van de testen, kan het definitieve Interaction design gemaakt en gelanceerd worden en de daadwerkelijke interactie tussen gebruiker en digitaal product kan beginnen.

Meer weten?

Wil je meer weten over design, lees dan bijvoorbeeld ons blog over landing page design of over UX Design.

Wil je een gave website laten ontwerpen of herontwerpen voor jouw bedrijf? Neem dan contact op met WP Brothers. Onze designers gaan graag voor je aan de slag.