9u in Brussel, de ochtendspits is in vol ornaat. Druppelsgewijs wandelden de Reffers en enkele andere agencies een ogenschijnlijk doodnormaal kantoorgebouw binnen. Google weet heel goed dat je maar een kans hebt op een eerste indruk. Alle naamkaartjes lagen perfect klaar; de koffie was warm en straf. Zoals het hoort. Wat echter het meeste opviel was de manier waarop het legertje developers en analisten binnen kwam. Rustig een koffietje nemen, oude bekenden even groeten, laptop open, wifi connecteren en in de code duiken. De toon was gezet, hier ging hard gewerkt worden.
Stipt op het afgesproken uur nam een oude bekende het woord. Nuria Gonzalez-Candia was vorig jaar nog een Reffster, vandaag verdient ze de kost als UX Growth Lead bij Google en de drijvende kracht achter deze hackathon. Na een korte introductie gaf ze het woord aan Antoine Brossault, Mobile UX-manager bij Google.
Happy Days
Antoine’s talk zat barstenvol actionable tips en tricks om de snelheid van een mobiele website instant te optimaliseren. In een sneltempo werden we om de oren geslagen met termen als HTTP-requests, asynchronous loading, lazyload, legacy coding, Defer JS, time to first byte, treeshaking, webpagetest.org, …
Voor een digitale strateeg (lees: development rookie) als mezelf ging de klok soms luiden in de verte. Waar de klepel exact hing was al een pak lastiger. De instemmende knikjes en het ijverig noteren van het publiek verzekeren me echter dat de presentatie spot on was. Dat werd andermaal bevestigd wanneer ik dezelfde termen herkende in de slotpresentaties van alle teams. Ze hadden verschillende tips & tricks direct kunnen implementeren en testen. Happy days.
Na de introductie werd de groep in 2 verdeeld. Onze techneuten staken hun knappe koppen bij elkaar, bedachten een gameplan voor de volgende uren en deden waar ze zo briljant in zijn: websites bouwen en beter maken. Nooit gedacht dat het zoemende getokkel van tientallen handen tegelijkertijd zo rustgevend en opwindend tegelijkertijd kon zijn. Er waren namelijk prijzen beloofd en ook bij nerds (kunnen we eindelijk eens afspreken dat dit een prachtig woord is?) bestaat er iets als competitiedrang. Boys will be boys?
De functionele analisten en UX’ers trokken samen met Nuria naar een andere ruimte om het over een heel andere boeg te gooien. Concepten zoals occupied en unoccupied waiting time werden opgefrist aan de hand van een heel boeiende case rond luchthavens.
De functionele analisten en UX’ers trokken samen met Nuria naar een andere ruimte om het over een heel andere boeg te gooien. Concepten zoals occupied en unoccupied waiting time werden opgefrist aan de hand van een heel boeiende case rond luchthavens.
Wandelen is het nieuwe wachten
In een grote internationale luchthaven wouden ze de klantentevredenheid verbeteren. Alle registers werden opengetrokken om de ervaring te optimaliseren. Kleine en grote ingrepen zorgden ervoor dat het gemiddeld slechts 7 minuten duurde om uit het vliegtuig te stappen, je bagage op te halen en buiten te wandelen. Dat lijkt heel erg snel en efficiënt, toch gaven de bezoekers aan dat ze niet echt onder de indruk waren en nog frustraties hadden. De reden was de wachttijd aan de bagageband die nog steeds 4 minuten in beslag nam.De oplossing?
Heel simpel: Het vliegtuig aan het uiteinde van de luchthaven parkeren. Dat zorgde ervoor dat de reizigers enkele minuten nodig hadden om tot aan de bagageband te wandelen. Wachttijd die nu werd opgevuld met een bezigheid. De tevredenheid behaalde eindelijk het gewenste niveau..
Wanneer je dus volgende keer foetert dat je een eindje moet wandelen van je vliegtuig naar het gebouw, onthoud dan dat je dat liever blijkt te doen dan dezelfde tijd te staan wachten. Het is onze eigen fout.
Wanneer je dus volgende keer foetert dat je een eindje moet wandelen van je vliegtuig naar het gebouw, onthoud dan dat je dat liever blijkt te doen dan dezelfde tijd te staan wachten. Het is onze eigen fout.
AMP’s, PWA’s en PWAMP’s
Na de noodzakelijke versterking van de innerlijke mens was het tijd om in te zoomen op 2 concepten die een hele grote impact hebben op mobile speed: Accelerated Mobile Pages (AMP) en Progressive web apps (PWA).
Beide groepen namen terug afscheid van elkaar en trokken elk naar hun eigen ruimte. De ontwikkelaars kregen Adam Read, specialist engineer bij Google, voor zich. Read zoomde vooral in op de technische kant en features van beide concepten. Na zijn energieke talk klapten alle laptops weer open en keerde dat heerlijk rustgevende getokkel terug. Wie ooit nog eens durft beweren dat hackathons vooral veel pizza en Red Bull zijn, mag je naar mij sturen. Hackathons zijn vooral keihard knallen tegen de tijd en verschrikkelijk hard werken.
In de andere ruimte werd vooral gekeken naar de concrete toepassingen en mogelijkheden van AMP en PWA. Wanneer zijn ze relevant? Hoe kunnen ze inspelen op het gevoel van snelheid? Hoe kunnen ze de UX verbeteren? Hoe kan je ze combineren en PWAMPS maken?
Beide groepen namen terug afscheid van elkaar en trokken elk naar hun eigen ruimte. De ontwikkelaars kregen Adam Read, specialist engineer bij Google, voor zich. Read zoomde vooral in op de technische kant en features van beide concepten. Na zijn energieke talk klapten alle laptops weer open en keerde dat heerlijk rustgevende getokkel terug. Wie ooit nog eens durft beweren dat hackathons vooral veel pizza en Red Bull zijn, mag je naar mij sturen. Hackathons zijn vooral keihard knallen tegen de tijd en verschrikkelijk hard werken.
In de andere ruimte werd vooral gekeken naar de concrete toepassingen en mogelijkheden van AMP en PWA. Wanneer zijn ze relevant? Hoe kunnen ze inspelen op het gevoel van snelheid? Hoe kunnen ze de UX verbeteren? Hoe kan je ze combineren en PWAMPS maken?
Naar het einde van de presentatie toe voelde je de meeste analisten lonken naar de flipcharts, post-its en stiften. Als enthousiaste jonge honden waren ze helemaal klaar om alle opgedane kennis in de praktijk toe te passen in groepjes van 2. Eens losgelaten kon de sfeer niet meer verschillen dan die in de andere ruimte. Ideeën er argumenten vlogen in het rond. Schema’s en flowcharts werden getekend, doorschrapt en hertekend. Als nadenken geluid maakte dan was het een oorverdovend kabaal daar op het vierde verdiep in hartje Brussel.
Om de dag af te sluiten presenteerde elk team kort hun resultaten en werd er democratiegewijs gestemd met de smartphone, uiteraard. The Reference eindigde trots op plaats 1 en 3. De overwinning werd gevierd terwijl de eerste meetingrequests met onze klanten om hun mobile speed te bespreken de deur uitgingen. Merci Google, we weten weer wat gedaan de komende weken!
Als uitsmijter geven we jullie graag nog enkele nuttige links, tools en reads mee om ook aan uw mobile speed te werken.
Als uitsmijter geven we jullie graag nog enkele nuttige links, tools en reads mee om ook aan uw mobile speed te werken.
- https://www.awwwards.com/brainfood-mobile-performance-vol3.pdf
- https://whatwebcando.today/
- https://ampbyexample.com/
- https://www.webpagetest.org/
- https://developers.google.com/web/tools/chrome-user-experience-report/
- https://www.base64-image.de/
- https://speedchecklist.com/#/
Hulp nodig om jouw mobile website te optimaliseren? Neem contact op met ons en we zetten alvast de koffie klaar.
