Harri Larkin - Website Mocks

Before working on layouts for Harri Larkin's mock website I looked at the websites for Ramones - the band whose logo was used as inspiration for Harri Larkin's logo, and Linkin Park, a band who's website I've found to be functional in past experience.

I looked at the homepage and news page (the two pages I'm doing mock-ups of) as well as from the shop page to make sure the layout is usable for various pages.

Neither of the two websites seem to have consistant layouts, something which I plan on changing. Overlaying the three pages on top of each other allowed me to create guides on the page to create a simplified grid that would work for the content - this resulted in a couple of rows and the top for a menu a bar, 3 or 4 columns for content, and a row at the bottom that acts as a border. This is the guidance I'll be using as it appears to be a way to make functional websites look more visually consistent.

The simplicity of the layout meant I didn't have to stray far from the very rough sketch I did for the home page and it translated into a news page pretty easily. The background of the page is a photo the band provided me with made slightly transparent over the texture used for the logo. The star and dots in the logo are incorporated into the banner to extend the visual continuity. The typeface used are London (the typeface used in the logo) and London Fill to create a simple hierarchy, body copy is Gotham to keep it simple and modern.

It was suggested to me that the menu bar was too thick and bold to match the rest of the pages - making it thinner and the same opacity as the white boxes solved this problem. This also resulted in the logo being made bigger on the home page and the content boxes being shifted upwards on the news page.