The Museum of Contemporary Art (MOCA) in Los Angeles recently asked us to build a site for their new live arts program Step and Repeat. They wanted a site that was as exciting and dynamic as the program itself. Inspired by the virality of Tumblr content and the ease of content management tools, we agreed to create a custom Tumblr theme for the site.
Fitting the Brand
The overall art direction for the Step and Repeat program focused on use of diagonal elements, repetition, and varying scale. Our site design embodied that direction with a diagonal page layout and movement.
[iframe src=”//www.youtube.com/embed/WaJ665yBOBE” width=”100%” height=”480″]
One of the biggest challenges we came across for this project was iterating quickly as we developed on the Tumblr platform. Developing software locally is usually ideal for quick previews of changes. However, Tumblr doesn’t currently provide tooling for local development. As a solution, we rendered out the template theme page on Tumblr and hosted it in a development server locally so we could develop against it.
In order to have full control of the experience, we knew we wanted to render HTML templates client side. We had two choices to do that: try to parse the post data from the page Tumblr rendered or load the posts via the Tumblr API. We found building on top of the API to be a much better solution than parsing the rendered page.
Sharing Our Tools
Potential Tumblr Improvements
1. Support API endpoints from blogs to like/unlike posts
The Tumblr API has endpoints for like/unlike, but they’ve set cross-origin policies that don’t allow these points to come from Tumblr blogs subdomains (yourblogname.tumblr.com) in browsers like Chrome that follow the cross origin policies. As mentioned in many discussions across the web, solutions to this problem are fairly hacky.
3.Provide API endpoints for template code
The options to deploy new custom Tumblr themes are limited. To update a Tumblr theme, you must copy and paste the template code into the Tumblr editor in browser and upload files individually. This process is slow to work with and even more troubling when a team is working together to build a complex Tumblr theme. Ideally, Tumblr would provide endpoints to upload template HTML/JS/CSS via API, which would allow for automated deployment and a smoother workflow.