Project Management Process for Web Designers & Developers

John Reeve | October 6th, 2009 | , , ,

Often times when we talk about Intervals we tell the story of how it was created by a group of like-minded creatives as web-based project management software for web designers and developers, as well other types of small businesses. What makes Intervals unique is that it was built by Pelago, a team of web designers, developers, creatives, and project managers, based on nine-plus years of client and project management experience.

We found that many design and development firms found Intervals to be a good match for their already established workflow, which means our experience has been a universal one. However, we have listened closely to our customers explain how Intervals could be better and tuned the software to address typical workflow issues shared by most small businesses.

What does the typical workflow of a web design agency look like? How do we manage projects? How do we handle clients? To give you an idea why we built Intervals the way we did, here is an inside look at how Pelago has managed the web design and development business process for the last nine years.

Write a scope of work and estimate

Your first job when starting any project is to extract as much information about the web site as possible from the client. The more you know, the more precise and complete your scope of work and estimate will be. Why is this important? If you are flat-bidding you want to know anything and everything about the project and have that information in a detailed and signed contract. It is the only way to control and contain client expectations, while protecting the project from suffering feature creep. If you are billing hourly for your work an accurate scope and estimate will enable the client to prioritize and budget accordingly and reinforces the idea that every feature has its price.

This process isn’t too complicated when estimating a basic web site design and build. When developing web-based applications, however, this process can often take weeks. At Pelago, we always approach web-based application estimates as business consultants. Few clients will know what they want or how they want it built, so we bill hourly for our time and expertise in helping them arrive to this conclusion. You can’t bid a project based on ideas alone. When we get done consulting with a client to define scope, they receive a detailed specification of how the web site should work, a document they can take to any web shop of their choosing for an accurate estimate. However, nine times out of ten they’ll move forward with your web design & development company because of the relationship forged during the scope definition process.

Sign the client contract

Now that you have a detailed scope of work and an estimate of how much it will cost, it should be quite easy to roll that into a client contract. Just sandwich it all between the summary/introduction and the closing legalese and have both you and the client sign and retain copies for your records. Feel free to download a copy of our client contract and use it for your own small business. Keep a copy handy during the life of the project in case any questions arise about compensation or scope. You can never be too thorough when managing client projects.

Issue the first invoice and collect the first payment

Unless you have a very strong and trusting relationship with a client Do not ever start on a project without first receiving a payment. Depending on the size of the contract, we recommend collecting anywhere between one third to one half the total estimate up front. Clients always have good intentions but those carry zero weight when it comes time to pay employees and bills. To make it official, issue an invoice at the start of the project and record the date and amount of the first payment. This first step may seem redundant when you already have a signed contract, but trust us, you don’t want to go through the collections process. There is nothing worse than completing several thousand dollars worth of work while the client says “the check is in the mail,” only to have them disappear leaving you with no money and a grounded project. Yes, you can go to small claims court, but do you really want to waste more time and money when there are people and bills to pay? It is the curse of the small business and billing hourly that when no one is working, no one is getting paid. So always invoice and collect a payment up front before starting any project.

Assign the first round of milestones and tasks

Using the scope of work as a guide, break the project down into manageable chunks of work that can be assigned to your design and development team. For us, that meant scheduling milestones due during certain phases of the project and grouping tasks into them. Using Intervals as our web-based task management service, our designers and developers log into the app and prioritize their workday by looking at which milestones are due next. Each milestone is further broken down into tasks which detail requirements, priority and due dates. As they are working on tasks individually or in teams, our project manager is checking the overall health of the project using productivity and financial reports and keeping the team on the correct path. As tasks are completed and closed the final web site project begins to take shape.

Track your time

Whether or not you are billing hourly for your services, it is important to track your time. If you are tracking billable hours you’ll want to know how much of the budget has been used. You’ll also want to know how much budget is left so you can prioritize the remaining features. And if the project should go over budget, you’ll need to know how much more to collect in payments from the client. If you are not billing hourly, it is still important to track your time spent developing a web project. Doing so will give you invaluable data useful for calculating your margins on flat bid projects and estimating web design projects in the future.

Monitor the budget

Keeping a close eye on the budget is critical for avoiding client frustration and disappointment. If you are tracking tasks and time properly you should know well in advance if a project is going to come in over budget. There are also other indicators that can raise red flags during web site development. If a third-party tool is being integrated into the site, watch it closely as they can be difficult to wrangle in and be made to play nice with your code. Integrating third-party tools are often a source of unplanned project costs. Another area to monitor are subcontractors. If the scope of work and time estimates are not communicated clearly enough, a freelancer can easily spend too much time overdeveloping the web site. Checking in with freelancers is a good way to monitor the overall project budget. If a problem with the budget does arise, communicate the issue to the client as soon as you are able and offer them options on how to resolve the overage. Some ways to cut back on budget are to implement alternative third-party tools and scale back the web site requirements.

Communicate with the client

Communicate early and often with your clients. Our philosophy has always been to be as transparent as reasonably possible. And it has worked to our advantage. Clients appreciate knowing how much of there money has been spent and how the project has progressed. For larger web-based applications we recommend holding weekly meetings with the client to review the work in progress and address upcoming issues. It is also important to keep an open incoming channel for the client to communicate with you. Most projects will change during development and that will need to be communicated and recorded. The better your records of what changed and who requested the change, the more accountable you will be to both your clients and your internal design and development team. Why is a chatter trail so important? Clients will inevitably question finances and features towards the end of a project. Being able to show them who requested and authorized changes to the scope of work will answer most questions before they have a chance to escalate into conflicts.

Apply the final round of updates

Once the project is complete and ready to launch (and most likely after is has launched) both you and the client will go through another round of fine tuning. Once we have the opportunity to click around and navigate through the finished project we will see the site’s functionality in a new perspective, one that could not have been obtained through whiteboard sessions or photoshop comps. Allow yourself some time to smooth over these final quirks just before launch, but don’t let it hold up the launch. Remember, a web site is not permanent. You can always do more tuning and tweaking after the “official” launch. When launching a new web site or adding features to a new web-based application we always remind ourselves that it doesn’t have to be perfect, it just has to be compelling. I would advise other web designers and developers to use the same criteria; it’s what has made us successful as a small business.

Issue a final invoice and collect the final payment

Wait! Don’t launch that web site just yet. It is a very good idea to get the final payment before you launch a web site. Because once you do upload those files to a server you no longer have any leverage for collecting payment. We will sometimes launch a web site or web-based application before receiving final payment if we have a good relationship with the client. But even then, we’ve lost money after having launched the web site before receiving final payment. Simply put, once a web site is live it becomes less of a priority for the client to pay on time. Make sure your client understands this ahead of time to avoid any misunderstandings and to give them time to get the final payment together.

Launch the web site

Now there is nothing left to do but to launch the web site you’ve developed. There are many different ways to do this depending on the technologies you are using. For example, our preferred sync method is to use rsync scripts because they intelligently move files up to the server based on timestamps. However, syncing files is only part of launching a web site. There will be databases to initialize, web servers to configure and various modules to install. But once you have that site up and running it is a thing of beauty and a grand sense of accomplishment. The process endured up to this point will have been well worth it and you can take a moment to rest and reflect on another successful launch.

Leave a Reply

Intervals Blog

A collection of useful tips, tales and opinions based on decades of collective experience designing and developing web sites and web-based applications.

What is Intervals?

Intervals is online time, task and project management software built by and for web designers, developers and creatives.
Learn more…

John Reeve
Author Profile
John Reeve

John is a co-founder, web designer and developer at Pelago. His blog posts are inspired by everyday encounters with designers, developers, creatives and small businesses in general. John is an avid reader and road cyclist.
» More about John
» Read posts by John

Jennifer Payne
Author Profile
Jennifer Payne

Jennifer is the Director of Quality and Efficiency at Pelago. Her blog posts are based largely on her experience working with teams to improve harmony and productivity. Jennifer is a cat person.
» More about Jennifer
» Read posts by Jennifer

Michael Payne
Author Profile
Michael Payne

Michael is a co-founder and product architect at Pelago. His contributions stem from experiences managing the development process behind web sites and web-based applications such as Intervals. Michael drives a 1990 Volkswagen Carat with a rebuilt 2.4 liter engine from GoWesty.
» More about Michael
» Read posts by Michael
Videos, tips & tricks