Code and Theory were tasked with the complete overhaul of DeepMind's public-facing website, leading the strategic direction, user experience and visual design, and front and backend development.

The site is built with the Django-based Wagtail CMS, on top of Google Cloud infrastructure - namely App Engine, Cloud Storage and CloudSQL. The backend was engineered to make heavy use of App Engine's async message queue and memcache in order to handle the huge traffic spikes that the site frequently encounters. The frontend is a bespoke JavaScript app built with Ampersand.js which progressively enhances server-rendered markup in to a full single-page application.

I was responsible for overall technical direction and design of the frontend application, CMS and infrastructure architecture. I also created the canvas-based generative geometric interactive animation which is used throughout the site.

A key visual feature of the site is the generative animation used throughout the site, this "interactive branding" as we called it was a custom canvas-based class which was designed to be highly flexible, so that it may be used as both a striking visual background to certain UI elements, and also a pathing mechanism to guide a user's attention as they navigate around the site.

We also took this "interactive branding" one step further to render out multiple synchronised ultra HD videos of the animations, using node-canvas and ffmpeg, to be used as a backdrop for DeepMind conference talks.

Credits

• Client
• DeepMind Technologies
• Agency
• Code and Theory
• Executive Producer
• Zelda Gulledge
• Associate UX Director
• Hollie Lubbock
• Associate Creative Director
• Tomi Lahdesmaki
• Art Director
• Rich Stangroom
• Designer
• Ross West
• Technical Director
• Neil Carpenter
• Frontend developers
• Andreas Hermansson
• Chris Lawrence
• Backend developer
• Erdem Ozkol