Battleship the video
game micro site

This is a site I designed for a video game based on the Battleship movie released in 2012. The concept behind this site is the experience that a new recruit would go through. I wanted the user to feel as if they were using a military computer interface right before a big battle. Users select their deployment point and this actually selects the game region and language for the site.

Building assets

I really wanted to have this whole site use SVG files where ever it was possible. Because of that, I designed all of it in Adobe Illustrator. This way the site could draw each element as it grew and jetted out.

Animations

I had a good idea of how I wanted the animations to look and feel. I made this quick animation to show the developer what I envisioned. In the end, we went with a solid illustration for the map design, instead of dots. Having the page draw each dot on the map made the whole site very slow.

Final version

We ended up making a few changes to the design due to technical limitations. The final version was a great implementation of design and kept the same feeling I was looking to convey.