Webdesign - Heavy Metal Machines Landing Page
Heavy Metal Machines was in need of a new landing page for the game, tailored for convertion, that delivered for new players a installer if they didn't had steam installed. 

I was in charge of building the website that presented the game to this new public and at the same time, made it easier for them to get right into the action with an intuitive design. It was built using PHP, Sass and Javascript, and today, it's used in all of Heavy Metal Machine's aquisitions campaigns.

After some iterations and A/B testing, this was the final design:
A lot of thought and consideration went into keeping the number of choices and content down to a mininum, to communicate as directly as possible what is Heavy Metal Machines.

The website features a lot of hidden bells and whistles, despite it's simple visuals, so let's do a break down of the main features:
At the fold, we have a video background with the trailer of the game, that loops automatically. But most importantly, we have 2 buttons: Play for free and Watch a video.

You're probably thinking that watch a video is somewhat unnecessary; and you're right. But it was added it to offer a 2:1 choice, or what is called "Hobson's Choice". The numbers from the A/B testing proved that it really makes a difference when it comes to conversions.

Also, the Play for free button was a little bit of a challenge itself. When the user clicks, the javascript I coded checks if the user have Steam installed in his machine. How? I check if the browser serves the user with a question to open steam, using steam protocol, and, if it does, the code gets executed, adding the game to the user's library.

Otherwise, the user will be automatically directed to the installer's download page, where he'll get instructions on how to proceed, being presented to steam for the first time.
The download page also reacts to the user's browser, showing the download tooltip accordingly to the navigator's interface.
After the download, the user is asked to register in the Metalhead Club, where he can join our newsletter, so that we can keep them informed and work remarketing as needed.
I also added an exit popup, that as soon as the user leaves the page for the first time, it appears, giving him one last chance to click the button and download the game again or subscribe to the newsletter, depending on the stage.

All in all, this experience really made me scratch my head and learn a lot about landing page convertion optimization, and browser especific coding. Our target navigators were Chrome, Firefox, Edge and IE.

You can check the live version here: https://play.heavymetalmachines.com


Webdesign - Heavy Metal Machines Landing Page
4
34
0
Published:

Webdesign - Heavy Metal Machines Landing Page

Landing page designed & developed for Heavy Metal Machines, with focus in conversion.
4
34
0
Published:

Tools

Creative Fields