MENDO is a candy store for book aficionados,” is hoe Roy, Joeri en Joost hun Amsterdamse winkel treffend omschrijven. Het is ook echt een unieke beleving om al die inspirerende, creatieve boeken te zien in de fantastisch ontworpen winkel, opgebouwd uit duizenden zwarte MENDO boeken.

Die beleving, maar dan online. Dat was de opdracht die Perceptor en Q42 kregen. Een pittige uitdaging, maar met de indrukwekkende content van MENDO en de unieke ontwerp-skills van Perceptor was het voor ons een feest om dat te verrijken met hippe web-technologieën en veel client-side snoepgoed.

Hardware accelerated animaties
Een aantal van die technieken komen regelrecht uit recente HTML5 game development ontwikkelingen. We hebben bijvoorbeeld met wat CSS3-truukjes het animeren van die enorme afbeeldingen “hardware accelerated” kunnen maken. Dat betekent dat niet de normale processor, maar de videokaart-processor daarvoor aan de slag gaat, waardoor het een stuk soepeler beweegt.

Dat werkt helaas nog niet altijd. Internet Explorer kan het bijvoorbeeld nog niet, Safari vertoont vreemde bugs en stukken tekst worden soms lelijk gerenderd. In die gevallen vallen we terug op jQuery-animaties.

Framerate
Ook hebben we een framerate-teller overgenomen uit één van onze in passietijd geknutselde HTML5 game-speledingetjes. Daarmee kunnen we wanneer de framerate onverhoopt te laag (en de animatie dus lelijk) wordt overschakelen naar een wat simpelere, maar soepelere animatie.

History API & AJAX
Met behulp van de History API en AJAX hebben we de online beleving nóg een stap verder kunnen brengen. Hierdoor kunnen we (in browsers die dit ondersteunen) reloads tussen pagina’s voorkomen en de transitities juist animeren. Dat is niet alleen mooier, maar vaak ook duidelijker voor de gebruiker. En dankzij de History API blijven de back-button en bookmarks gewoon werken.

Online beleving
Tijdens het ontwikkelen merkten we al dat de online beleving aan het lukken was. Soms verloren we onszelf echt in de digitale boekenwinkel. Gaandeweg raakten we steeds enthousiaster over de boeken. En heus niet alleen die met naakt. Desalniettemin waarderen we het kado van Perceptorzeer.

Afijn, genoeg gekletst. Tijd om het zelf te beleven: http://mendo.nl. Veel plezier!

Psssst. We hebben al een award binnen. En nog wat mooie nominaties en eervolle vermeldingen.