Ted-iPad-hero-scene3.jpg
 

Ted website

Website for Seth MacFarlane’s 2012 film Ted. Optimised for iPads, smartphones and feature phones for the USA and UK markets.

Back in 2012, Universal Pictures still made websites for each of their films in Flash, which did not work on tablets or phones. At the time I was working at Net Mobile - a small mobile app and web agency in London. We redesigned all of Universal’s Flash-based film websites and optimised them for mobiles and tablets.

Our agency was supplied with a high-res Photoshop movie poster file, as well as other related assets. I then used those assets to design our mobile-friendly versions. I was the sole designer in the agency, and worked closely with the developers and the account manager.

Client: Universal Pictures (USA).
Designed at Net Mobile, London, 2012.

 
 
Our agency made different versions of the website targeted to work for iPads, smartphones and feature phones.

Our agency made different versions of the website targeted to work for iPads, smartphones and feature phones.

 
Smartphone: movie trailers.

Smartphone: movie trailers.

 
 
Ted-Loading-ANimation-V01.gif
 
Above: a loading animation I designed for the website.
 
 
 
iPad: movie trailers and story screens.

iPad: movie trailers and story screens.

 
Smartphone: loading screen, age-gate and story screens.

Smartphone: loading screen, age-gate and story screens.

 
 
 
 
 
 
 
 
 
 
 
 
 
Ted-iPad-scene-to-export.jpg
Above: I designed a parallax animation effect for the iPad version of the website. When you tilt the iPad to the side, the foreground, midground and background slide sideways independently, as Ted's beer tilts in his hand. This involved a lot of Photoshopping to extend the background and other parts of the scene to allow for the animation.
 
 
 
Smartphone:  home screen.

Smartphone: home screen.

 
iPad: sign up for mobile alerts.

iPad: sign up for mobile alerts.

 
iPad: picture gallery.

iPad: picture gallery.

 

PROJECT TAGS:

 
 

More projects like this

 

The Bourne Legacy website

Les Misérables smartphone website

 

Want to work with me?

If you like this project, then say hello and let’s see what I can do to help you.

flat-colour-break-2c.gif