Virginia Lottery JeepSeeker

application development, Desktop & Mobile Platforms

The Brief

A scavenger hunt game built for the Virginia Lottery, where players answer clues posted on Facebook that lead to Jeeps hidden in a Google Map. Collected Jeeps counted towards points in the game that became entries in a drawing for a brand new Jeep Wrangler Rubicon.

Background

Big River Advertising had devised a map-based scavenger hunt game concept as a promotion for their client, the Virginia Lottery, and needed a development team who could pull off a complex game, integrating the Google Maps API. Big River had many creative ideas for what they might like to do in the game, but weren't sure what was technically feasible, especially within the compressed timeline they had to create the game. They were looking for a partner with a strong technical background who could also contribute to the creative and strategic thinking behind the game in order to shape the best possible product.

"CO+LAB was involved at the client level at every step and even at the toughest of times in the project, kept cool heads and stayed focused on the final product."

Scott Ackerman
Creative Technology Director - Big River Advertising

The Problem

The challenge of this project was to create dynamic game-playing experience that met a difficult set of requirements, maintained the highest level of security, and was still fun to play.

The game needed to do the following, at a minimum:

  • must work on desktop, tablet, and mobile phone devices
  • allow Big River and the Lottery to enter hundreds of Jeeps into the game prior to the promotion start date
  • automatically deploy the Jeeps into the map each day over the course of the 6-week promotion
  • display Jeeps at a specific zoom-level of a Google map only within the viewable area of a user's browser
  • allow players to register for the game and create an account through an API connection to the VA Lottery's authentication system
  • allow players to answer clues to locate Jeeps hidden in the map, collect Jeeps, keep track of their collections, and compare their point totals with other players on a leaderboard
  • allow players to collect Bonus Jeeps by clicking on online advertising created by Big River
  • provide for a special "Game Guy" Jeep that could be collected by scanning a QR code on Game Guy's real life Jeep vehicle
  • be able to detect location of a player and display their local weather conditions using the Weather Underground API
  • store no Jeep locations in the source code so they aren't accessible by scanning the code
  • maintain the highest level of security against hacking and cheating
  • maintain the highest level of availability, with minimal-to-no server outages or down-time during the six-week promotion
  • the game needed to scale during the course of the promotion as needed, with hundreds of players using the game concurrently and growing daily

The Solution

CO+LAB architected a dynamic solution that was secure, light-weight, and responsive using node.js, a javascipt application system that drives browser-event-based applications, and socket.io, a websocket protocol for node.js which allows for instantaneous and persistent connections with users through the browser.

Server Architecture

The server architecture utilized a front-facing F5 load balancer to distribute traffic across a series of node.js servers which communicated with a third-layer set of application servers. We used RabbitMQ as a communication and remote procedure call layer between the node and application servers to manage player actions (such as Jeep collections) and communicate that information across the system infrastructure. This effectively saved server load on the application servers, which were the core of the gaming system.

CO+LAB built the application itself upon a custom Python content management system (CMS) using the Django framework, which managed the game logic, rules system, game play, and the administration and reporting screens that Big River and the Lottery used to conduct the game and promotion. The database supporting the Django application was built with MySQL.

Security

To protect against cheating, we devised an architectural solution in the software so that users with advanced programming savvy couldn't use their hacking skills to programmatically find Jeeps in the map faster or more efficiently than the average person. This meant that the locations of Jeeps, their latitudinal and longitudinal coordinates, could not be delivered to the browser until the required conditions were met (i.e. the map was zoomed in to the required level and a Jeep should be located in the area displayed in the browser) – only then would the Jeep actually be displayed. We can't reveal the details of how we did this – it's secret sauce.

For server security, we partnered with Rackspace to design a server architecture and security plan to maintain the highest levels of security and up-time possible. We used cloud servers set behind a physical firewall, all tied together using Rackspace's RackConnect infrastructure. We also utilized Rackspace's Threat Logic and Alert Logic products for real-time notifications of any suspicious activity and to immediately stop any attacks on the servers.

Monitoring, Analytics, and Scalability

No one could know for certain how popular JeepSeeker would be, how many people would play the game, and most importantly, how many people would play the game at the same time. In order to ensure maximum up-time with consistently smooth and responsive game-play, we needed to monitor the server usage closely and be able to spin-up additional server capacity quickly as needed. We also needed to compare those server usage statistics with site traffic numbers to know how efficiently the application and its underlying server architecture were handling game-play.

We performed this monitoring and optimization through a combination of New Relic, which we used to monitor server statistics, and Google Analytics, which gave us real-time site traffic stats. This pairing of services enabled us to identify potential problems before they happened and make timely decisions on how to optimize the application and server configuration.

As more and more players joined the game, we needed to be able to quickly scale the server architecture to handle the increased load and demands on the system. To manage the process of deploying servers quickly, we employed Chef, a server configuration tool used to streamline server configurations and set-up.

HTML, CSS, and Javascript Coding

Big River wanted to push the envelope with their game concept and came up with an engaging experience for players that was fun, challenging, and unique. They instinctively understood that the visual design of the game and the user interface would also need to push the boundaries into new territory while still being intuitive and easy for players to use.

This experience they were designing also needed to work differently on a mobile phone than it did on a desktop computer because the screen size difference would greatly impact how a user played the game. That being the case, separate desktop and mobile sites were developed to be tailored to each experience, which meant we needed two sets of HTML, CSS, and Javascript "front-end" code for each, both of which connected to the same "back-end" game application system.

Since this game needed to be tailored to mobile devices, many of which now come with significantly higher resolution screens, such as retina displays on Apple devices, we faced a challenge in making assets for the site that were high enough resolution while still loading fast enough to keep from degrading the performance of the game. This meant serving graphics that were normal size, and 2x normal size (for high resolution displays). We also created an icon font that allowed us to use easily reproducible, re-colorable, and scalable vector-based graphics that could be used on all platforms regardless of screen resolution.

Testing

An application of this complexity requires an immense amount of testing to ensure it works across several platforms (desktop, tablet, and mobile devices) and across the spectrum of web browsers found on those devices. CO+LAB tested the game on more than 20 different environments in which a player could have experienced the game, including:

  • Chrome desktop versions 10 to 24
  • Firefox desktop versions 10 to 19
  • Safari desktop versions 5.0 and up
  • Internet Explorer versions 7 to 10
  • Safari on iOS versions 5.0 and up
  • Chrome on Android versions 4.0 and up

CO+LAB also needed to perform extensive load testing of each server layer to ensure it was capable of handling the number of users the Lottery and Big River had set as goals for the promotion. We used Loader.io to test standard web requests against the Django game application.

One distinct challenge was testing the Node.js servers. Node has a single-threaded processing system which is not designed for multi-threaded processing. In short, this meant that we didn't have a clear-cut way to accurately test for multiple users connecting simultaneously. In order to do the testing we needed, we wrote a custom Java application for testing the socket.io requests which allowed us to simulate multiple, concurrent users.

The Results

Big River and the Virginia Lottery had set goals for the JeepSeeker promotion that we thought were quite ambitious, especially for a new type of game that hadn't been done before. They wanted to attract 5,000 players and generate 100,000 entries for the drawing.

More specifically, the Lottery was looking to attract a particular demographic of game players, namely young, tech savvy people who like playing games online. The Lottery uses a system to segment participants in their online games, which was part of the API we integrated into the registration process for JeepSeeker so the Lottery could know more about demographics of the players.

By the end of the game, over 9,000 players had collected at least one Jeep, creating over 136,000 entries for the drawing. The numbers had clearly exceeded the goals for the game, especially the number of participating players, which was ultimately the most important goal and outcome of the promotion.

JeepSeeker was also wildly successful with respect to the desired demographic they hoped to attract. In a typical promotion for the Lottery, roughly 2% of the participants are in the demographic they we trying to reach with this game. However, with JeepSeeker, that demographic represented 8% of the participants in the game, an immense increase in participation.

A large part of the credit for that success goes to Big River for the impressive work they did through social media to curry engagement and enthusiasm for the game. We see a lot of companies trying to make social media work for their business to varying degrees of success, but even we were impressed by what Big River was able to do.

"No one was sure what to expect on day one from the help desk standing by to take calls for issues, but after thousands of users over several days and no substantial bugs or issues on any platforms we were supporting, we were blown away by how bullet proof the app was."

Scott Ackerman
Creative Technology Director - Big River Advertising

"With a project like Jeep Seeker, the Virginia Lottery needed a partner who was agile, resourceful, and capable. With CO+LAB, we got all three - and a final product that far exceeded our wildest expectations!"

Ben Nicolls
Project Manager - The Virginia Lottery

Co+laboration

At CO+LAB, our best work always comes from working closely with our clients as partners and collaborators, which was certainly the case with JeepSeeker. We could not have asked for two better partners than Big River and the Virginia Lottery.

Big River came to us with an idea that we thought was risky because we hadn't seen anyone execute a maps-based gaming application exactly like it before. We had ideas of how it might be accomplished, but nothing was certain at the start.

In short, we were asked to do something that was exceptionally complex and difficult, but the only reason we were able to achieve a successful result was because we were given the resources and support we needed from Big River and the Lottery to get the job done.

We told Big River from the start that we would need to figure out what was possible together, that we could only be successful if we could be both a technical consultant and a creative and strategic partner in shaping the game. Big River was enthusiastically open to and nurturing of that relationship. Their creative and innovative thinking paired well with our technical problem-solving, and vice-versa – Big River's technical savvy enabled CO+LAB to contribute creative ideas around the technology as well.

And neither Big River, nor CO+LAB, could have accomplished any of this work without the leadership, patience, and enthusiasm of the Virginia Lottery team who worked on the project. We worked closely with both the Lottery's Marketing group and their IT and Security teams. A tremendous amount of coordination was required with a number of people in both groups, and it was a pleasure working with all of them. They held us to a very high standard, which we loved because it showed they cared for the quality of their work as much as we did. The Virginia Lottery was an awesome partner – we applaud their drive to do cutting edge work in a responsible and meaningful way.

In the final analysis, JeepSeeker was a very high-risk project that actually turned out great. There were many challenges along the way with many difficult problems to be solved, but it all worked out fine and everyone was very happy with the results. The Lottery even gave us this fancy award.

Thanks!

Like our work?

Learn more about what services CO+LAB can offer you and your business.

Our Services

Have a project in mind?

We'd love to hear from you and answer any questions you have.


Shoot us an email and let's get started.

Say Hello!