1. Schetsen
Om te beginnen ga je schetsen maken over hoe jij denkt de schermen er uit moeten komen te zien. Aan de hand van deze schetsen ga je itereren om te komen totdat je genoeg informatie hebt om een digitaal prototype te maken.
Op de eerste schets probeerde ik een creatief startscherm te maken en probeerde ik de leeftijd door middel van het verstellen van de lengte uit. Ik ben echter gestopt met dit idee, omdat groei bij elk persoon anders is en vaak dus niet samenhangt met de leeftijd.
Op de tweede schets probeerde ik een andere interactie uit. Deze leek ook niet heel erg gebruiksvriendelijk.
Op de derde schets is de basis van het eerste digitale prototype te zien. Hier heb ik nagedacht over de flow en de indeling van de applicatie.
Op de vierde schets heb ik nagedacht over animaties die het gebruik van de app kunnen verbeteren.
Op de vijfde schets heb ik nagedacht over een herontwerp van het eerste prototype. Op de zesde schets heb ik dit uitgewerkt.
2. Het eerste prototype
Het eerste prototype is natuurlijk nooit het beste prototype. Hieronder de eerste test om te zien of de interactie klopte en om te zien of ik aan alle voorwaarden voldeed voor een goede applicatie. Helaas miste ik hier heel erg de het begrip: 'one action per screen'. Dit begrip betekent dat je per scherm maar één hoofddoel moet hebben om de informatie behapbaar te houden voor de doelgroep. Bij dit ontwerp is er erg veel te zien op elke pagina en dit werkt verwarrend. Ook was mijn visuele hiërarchie bij de detailpagina nog niet goed, want het was niet duidelijk waar je moest beginnen met lezen, omdat alle fonts op elkaar lijkten.
3. Nader visueel onderzoek
Naar aanleiding van het eerste prototype heb ik meer onderzoek gedaan naar een aantal design-principes die mij gaan helpen in het bouwen van mijn tweede prototype. Ik heb er ook plaatjes bij gezocht om het voor mijzelf duidelijk te krijgen wat de principes precies inhouden.
4. Prototype 2. (Eindproduct)
De onderstaande flowcharts laten zien hoe de uiteindelijke oplevering eruit zag voor dit vak. Er zitten een paar iteraties tussen in vorm van schetsen en design-principes en shifts in visuele hiërarchie. Dit is dus hoe ik uiteindelijk de OBA 'boek een app' voor me zag. 
In het laatste prototype heb ik heel duidelijk 'one action per screen' toegepast en heb ik gezorgd dat de ogen van de gebruiker gelijk naar de belangrijkste elementen gaan door het juiste gebruik van kleur en vorm. 
De interactie stond ook voorop en overal waren hints te vinden over hoe je kon navigeren door de boeken en pagina's. Ook heb ik schermen gemaakt om je favorietenlijst te bekijken en er is ook een 'blank state' gemaakt wat je ziet als je nog geen favoriete boeken hebt aangemaakt.
Wat heb ik er van geleerd?
Van dit project heb ik voornamelijk geleerd om de juiste design-principes en een juiste visuele hiërarchie te gebruiken om een handige en begrijpelijke app te maken. Ook heb ik geleerd dat je nooit een perfect prototype kan maken vanaf het begin, maar dat je ten minste één keer 'je darling moet killen', zoals designers dat zeggen. Dit houdt in dat je een keer al je voorwerk weg moet doen en opnieuw kijkt hoe je datzelfde probleem op lost, maar dan op een andere manier. Hierdoor kom je het snelst op nieuwe, goeie ideeën.
Wat zou ik volgende keer anders doen?
Volgende keer onderzoek ik beter naar design technieken die ik wil gaan toepassen, voordat ik daadwerkelijk een digitaal prototype maak. Ik had in de eerste stap nooit zoveel elementen moeten plaatsen per scherm, dit zorgde dat mijn idee verdoemd was om te falen. 
Ook zou ik andere design tools gebruiken. De prototypes en ontwerpen waren uitsluitend gemaakt met illustrator en invision, maar dit blijken voor mij, op het moment van schrijven, niet zo een goede combinatie te zijn als programma 'sketch', Daar kan ik veel sneller en netter op werken om het gewenste resultaat te bereiken.
Back to Top