Het maken van een wireframe is het maken van een blauwdruk van een website. Wireframes worden gebruikt als visueel hulpmiddel bij het ontwerpen van een gebruikersinterface. Een gebruikersinterface wordt gebruikt bij een app of een website.
De wireframes zijn de visuele gids dat het raamwerk van een gebruikers interface bepaald. De wireframes zijn de basis van het functionele ontwerp. Door deze visuele gids uit te werken heb je een middel om te communiceren over de invulling van de functionaliteiten. Deze wireframes voorkomen ruis in de communicatie door te richten op de kern.
Door wireframes te maken focus je op het doel en de functionaliteit. Door in deze stap de wireframes goed uit te werken zorg je er voor dat bij het maken van een visual design de vorm en functie samen komen.
De wireframing-kit wordt gebruikt om elementen te copy-pasten in een nieuw canvas. In het nieuwe canvas kun je deze elementen dan naar eigen stijl uitlijnen en gebruiken om een wireframe te maken.
Er zijn veel manieren om de wireframing-kit te maken, het is aan jou om te kiezen hoe je dit doet.
Balsamiq is een programma dat helpt om snel protoypes te maken. In Balsamiq zit de kit al ingebakken. Voor het maken van wireframes en de wireframe-kit kunt er ook Illustrator (of inDesign) gebruiken. Het voordeel van het gebruik maken van Illustrator is dat het voeren van een eigen stijl mogelijk is.
De wireframe-kit is verzameling van grafische elementen. De grafische elementen zijn zo eenvoudig en functioneel mogelijk uitgewerkt. Dit zijn elementen die je kunt gebruiken voor o.a. vormen, buttons, invoervelden en navigatie.
Voer de functionele stijl door binnen het ontwerp. Wanneer je een bepaald type knop gebruikt voor een handeling blijf dit type knop dan voor deze handeling gebruiken.
Mijn eigen wireframeing-kit:
