Bij het bedenken van nieuwe producten speelt user experience design een steeds grotere rol. Prototyping is een van de belangrijkste onderdelen van het user experience design proces.
Veel ontwerpers weten wat prototyping inhoudt maar als je vraagt naar de verschillen tussen high fidelity prototypes en low fidelity prototypes en wanneer welke vorm het beste gebruikt kan worden blijft het stil. Prototypes kun je verdelen in twee groepen, low en high fidelity prototypes, maar wat betekent fidelity. Beide vormen van prototyping hebben voor- en nadelen, dit maakt het kiezen van de juiste soort extra belangrijk.
In dit artikel ga ik de volgende onderwerpen toelichten:
- Fidelity;
- Interactieve en Statische prototypes;
- Low fidelity prototyping;
- High fidelity prototyping;
Introductie
Wanneer je als ontwerper aankomt bij het user experience deel van een ontwerpproces, is het goed om na te denken over de verschillende soorten prototyping. Belangrijk hierbij is dat de ontwerper goed begrijpt wat prototyping inhoud en wat hier allemaal onder valt. Een prototype is een heel breed begrip, van een stapel schetsen tot een compleet uitgewerkte applicatie het valt allemaal onder prototypes.
“A prototype can be almost anything, from a series of paper sketches representing the different screens or states of an app to a fully-functional, pixel-perfect app.” (Babich, 2017)
Toch moet er een onderscheid gemaakt worden tussen schetsen, wireframes en mock-ups en prototypes. Het belangrijkste aspect van een prototype is de interactie met de gebruiker, een prototype moet hierop getest kunnen worden.
Omdat prototyping zo’n breed begrip is, is het extra belangrijk om als ontwerper te weten wanneer welke vorm van prototyping het best toegepast kan worden. Om toch een beetje structuur te bieden bestaan er twee vormen prototyping, low en high fidelity prototyping. Beiden hebben voor en nadelen, waardoor de een beter bij een bepaald ontwerpproces past dan de ander of dat de ontwerper ervoor kiest om zowel een low als high fidelity prototype te ontwerpen.
“When you’re getting ready to begin prototyping, you’ll need to decide how closely you want it to match the end result, which will also dictate how much time and energy you need to put into it.” (Esposito, 2018)
Fidelity
Fidelity klinkt als een lastig Engels woord, maar dit is heel simpel uit te leggen. De fidelity van een ontwerp beschrijft de mate van detail en functionaliteit van een prototype. Hoe hoger de fidelity hoe dichter het prototype bij het eindproduct komt. Er bestaan officieel twee soorten fidelity, low en high. Low fidelity wordt vaak gebruikt in de vroege fase van het ontwerpproces omdat ontwerpers nog niet precies weten hoe het eindproduct eruit komt te zien. High fidelity is bedoeld om de werking en het uiterlijk van een prototype zo dicht mogelijk bij de werking en het uiterlijk van het eindresultaat te krijgen. Waardoor het testen betrouwbare resultaten oplevert.
“The fidelity of the prototype refers to how closely it matches the look-and-feel of the final system.” (Pernice, 2016)
De fidelity van een prototype wordt vaak bepaald aan de hand van de volgende drie onderdelen:
- Interactie;
- Visuals;
- Contents en commands.
In de onderstaande tabel wordt uitgelegd wanneer deze onderdelen vallen onder low en high fidelity:
Bovenstaande tabel (Pernice, 2016) laat zien welke voorwaarden horen bij low en high fidelity.
Verder kunnen we prototypes verdelen onder interactieve prototypes en statische prototypes.
Interactieve prototypes:
Een interactief, ook wel ‘clickable’ prototype genoemd, is een prototype waarbij de ontwerper een reactie voor elke gebruikersactie ingesteld heeft. Tegenwoordig zijn er veel verschillende tools die dit makkelijker maken voor de ontwerper. Zelfs met deze tools kan het maken van interactieve prototypes veel tijd kosten.
Statische prototypes:
Een statisch prototype kan gebruikt worden tijdens een real time test bij de gebruiker die al bekend is met het ontwerp. Deze vorm van prototyping kost minder tijd maar levert minder betrouwbare testresultaten op.
“To make it respond to user actions, we can spend time implementing the interaction before the test or we can “fake” the interaction during the test. Both methods have benefits and drawbacks.” (Pernice, 2016)
Low fidelity prototyping
Low fidelity (lo-fi) prototypes hebben als belangrijkste functie het testen van de functionaliteit, het uiterlijk van het lo-fi prototype is hierbij nog niet belangrijk.
Omdat het hierbij alleen gaat om de functionaliteit van het prototype is dit een eenvoudige en snelle manier om concepten om te zetten naar een testbaar prototype.
Visual design:
Bij een low fidelity prototype bestaat het visual design alleen uit basiselementen zoals vormen en een algemene lay-out.
Content:
Alleen de belangrijkste content wordt meegenomen in het low fidelity prototype.
Interactie:
Bij low fidelity prototype kan zowel gekozen worden voor een interactieve of statische versie. Hierbij wordt vooral gelet op de lay-out van het prototype.
Een voorbeeld (Canvasflip, 2016) van een low fidelity prototype.
Low fidelity technieken
De meest voorkomende technieken van low fidelity prototyping zijn bijvoorbeeld paper prototypes en klikbare wireframes. Deze zijn vooral gericht op het snel testbaar maken van concepten om bruikbare feedback te krijgen en verwerken..
Lees ook: Top 9 programmeertalen voor websites
Paper prototypes
De naam paper prototypes zegt het eigenlijk al, dit is het schetsen van schermen met pen en papier in plaats van digitale software. De meest eenvoudige manier van paper prototypes zijn schetsen van schermen die door de keuzes van de gebruiker handmatig gewisseld worden.
“In the high tech world of digital design, sometimes the best method is still pen and paper.” (Cao, 2016)
Paper prototypes kunnen gebruikt worden in de vroege fase van het ontwerpproces om basiselementen te testen.
Klikbare wireframes
Een klikbaar wireframe is een simpele versie van het eindproduct waarbij alleen het structurele aspect belangrijk is. Een wireframe kan met pen en papier geschetst worden maar meestal wordt dit gedaan met digitale software. Om een wireframe klikbaar te maken bestaan verschillende tools zoals Invision en Marvel.
Vaak heeft een klikbaar wireframe drie hoofdfuncties:
- Het weergeven van content en functies van de pagina’s.
- Ontwerpers helpen communiceren met de opdrachtgever.
- Een duidelijke structuur op te zetten.
High fidelity prototyping
Een high fidelity (hi-fi) prototype is een prototype dat zo dicht mogelijk bij het eindproduct komt. Dit kan alleen bereikt worden als de ontwerper al precies weet hoe het eindproduct gaat werken en hoe het eruit komt te zien. Het uiterlijk en de werking van het prototype zijn hierbij even belangrijk. Een high fidelity prototype kost meer tijd en geld om te maken daarom is dit niet altijd de beste vorm.
Visual design:
Het prototype ziet er precies zo uit als het eindproduct, het is belangrijk om tijdens het prototyping pixel-perfect te werken.
Concent:
Er wordt alleen content in het prototype gebruikt die ook daadwerkelijk in het eindproduct zal komen. Soms kiest een ontwerper ervoor om content te gebruiken die gelijk is aan de content van het eindproduct.
Interactie:
Een high fidelity prototype werkt precies zoals het eindproduct. Alle interacties moeten kloppen om bruikbare feedback te krijgen tijdens het testen.
Invision (2018) laat zien hoe het proces van een high fidelity prototype eruitziet.
High fidelity technieken
De meest voorkomende techniek van high fidelity prototyping, is een digitaal prototype. Dit digitale prototype is vooral gericht op verkrijgen van bruikbare feedback.
Digitaal prototype
Bij een high fidelity prototype is het belangrijk dat het prototype eruit ziet en werkt als het eindproduct. Een manier waarop ontwerpers dit kunnen bereiken is het maken van een digitaal prototype. Een digitaal prototype wordt pixel perfect ontworpen in software zoals Sketch en Adobe XD. Om de interactie te testen wordt vaak gebruik gemaakt van online tools zoals Marvel en Invision. Door het interactief maken van een digitaal prototype levert het testen betere feedback op.
Low fidelity of high fidelity?
Nu duidelijk is wat het verschil is tussen low fidelity en high fidelity kunnen we kijken wat de voordelen van beiden zijn. Aan de hand van de voordelen kun je het beste kiezen of je begint met het maken van een low fidelity prototype of een high fidelity prototype.
Voordelen van low fidelity:
1. Het kost minder tijd en geld. Een low fidelity prototype komt vooral in de vroege fase van een ontwerpproces tot zijn recht. Het kost minder tijd om een low fidelity prototype te maken, dit is vooral handig bij het testen van concepten.
2. Het prototype staat nog niet vast. Tijdens het testen kunnen veranderingen snel toegepast worden. Het ontwerp en interactie van het prototype staan nog niet vast dus is het makkelijker om feedback door te voeren.
3. Minder druk op gebruikers. Doordat het duidelijk is dat een low fidelity prototype nog niet af is, durft de gebruiker eerder negatieve feedback te delen. Wanneer een prototype al lijkt op een eindproduct, voelt de gebruiker meer druk om het goed te vinden.
Voordelen van high fidelity
1. Bruikbare feedback tijdens het testen. Omdat een high fidelity prototype functioneert en eruit ziet als het eindproduct is de feedback betrouwbaar.
2. Het testen werkt sneller en betrouwbaarder. Omdat de interactie van een prototype niet met de hand getest wordt maar via de computer, werken de interacties sneller en is er minder kans op menselijke fouten.
3. Iedereen begrijpt hoe het eindproduct eruit komt te zien. Omdat een high fidelity prototype functioneert en eruit ziet als het eindproduct is dit niet alleen voor de ontwerper duidelijk.
Conclusie
Het is duidelijk dat het testen van een product niet overgeslagen kan worden. Zodra een product online gaat en de gebruikers het product in gebruik nemen, wordt het getest. Daarom is het belangrijk om al tijdens het ontwerpproces een prototype te maken en de reacties van de gebruiker te testen. Tijdens het ontwerpproces is er genoeg tijd om feedback te verwerken, het zou zonde zijn als je na het uitbrengen van een product pas bruikbare feedback ontvangt die je niet meer kunt toepassen. Om dit te voorkomen is het maken van een prototype onmisbaar in een goed ontwerpproces. Tijdens elk ontwerpproces is het goed om een bewuste keuze te maken, kies ik voor low fidelity of voor high fidelity, of kies ik ervoor om allebei te gebruiken. De twee vormen van prototyping hebben allebei voordelen, nu deze benoemd zijn is het makkelijker om bewust te kiezen voor een van deze vormen van prototyping. Een low fidelity prototype is snel, goedkoop en flexibel maar niet erg betrouwbaar en een high fidelity prototype kost meer tijd en geld en staat al vast, maar levert wel betrouwbare feedback op.
About Post Author
