UI/UX-design
Op het moment dat we bedacht hadden wat we zouden kunnen maken voor de opdrachtgever, hebben we UI/UX-designs gemaakt met Draw.io. Deze designs hebben we voorgelegd aan de opdrachtgever, met als doel na te gaan of dit inderdaad zou bijdragen aan het probleem wat centraal staat. De gemaakte designs staan op hiervoor bestemde git repository.
We zijn ambitieus van start gegaan, met ontwerpen welke ook persoonlijke opslagmogelijkheden tonen voor gebruikers (hier te vinden). Hiermee zouden de gegenereerde quizzes en lesmateriaal bewaard kunnen worden voor hergebruik. Zoals te lezen in onze requirements had persistentie echter niet de hoogste prioriteit. Daarom hebben we deze ontwerpen in de ijskast geplaatst en zijn we aan de slag gegaan met simpelere varianten gaan maken (hier te vinden).
Deze simpelere varianten zijn de basis geworden van de applicatie zoals hij nu staat. Voor kleuren en vormen hebben we afgekeken bij Brightspace-instance1 van de HHS en de huisstijl van de HHS2, zodat we een herkenbare interface kunnen tonen aan gebruikers.
Omwille van de eenvoud van de applicatie, beperkte designkennis en de voorbeelden die we reeds tot onze beschikking hadden, hebben we gekozen om geen high fidelity-designs te maken.
Impressie van de designs
De designs kunnen vrij ingezien worden door de .drawio-bestanden uit eerdergenoemde repository te openen in Draw.io. Toch willen we enkele belangrijke designs hier uitlichten.
Quiz genereren
De volgende afbeelding toont de UI van het Quiz genereren-scherm. Aangezien er geen inlogmogelijkheid is, is dit ook het startscherm van de applicatie.
Quiz inzien en exporteren
Wanneer het genereren klaar is, moet men op dit scherm terecht komen. Hier worden de vragen getoond met enkele eenvoudige bewerkingsfuncties. Deze bewerkingsfuncties zijn op vraagniveau bijvoorbeeld:
- Quizvraag hergenereren, dit genereert een nieuwe vraag van hetzelfde type ter vervanging van de vraag.
- Quizvraag verwijderen, dit verwijdert de vraag.
Gebruik van de designs in het prototype
Vrijwel alle functies die te zien zijn in de designs zijn geimplementeerd, enkele functies vielen na het toepassen van priorering middels de MoSCoW-methode af voor het eerste prototype:
- De 'Genereer extra vraag'-functie.
- De 'Alles opnieuw genereren'-functie.
- Vragen bewerken (dit kan de gebruiker wel in Brightspace doen).
