The life-cycle of creating a website from scratch is not an exact science, it varies from site to site, it is different for each persons requirements, sometimes different parts take longer than others, focus is constantly changing and it’s nonlinear – you can take this order with a pinch of salt… However in this article I will try to explain the basic concept. This is the workflow I try to stick to, it never is exactly like this and varies greatly for each project.
Brainstorming – This is the most important step from the designers perspective, and the hardest to get 100% right first time. Brainstorming is basically getting what the client wants in a memorable format, use whatever you want here, sketch pictures, write notes, just learn everything the customer wants, it’s also your chance to insert your 2 cents and try to persuade them to add and remove certain features or change how it looks, explain things that would work better or worse.. remember to speak in “normal person speak” (ie. no jargon) Now is also the time to find out what the client can provide, do they have images? content? look and feel the customer wants? colour scheme? requirements that they have to abide to? any specifics that may have been missed out? I tend to try and get the price sorted here also, it is generally easier to get the “always awkward” talk out the way and then it can be left knowing that it has been agreed upon.
Personally before the “Photoshopping” stage I tend to have a sketchbook and go back and fourth with design ideas and sketches, which to me is quicker than coming up with multiple Photoshop concepts.
Photoshopping – This stage to me is annoying, but it’s common practice to create multiple concepts for the clients website – different colour schemes, layout styles, 2/3 columns, various ideas for the client to pick and choose from, it’s a relatively time-consuming process. As stated before I try to do that before this stage so it only needs doing once and I do the “Photoshopping” & “Templating” at the same time. This means, only 1 concept, the template gets created at the same time, and visual tweaks can be made fairly easily after the templating stage.
Templating – A fairly simple process (if you know what you are doing) but it basically consists of getting your Photoshop documents into a functional website template.. creating the CSS + HTML (or XHTML) building it into whatever framework you are using, I’m a big fan of the HTML5 boilerplate [link] – This stage does not consist of any PHP, JavaScript or anything dynamic, it is purely for a static template, something to show the customer. Once you are satisfied with what you have created it’s time to recap – show the customer, get their input, any changes they want to make, things to add and remove and go back to Photoshopping and Templating. As a side note, if this process goes on too long it may be a good idea to tell the customer what comes next and still needs doing, and possibly charge extra if you see fit (and are charging on a per-page basis) or come to an arrangement.
Customizing – The fun bit… (at least to me) It’s time for the dynamic content, add all the functional elements, create the database, code the backend, add JavaScript if necessary, gallery’s, forums, shopping cart, logins, anything that could take a little bit of time and concentration. Lets get that grey matter firing, switching from right (creative) to left (logical). If the database needs any data in it fill it with test data just for previewing.
Finalizing – Your website should be nearly done, it’s just a case now of adding the customers content, images, text, logos etc. and populating the database with live content. Double checking all links, check spelling, run tests to make sure every thing is as expected. Once this is complete, uploading it 😀 – congrats your work here is done.
After – If this is your own website or you happen to have a contract, this is never ending, hopefully you have some analytics and visitor tracking installed, a method of getting feedback, it’s time to see what works and doesn’t, customize and change things to suit the purposes it was made for. What stage you go back to is up to you (or the client) but it should be constant, create – publish – revise.
I hope this article has helped some of you, I hope you have found it informative. I would love to get some feedback myself, what you liked, what you didn’t, suggestions, improvements etc. Feel free to add a comment or tweet me @Ross_W_Marks