Tijd om je app tot leven te zien komen als prototype
  • Prototype
  • Android
  • iOS
  • Wireframes
  • Interactiondesign

Introductie

Het realiseren van je app idee tot eerste prototype is een mijlpaal die gevierd mag worden. In deze fase worden er op verschillende manieren concepten van de app gemaakt die gezamenlijk zullen zorgen voor de realisatie van het prototype. Eindelijk beginnen alle ideeën en brainstormsessies samen te komen tot een sterk visueel concept. Jouw idee begint nu echt een tastbaar product te worden, een juichmoment voor iedere klant.

De drie stappen van prototyping

Een werkend prototype bouwen van een app vraagt veel werk op technisch gebied. Om deze zo goed mogelijk op te bouwen worden hier voorafgaand een aantal ‘dummy’s’ ontwikkeld. Een dummy is een app versie waarin de techniek nog even achterwege wordt gelaten, dit scheelt tijd en dus ook kosten. In het proces tot de ontwikkeling van het definitieve prototype komen de volgende drie onderdelen aan bod:

  1. Low fidelity prototyping met wireframes
  2. User validation
  3. High-fidelity prototyping

Vooronderzoek en het MVP

Voorafgaand aan de eerste genoemde stap heb je je door middel van user story mapping flink verdiept in je doelgroep. Hierdoor weet je nu precies welke functionaliteiten de gebruiker nodig heeft en wat voor design bij hun in de smaak valt. Dit heeft je een sterke basis gegeven om je visie uit te bouwen tot een globale eerste versie van de oplossing: het MVP (Minimum Viable Product). Met deze informatie in de pocket kunnen we succesvol een low-fidelity prototype ontwikkelen.

1.    Low fidelity prototyping met wireframes

Op basis van het MVP gaat onze UX designer aan de slag om het interaction design in elkaar te zetten in de vorm van een schets. Door middel van wireframes wordt er gekeken naar praktische manieren om door de app te navigeren en een logische informatie voorziening (ook wel informatie architectuur genoemd). Een wireframe is een draadmodel die een heldere visueel weergave geeft van de indeling en navigatie van een app met tekstuele notities, dit zorgt ervoor dat de app een goede structuur en flow krijgt.

Deze wireframes worden meestal gemaakt in een programma genaamd Sketch en resulteren in een aantal schetsen van de verschillende pagina’s van de app. Deze low fidelity (lo-fi) schermen worden vervolgens in steeds meer detail opgebouwd tot een helder product. Wanneer de klant tevreden is over het resultaat gaan we over op het testen onder de doelgroep.

2.    User validation

Het in stap 1 een gerealiseerde lo-fi prototype zal gebruikt worden om aannames rond probleem en oplossing met klanten te valideren. Hiervoor zal het prototype worden getest met een aantal personen die vallen binnen de doelgroep en bereid zijn om deel te nemen. Op welke manier deze test wordt vormgegeven kan verschillen per case.

Een aantal mogelijke manieren om hier invullen aan te geven zijn:

  • Het lo-fi prototype aan de doelgroep laten zien via laptop, telefoon of zelfs op papier
  • Het lo-fi prototype per persoon testen en die persoon hier vragen over stellen
  • Met een groep samenkomen die het lo-fi prototype testen en hier vervolgens samen over in gesprek gaan
  • De doelgroep een enquête over het materiaal in laten vullen tijdens of na het bekijken van het lo-fi prototype
  • (Telefonisch) in gesprek gaan met de doelgroep tijdens of na het bekijken van het lo-fi prototype
  • De doelgroep observeren terwijl zij het het lo-fi prototype bekijken

Tijdens deze interviews vraag je feedback aan de gebruiker over de bouw van de app, of ze de functionaliteiten aantrekkelijk vinden, nog elementen missen en de opbouw van schermen logisch vinden.

3.    High fidelity prototyping

Je bent al een heel eind op weg en hier begint de app dan echt tot leven te komen. De designer gaat met programma’s als Sketch , Adobe Photoshop en Illustrator aan de slag om het prototype een aantrekkelijk uiterlijk te geven die overeen komt met de gewenste huisstijl. Ook krijgt het prototype een professioneel interaction design met behulp van Invision. Dit betekent dat het vanaf dan mogelijk is om op knoppen te klikken en dat er als reactie hierop ook daadwerkelijk een vervolgpagina wordt geladen. Wanneer jij als klant helemaal tevreden bent met dit high fidelity (hi-fi) prototype dan is het tijd om ook deze versie te laten testen onder de doelgroep. Hierbij wordt er gekeken of de doelgroep soepel door het ontwerp heen klikt, scrollt en swiped. Op basis van feedback kunnen er vervolgens nog een paar laatste aanpassingen gedaan worden aan het prototype om deze te perfectioneren.

Geen rechte weg

Uiteindelijk wil je bij de laatste stap uit wilt komen, maar het is niet vanzelfsprekend dat dit in een rechte lijn gebeurt. Het kan bijvoorbeeld zo zijn dat je op basis van feedback uit stap twee weer terug naar het tekenbord gaat om het een en ander te herzien. Op deze manier bouw je een prototype dat zoveel mogelijk aansluit op de behoeften van de doelgroep, wat de kans op succes van de uiteindelijke app vergroot.

Wil jij samen met ons in gesprek gaan om te kijken wat het beste aanpak is voor het creëren van jouw geweldige app idee? Twijfel niet en neem contact met ons op voor een vrijblijvend gesprek!

Of lees je (nog) eens in over hoe je door middel van user story mapping in de huid van je doelgroep kruipt.

072 - 888 3704