Paper Prototype en Design Validation met gebruikers van beeldbeschrijving voor Dedicon

Geschreven door Dennis Ulijn in maart 2024

De lijst van wensen, behoeften, acties, taken en doelen moete worden gevisualiseerd.Dit doe ik na de Requirements-fase in continue Design- en Evaluatie-ronden. In de eerste stap van Design-Evaluatie richt in me in Low Fidelity Prototypes op het samen met de gebruikers scherp krijgen van het concept van de interface.

Crazy 8's

Het publicatie-overzicht dat gebruikers nu gebruiken is een droge, zakelijke lijst tekst: titel, status, deadline.

Publicatie-overzicht voor productie van o.a. beeldbeschrijvingen
Publicatie-overzicht voor productie van o.a. beeldbeschrijvingen

Om dit deel van de nieuwe interface wat prettiger in gebruik te maken en aan te laten sluiten op de behoeften van de gebruikers, ga ik onderdelen hiervan herontwerpen. Ik gebruik de elementen uit de Task Flow om met de Crazy 8's-methode tot ontwerpopties te komen. Dit houdt in dat ik met snelle schetsen (8 per A4), vluchtige ideeën uit mijn hoofd op papier krijg. Dit doe ik met pen en niet met potlood, zodat ik niet geremd word om een foutje uit te gummen, maar gefocust blijf op ideeën schetsen, ook al zijn ze 'fout'. Juiste in deze fouten kunnen pareltjes van ideeën zitten.

Voorbeelden van verschillende pagina's aan Crazy 8's-schetsen
Voorbeelden van verschillende pagina's aan Crazy 8's-schetsen

De gebruikers waren niet gecharmeerd van AI die gevoelsmatig hun werk overneemt. Hierdoor heb ik bekeken hoe ik hen opties en controle over dit proces kon geven, hoe ik kon aansluiten op 'steekwoorden' tot 'lange beeldbeschrijvingen' en of dit wat luchtiger kon door bijvoorbeeld een ansichtkaart naar ChatGPT te sturen, die een reactie terugschrijft.

Aantal voorbeelden van manieren waarop kunstmatige intelligentie beeldbeschrijvingen voor kan stellen
Aantal voorbeelden van manieren waarop kunstmatige intelligentie beeldbeschrijvingen voor kan stellen

Ik bepaalde hoe ik gebruikers het beste door de stappen van de taken mee moet nemen in de context zodat steeds meer informatie voor de gebruiker ontsluit. Door veel informatie te tonen is Deze route zorgt ervoor dat de interface een hoge informatiedichtheid heeft, waardoor begeleiding in de volgorde en zichtbaarheid van informatie erg belangrijk. Deze informatie kan ik nu verwerken tot een Low Fidelity-prototype.

Paper Prototype

Ik wilde ik deze conclusies digitaal gaan wireframen, maar merkte dat ik vastliep op keuzes zoals maten en vorm. Ik kon de interfaces ook niet zo snel aanpassen, waardoor werken met schetsen op papier sneller en laagdrempeliger is en makkelijker te testen is met gebruikers.

In het Low Fidelity prototype wil ik de taken 'schrijven van beeldbeschrijvingen', 'overnemen van bestaande beeldbeschrijvingen van herkende afbeeldingen in de database' en 'opstellen van beeldbeschrijvingen door AI' uittekenen. Deze elementen haalde ik uit de Crazy 8's en schetste elementen en de schermen waarop ik deze kon plaatsen.

Paper prototype: elementen waaruit schermen kunnen worden opgesteld
Paper prototype: elementen waaruit schermen kunnen worden opgesteld

Door deze elementen in schermen te plaatsen heb ik een deelbare versie van de inhoud en plaatsing van elementen in de interface. Hiermee kan ik met gebruikers testen of zij deze interface begrijpen en prettig vinden werken, nog voor ik daadwerkelijk met het digitale ontwerp van de web-interface begin.

Een aantal schermen uit het Paper prototype. In het tweede schermen tonen pijlen de begeleiding van de gebruiker door de interface
Een aantal schermen uit het Paper prototype. In het tweede schermen tonen pijlen de begeleiding van de gebruiker door de interface

Design validation

Door het paper prototype door te lopen met de gebruikers, achterhaal ik waar het ontwerp aansluit op hun verwachtingen en wensen. Ik gebruik onderdelen van Usability Testing en A/B Testing, Ik zie dit daarmee niet als volledige Usability Testing omdat ik meer observeer wat gebruikers vinden van de werkwijze en schermen, in plaats van de gebruiksvriendelijkheid van de elementen zelf. Door de schermen in te scannen en in Figma te verbinden heb ik dit prototype interactief gemaakt, zodat ik dit ook op afstand kan testen met gebruikers in Rijswijk.

Interactieve versie van de Paper Prototype-schermen
Interactieve versie van de Paper Prototype-schermen

Aanverwante Artikelen