Maak in een handomdraai een visueel aantrekkelijke en interactieve tijdlijn met Timeline JS.
Door: Leen Liefsoens
In het Knight Lab van de Northwestern-universiteit werken studenten, docenten, designers en ontwikkelaars samen aan het ontwerpen van gebruiksvriendelijke storytelling tools voor journalisten. Een van hun tools is Timeline JS. Niet alleen handig voor journalisten, maar voor eenieder die online een chronologisch verhaal wil vertellen of chronologische data wil visualiseren.
Via timeline.knightlab.com/#make maak je in vier stappen een interactieve tijdlijn.
1 Allereerst bouw je je tijdlijn op aan de hand van een Google spreadsheet template, te downloaden bij stap 1 op timeline.knightlab.com/#make. Een Google-account is dus vereist. Elke rij in het document is één evenement op je tijdlijn. Daarbij is elke gebeurtenis te illustreren met een gepast media-element. Negentien verschillende mediatypen worden ondersteund, waaronder YouTube-filmpjes, Spotify-tracks, tweets, Google Maps, Flickr-foto’s en Wikipedia-artikelen.
2 Zorg ervoor dat je Google spreadsheet is gepubliceerd.
3 Kopieer vervolgens de link van je Google spreadsheet naar het lege tekstveld bij stap 3 op timeline.knightlab.com/#make. Dit moet de link zijn van de adresbalk van je browser, negeer de link die bij stap 2 wordt weergegeven in het venster ‘Publiceren op internet’.
Bij deze stap is het instellen van verschillende opties mogelijk, waaronder het lettertype, het startpunt van je tijdlijn en de plek van de navigatie.
4 Ten slotte verschijnt een link naar je gegenereerde tijdlijn. Of je kunt gebruikmaken van de insluitcode om je tijdlijn op je eigen website te plaatsen.
Je hebt geen programmeerkennis nodig voor het gebruik van Timeline JS, maar je kunt je tijdlijn wel verder aanpassen indien je kennis hebt van JavaScript Object Notation (JSON), een gestandaardiseerd gegevensformaat.
De tijdlijnen zijn geschikt om te bekijken op een groot scherm, maar ook op de kleinere schermen van een smartphone of tablet. En het gebruik van Timeline JS is helemaal gratis. Kortom, vele voordelen en daarbij zijn de tijdlijnen die je maakt met Timeline JS visueel erg aantrekkelijk. Een mooi voorbeeld vind je op www.rainforest-alliance.org/about (de tijdlijn bevindt zich halverwege de webpagina).
Tips
- Beginners kunnen een tijdlijn maken met niets meer dan een Google spreadsheet, zoals in de vier stappen staat beschreven. Op YouTube vind je diverse Engelstalige tutorials. Een aanrader is de how-to video van de Carleton Universiteitsbibliotheek: youtu.be/gNQA2HEseso.
- Experts kunnen hun JSON-vaardigheden gebruiken om een tijdlijn verder aan te passen zonder verlies van de nette basis van Timeline JS. Op timeline.knightlab.com/docs vind je de benodigde documentatie. De bibliotheken van het Boston College beschrijven hoe zij het voor een van hun projecten hebben aangepakt: ds.bc.edu/creating-a-timeline-with-timelinejs-and-json.
- Er is ook een plugin van Timeline JS plugin voor WordPress beschikbaar. Door deze plugin te installeren kun je eenvoudig een tijdlijn toevoegen aan je website. Een demo van de plugin kan je bekijken via youtu.be/W4k5Bih3k_U.
Leen Liefsoens is redacteur van IP en senior informatiespecialist bij de bibliotheek van de Haagse Hogeschool.
Deze bijdrage komt uit IP nr. 4 / 2018. Het gehele nummer kun je hier lezen.