Banner

De foto die voorheen op de banner stond vond ik wat eentonig en een beetje eng overkomen. De manier hoe de mensen keken vond ik persoonlijk wat onprettig. Daarnaast geeft het ook niet goed weer wat KBO Reeshof nu precies doet. De banner werd daarom veranderd met verschillende activiteiten foto’s. De banner werd ook vergroot op de hoofdpagina zodat bij binnenkomst er een groot mooi blauw venster aanwezig is. Dit kan wellicht wel verwarring brengen met betrekking tot scrollen. Dit wil ik eerst testen met de testpersoon van woensdag 18 mei.

Untitled

Figuur 54: Eerste iteratie banner

Untitled

Figuur 55: Tweede iteratie banner

Na test met eerste persoon

Na de test met de eerste persoon waren er overduidelijk 2 kleine dingen die gelijk aangepast moesten worden. Het scrollen was nu inderdaad onduidelijk voor de testpersoon. Daarnaast werd er direct op de rode ‘bekijk de voordelen’-knop gedrukt. Dit komt hoogstwaarschijnlijk door de websiteuitleg waar de gebruiker eerst doorheen was gelopen. Bij de uitleg werd ook dezelfde rode knop gebruikt om naar de volgende stap te gaan. Hierdoor was de gebruiker snel geneigd om hierop te drukken zonder eerst naar beneden te scrollen.

Om deze 2 problemen op te lossen wordt ervoor gekozen om de banner weer kleiner te maken zodat er een witte balk ontstaat waardoor het duidelijker wordt voor de gebruiker dat er gescrolt kan worden. Op de voordelenpagina was het namelijk wel duidelijk dat er gescrolt kon worden.

Untitled

Figuur 56: Derde en laatste iteratie banner

Ook werd de onderste afbeelding aangepast naar een foto waarop een daadwerkelijke activiteit te zien is met mannelijke ouderen. Er werd hiervoor gekozen om op die manier ook duidelijk te maken dat er ook voor mannen activiteiten beschikbaar zijn. Daarnaast geeft deze afbeelding een beter beeld over wat KBO-Reeshof kan bieden dan een bos bloemen die voorheen getoond werd.

Als laatste wordt de rode knop veranderd naar ‘wat wilt u doen’. Deze knop begeleidt de gebruiker naar beneden naar de navigatiemenu op de hoofdpagina. Hier werd voor gekozen omdat de introductie van de website ook gebruik maakte van knoppen en hierdooor de gebruiker snel geneigd was om door te drukken op de knop. Hierdoor mist de gebruiker content op de website aangezien hiervoor gescrolt dient te worden.

Navigatie

Om de foto’s in de navigatiemenu beter te tonen werden de foto’s gedraaid tot rechte vierkanten. De hoeken worden behouden. Daarnaast wordt de tekst omgezet van rood naar blauw en onderstreept verwijderd om te testen of de ouderen dit nog duidelijk vinden dat hier geklikt kan worden, en om niet te veel CTA-kleuren te gebruiken.

Untitled

Untitled

Figuur 56: Menuitem versie 1.0

Figuur 57: Menuitem versie 2.0

Oude versie vs nieuwe versie

Homepage.png

Figuur 58: Volledig hoofdpagina versie 1.0

Homepage.png

Figuur 59: Volledig hoofdpagina versie 2.0

‘Naar boven’-knop