Building a website is never an easy task, even to experienced designers and coders, there are always new issues that arrives and different things you have to worry about throughout the desing and coding process. In the first of a two part series, we breakdown the design process itself with examples of the various stages of work it took to complete version one of Devlounge.
Brainstorm, On Screen
First things first when you’re designing. You want to have an idea of what you want the overall layout of your site to look like, and have some sort of favorite color scheme you’re really into. To get yourself motivated, it’s always good to go browsing web designer forums and looking at site showcases,. as well as looking through google for some of the hard-hitting, well known designer portfolio. Get a feel for what you want to do, and open up Photoshop or similar graphics program and play around with possible layout ideas. This can be done just by using text and boxes, and it will give you a very good base to begin working with.
Know Your Purpose
One of the most important things to know and keep in mind throughout the whole design process is exactly what you are aiming to accomplish. If you want to focus on simplicity, then keep your mockups to minimals at first, and slowly add additional things. Don’t get carried away with graphics down the road. Understand what your site is showcasing, and make a design that fits it. If the focus is content, then a highly developed flash site isn’t the best idea, because all the fancy design features will distract the user from the content itself.
Create Your First Concept
In most cases, even the best designer never gets a design perfect after just one time working on it. In Devlounge’s case, it took 10 revisions of the original design to get things right, and even after the design was finished, things were modified on the homepage to improve the overall look.
As you can see below, the first revision of Devlounge was very simple, and we left a lot of details out in the first mock. We knew we wanted to archive a simple, web 2.0 look without the fancy graphics and heavy load times.
