"Ik maak alles wat de gebruiker van een website of app ziet, op technisch en creatief vlak. Data die door de back end developer is ontwikkeld zet ik om in bruikbare en visueel aantrekkelijke websites en apps."
"Ja, zeker! Wat wil je weten?"
"Animaties zijn bewegende onderdelen op een website of in een app. Ze zijn er in alle soorten en maten. Denk aan een kleur die verandert wanneer je met je muis over een knop of menu gaat. Maar ook hele pagina’s die veranderen doordat je je muis beweegt of naar beneden scrolt. De beweging van een animatie op het web is altijd afhankelijk van een gebruiker die iets doet."
"Grofweg zijn er twee soorten: animaties die je website visueel aantrekkelijker maken en functionele animaties, die bedoeld zijn om de gebruiker sneller naar zijn doel te leiden. De meest gebruikte animaties zijn elementen die verschijnen en verdwijnen. Ook de kleine elementen die zichtbaar worden als je met je muis ergens overheen gaat, zie je vaak. Ze hebben een ondersteunende functie om de gebruiker duidelijk te maken dat hij op die plek iets kan doen. Bijvoorbeeld klikken op een button. Verder zijn er allerlei kleine animaties die op de achtergrond afspelen. Een achtergrond die net iets langzamer omhooggaat dan de content bijvoorbeeld. Animaties zorgen voor speelsheid. Websites zien er daardoor niet meer zo statisch uit als vroeger."
"Haha, ja dat is een goed punt. In sommige gevallen leiden animaties alleen maar af. Het is daarom ook belangrijk om je af te vragen of een animatie meerwaarde heeft of juist een averechts effect en goed af te wegen of je ze wel of niet inzet."
"Ze zijn vooral bedoeld om statische websites meer sjeu te geven. Daarnaast kan het ook helpen om een gebruiker de weg te wijzen op een website of in een app. Of om hem naar de plek te sturen waar jij hem wilt hebben. Een animatie kan dus ook dienen als een visuele call-to-action. Als iets visueel aantrekkelijk is, valt een element meer op en houd je de aandacht van de gebruiker langer vast."
"Ik let er vooral op dat hij het doel van de website ondersteunt en niet afleidt. Over het algemeen is het dan belangrijk dat je animaties niet over de top zijn. Natuurlijk zijn er uitzonderingen. Neem bijvoorbeeld Apple. Apple heeft een supervette animatiewebsite met allerlei elementen die in en over elkaar schuiven. Voor zo’n bedrijf geldt: hoe meer over de top hoe beter! De animaties ondersteunen op een visuele manier het verhaal dat Apple te vertellen heeft. Een goede animatie leidt de bezoeker naar zijn einddoel op een visueel zo aantrekkelijk mogelijke manier."
"Een website zonder animaties, vind ik anno 2021 een beetje achterhaald. Natuurlijk is het niet het enige wat ervoor zorgt dat een app of website er van deze tijd uitziet. Maar animaties zorgen voor een lekker werkende website waar je vloeiend doorheen navigeert."
"Een animatie kan de toegankelijkheid van je website beperken. Als je een element animeert, vraagt dat best veel vermogen van je laptop. Dat kan tot gevolg hebben dat bij het laden van een zware animatie je laptop gaat blazen, omdat hij steeds moet herberekenen waar het element staat. Met een beetje pech loopt je webpagina vast, omdat ie druk is met het herpositioneren van elementen."
"Bij het maken van animaties werk ik veel samen met de designer. De designer ontwerpt de basis. Daarna is het aan mij om dit ontwerp zo goed mogelijk te interpreteren en toe te passen op de andere elementen. De designer kijkt wat hij daarvan vindt en op basis van die feedback doe ik aanpassingen. Het maken van animaties is een echte gevoelskwestie, dus we overleggen veel met elkaar. Net zolang tot we allebei tevreden zijn."
"De website Kryha was heel leuk om aan te werken. Het bedrijf – gespecialiseerd in blockchain – wilde een website die er lekker clean en strak uitziet. Animaties vonden zij belangrijk, dus maakten zij daar ook budget voor vrij. Een ander voorbeeld waar ik trots op ben, is de website voor Pascal, een compliance support platform. Tegelijkertijd vind ik het ook een goed voorbeeld van een website waar de vorm enigszins boven functie gaat. Voor contactinformatie moet je helemaal naar beneden scrollen naar de footer. Maar intussen zorgen de animaties ervoor dat je af en toe moet wachten tot ze geladen en verder kunt scrollen. De gebruiker doet er dus langer over om bij bepaalde informatie te komen."
"Voor deze organisatie is het heel belangrijk dat de homepagina er catchy uitziet. En dat is gelukt! De homepage die er nu staat past echt goed bij het bedrijf. De rest van de website is minder zwaar geanimeerd, waardoor de balans terug is en je evengoed een hele fijne website hebt. Er zitten allerlei toffe elementen in. Scroll je naar beneden dan verdwijnt het menu, zodat je zonder afleiding de hele pagina kunt zien. Scroll je naar boven, dan komt het menu weer tevoorschijn. We gaan er dan vanuit dat de gebruiker op zoek is naar iets anders."
"Grote animaties kosten veel tijd om ze lekker werkbaar te maken. Ze moeten op alle devices vloeiend werken en daar ben je wel even mee bezig. Op een desktop werk je met een muis en toetsenbord, maar als je een mobiel gebruikt dan heb je alleen je vinger waarmee je aan het systeem kan laten zien welke actie je gaat doen. En naast al die verschillende apparaten heb je ook nog verschillende browsers, die allemaal net anders werken."
"Soms. Een geanimeerde app of website kan er op het ene device supergoed uitzien maar op een ander device blijkt het niet te werken. Maar als je die puzzel dan oplost en het lukt een animatie op elk device goed te laten werken, dan geeft dat superveel voldoening!"