I wanted to create a website that was visually simple and “clean”, while being very distinctive and unique. I wanted to avoid overloading the user with information, which I often see on many sites.
Sites such as bbc.co.uk and skysports.com throw lots of information at the user from a huge variety of areas and it can be disorientating. However, the BBC website is well designed to avoid this, with clear divisions and user-customisation. The Sky Sports website on the other hand feels like it’s too much, throwing all this information at the user. I really wanted to avoid this.
As far as inspiration was concerned, the Twitter homepage inspired me. The very simple, very clean design of both the logged-out homepage and the main logged-in homepage were very good examples of easy to use, easy to consume websites.
I decided to design a website based around a building, with the header being the rooftop and the main body being one side of the building, with the sky making up the background. The billboards at the front right would serve as the links to pages.
Above: The Skycraper Rooftop Concept
In crafting a skyscraper, something that was important was depth and a sense of scale. Inspiration for this came from the iconic, almost clichéd Lunch Atop a Skyscraper photograph.
Above, Lunch atop a Skyscraper by Charles C. Ebbets, 1932
The picture is a key centrepoint for my inspiration as it shows a huge degree of depth and height. You can see the buildings hundreds of feet below and New York City stretching off into the distance, as well as Central Park. The scale is staggering, and it only increases the surprise that these men are so high up and casually eating lunch.
I also needed a way of displaying the portfolio in a manner that fit the scene. I decided on a concept of banners hanging from the side of the building. When creating this sort of image, I was inspired partly by the James Bond 1997 film Tomorrow Never Dies, in a scene where Bond and Wai Lin escape from a skyscraper using a huge poster of the villain, Elliot Carver. I wanted to capture the same sort of imagery that the original poster tried to achieve – hopefully with less ripping!
Above: The Portfolio “Building Banner” Concept.
When it came to the mockup of the rooftop in Adobe Photoshop, I was inspired by the videogame Mirror’s Edge (Electronic Arts, 2008). It’s futuristic visage of rooftops and skyscrapers was unique and refreshing, and it’s use of (or lack of) colour was inspiring.
Above: Two shots of the Mirror’s Edge cityscape.
I then mocked up the website in photoshop, adding detail over time to create a lifelike, but abstract scene. I plan to add detail in the future to the rooftop and sides.
