Sometimes you have a good web design, possibly even great in terms of the layout and the hierarchy of the pages, but for some reason the wireframes you sketched or mocked up on your computer were more exciting than the final product is.

The key to incredible design is nothing magical – it basically all comes down to attention to detail. Of course the website has to be easy to use and effective in delivering information, but if you want a final product that you would be proud to put into your portfolio you had better start looking at the small things. Here are a few tips to transform a good design into an incredible design:

Use Textures

Adding textures to your design can make a world of difference. They can give your design character and make it stand out from the crowd. A prime example would be for an illustrator to add subtle sketchbook or paper textures to the background of their portfolio website.

Or if you’re designing a website for an executive chauffer driven car hire company you could apply some leather textures to reflect the style of luxury cars etc..

A good example of textures being used effectively is Amazee Labs

amazeelabs

Add Realism

People like it when things feel “real”. The psychology behind it is probably something to do with the possibilities and uniqueness of real objects against the blandness of computer generated, infinitely perfect shapes and colors.

If you take the time to make your website feel “real” it will definitely show.

Have a look at the double shadows of the browser windows on the Foundation Six homepage and how they contour onto the objects behind them.

foundationsix

Add Depth

Depth makes your website feel stronger and more layered. A quick and easy tip for adding depth to your designs is to put shadows or highlights onto your text.

Text Shadows

Generally shadows will give your text emphasis and make it appear to be floating above your page, it’s best to create this effect very subtly though, as too much shadow can start to look tacky.

Text Highlights

Adding highlights to your text on the other hand can make your text look as though it is indented into the page. A common practice to get a good highlight in Photoshop is to apply the Drop Shadow layer style to your text, set the blending style to Normal, the color to white, the angle to 90, the distance to 1 and the size to 0 but it’s always worth experimenting with the settings to find the perfect effect for your project.

Hello Themes use a shadow effect on the main header to make it stand out and then an indented effect on the text below and the call to action buttons

hellothemes

Play Around With Noise

It’s kind of an inside joke in the design world at the moment that if you slap some noise on it, it’ll look better but the fact is …. it’s true! Noise works in a similar way to textures. When used (very) subtly it adds an air of authenticity and brings a flat design to life.

Devin’s Heaven by Devin Ross uses noise on the background, main menu bar and logo type to good effect.

devinsheaven

Build a Cohesive Theme

Most importantly though, to make your website look really incredible and to make it stick in peoples minds it needs to have a distinct, consistent style or theme.

The best practice is to plan your designs ahead of time, collect design resources and carry a single, distinct style throughout your project.

A perfect example of carrying a strong, distinct theme throughout a website is the usage of vintage stock photos on the recent redesign of the you know who website by Sarah Parmenter.

youknowwho

Conclusion

This brings us to our conclusion. Attention to detail can make or break your website in terms of aesthetic appeal, but the key is in moderation. Just remember not to overload your page with too many of these tips, and make sure the design was a “good” design to begin with.

(Originally posted by Tony Thomas on Medialoot.com)

One Response



Leave a Reply

%d bloggers like this: