Interactive

Become a Kingsman

By:
UNIT9
20th Century Fox
Anrick Bergman
Erik Dane
Jeff Kelly
Dave Dinardo
23+ Team Members
V.M.H. 8 P.T. 8 M.S. 6 J.M. 7.5 Creative 7.4 V.M.H. 8.5 P.T. 8.1 M.S. 6 J.M. 8 Design 7.7 V.M.H. 8.5 P.T. 8.2 M.S. 7 J.M. 8 Craft 7.9 V.M.H. 8.3 P.T. 8.1 M.S. 6.3 J.M. 7.8 Total 7.7
20th Century Fox partnered with UNIT9 Director Anrick Bregman and a team of storytellers, designers, and developers to create an interactive online game for the movie Kingsman: The Secret Service.
The Concept

The design team was inspired by the ultramodern gadgets and stylish tailoring that embodies the film’s agents. UNIT9 translated the film’s art direction into a design approach to create an experience that feels sharp, smart and immaculate.

Laura’s initial concept sketches of the apps layout and pages.
The Production

Laura began with a set of wireframes. An export script in Photoshop was ran by Dan to create the tile set required for each zoom level in the game. This resulted in a full set of 461 images per panorama. All positional data for the markers was loaded with an external JSON.

Kingsman app welcome call.
Wireframe for phone connection. You start the experience by connecting your smartphone to a desktop and use it to control the action on the larger screen. The two devices are linked and can exchange up to 25 interactions per second.
Unlock wallpaper.
Mission rollover screen. Using touch and swipe actions, you have the opportunity to prove your skills as a potential Kingsman agent.
Mission A
Mission completion screen.
Streetview Instructions.
Streetview/ Finding Agent Harry - Jarrod and Dan used Street View API to capture a high volume of real images from Kings Cross station. Jarrod retouched each image one-by-one (over 12,000 images!).
Final

The digital experience created excitement for the film before its release in cinemas and gave people a chance to interact with and learn about Kingsman characters ahead of time.

The first mission, takes you straight to a fight scene from the film. You use swipe action to trace shapes correctly, enabling the scene to unfold.
The second mission allows you to explore one of London's most famous places, St. Pancras train station. Your phone becomes a virtual compass to help you uncover important intel.
Client
20th Century Fox
Credits
20th Century Fox Client
Anrick Bergman Director
Erik Dane Director, Digital Marketing
Jeff Kelly VP, Executive Creative Director, Digital Marketing
Dave Dinardo Creative Director, Digital Marketing
Alessandro Pula Executive Producer
Fabien Terrasse Digital Producer
Dirk Van Ginkel Creative
Laura Cortes Creative
Sean Hobman Head of Design
Craig Parkinson Design
Melanie Hubert Design
Steve McGeorge Design
Godart Raets Motion Graphics
Tarn Gordon-Rogers Copywriter
Laura Cortes UX
Bruno Imbrizi Tech Lead/ Developer
Maciej Zasada Developer
Peter Altamirano Developer
Dan Edgar Developer
Michal Kleszcz Developer
Krzysztof Wyrzykowski Developer
Richard Nathan Interactive Sound Design
Dominic Berzins QA Manager
Mark Hinge QA Senior Tester
Testology Quality Assurance
Jarrod Castaing Retoucher
Geraint Smith Marketing Creative
Submit your work
Thanks!
We will contact you once your submission is approved.
Please allow 24hrs for your project to appear in the directory.
Have a Great Project you’d like to share?
See if you have what it takes to get through our nomination process but be prepared to back it up with some great behind the scenes materials.
Please attach jpg or png at 1280x1024
Upload
Sign Up
http://howww.com/profileagency/USERNAME
Minimum 6 characters
Already a member? Sign in
Sign In
Not a member? Sign up here
One click sign in if your account is connected to Facebook or LinkedIn
Forgot Password
Enter your email address below and we'll send you an email with instructions on how to reset your password.
Check your email!
We have sent an email to the address you provided. Follow the instructions in that email to reset your password. Thanks!