Testplan prototype Het definitieve prototype van Foliostory zal op basis van een usability test getest worden. Hierbij wordt een happy flow scenario aan de respondenten voorgelegd met daarin taken die voldaan moeten worden. Volgens Steve Krug in zijn boek ‘Don’t make me think’ zijn er een aantal eisen waaraan een gebruiksvriendelijke website aan moet voldoen. Deze eisen vormen de doelstelling van de test. - Geen vraagtekens bij de functies - Draagt het visual interface design bij aan de gebruiksvriendelijkheid? - Iemand met gemiddelde kennis of ervaring kan het eindproduct gebruiken - Het eindproduct moet zichzelf kunnen uitleggen - Het eindresultaat moet ook door alleen te scannen een duidelijk beeld geven van de inhoud
Respondenten + uitvoering De testen worden met 3 personen uitgevoerd binnen de doelgroep jonge creatieven. 3 personen geven volgens Steve Krug in het boek ‘Rocket surgery made easy’ goede snelle inzichten (Steve Krug, 2009, p.43). Hierbij zal een klikbaar design op een laptop getest worden. De gebruiker zal een profiel aanmaken en daarbij de belangrijkste onderdelen invullen, hierbij wordt gekeken of de funtionaliteiten logisch zijn en aansluiten bij de behoeften en doelen van de doelgroep.
Profielschets Om een duidelijk beeld te krijgen van de respondenten die deelnemen aan het testen van Foliostory zullen er voorafgaand een aantal vragen gesteld worden.
1. Heb je een eigen portfolio website? 2. Waar gebruik je deze voor? / Zou je wel een portfolio willen? 3. Maak je gebruik van LinkedIn? 4. Gebruik je andere tools voor ondersteuning bij sollicitaties?
1
Opdrachten/taken A: ‘Je gaat binnenkort solliciteren voor een afstudeerstage, je huidige portfolio is al wat veroudert en je hebt geen tijd om helemaal zelf een nieuwe te maken. Je komt op de homepage van Foliostory en wilt meteen van start gaan’ Taak: Meld je aan
B: ‘Foliostory geeft de mogelijkheid om LinkedIn te koppelen waardoor er al veel informatie over jou ingevuld kan worden’ Taak: Koppel je LinkedIn account
C: ‘Je wilt graag een invulling geven aan het headerbeeld maar weet niet zo goed wat precies, dus wilt graag geïnspireerd worden’ Taak: Zoek inspiratie voor het headerbeeld D: ‘Je wilt de introtekst invullen, er schiet meteen een goede zin in je hoofd’ Taak: Pas de introtekst aan E: ‘De tijdlijn is al ingevuld omdat je je LinkedIn account hebt gekoppeld, je leest in de tips dat je een quote kan toevoegen aan een werkervaring en wilt dit doen’ Taak: Voeg een quote toe aan de stage bij Supersteil F: ‘Werk tonen is het belangrijkste in een portfolio dus je gaat een project toevoegen, deze heb je nog in je Dropbox staan en wilt deze toevoegen’ Taak: Voeg een project toe waarbij media wordt ingeladen vanuit Dropbox, vul vervolgens alle velden in bij de omschrijving van het project. G: ‘Je wil wat va jouw inspiratie bronnen laten zien er schiet meteen een mooie illustratie in je hoofd die je laatst op Pinterest had toegevoegd, deze wil je hier laten zien. Taak: Voeg een inspiratiebron toe vanuit Pinterest H: ‘Het leermoment kan een lastig onderdeel zijn om snel in te vullen, je wilt graag een voorbeeld.’ Taak: Zoek een voorbeeld voor het leermoment en vul leermoment in
2
I: ‘Je hebt al een tijdje doelen voor ogen die je wilt bereiken, deze kunnen hier ingevuld worden’ Taak: Vul doelen en dromen in
Verwachtingen Ik hoop dat de uitkomst van deze test is dat alle problemen en aanpassingen van de eerste usability test met klikbare wireframes zijn verholpen en opgelost. De vraagstukken die van te voren zijn opgesteld moeten beantwoord kunnen worden. Tot slot dat de gebruiker een positieve ervaring heeft, de functionaliteiten begrijpt en overtuigd wordt om het product te gebruiken.
Resultaten en evaluatie De tests zijn goed verlopen met positieve reacties. Iedere respondent zou Foliostory willen gebruiken doordat het er aantrekkelijk en overzichtelijk uitziet. Een andere reden voor gebruik is doordat het makkelijk en snel in te vullen is. Dit waren ook behoeften die naar voren kwamen in het vooronderzoek, er kan dus geconcludeerd worden dat het eindresultaat een positieve werking heeft op de doelgroep. In de testen kwamen enke kleine puntjes naar voren die niet helemaal duidelijk waren doordat er niet genoeg onderscheid in de interface was of vormgeving technisch net wat beter konden. Deze worden besproken in bijlage 3.1 bij alle final designs.
Respondent
1
2
3
Eigen portfolio website
ja
ja
nee
sollicitaties
werk tonen
-
-
-
ja
ja
ja
ja
behance
nee
nee
JA: Voor welk gebruik NEE: Interesse in portfolio? Gebruik LinkedIn Gebruik andere tools
Resultaten usability test 1/2 3
Respondent
1
2
3
A: Meld je aan B: Koppel je Linkedin account C: Zoek inspiratie voor het headerbeeld D: Pas de introtekst aan E: Voeg een quote toe F: Voeg een project toe G: Voeg een inspiratiebron toe H: Zoek een voorbeeld voor het leermoment I: Vul doelen en dromen in
Resultaten usability test 2/2
Verbetering Er is een resultatenschema gemaakt om helder te krijgen welke taken soepel verliepen en welke minder. Bij groen was de taak geslaagd, bij oranje was de taak met enige moeite volbracht en bij rood was de taak niet gelukt.
Zoals te zien is in het resultatenschema in afbeelding 3.2 ging het toevoegen van een quote minder soepel. Dit kwam doordat er niet genoeg onderscheid zat tussen de onderdelen in het formulier. Er was lastig te zien welk onderdeel precies aangepast moest worden. Eigenlijk had het project toevoegen hetzelfde probleem. De selecties van de afbeeldingen waren nog niet duidelijk genoeg en bij het invullen van de informatie hadden de invulvelden niet genoeg onderscheid. Hieruit kon geconcludeerd worden dat er in de formulieren meer hiërarchie in de vormgeving aangebracht moet worden. Dit is doorgevoerd in het final design. 4
Final designs met testresultaten + user scenario
Homepage en aanmelden ‘Manu gaat binnenkort solliciteren voor een afstudeerstage, haar huidige portfolio is al wat veroudert en ze heeft geen tijd om helemaal zelf een nieuwe te maken. Ze komt op de homepage van Foliostory en wil meteen van start gaan. Foliostory geeft de mogelijkheid om LinkedIn te koppelen waardoor er al veel informatie over haar ingevuld kan worden’
Testresultaten: In de interviews kwam naar voren dat gebruikers het vervelend vinden om veel verplichte velden te moeten invullen. Daarom bestaat het aanmeldformulier alleen uit de essentiële onderdelen. Bij het toevoegen van LinkedIn wordt er direct doorverwezen naar het LinkedIn account. Dit onderdeel verliep soepel bij de testen. 5
Headerbeeld ‘Manu wil graag een invulling geven aan het headerbeeld maar weet niet zo goed wat precies, dus wil graag geïnspireerd worden. Nadat ze geïnspireerd is heeft ze een beeld in gedachte die kan dienen als headerbeeld, en voegt deze toe.’
Testresultaten: Bij dit onderdeel kwam naar voren dat ze het prettig zouden vinden dat als je voor de eerste keer op in de editmodus komt de eerste mogelijkheid voor tips open staat. Zo is het meteen duidelijk waar de tips en voorbeelden zitten en krijg je meteen een welkom krijgt. De switch van tips naar voorbeelden vonden de respondenten erg goed en inspirerend.
6
Introductie ‘Manu wil de introtekst invullen, nadat ze de uitleg heeft gelezen typt ze een stukje tekst over zichzelf.’
Testresultaten: Het onderdeel introductie tekst toevoegen was meteen duidelijk dat er door op de tekst te klikken de tekst aangepast kon worden of dat de button voor aanpassen gebruikt kon worden.
7
Interactieve tijdlijn ‘De tijdlijn is al ingevuld omdat Manu haar LinkedIn account heeft gekoppeld,ze leest in de tips dat ze een quote kan toevoegen aan een werkervaring en wil dit doen bij de stage bij Supersteil.
Testresultaten: De tijdlijn is na de optimalisatie een stuk duidelijker geworden en werd dan ook meteen begrepen door de respondenten. Het probleem wat naar voren kwam in de usability test qua hiërarchie in het formulier is hier opgelost door er duidelijke titels aan toe te voegen.
8
Leermoment ‘Het leermoment kan een lastig onderdeel zijn om snel in te vullen, Manu wil graag een voorbeeld.’
Testresultaten: Het toevoegen van het leermoment werkt het zelfde als het invullen van de introductie. Dit onderdeel ondervond dan ook geen problemen bij de test. De tips werden bij dit onderdeel erg op prijs gesteld.
9
10
Projecten tonen ‘Werk tonen is het belangrijkste in een portfolio dus Manu wil een project toevoegen, afbeeldingen van het project staan in de dropbox. Gebruik dit medium om het project toe te voegen.
Testresultaten: Bij het toevoegen van projecten waren er een aantal kleine puntjes die nog niet helemaal duidelijk waren bij de respondenten. Als eerste was het nog niet helemaal duidelijk welke afbeeldingen er geselecteerd waren, dit is nu duidelijker gemaakt om een blauwe rand om de selectie te maken. Daarnaast was bij het toevoegen van details aan het project ook niet genoeg hierarchie en feedback. De selecties zijn nu duidelijker gemaakt en er is meer onderscheid in de verschillende onderdelen.
Het bekijken van projecten waren ze erg over te spreken. Duidelijke structuur en de informatie komt snel over. De jonge creatieven gaven aan dat ze dit een hele goede toevoeging vinden aan een online tool en het maakt ze bewust van wat bedrijven willen zien en lezen over hun gemaakte werk.
11
12
Inspiratie ‘Manu wil wat van haar inspiratie bronnen laten zien, ze heeft een map op haar computer staan waar ze inspirerende beelden opslaat. Voeg een beeld toe in de inspiratie gallerij.’
Testresultaten: Inspiratie is bedoeld om de persoonlijkheid van iemand te visualiseren en inzicht te geven in hoe iemand te werk gaat. Dit vonden de respondenten duidelijk en een goede toegevoegde waarde. Ook bij dit onderdeel zeiden ze dat het ze bewust maakt om meer van dit soort informatie in een portfolio te verwerken. De functionaliteiten waren hier allemaal duidelijk. “Het mouse-over effect heeft hier echt een toegevoegde waarden” Zei respondent 1.
13
Doelen en dromen ‘Manu heeft al duidelijk doelen voor ogen die je wilt bereiken, deze kunnen hier ingevuld worden. Daarnaast is Manu een dromer die graag grootse dingen wilt bereiken.’
Testresultaten: Functionaliteiten waren hier allemaal duidelijk. Net als leermoment een lastig onderdeel om snel in te vullen dus de tips en voorbeelden zijn hier heel erg toepasselijk.
14
15
