The All New

A Bold Site for a Bold New Game

Quark Games is a tablet and mobile gaming company founded in 2008, with an emphasis on creating innovative and engaging gameplay experiences. Quark approached Viget as it was preparing to launch its brand new tablet game, Champs: Battlegrounds. With the launch of their flagship game around the corner, they needed a strong web presence to tell its story.

A New, Addictive Game

Champs: Battlegrounds is a multi-player strategy game with a twist: players take their turns in real-time (no waiting for the other player to go), creating a fast-paced, engaging, and addictive experience. In order to prepare for designing the new website, we were given access to the Champs: Battlegrounds Beta, and as someone who barely made it past playing Mario Bros. as a kid, I was surprised at how fast I was hooked. With this in mind, we knew we needed to create a site that hooked prospective players immediately.

Designing Tablet and Mobile First

We presented the client with bold yet simplistic designs that really let the amazing artwork from Champs: Battlegrounds shine. Quark Games has done such an amazing job with the character and gameplay graphics that we focused on complementing them rather than competing with them. We also took the tablet and mobile game theme to heart. Most users will likely be viewing the site from a tablet or be familiar with mobile interactions, so why not design specifically for that view? What we came up with was large, easily clickable buttons in any view, as well as a default collapsed menu for all views, even desktop. This gives the site a consistent look and consistent navigation for all devices.

Creating a Site That's Accessible From Anywhere

Design was only half the story here, though. The team still needed to develop the site to be responsive across all devices. While faithfully translating the design, we paid special attention to how it would look - and perform - on different devices and network conditions. Beyond utilizing common responsive techniques, the team took things a step further by serving images at various qualities based on a user’s bandwidth. This ensures the beautiful retina graphics do not negatively impact quality for users with lower bandwidth. The end result is an entertaining site that can be easily, and quickly, viewed on any device.

A Platform to Allow Easy Updates

We used ExpressionEngine as our platform, which gives Quark Games all the flexibility they need to manage and update their site on a consistent basis. With ExpressionEngine, the client was able to manage images, news, and game highlights with an intuitive and annotated interface.

A Successful Outcome

The all-star team we had, combined with a client who was willing to push the envelope a bit and try new things, led to a site we are proud to have worked on. The project was a lot of fun, the guys over at Quark Games were amazing to work with, and we look forward to hearing the reactions they get to their new site!

Take a look at and let us know what you think!


Becky manages digital projects from our Boulder, CO, office for clients such as Duke University, Volunteers of America, Massachusetts General Hospital, and Shure.

More posts by Becky