Doe een user test over het form

[Annevd]

Gebruikerstest voor het Formulier

Doelen van de Test

• Formulierfunctionaliteit: Testen of het formulier zonder problemen kan worden ingevuld en verzonden.
• Gebruikerservaring: Controleren of het formulier duidelijk, logisch en gebruiksvriendelijk is.
• Bevestigingsfeedback: Nagaan of de gebruiker de bevestiging na het verzenden (loading-animatie en knopwijziging) begrijpt.

Testscenario’s

Scenario 1: Het formulier invullen en verzenden

• Situatie: De gebruiker van Bieb in Bloei wil een vraag stellen of zich aanmelden voor een workshop en vult het formulier in.
• Taak: Het formulier volledig invullen en de knop “Verzenden” aanklikken. De gebruiker ziet dan de bevestiging.

Teststappen

1. Vooraf

• Geef een korte uitleg over het doel van het formulier.

2. Invullen formulier

• Vraag de gebruiker om het formulier volledig in te vullen en op de knop “Verzenden” te klikken.
• Observeer of er vertraging of verwarring is bij het invullen van bepaalde velden.

3. Feedback na Verzenden

• Vraag de gebruiker om aandacht te besteden aan wat er gebeurt na het klikken op “Verzenden”.
• Observeer of de puls-animatie en de wijziging van de knoptekst naar “Verzenden gelukt!” opgemerkt worden.
• Vraag of de gebruiker de animatie begrijpt als bevestiging van de verzending.

4. Algemene ervaring

• Vraag de gebruiker naar zijn of haar algehele ervaring met het formulier:
  • Was het eenvoudig te begrijpen en in te vullen?
  • Is de bevestigingsfeedback duidelijk?
  • Heeft de proefpersoon suggesties voor verbeteringen?

Vragen na de test

Gebruiksgemak:

• Hoe eenvoudig was het om het formulier in te vullen? (Schaal van 1-5)

  Animaties en Feedback:

• Waren de animaties en bevestigingsfeedback nuttig en duidelijk?

  Verbeterpunten:

• Zijn er aspecten van het formulier die verwarrend of onduidelijk waren?
• Heeft de proefpersoon suggesties voor verbeteringen?

[Annevd]

17/11 User test

Vandaag heb ik een user test op het formulier uitgevoerd met mijn vader op mijn laptop, die niet tech-savy is en vrijwel nooit een laptop gebruikt. Ik heb de stappen van bovenstaande voorbereiding gevolgd.

Tijdens de user test

Ik heb mijn vader eerst gevraagd om het volledige formulier in te vullen.

Hij begon met het invullen van de reden voor contact, waar hij het bolletje voor de workshop aanklikte. Vervolgens begon hij met het invullen van zijn voornaam wat goed ging. Na dit gedaan te hebben vroeg hij of hij ook op enter kon klikken om naar de volgende input te gaan, dit probeerde hij en dat werkte zoals hij verwacht had.

Toen hij bij de textarea kwam waar je je voor de workshop kan aanmelden vroeg hij welke workshops er dan waren. Deze staan er natuurlijk niet bij omdat het een component op zich is, buiten de context. Ik heb hem toen laten zien dat je de workshops normaal gesproken bij de agenda pagina ziet, en vanuit daar klikt op aanmelden. Na deze informatie vond hij het wel duidelijk en ging hij verder met het afmaken van het formulier.

Daarna vroeg ik hem om op de verzendknop te klikken, en te observeren wat er met de knop gebeurt. Nadat hij dit gedaan had vroeg ik hem "wat zag je toen je op de knop drukte? wat gebeurt er met de knop?", waarop hij antwoordde dat hij gelijk de not-allowed cursor zag en de tekst "verzenden gelukt!". Hij wist niet of deze rode cursor nou een goed of slecht ding betekende. Op basis van dat antwoord vroeg ik hem "waarom denk je dat je nu niet op de knop kan drukken?", waarop hij antwoordde "omdat het formulier al verzonden is". Dit maakte het voor hem duidelijk dat de not allowed cursor dient als bescherming dat het formulier niet dubbel verzonden wordt, omdat het verzenden al gelukt was.

Ik vroeg hem ook of de state tussen verzenden en verzenden gelukt hem was opgevallen. In eerste instantie dus niet. Ik heb hem gevraagd dit nog een keer te observeren. Toen viel hem op dat de cursor een laadrondje wordt. De pulse animatie viel hem niet op. Ik vertelde hem dat deze animatie er was en liet het zien, waarna hij het nu wel zag. "Vind je dat een duidelijke manier om te laten zien dat het aan het laden is?". Hij antwoordde dat de ladende cursor al heel veel zegt, maar als je wil dat de animatie dat ook laat zien dat het opvallender moet (de scale moet dus groter).

Na de user test

Gebruiksgemak:

• Hoe eenvoudig was het om het formulier in te vullen? (Schaal van 1-5): een 5/5

  Animaties en Feedback:

• Waren de animaties en bevestigingsfeedback nuttig en duidelijk?: De animatie van de plantjes zijn leuk en geven aan dat je het goed hebt ingevuld samen met de groene kleur. Ze zijn niet per se nodig maar maken het wel leuker om in te vullen.

  Verbeterpunten:

• Zijn er aspecten van het formulier die verwarrend of onduidelijk waren?: Nee
• Heeft de proefpersoon suggesties voor verbeteringen?: Opvallendere loading state animatie

Conclusie

De gebruiker vond het formulier eenvoudig in te vullen. De feedback en animaties werden als leuk en nuttig ervaren, hoewel ze niet essentieel waren.

Er kwam een puntje feedback naar voren: de laad-animatie tijdens het verzenden viel niet meteen op. Een grotere of opvallendere animatie kan helpen om de status duidelijker te maken.

Verder was er geen verwarring over het formulier, en de feedback (zoals de groene kleur en bevestiging tekst) werden goed begrepen.