Flowchart

Voor mijn project Blinko heb ik een prototype van de applicatie ontwikkeld. Eerst heb ik een flowchart opgesteld om een duidelijk overzicht te krijgen van hoe de app zal werken. Hierdoor wordt de structuur van het systeem, de volgorde van de pagina’s en de werking van de verschillende onderdelen beter zichtbaar. Op deze manier heb ik eerst een basisstructuur, ofwel het skelet van de website, uitgewerkt.

Wireframe

Na het maken van de flowchart heb ik een wireframe ontworpen. Een wireframe is een eenvoudige visuele schets van een website of applicatie, waarmee de indeling van de pagina’s en de plaatsing van elementen worden weergegeven zonder definitief design of kleuren.

Ik heb een wireframe gemaakt om vooraf een duidelijk beeld te krijgen van de structuur en gebruiksvriendelijkheid van de applicatie. Hierdoor kon ik beter nadenken over de positie van knoppen, inhoud en navigatie voordat ik begon met het uiteindelijke ontwerp.

Hi-fi prototype

Uiteindelijk heb ik een prototype van de applicatie gemaakt. Hier heb ik gedurende een langere periode aan gewerkt en ik heb verschillende ontwerpvarianten uitgeprobeerd. Uiteindelijk ben ik tot het definitieve ontwerp gekomen, dat hier te zien is.

In het prototype werken bijna alle knoppen en navigatiefuncties. Enkel de invoervelden en enkele specifieke knoppen zijn nog niet volledig functioneel, aangezien de focus vooral lag op het ontwerp en de algemene werking van de applicatie.