For my first punch at a re-design my friend chose the Reading Short Stay website. After I’d gotten over the initial shock of how basic this site looked I sat down to take a more objective look at it.
Basic analysis of current website
The biggest problem here is a lack of branding: logo, colour palette, background and use of typography. As I am no branding expert and it isn’t my main aim of this task I just quickly threw together a basic logo after trying out withoomph.com, took their existing blue to use as an accent colour since it connotes clear, fresh, airy, quiet, soothing and resting qualities all of which you’d expect from a home and selected a simple font: Edmondsans Regular. I then took inspiration for the diagonal lines to break up the clean white background from another website I stumbled across some time ago as simple patterns always work better than stock imagery.
The next issues that needed addressing were mainly layout and alignment related. I personally am not a fan of the two column layout of images and then text – it’s very basic, outdated and doesn’t give a nice flow. In addition the proximity of the images isn’t utilized as they aren’t placed adjacent to the corresponding copy text (the picture of the garden is on the rates page rather than the garden apartment page).
I also found it quite difficult to find the information I wanted, navigation wasn’t an issue it was more that things weren’t organised or grouped with similar things that i was anticipating as a user. With this in mind I re-jigged some text, created a testimonials page and did some light re-writing to use correct English.
So with those observations let’s look at how I started to transform the website.
Re-design in progress
I started with looking at some competitor websites and noticed that the majority rely on stunning interior shots to be the main focus, as I didn’t have that luxury as I was simply re-using their existing imagery I needed to come up with a cunning plan. I sketched some rough layouts in my notebook and then started taking chunks of information from the home page and placing it until I liked where it sat.
I always design in gray-scale first and focus on adding contrast by giving emphasis to top priority information. I quite liked the idea of Polaroid style for snapshots of key selling points and balanced it out with circles for things that needed to grab attention. Once the home page was to this basic stage I replicated the design for the other pages.
Here are some images of the in progress:
The next stage was to introduce the colour palette to bring more contrast and make things pop. Designing the Polaroids saw several possibilities with variations in outline thickness and shadows which can be seen below. Do you think I picked the best one? What would you have done?
The finished re-design
Ta-dah! Here are all the pages in the re-design, to see ‘before’ images visit the Reading Short Stay website.
So that was my first stab at a re-design and I’d love to hear what you think 🙂 Any suggestions, improvements, things you would have done differently – just comment below!
til next time