FutureBrand is a global leader in branding and marketing strategy, but it still has the atmosphere of a youthful start-up. Under the sure handed direction of their creative directors, the design team turned everyday clients into exciting and fun brands. While there I worked on some great accounts such as London & Country, Vizient, and the website for FutureBrand itself.
Made with: Craft CMS, Bootstrap, Yeoman, Lighting Beetle static site generator
Living Map transport
For our Living Map London map, we wanted to give the pedestrian user some quick and easy transport information. TFL now provide many open feeds, but in a variety of formats and with limited hit rates. We decided to ingest the various TFL feeds and provide our own API which our map users could hit as many times as they wanted. I built the cycle hire, bus Countdown, and tube line and station status APIs in Node.
Made with: Node.js, Leaflet.js, TFL feeds.
This is Cleveland
Cleveland needed a searchable map to highlight its businesses and attractions. We built a great looking map which reflected the city’s vibrant branding, and used Elastic Search on top of our geo-database to manage the search. I was responsible for all the frontend interaction with Elastic Search - sending search terms, receiving results and displaying them; and I also wrote unit tests using Mocha.
Made with: Node.js, Leaflet.js, jQuery, Underscore, Mocha.
Made with: Node.js, Leaflet.js, Jade, Gulp, Nginx, PM2.
The new site for International Aluminium Institute, including CMS, blog and advanced statistics section. Later additions include an image gallery and embeddable widgets.
I lead the front end build and QA, tested various JS charting libraries and created wireframes.
Made with: Django CMS, Flot.
Skullcandy Supreme Sound Journey
An HTML5 scroll path journey to tell the brand story of the Skullcandy Supreme Sound range. A looped path follows a headphone cable on a journey through product features, brand ambassadors and hero products. Along the way there are videos, wallpaper and music downloads.
I made a prototype to test for performance, and most of the front end build. I translated the vector path designed in Illustrator to a set of instructions for for the Scroll Path library, and implemented rotations and bezier curve path movements to elevate this HTML5 experience. This website harnessed brand new techniques and was first to market with these. Mouse tracking parallax lens flare elements on the ambassadors add another level of depth to these screens.
I lead the front end build and QA, specifing what frameworks and technologies to use. I created IA diagrams, a functional specification and wireframes. I also specifically built the front end for the slide editor, which was based on Django admin and allowed the content manager to see what the multi-box slides would look like as they were putting them together. Later we built a full e-commerce implementation for them using Django Oscar, an opensource ecom framework for Django.
Made with: Django CMS, Django Oscar.