Wireframes & Prototype - YunusEmreCMD/blokTech GitHub Wiki

Ik had in het begin de feature "account aanmaken" gekozen, die ik kort daarna heb geschrapt, en daarna ben ik begonnen met het realiseren van een nieuwe feature, namelijk "filteren". Dus ik ben op internet gaan zoeken naar inspiratie en bestaande apps die een filter feature hebben.

Filter feature voorbeeld 1 en 2 - hotel en workout

Ik vind beide voorbeelden er clean uitzien, het is makkelijk te gebruiken en begrijpen. Ondanks dat je bij het linker voorbeeld veel hebt op op te filteren, hebben ze er goed over nagedacht hoe ze het best de filter feature kunnen opmaken en implementeren.

Filter feature voorbeeld 3 en 4 - hotels

Ik vind de layout van beide features erg opvallen, het lijkt me tof om ook zoiets in mijn design te verwerken. Het kleurgebruik vind ik ook cool, het geeft een mooie uitstraling. Ook vind ik de icoontjes leuk die worden gebruikt in het rechter voorbeeld.

Eerste versie filter overlay

Mijn nieuwe ontwerp is nog vrij simpel, het is een eerste 1.0 versie. Als het werkt, kan ik alles verder opmaken. Links V1.1 rechts V1.2.

Zo ziet de filter overlay er uit, wanneer de dropdown is uitgeklapt, de slider is gebruikt en gebruik is gemaakt van de radio button.

Cards inspiratie

Ik wil de resultaten in cards (design principe) weergeven, dat lijkt mij het cleanst en verstandigst om te doen. Ik wist al ongeveer hoe het eruit moest komen te zien, maar ik heb eerst even inspiratie opgedaan.

Volgende stap: Kaarten omdraaien

Ik heb een interface gemaakt met cards en de stijl aangepast, je kunt hierin scrollen naar de zijkant. Nu zie je alle cards uiteraard, maar binnenkort moet er gefilterd kunnen worden.

Volgende stap: Kaarten omdraaien

Ik wil wanneer je op een card klikt je meer informatie krijgt over of de werkzoekende of de werkgever. Dit had ik al in het begin in mijn hoofd, het moet er ongeveer zo uit komen te zien: