Innhold
I år markeres McDonalds 40-årsjubileum, og det feires ved å presentere kundenes minner som strekker seg over fem tiår, i et interaktivt program laget av Razorfish, et av våre favoritt designbyråer å følge på Twitter.
Bygg ditt eget nettsted med disse strålende WordPress-opplæringene
Bygget helt ved hjelp av HTML5 Canvas API, er det to ting her som virkelig fanger øyet: det vakkert animerte grensesnittet og god nok å spise typografi.
Hvordan de klarte det
Rutenettoppsettet og plakatene ble bygget med Pixi.js, en 2D WebGL-gjengivelse av Goodboy Digital.En tilpasset 3D-renderer ble bygget på toppen for å gi overgangsanimasjonene og få dem til å fungere jevnt, selv på mobile enheter. Systemet som lager typografiske plakater bruker naturlig språk- og syntaksanalyse for å dekonstruere hver setning og merkeord basert på følelsen den inneholder.
Goodboys tekniske samarbeidspartner Mat Groves sier: "Vi kjørte sentimentinformasjonen gjennom en algoritme som ville legge ut plakaten og gjengi den ved hjelp av noen skreddersydde WebGL-skyggeleggere. Det kule er at alt dette skjedde i sanntid!"
Brukere kan også dele minner gjennom taleinndata i nettlesere som støtter Web Speech API - en annen flott forbedring på et nettsted fullt av detaljerte detaljer. Nettstedet er ikke lenger live, men du kan se det på Razorfishs porteføljeside på 40together.razorfishawards.com.
Ord: Peter Gasston
Peter Gasston er en veteran webutvikler som nå jobber som teknolog og frontleder hos rehabstudio. Han er forfatter av The Book of CSS3 og The Modern Web.