Bank of Muse

I was approached by Muse in April to help develop an interactive campaign that would exist alongside their massive European summer tour both online and at the shows starting May 22nd at Ricoh Stadium. As it turned out, their team were fans of the In Rock We Trust Foo Fighters FOO bill confetti to online campaign I was recently a part of, so we decided to expand upon the concept so that it could exist over the 3-month lifespan of the entire tour while hopefully staying interesting enough for the fans to keep caring.

And so, the Bank of Muse, a financial institution acting as a global joint savings account for all Muse fans, was founded.


In order to legitimize our bank, we first turned to the counterfeit euro experts at Morning Breath to help design the Musos we’d be printing and distributing at each of our shows. Morning Breath utilized some Muse typography and schematics from the new stage to design a euro so real, we had to run it through legal several times. Props to the geniuses at Quantum Special Effects for their confetti cannons and this guy and his 5,000 Muso suit. C'mon!

On the back of each Muso and printed within the tour program, was a link to the Bank of Muse. Fans visited this URL via their mobile devices at the show (or when they returned home) and were prompted to make their first deposit to the bank in order to contribute to a global financial ticker which would unlock exclusive tour content as certain targets were met. Mobile was very important here, because we actually served the behind-the-scenes instant-grat video of Dom to each new account holder, allowing fans to participate right from the show.

Our content rollout strategy was kept very loose in order to respond to fans’ reactions throughout the tour, rather than get locked into something that might fail. In the end, we released several videos, photo galleries, and downloads. We also put together a mid-tour crowd-sourced video campaign for fans attending the Paris shows. It was really convenient to have the app setup to market this before, during, and after the event.

New Account Holders #

Bank of Muse

One way we encouraged fans to participate was showing other fans wiring their deposits in real-time on a map. This was done easily using a combination of Pusher, Ruby Geocoder, and the Google Maps SDK.

When a user logs in via Facebook, I use the Geocoder gem to get coordinates for their location which Facebook provides as a city string.

    coordinates = Geocoder.coordinates(user.location)

I then pass the coordinates, user’s avatar, and current total user count to the client via a Pusher event.

    Pusher['bank-of-muse'].trigger('new-user', {
      user: {
        latitude: user.latitude,
        longitude: user.longitude,
        image: user.image
      total: User.count

The client listens for each of these events and displays the new user as a geodesic line originating from user’s location and ending at the location of the bank aka the current tour date. I also update the global financial ticker with the new count, keeping it nicely formatted with the Numeral.js library.

  channel.bind 'new-user', (data) ->
    user = data.user

    show     = new google.maps.LatLng(52.448365, -1.495491)
    location = new google.maps.LatLng(user.latitude, user.longitude)

    image = new google.maps.MarkerImage(
      new google.maps.Point(10, 10), 
      new google.maps.Size(20, 20)

    marker = new google.maps.Marker
      animation : google.maps.Animation.DROP
      position  : location
      map       : map
      icon      : image

    line = new google.maps.Polyline
      path          : [show, location]
      map           : map
      strokeColor   : '#E13452'
      strokeOpacity : 1.0
      strokeWeight  : 2
      geodesic      : true

    $(".total").text numeral('0,0')

Global Financial Target #

I don’t typically “chart” things in my designs, but it seemed fitting here for the global financial ticker and the Chart.js library made it a breeze. Just give it some options, labels, and data, and it does all the work for you. Pretty killer.

    options =
      scaleLineColor     : "#FFFFFF"
      scaleShowLabels    : false
      scaleFontSize      : 10
      scaleFontColor     : "#FFFFFF"
      scaleShowGridLines : false
      bezierCurve        : false

    data = {
      labels: ["22/5", "23/5", "24/5"],
      datasets: [
          fillColor        : "rgba(62,85,161,0.25)"
          strokeColor      : "#3E55A1"
          pointColor       : "#FFFFFF"
          pointStrokeColor : "#3E55A1"
          data : [2716, 3435, 3633]

    context = $("#chart").get(0).getContext("2d")
    chart   = new Chart(context).Line(data, options)

I feel like this campaign was a success for two reasons:

  1. It actually worked organically. Fans were picking up Musos and visiting the website at a steady rate for a week before we even made mention of it online. The reasoning? It was fun.
  2. We allowed our content rollout strategy to be loose but constant enough to continue grabbing fans’ attention. We knew when our fans were more or less active because the deposits were a representation of this, so we reacted accordingly in realtime.

You may not see the same conversion numbers from a real world campaign that you might see from an email or social campaign, but you can be sure that the fans who are participating are actually paying attention, rather than being simultaneously over-saturated by the inherent nature of the web. Even I can admit that a lot of fans never see my work because they don’t Internet quite the same way most of us do, but I know they saw that fucking confetti, and that makes me happy.

Special thanks to Sam Sparrow and the Warner Music UK team for orchestrating this on behalf of Muse.


Now read this

Sim Bootleg

On the art of bootlegging live concerts and YouTube WebM video. This post goes out to all the bootleggers out there, sacrificing their own concert experience so we can relive our favorites moments on YouTube later. Their efforts, for the... Continue →