THE METAL POST
A website redesign and rebrand for a send-in-the-post scrap for cash recycling business
The Metal Post
Lead Art Director
The Metal Post is a way to sell scrap and scrap metals online. You simply send the scrap metal (sorted or unsorted) in the mail and make a profit.
I was asked to come up with a new art direction and style for the website, as their existing website felt uninspiring and confusing to navigate.
Looking at the clients website, and those of their competitors, they all seemed to follow the same formula. Photos of metal objects. Lifestyle shots of happy builders holding cash. The overall design lacked memorability. The branding felt repetitive and uninspiring.
Just in case you couldn’t imagine some old metal things, here are some old metal things...and a happy builder
Wanting to break away from the generic style, I decided to offer two art styles to the client; graphical, and photo-realistic. For timing’s sake, I would present just the header for each concept, designing the whole home page once the client had made their decision.
The clients existing colour palette was a little broader. I narrowed it down to four key colours; white as my background, red for call-to-actions, yellow for alerts, and grey for the footer. I tweaked their red and yellow shades a little, making them less saturated for digital.
I started to explore a couple of directions using real physical items. The first idea was a bit abstract, with a full bleed photo showcasing curving metal plates of various copper shades. This created a more visually interesting header, but felt a little misleading to the user. As arty as it looked, it didn’t realistically convey the services of The Metal Post.
Mock-up showing my initial idea with photo-real elements - but far too much abstract vibes
So I focused more on the physical items that customers might be able to send in the post, and started to sketch out some possible layouts. One header sketch showed an open cardboard box set on a table, with various metal objects scattered over it. And this would also work well threaded through the rest of the website too, with various metal objects shown in situ throughout a house (pots hanging against the kitchen wall, nuts and bolts in a metal toolbox, etc). Another showed a top-down perspective that could work in the same way.
Some rough sketches for the header and homepage composition
I chose the top-down perspective as this was an easier way to present the metal objects. It’s worth mentioning that this was still a rough mock up, so I used rough reference stock photography and some seriously bad photoshop drop shadows. Once you see it, you cannot unsee it, right?
Mock-up showing my second idea with photo-real elements from a top-down perspective
This felt much more fitting to the brand than the abstract version I’d created, and had the added benefit of showing users what kinds of metal items could be sent in the post. I wanted the objects to stand out, so I selected a light coloured background; using a deep oak wood texture didn’t work and the clarity of the items were lost. It was also great to see that even at this early stage, the composition was working well with the clients original colour palette of red, white, grey and yellow.
Graphical Art Direction
Next up, the more risky option. Exciting times, people!
Having taken a look at the long list of items users could send to The Metal Post, I decided I would present them in a cool, modern, graphical style. So I did a few more sketches and chose to create the same cardboard box composition again but this time with a side view of the box, the metal items falling in to it from above.
Rough sketch for the side view of the header and cardboard box
Iconshock; a very smart and affordable way to illustrate a website without lifting a single pencil!
I went through iconshocks' very extensive icon list, saved out all relevant icons in to a Sketch icon library I’d created, and then started composing the header graphic. I designed the cardboard box vector myself, as I needed something larger in scale. I positioned this on the right side of the header, keeping the header title and copy left aligned. The remaining metal icons could be easily arranged around this.
The overall art direction felt clean, modern, and memorable. I was happy with the result, and waited for the clients decision.
Mock-up showing my graphical idea with illustrated elements from a side-view perspective
And the winner is...
A before and after of The Metal Post website
Find out more about The Metal Post