Batman vs. Superman

UX- AND INTERACTION DESIGN

Brief

How can we hype the "Batman vs. Superman" movie before the premier date and ensure that a lot of people will show up in the French cinemas excited to see the result of the epic battle? 

The solution 

A betting game filled with questions about the Batman vs. Superman movie. The user can bet with virtual "gotham money" and see how much money they will get in return if the answer is correct. The player who ended up earning the most gotham dollars in the end would win a trip to Californien to visit the Warner Brothers studio. 
The game was released 7 days before the premier. The user would not know how many of his/hers answers were correct until the premier date.  

What I did

When I first joined the project most of the wireframes for the mobile version was already finished. I helped with mapping out the userflow so that we could make sure that the user interaction was smooth as well as updating some of the wireframes. Later on I was given the task to make the concept and wireframes for the desktop version. The mobile version of the app was very simple and straight forward, but I was able to have more creative freedom when it came to designing for the desktop because of the wider screen with more space. Of course the navigation and the betting should have the same basic functions so that the user would not be confused if switching between the two devices. I experimented with a lot of different ideas, below are some of them:

  • gallery-image
  • gallery-image
  • gallery-image

In the end we decided on a combination of my ideas, and here's the finished product made by the visual designer: 

  • gallery-image
  • gallery-image
  • gallery-image
  • gallery-image