Case Study: We Are Colony
We Are Colony is a video on demand platform for independent film that puts emphasis on connecting fans to films and their filmmakers by offering a wealth of exclusive behind the scenes and additional content.
I worked with We Are Colony for just over six months, acting as front end lead, from the start of the interface build to launch of the first public beta.
Responsible for development of the visually-rich interface, the main challenge was to make appropriate decisions on which technologies and methodologies to use so that the product was easy to maintain and scale, but, from my perspective, that was also part of the beauty and appeal of the project.
It was super enlightening being able to test out different solutions across the build, for example we started the developing the site using Angular as an experiment and for a variety of reasons we decided that it wasn't right for us at that time, so we created our own JSON api and rendered all the markup with Mustache templates before finally switching again to on an 'old-school' server side rendering approach which we found faster, simpler and with the added benefit of working without JavaScript in a nice progressively enhanced way.
The interface is also seriously rich. There's a lot of moving elements and interesting takes on handling and organising content which take out the need for traditional navigation. Being a VOD content platform means the user experience on devices like tablets and mobile phones would be critical to the site's success and Vix Young's idea was to try and keep the experience as seamless as possible, not only by making it responsive, but by also keeping the same user interactions regardless of device the site is being viewed on, so we built everything mobile first and if you can swipe on a touch device you can swipe on a laptop (with a mouse if you don't have a touch-screen laptop :-) with just the addition of small buttons that perform the swipe for you if your device needs them.
Also jank. I spent a lot of time busting jank on this project and it was really interesting to spend time recording and analysing frame timelines and trying to work out the best way to keep everything running at high FPS but staying true to the original idea of the project's visual style. It's still a tricky game and the dev tools, while helpful, still leave the feeling that it's an currently an inexact science where knowledge about the base level browser rendering needs to be either already known or googleable.
All in all a really great project to work on with an amazing team. I'll be watching with keen interest how this project grows and develops over the coming years.
Additional links:
- Presentation — "Building the interface for We Are Colony"
- Blog post — "Switching out ems for rems: An attempt to provide a nice pixel fallback for rem values with Sass"