In de bovenbouw van het havo, vwo of gymnasium wordt er -in zowel Nederland als Vlaanderen- in lessen Nederlands aandacht besteed aan literatuur. Literatuurgeschiedenis.nl is een samenwerkingsverband tussen de Koninklijke Bibliotheek en de Taalunie waarin kennis, verdieping en inspiratie wordt geboden aan docenten en leerlingen op het gebied van de geschiedenis van de Nederlandstalige literatuur.

Briefing 

De website van Literatuurgeschiedenis.nl dateerde uit 2000 en was verouderd. Ik werd als freelance UX designer benaderd voor een nieuw modern visueel design. Maar een nieuw ‘jasje’ is maar één onderdeel van de gebruikerservaring. Want sluit de site ook aan op de wensen van de gebruikers? En wat zijn die wensen…

De doelgroepen/gebruikers van Literatuurgeschiedenis 

De inhoud van de site kwam vanuit werkgroepen met o.a. Nederlandse en Vlaamse docenten en vakdidactici Nederlands/literatuur. Leraren geven lesstof op aan hun scholieren, die daardoor wellicht de belangrijkste/grootste groep eindgebruikers zijn.

De wensen 

Om in kaart te brengen wat gebruikers van Literatuurgeschiedenis.nl vinden, hebben we een online enquête uitgezet op de site zelf. Dit werd vooral ingevuld door docenten (90%), maar gaf alvast een eerste richting. De belangrijkste verbeterpunten waren:

  • De vormgeving was verouderd
  • Gebruikers vonden het lastig informatie te vinden en te navigeren
  • Men wil makkelijk kunnen zoeken (zoekfunctie)
  • Er is behoefte aan thema’s
  • Gebruikers willen graag relevante links en artikelen zien

Tevreden was men over de hoeveelheid en kwaliteit van de informatie. Daarnaast werd de tijdslijn ook als prettig ervaren. Uiteraard kan dit een vertekend beeld zijn omdat de enquête grotendeels door docenten is ingevuld, maar het geeft een globaal beeld waarmee ik aan de slag kon.

 

Dit leidt tot de volgende projectdoelstelling:

Literatuurgeschiedenis.nl moet een moderne uitstraling krijgen en gebruikers moeten makkelijk kunnen zoeken en relevante informatie vinden.

Proces

Eerst keek ik naar vergelijkbare websites gericht op literatuur, geschiedenis of onderwijs. O.b.v. het bestaande design en vergelijkbare sites maakte ik schetsen en zette deze vervolgens om in high fidelity wireframes in Sketch en in een klikbaar Invision-prototype. Het klikbare prototype werd gebruikt tijdens 2 rondes gebruikerstests (zowel Nederlanders als Vlamingen). Er deden in totaal 8 middelbare scholieren mee, 1 student literatuur en 2 docenten. Tussen de twee rondes in werd het design aangepast o.b.v. de feedback uit de gebruikerstests.

Literatuurgeschiedenis_UXdesign_proces-min2

Challenge 1: Moderne uitstraling (en aansluiten bij de KB huisstijl)

Het oude design van Literatuurgeschiedenis.nl vond men ouderwets, saai en een te druk Daarom is er in het nieuwe design gekozen voor veel wit (ruimte), een grote headerafbeelding en de tijdslijn werd in een nieuw jasje gegoten. Daarvoor ontwikkelde ik een icoontje voor elk tijdsvak.

Literatuurgeschiedenis_icoontjes-min2

Reacties usertests:

Testers vonden het nieuwe design mooi en rustig. Het vele wit (witruimte) vonden ze erg prettig. De icoontjes vielen erg in de smaak:

“De tijdlijn is zeer leuk met de icoontjes, dat spreekt aan voor de leerlingen denk ik.”

“De icoontjes vind ik ook mooi. Misschien is het wel handig als er jaartallen bij de icoontjes staan want mijn eeuwen zijn niet heel goed. Ik denk altijd in welke eeuw hoort ook alweer 1630? Is dat de 16e eeuw of de 17e eeuw.”

Naar aanleiding van deze feedback zijn de jaartallen erbij gezet. Zo zie je direct waar je moet zijn als je een boek zoekt uit 1630.

Challenge 2: Makkelijker navigeren

In het oude design was navigeren lastig. Om dit te verbeteren zijn/is er:

  • Een menubalk toegevoegd die zichtbaar is op elke pagina
  • Overzichtspagina’s gemaakt voor ‘Tijdsvakken’, ‘Schrijvers’, ‘Teksten’, ‘Thema’s en stromingen’.
  • Een zoekfunctie toegevoegd in zowel de menubalk (altijd te zien) als op de homepagina. Zo kan je vanaf elke pagina zoeken. Dit werd ook in de gebruikerstests erg gewaardeerd. Wanneer ik bijv. vroeg ‘hoe zou je iets opzoeken over de Renaissance?’ zeiden veel testpersonen: dan gebruik ik gewoon de zoekbalk.

Tijdens de gebruikerstests kregen de testpersonen taken (bijv. zoek Constantijn Huygens of Alexanders Geesten uit 1206.). De testpersonen konden deze informatie makkelijk vinden en dit bleek ook uit de tests (het gedrag).

Alleen zorgde de overzichtspagina ‘Schrijvers’ voor een obstakel. Testers dachten dat informatie niet op alfabetische volgorde stond. Dit was wel zo, maar het stond op achternaam. En moet je nou zoeken bij de T van Thomas, de A van Assenende of voor Vlamingen bij de V van Van Assenende.

 

Na de eerste gebruikerstest is er daarom gekozen om de namen te schrijven zoals in een bronvermelding (Huygens). De alfabetische volgorde was hierdoor niet meer verwarrend. Bij de filteroptie werd eigenlijk direct op de juiste letter geklikt, al zei een enkeling alsnog ik zou dan zoeken bij de C en anders bij de H.

Literatuurgeschiedenis_schrijvers-overzicht

Challenge 3: Relevante informatie

Literatuurgeschiedenis.nl bevat veel informatie, zoals ook duidelijk werd uit de enquête. Maar wanneer men klikte op de naam van een schrijver kregen testpersonen niet wat ze verwacht hadden.

Soms kwamen ze op een tekst van de schrijver, soms op een pagina waarin de schrijver genoemd werd en soms op een overzichtspagina over de schrijver. Maar zagen ze nooit wat ze verwacht hadden.

Ik verwacht over de schrijfster en haar levensloop en wat haar heeft beïnvloed en iets over werk enzo en verzameling van alle boeken die ze heeft geschreven en als die op de website staan dan ook daar je daar naartoe gaat.

Ik verwacht dat je gaat naar de pagina over deze schrijfster, haar leven en achtergrond. Misschien ook relatie met andere schrijvers.

 

Uit de gebruikerstests bleek dat de pagina over een schrijver de volgende informatie moest bevatten:

  • Wie is de schrijver (korte beschrijving + foto/schilderij)
  • Waardoor werd deze schrijver beïnvloed
  • Wat zijn de beroemdste werken
  • Werken op literatuurgeschiedenis te vinden
  • Gerelateerde onderwerpen/schrijvers

O.b.v. deze input maakte ik een ‘template’ voor de schrijverspagina. Schrijvers komen alleen in het overzicht als er een schrijverspagina over ze is.

Ik gebruikte de bestaande tekst van Constantijn Huygens (lange variant) en een pagina voor Thomas a Kempis (korte variant). Deze werden in de tweede ronde beide getoond aan de testpersonen.

Ik zou gefrustreerd zijn als er over de een schrijver veel meer bekend is dan over de ander, als er meer bekend is dan wil je dat ook kunnen lezen. Misschien dan ook met tussenkopjes erbij.

Kort is dus niet altijd beter. De meeste testpersonen kozen voor de langere variant (meer informatie), maar wilden wel meer afwisseling (bijv. video, foto’s en geluidsfragmenten) en tussenkopjes. Maar… de tekst moet ook weer niet te lang worden. Er waren testpersonen die het al hadden over ‘wat een lap tekst’. Er moet dus een balans in worden gevonden en d.m.v. tussenkopjes en andersoortige content willen middelbare scholieren best wel een iets langere tekst lezen. Tussenkopjes kunnen hierbij helpen, omdat de tekst dan beter te scannen is en relevante info over de inhoud van de tekst hieruit kan worden afgeleid.

“De doordachte ontwerpen en uitgebreide gebruikerstests hebben een grote rol gespeeld in het succes van het vernieuwingsproject van de website. Zowel webbouwer Marcel als ikzelf hebben de samenwerking met Carlien als erg prettig ervaren: ze denkt goed mee, reageert snel op mails en vragen en is erg flexibel. We zijn nog niet helemaal klaar met alle verbeteringen toepassen, maar de site is nu al enorm opgeknapt. Bij een volgend project staat Carlien bovenaan mijn lijstje met mensen om te bellen”.

 

Karin Vingerhoets – Dienstcoördinator www.literatuurgeschiedenis.org (Koninklijke Bibliotheek)

“Carlien werkte voor de Taalunie en de KB aan de nieuwe vormgeving van de educatieve website literatuurgeschiedenis.org. Het eerste design was al meteen raak: open, licht en de juiste balans tussen tekst en afbeeldingen. Carlien komt snel met mooie oplossingen en is grafisch ook erg sterk. Bovendien is zij een prettige persoon om mee samen te werken”.

Martijn Nicolaas, senior beleidsadviseur – Nederlandse Taalunie

Eindresultaat

Het live resultaat is te zien op: www.literatuurgeschiedenis.org.

freelance_ux_designer_literatuurgeschiedenis_animatie_oud-nieuw

Nieuwsgierig geworden?

Is jouw website of applicatie toe aan vernieuwing? En wil je zeker weten dat je nieuwe site of app perfect aansluit op de wensen en verwachtingen van je klant?

Stuur me een mail, dan kijk ik met je mee naar de mogelijkheden.