Wireframes

In de wereld van UX zijn wireframes een schematische weergave van bijvoorbeeld een site of applicatie. Vaak worden de belangrijkste pagina’s gemaakt, waarbij je nog niet kijkt naar vormgeving. Het zegt dus nog niets over kleur, letters, foto’s en illustraties. Wel toont het op abstracte wijze wat er op de verschillende pagina’s te vinden is en hoe je er doorheen klikt. Je laat zien waar foto’s en tekst staan. Je laat zien waar en wanneer bijvoorbeeld invoervelden, keuzelijsten, aanvinklijstjes, invoervelden en knoppen zichtbaar zijn. En nog veel belangrijker: je laat het onderlinge verband tussen pagina’s zien. Goede wireframes laten zien hoe je door de belangrijkste pagina’s klikt en tonen op directe wijze wat je er als user aan hebt.

Meestal zijn wireframes eerst vrij globaal, zodat opdrachtgever en -nemer zich niet verliezen in details. Je kunt in een vroeg stadium luisteren naar en leren van (potentiële) users. Daarna kun je bijschaven en opnieuw het gesprek aangaan met users. Door vroeg en vaak te onderzoeken en aan te passen, voorkom je dat je iets maakt wat niet in de wereld van de beoogde user past. Een passende tegelwijsheid in UX-land klinkt dan ook “Kill the monster when it’s small.“

Door vroeg en vaak te itereren kom je tot een prototype dat relevant en waardevol is voor de user. Bij elke iteratie wordt er steeds meer naar detail gekeken. Niet alleen visueel (graphic user interface, GUI) gaat het steeds meer op het eindproduct lijken, ook wat betreft content en interactie (Interaction Design, IxD) krijgt het prototype steeds meer zijn uiteindelijke vorm. Van globaal (low fidelity) naar gedetailleerd (high fidelity) ontwerp je voor user experience (UXD).

Er komt dus een punt waarop de wireframes eigenlijk te gedetailleerd zijn om nog wireframes te heten. Dat is het punt waar je wel gaat vormgeven. Kleur, letters, foto’s en illustraties komen om de hoek kijken. Dit noem je niet meer wireframing, maar mock-up prototyping. Oorspronkelijk werd met een mock-up een niet interactieve preview van een pagina bedoeld. Tegenwoordig kunnen mock-ups heel goed interactief zijn. De interactieve mock-up is dus de high fidelity versie van een prototype, waarbij ook content en interactie verder zijn uitgewerkt. 

Er zijn, naast wireframes en mock-ups, meer manieren van prototyping. Hier vind je meer informatie over prototyping en mock-ups.