Catch The Dragon

Brand
Peugeot
Year
2015
Objective
Awareness
Industry
Automotive
Mechanic
Adventure & Quest
Platform
AR & VR
Agency
DPDK

Screens

18 screens

Objective

Peugeot wanted a digital sequel to the global TV campaign starring an orange dragon, one that would pull a younger audience toward the new 208 while feeding leads to dealers. dpdk was asked to fuse its existing 208 Virtual Testdrive with the dragon from the commercial into a single experience, giving the Dutch leg of the launch a bridge between the in-showroom VR activation and the worldwide TV spot.

Solution

Catch the Dragon runs straight in the browser at catchthedragon.nl, no app required, and works on desktop or mobile with Google Cardboard support. It opens with a re-cut of the TV commercial, then drops the viewer into 360° footage shot on the roads of southern France before that footage dissolves into a low-poly 3D world rendered in WebGL/Three.js, where the dragon takes flight around them. Players chase it by turning their head — tracked through the phone's gyroscope — or panning the camera with the mouse on desktop, with a custom 360° viewer nested inside the 3D scene so live-action and CG blend without a seam.

Results

Catch the Dragon drove a 300% increase in unique visitors to the Peugeot 208 pages, a 150% rise in test-drive requests, and a 60% increase in customer orders.

How it plays

7 steps
  1. 1

    The experience opens in a standard browser, on desktop or mobile, at a dedicated URL with no app to install; on mobile the player can switch into a split-screen Google Cardboard view or stay with a flat gyroscope-controlled view.

  2. 2

    A short intro plays first: remixed footage from the original Peugeot 208 TV commercial showing a tattooed dragon come to life and fly out of the car, setting up where the dragon came from.

  3. 3

    The player then rides along in a 360° live-action driving scene filmed on real roads in southern France, free to look around the car's surroundings as it drives.

  4. 4

    The road leads into a tunnel, and inside it the live-action footage gives way to a low-poly 3D world built on WebGL, reassembled from randomized seamless tiles so the route never repeats exactly, with separate paths laid out for the car and the dragon.

  5. 5

    The player looks around the 360° world by tilting a phone (tracked via accelerometer/gyroscope) or dragging with the mouse on desktop, scanning for the dragon as it flies its own path and appears and disappears at unpredictable points, trying to keep it in view.

  6. 6

    Over the course of the ride, the sky gradually shifts from day to night, with lighting, textures, and colors changing to match.

  7. 7

    The dragon is caught the moment the player's view lines up exactly with it, which triggers a stitched transition into a closing screen that ends the experience.