As an extension to the Project Pages, we need to create product pages for the back catalogue products. These were games that were no longer been pushed by brand on a regular rotation but are still important to the Total War brand as a whole. I was therefore tasked with creating a design for this new page.
The Major challenge on this project was the lack of high-resolution assets. A lot of the back catalogue was created in the day when 1024 was considered high res. This made it very hard to find assets that showed the game to it's best in this modern world of high definition, high-resolution graphics.
As with all of my design work, the main tool that I used to do the design was Sketch. I use Sketch because it is vector based and designed to be the tool for web and app development. This allows me to quickly transfer my basic ideas to the screen, then polish and experiment easily. This allows for a very iterative way of working. I also use Photoshop as Sketch doesn’t have a huge range of image manipulation, so when customising and touching game assets I rely on Photoshop.
When designing the page, I wanted to reflect the legacy and the era's nature of the back catalogue.
I did this in three ways, I arranged the titles by the era that they represented rather than the order they were released.
I added a timeline to the left-hand side of the page to reflect this, and the fact that the products span a wide historical range.
Lastly, I created a mist of time look and feel to the page. The mist of time feels also allowed me to make the artwork look better by enhancing the images to make up for the lack of resolution.
The basic page layout was simple, each game was allocated its own block. This allowed room for key art , screenshots and a description, along with a way of purchasing the game.
You appear to be using Microsoft Internet Explorer (IE) to visit this site.
DotMH.io does not support IE. It is recommended that you upgrade your browser to a more modern one.
For more information on the browsers that are available please click here