Northern Ballet

Face-transforming Webapp

Northern Ballet is a Leeds (UK) based touring ballet company. For the Beauty and the Beast show, they wanted to attract a younger audience.

We were asked to produce a web application where users can upload their picture and they can then get turned into the beauty or the beast. When finished, they can share the generated link of their image.

It was a very interesting challenge. First I had to prototype something and decide what would be the user journey. Then the project went through a design/review process based on my prototype. Once approved, I had to finalise the build, back-end and front-end.

For the transformation, quite a lot of things are happening:

  • Eyes and mouth recognition with distortion in these areas
  • Image filters including contrast, saturation, luminance
  • Drag & drop of png elements on canvas with position/zoom controls

One of the biggest difficulty was to make it work everywhere. As it is far from being a simple website, every aspect of the functionality had to be tested on different configurations: mobiles, tablets and desktop computers across different browsers and operating systems.

  • Tools: Slim, Twig, Gulp, Bower, JS libraries (Croppie, TrackingJS, glfx)
  • Role: Prototyping, Back-end and front-end development