Hi-Fi V4
Last updated
Last updated
Bij het vierde prototype heb ik nogmaals goed gekeken naar de soorten data die ik in mijn navigatie had staan. Ik heb dit geprobeerd om beter te structureren dan eerst en heb dit verdeeld in twee verschillende zijpanelen. De linker over het filteren en de rechter over de output en visualisatie van de MRI scans.
Verder heb ik alvast een aantal visualisaties uitgewerkt zodat ik een impressie kan geven hoe dit zou kunnen werken. Volgende week ga ik de eerste gedetailleerde prototypes testen met de doelgroep dus daarom wilde ik iets meer detail toevoegen. Hieronder een update van de flow met de nieuwe schermen.
Prototype
Ik heb onderzoek gedaan naar verschillende filter menu’s op internet en kwam er hierbij achter dat er bij mijn verdeling van de filter categorieën met de titel van de filter weinig onderscheid was tussen de titel en de filterbare elementen die daarbinnen vallen. Ik heb de titel dus lichter en inklapbaar gemaakt.
Content die buiten de viewport valt is te bereiken door te scrollen. Ook gaf Jan Jaap de tip nogmaals naar de data te kijken en hoe deze zich verhoudt tot elkaar. Zo ging “download” en “share” meer over de MRI scan en niet zozeer over de filter. Jan Jaap gaf aan dat bij hem niet alles in zijn scherm paste en er elementen buiten vielen die hij eerst niet zag. Ik heb de content nu scrollbaar gemaakt binnen het desbetreffende menu item zoals de pre filter/filter zodat alle menu items altijd zichtbaar blijven en niet buiten de viewport vallen zoals bij de linker versie.
Uit de co-creatie sessie met Roelant bleek dat het een wens was van de arts om een preset aan te maken van de filtercriteria. Ook moest het mogelijk worden om een filter preset te kunnen openen. Dit heb ik weer met tabjes gedaan zoals bij de filter en prefilter omdat deze data bij elkaar hoort.
Informatie over de MRI-scan en populatie en layers met het aantal patiënten die meegenomen worden in de filter. Deze twee items horen ook in het rechter paneel aangezien deze informatie gaat over de MRI-scan.
De structurering van de data was niet logisch. Samen met Jan Jaap heb ik overleg gehad en zijn we tot de conclusie gekomen dat het een goed idee is om data te structureren in 2 soorten: data die gaat over het manipuleren van filters (links) en data die gaat over de MRI-scan en output (rechts). Ook vond ik dat het uitschrijven van het samengevouwen menu veel ruimte kostte dus heb ik ervoor gekozen om iconen te gebruiken.
Filter is opgedeeld in twee pictogrammen met prefilter en detailed filter. Zo ziet de gebruiker ook bij de ingeklapte filter dat er twee soorten filters zijn.
Adjust coordinates staat nu rechts in het paneel die gaat over het bewerken van de MRI-scan in het midden.
Toggle masking staat nu rechts in het paneel die gaat over het bewerken van de MRI-scan in het midden.
Download staat nu rechts in het paneel die gaat over het bewerken van de MRI-scan in het midden.
Share staat nu rechts in het paneel die gaat over het bewerken van de MRI-scan in het midden.
Links stonden de coördinaten nog aan de linkerkant maar n.a.v de feedback heb ik deze verplaatst naar de rechter kant. Ook gaf Jan Jaap de tip om te kijken naar Photoshop en hoe zij dat structureren aangezien zij ook veel functionaliteiten bundelen en weergeven in openklapbare panels. De coördinaten staan nu aan de rechterkant. Ook heb ik witte bolletjes toegevoegd om het klikveld om de sliders te draggen groter te maken.
Hier stond de toggle masking nog aan de linkerkant maar n.a.v de feedback heb ik deze verplaatst naar de rechter kant. In die nieuwe versie heb ik de toggle masking aan de rechterkant geplaatst. Verder heb ik deze nu onder dezelfde categorie geplaatst als de adjust coordinates omdat dit beide om het manipuleren van de MRI scans gaat.
Tijdens de coachingsessie vroeg Jan Jaap hoe je kon zien dat er een filter is ingevuld. Hier had ik nog niet over nagedacht dus heb ik dat nu toegevoegd. Ingevulde filters worden nu met een blauwe stip gemarkeerd zodat je kunt zien dat je deze filters bewerkt hebt.
Scrollbare content binnen het desbetreffende menu item zodat er ruimte overblijft om altijd alle 4 de menu items te tonen.
De age tab heeft een histogram die verdeeld is over leeftijd x aantal. Door de balkjes te selecteren worden de aantal patiënten bovenin opgeteld. Aangepaste filters worden gemarkt met een blauwe stip om aan te geven dat hier iets bewerkt is.
Gender is een multiselect tool. Rechts de aantallen per categorie en bovenin nogmaals de gehele geselecteerde populatie.
BirthYear is een slider die met de muis bediend wordt. Tijdens het overleg met het VUmc wil ik gaan voorstellen om dit ook voor age te doen. Ik moet hier nog onderzoek naar doen wat voor hen het beste werkt.
