The Principles of Good Web Design Part 3: Colour
September 24th, 2009 — 17 Comments
This is the third part in this series of The Principles of Good Web Design. The other parts are listed below:
Colour is an often underrated aspect of web design but can play a very important role in usability as well as convey the overall meaning of a brand as well as the overall mood of the website. Different colour combinations can evoke different emotions and reactions.
Colour design is often very subjective but it is important to keep usability in mind. Changing colour for subjective reasons may ultimately have a negative affect on usability.
Read more...The Principles of Good Web Design Part 2: Navigation
September 21st, 2009 — 10 Comments
This is the second part in this series of The Principles of Good Web Design. The other parts are listed below:
Navigation is one of the most important things to consider when designing a website. After all, it is one of the main ways that will determine how a user interacts with a site. It is also an important thing to consider as it has an effect on usability. Poor use of navigation can cause confusion which has a negative effect on usability. We will discuss the principles of how this can be avoided in this article.
The Principles of Good Web Design Part 1: Layout
September 17th, 2009 — 35 Comments
This is the first part in this series of The Principles of Good Web Design. The other parts are listed below:
Good web design doesn’t just appear out of nowhere, there are many aspects of design that come together to achieve this. The first one that we’ll be looking in this 4-part-series is layout.
Layout is an interesting beast. There are no definitive right or wrong ways of approaching it. What you need to do is make sure that the layout works for the site that you are designing.
Layout primarily consists of the following aspects:
Read more...Showcase of Great Video Game Related Web Designs
September 14th, 2009 — 6 Comments
Video games and web design share one thing, visual design. A lot of work in both industries is geared towards visual design. Some games keep the artwork consistent between game and website while others communicate the look and feel of their games through their web design. Here is a look at some of the best examples of video game related web designs.
Left 4 Dead 2
Left 4 Dead is a zombie survival horror game, although a very action orientated one. The design of their website follows on from first game. An example of great header design. Saying that, the way the header has been built is not exactly great. Open up firebug, Webkit’s web inspector or view the source code to see what I mean.
Nintendo DSi
Nintendo uses a big javascript slider to show off their latest handheld gaming device, the Nintendo DSi.
Sidhe Interactive
Sidhe  is a game development studio. They came to my attention with their PS3 game, Shatter. Very clean and uncluttered design with links to sites for each of their games.
Pop Cap
Pop Cap are probably the king of casual games right now. There is a huge emphasis on fun in their games which is carried over into the design of their website. The header, background and footer are all customised to promote their latest game.
Rock Band
The strong illustration as seen in the menus of the Rock Band game are carried over into the header of the game’s website.
Forza Motorsport
The visuals of Forza Motorsport 3 are very clean and crisp which is reflected in the website.
The Orange Box
The Orange Box contains five different games that could sell for full price individually. Very simple design that is striking at the same time.
Gameloft
Gameloft are one of the biggest mobile game developers in the world. The light colours evoke the kind of find that they try to achieve in their games.
Star Defense
ngmoco uses a picture of an iPhone to display videos of their tower defence game, Star Defense. All of this is displayed on a great looking background image.
Nintendo
Nintendo has laid out their main page in a grid based layout. The combination of this and and strong imagery makes the page easy to scan.
Naughty Dog
Naughty Dog uses a background image of concept art from their soon to be released PS3 game, Uncharted 2. Certainly one I am looking forward to myself as I’m currently thoroughly enjoying the original.
Wrixel
Wrixel is a gaming blog that makes good use of colours to highlight different areas in the navigation. Also, good use of a jQuery slider to highlight their latest articles.
Battle.net
Battle.net uses a visually stunning background image and transparency. It is also an example of how to use buttons to improve usability that I looked at here on Inspect Element last week.
Next Level Games
Simple, clean design for game developers Next Level Games. Good use of proactive words as navigation.
Rolando 2
Rolando 2 is a fun and colourful game just like its website.
Capcom Europe
Capcom Europe’s website does something that I haven’t seen before. If you click customise, you can upload your own image to use as the background of their homepage.
Plus
ngmoco’s social gaming network’s site, Plus, has a great, consistent interface and is another example of how to use buttons to improve usability.
Konami
Konami uses a big image to show of their latest project allowing them to attract attention directly to what they choose.
WoW Insider
World of Warcraft blog, WoW Insider, utilises a big search bar for users to easily find what they want. There is also an area towards the top that displays their latest, top content.
The Beatles Rock Band
I’m not a fan of the Beatles at all but the website for the Rock Band game is quite good looking. As you move the mouse around, the layered header moves with it. A similar effect happens to the stars when you scroll up and down.
Codemasters
Codemasters uses a customised header and background to show off their latest game. In this case it is Colin McRae Dirt 2 which has an innovative in-game 3D menu. See a video of it in action.
Read more...Recent Web Designs that Don't Follow Recent Trends
September 7th, 2009 — 18 Comments
Last month I wrote an article on why design trends don’t have to completely disappear, explaining why design trends should live on beyond their acceptance. However, we are now starting to see designs that don’t follow any popular recent trends. What makes the following examples great is that they stand out from the crowd and are instantly memorable for being unique.
Read more...5 Important Things to Remember when Redesigning a Site
September 3rd, 2009 — 15 Comments
Redesigning sites is an important part of website design as technology and the web is constantly evolving. Staying with a design for too long risks falling behind competition. There are a number of things to consider when redesigning website so don’t think of a redesign as just changing the visuals.
42 Very Colourful Websites
August 31st, 2009 — 25 Comments
Great use of colour can really make a design stand out but deciding on an effective colour scheme can be a difficult thing to achieve. The following examples all use a number of different colours to create a visual impact which is the first thing a visitor is likely to notice. If the colours blend well together then that initial impact will almost always be a positive one.
Make Photoshop Faster
