Mirificam Press

Use the links below to share Managing a Web Project from Start to Finish on your favorite social networks.

Back to the Article >>

Managing a Web Project from Start to Finish

May 28th, 2008 in Business & Process

by: Matthew Griffin

Every web designer has a process—a sequential order of tasks that is used to guide the development of a website from start to finish. Some of us are deliberate about our process, and some of us follow ingrained habits; but we all have a way we like to do things. I think this subject of web project management is one worth discussing and revisiting frequently as the web design industry grows and matures. Of course, every project is unique and requires some deviation from preconceived road maps and ideal flow. But it helps to consider what steps work best in what order to avoid common pitfalls. Over the last eight years designing websites as a freelancer, I've developed a fairly solid process for building a website. I'll be walking through that process in this article. I welcome comments from other designers who work on teams, under employers, and in other situations.

Step 1: A Project Is Won

I'm going to start explaining my process beginning at the point a project is won. I have already posted several other articles about writing proposals, , etc.; so I won't go into detail about those areas.

The first thing I do after winning a project is wait a week. Since I expect half of the payment for the project up front, this gives the client some time to get that check mailed and in my hands. Waiting a week also gives me time to really mull over the task in front of me, do some casual research, and think of any additional questions that weren't addressed in initial meetings. By the end of the first week, I usually have a pretty clear image of the new design and layout in my mind. I've had time to get down off the high of the win, and make good, well-thought-out decisions.

Step 2: The Mockup

Based on my research and planning done for my proposal and my week of contemplation, I design a mockup of the home page of the web site. I'm sure there's no question that I use Adobe Photoshop, but I'll mention that anyway. At this point, I'm not slicing up images or even looking at HTML. When I feel the design is adequately fleshed out, I present it to my client. If you've read any of my other articles, you know that I only present one design at a time. Depending on the client, I either email my mockup as a JPG or physically present the design in a meeting. In many cases, I've found that presenting a design in a meeting is a big mistake. Something about getting a group of non-designers together to look at a design makes them feel like they need to make changes. It may sound weird and unnatural, but when I email a design, I usually get better and more specific suggestions from my clients; and there tend to be fewer suggestions overall. It also saves me the time of driving somewhere and making a presentation. I could theorize about why this works so well, but honestly, I'm not sure—it just does.

Step 3: Revisions

I make a point to do as many design revisions as I can at this point in the project. When you have everything in Photoshop, it's easy to make changes. I push hard for a definite approval from the client before I move on to anything else. I think this is one of the most important parts of the whole project. I've gotten ahead of myself many times in the past and regretted it every time. I continue to make my mockup revisions until I get that firm and decisive approval. This also gives me good cause to bill for additional work if the client comes back later and wants to make earth-shattering changes.

Step 4: The Template

As soon as I have approval for my Photoshop design, I start slicing it up and writing HTML and CSS for the web template. I use Dreamweaver CS3 form my templating system and I'm not ashamed to say that. It's by far the best and easiest I've found. I don't trust Dreamweaver to write my CSS or HTML, though, so I do all that initial coding by hand. As soon as I have a template and set of empty pages ready to go up, I start setting up hosting accounts and uploading pages for testing in multiple browsers. During this phase, I also start pressing hard for content. Content is my number one project delayer and I like ask very specifically for what I need as early on as possible.

Step 5: Content and Programming

Now I have a website shell up on a server. This is usually when I send the client a link where they can follow along with the progress of the site. I've found that keeping the client informed is key to keeping them happy and excited about the project. I have a tendency to lower my head and just work, but that approach usually leads to angry clients (even when a lot of work is getting done). Even if I haven't made any progress on a project during the week, I'll still email my client just to let them know I haven't forgotten about them. Every time I get a chuck of content up on the site and reformatted, I let the client know. Likewise, every time I complete a programming module, I let the client know.

Step 6: Finishing Up

When everything is up and running on the site, I ask for final approval to publish the site live for the public. After the project is officially complete, I allow a period of about a month where changes are done for no additional charge (as long as they're not huge). After that period, I start billing for updates. That's it. There are some important steps I take after a project is complete, but I have already outlined them in an article entitled

This process may look very familiar to some designers, but I'm sure others have vastly different processes. Being a freelancer, I see many issues though that pair of glasses. I'd love to hear how your process differs from my own.

Back to the Article >>