< Digital Artwork / >

The Engine @ MIT

Back
//
npm run case_study

An innovative content-driven artwork for The Engine's new headquarters that engages audiences both within and beyond the walls of the new space.

The Engine, a Cambridge-based venture fund, was looking for a creative way to showcase the companies and founders that work at their new headquarters, as well as the problems they are solving. They tasked Sosolimited (with me as the lead creative developer) to create a content-driven digitally-rendered artwork that would position The Engine and Tough Tech beyond the walls of the new headquarters, and express the transformative significance of the problems being tackled by the founders and their companies.

Creative programming.
Problems that companies in The Engine face, and how they plan to solve them.

The artwork was designed to be displayed on a large screen measuring 22' high and 11' wide, in the lobby of their new space, with a 4K resolution.

Our challenge was to create an application that highlighted The Engine’s brand and design principles while accepting various types of data input and edge cases, so that the artwork could best represent all of the activities at The Engine.

The application was built using VueJS, with a custom pipeline for rendering “axis” of data to the screen. With a target minimum of 60fps @ 4K running in a Chromium-based browser, every graphical element on-screen was scrutinized. Novel methods were developed for attaching HTML5 canvas rendering to Vue’s reactivity system, so that frames would only be drawn when the content needed to animate. We also employed a “LOD” (level-of-detail) approach to animation complexity - so that elements had higher resolution when static, and lower resolution when moving.

Creative programming.
A quick visualization of the system architecture, and where the data comes from.

Data for the visualizations came from multiple sources. Core content such as companies, key themes, and statistics were delivered using GraphQL via Contentful. Real-time feeds such as Twitter and website articles were passed through a custom-built data service architecture that provided a layer of standardization and caching, whilst also implementing additional search and filter logic and bypassing CORS restrictions. A Slack bot was built for an internal channel, to monitor latest news articles and surface them on the wall.

Creative programming.
No pixels were harmed in the fixing of this screen.

The end product was an innovative and sophisticated content-driven artwork that successfully positioned The Engine and Tough Tech beyond the walls of the new headquarters, and expressed the transformative significance of the problems that founders and their companies are tackling. The application was designed to engage audiences at hosted and public events, the general community, and to investors across the capital stack as well as strategic partners.

Creative programming.
A directory view, rotating through the companies in The Engine.

The flexibility of the code allowed for faster structural changes, making last-minute tweaks feasible. This project demonstrated Sosolimited's ability to develop advanced, customized solutions in order to achieve the client’s goals, and I was happy to help bring that to life with some creative code.