Cameron Chapman May 26th, 2010

A Designer’s Guide To Effective Proposals And Invoices

Because of the potential for variations in the different aspects of a web design project, creating a proposal or invoice for such a project can be trickier than that of another industry like accounting or legal services. If your proposal isn't created carefully, it can lead to misunderstandings and unhappy clients (not to mention the grief it can cause you). The same is true for invoices: if it's not clear what they're paying for, clients can delay making payments or dispute charges. There are two main factors to keep in mind when preparing a proposal or invoice: First, you're likely dealing with people who are not yet your clients; and second, you're dealing with clients who you (probably) hope will bring you repeat business. This article will offer a number of tips, based on those two principles, to help designers creative effective proposals and invoices.

Proposals

We'll start with proposals, since you'll have a need for them before you need an invoice. There are probably as many web design proposal formats as there are web designers. A lot of what you include in a proposal is a matter of personal choice. But there are a few things that every proposal should include.

The Basics

A proposal should include basic information about your company (contact info, mostly), information about who the prospective client is, and the fact that this is a proposal. In many cases, you would include your logo and business name, along with your contact information, at the top of the page. Then, below that, you'd include your client's contact information. Put the date somewhere near the top, too. Finally, put the word "Proposal" or similar, preferably in bigger type and bold. These things are just formalities, but they're still important and it's completely possible that some designers might forget to include one or more of these in their rush to get a proposal out the door to a new prospect.

The Project's Scope

Somewhere in your proposal you'll include information about the scope of the project. Is this going to be a simple brochure site? An online store? Will it have a blog? An intranet or members-only area? Community features? There are tons of variables that go into the creation of a website, and it's important to describe at least the major ones here. Make sure you understand what your prospective clients are looking for before you send a proposal to them (this should be done in a discovery phase, with either a formal or informal client questionnaire). Project scope This section should be clearly indicated, but can be formatted either as a series of bullet points or in paragraph form. Which one works best will probably depend on the type of site and how many features it will have. A bulleted list can give a more polished look and make it easier for the client to read — as long as there aren't too many points. Don't be afraid to use bold or underlined type to highlight particularly important sections. Ideally, you want to include a problem statement at the beginning of this section (or possibly as its own section if it's long enough), where you restate and rephrase what the client is looking for, to make sure you understand what they want, and to ensure they know that you understand their needs. Make sure you make it clear to your prospective client that you understand what their needs are, what their company is all about, and that you can help them reach their goals. This is also the section where you want to make it clear what are your capabilities. The more specific you are about what you can and can't do for a client, the less likely they are to make incorrect assumptions, and the more confident they'll be in your abilities. By being honest up front, you build trust with your client, which makes them more likely to hire you, and, if the proposal is approved, they'll be more likely to listen to, and trust, your suggestions during the course of the project.

The Project Timeline

Generally, web design clients want to know how long it will take for their website to be up and running. My advice: take a page from Scotty's book (from the original Star Trek series). Under-promise and over-deliver. In other words, if you think something will take you two weeks, tell your clients it will take three. There are two reasons for taking this approach. First, every project will have its unexpected problems and challenges — maybe your client submitted artwork three days late, or maybe the domain they wanted was already taken and it took them a week to come up with an alternative, or maybe the hosting they purchased ahead of time doesn't support databases or PHP5. Whatever the reasons, giving yourself some buffer time means you aren't scrambling to meet deadlines that are suddenly unrealistic or delivering the project a week late. But there's an even more important reason to under-promise and over-deliver: If everything lines up properly and you don't run into any problems, you will gain the reputation of being faster and more efficient than other designers. In both cases, you end up with happier clients without pulling out all of your hair! So, come up with a realistic timeline for the project, breaking it down into milestones if it's a particularly large or complicated site. For example, you might promise initial mockups in two weeks, a functional site for testing in a month, and the final site in two months. For a smaller site you might promise the mockups by the following week and the finished site a week after the mockups are approved. In creating the written timeline, be sure to mention that some milestones may depend on the client's approval. It's not unreasonable to set incremental deadlines that require the client to review certain aspects of the project. In the documented timeline you want to inform them that any delays on their part will affect the overall timeline.

The Project Costs

Including project costs in your proposal in a well-outlined and well-explained manner can contribute to how happy your client is and how long it takes them to pay their bills. You'll want to break down the costs based on phases or parts of the project. How you do this depends on how you normally bill clients and how complex the particular project is. For very simple websites, you might write "Brochure site, 4 pages with contact form, $500" or similar. For a more complex site, however, you'll need to break it down into separate items. You might have a fee for the basic design, a fee for adding ecommerce capabilities, a fee for some original artwork, and maybe a fee for custom coding. In either case, make sure you outline whether this is a flat fee or based on an hourly rate (and how many hours that covers). Outline potential additional charges, too. These might cover things like domain name registrations, hosting setup and monthly charges, and ongoing maintenance fees. Including these details in the proposal will help avoid any surprises from a client perspective.

Other Things to Include

There are other less important things you might want to include in a proposal, depending on your own normal business practices and your individual clients. These include: Business meeting Business meeting in coffee shop with Windows Mobile devices photo by shared under Attribution-NoDerivs 2.0 Generic (CC BY-ND 2.0) licence
  • Make sure you're accessible. Make sure you include multiple methods for the client to contact you by. At a minimum, the client should have your email address and a phone number, but also consider including your cell number, and one or more IM usernames, if it will fit the circumstances.
  • A confidentiality clause. You may want to include a confidentiality clause in the proposal, making it clear to your prospects that the information contained in your proposal should not be shown to others (especially other designers).
  • Technical specifications. Some designers like to specify exactly which browsers the site will work in, as well as any special or proprietary technologies the site will use. This might also include specifying a particular CMS.
  • Original artwork creation. Sometimes a web design client will want you to revamp their logo (or create one from scratch) or do some other original design work for them. These things should probably be specified separately.
  • Payment terms. If you have a payment plan worked out with your client, the proposal would be the best place to spell it out. You might also mention things like penalties for not making a payment on time.
  • A short company or designer bio. Giving your prospective client some idea of who you are and what you've done in the past may make their decision a bit easier. Putting that information on the first page of your proposal makes it easy for them to remember why they considered hiring you in the first place.
  • A cover page. A cover page is a great place to include things like your company bio and your confidentiality clause. It can also make the proposal look more professional, especially if the proposal is more than a couple of pages long.
  • Headers and footers. Including a header and/or footer with your contact information and page numbers makes it easier for prospects to keep your proposal organized and for them to contact you without having to flip back to the front. This also helps it look more polished.
  • Moodboards and/or wireframes. For particularly promising projects, or for ones where you're pretty confident the client is going to hire you, including a couple of wireframes or moodboards (with color schemes or other design elements) can be a nice added touch. Just don't put too much time into it or give too much away until you actually have the project.
  • Case studies. Including case studies of similar sites or projects you've completed can also give clients more faith in your abilities. Include any relevant projects, but limit this to 2-4 strong and applicable examples, to avoid overwhelming your prospects.
  • Include a cover letter. Give a very brief introduction and overview, in an email or cover letter, of what's included in the proposal, what your qualifications are, as well as your contact information.
  • Schedule a meeting. When you email or otherwise send the proposal to your prospect, include in the proposal a request for a meeting to discuss any questions they might have about your proposal or the project itself. Knowing there is a possible follow-up meeting might make it more likely that the client will review your proposal in a timely manner.

Don't Forget...

Here are some other things to keep in mind when preparing your proposal:
  • Spell check and proofread! There's nothing worse than getting a proposal that's littered with typographical and grammatical errors. Remember that your computer's spell check isn't foolproof. Do a manual proofread, too — preferably on a hard copy.
  • Ask your client whether they prefer a printed or digital version of the proposal, and if digital, which file format they'd prefer.
  • If it's a print proposal, use high quality paper and ensure that your printer isn't running out of ink; you want your proposal to look as professional as possible.
  • Use a customizable template to make the creation of future proposals easier and more streamlined.
  • Be neat and professional, but don't over-design your proposal; its purpose is to get the information across, not to show off your design skills.

What's Next?

So, you've crafted the perfect proposal and sent it to your prospective client — now what? If you haven't heard back from the client within a week or so after submitting the proposal (and assuming you didn't schedule a follow-up meeting when you sent the proposal), it's fine to follow up. Whether you want to email or telephone is up to you, and may depend on the type of client you're dealing with. But get in touch to make sure they received the proposal, and to see if they have any questions. If they haven't made a decision by this point, try to find out when they're likely to do so. Then, plan to follow up again after that date if you haven't still heard. Desk My Work Desk photo by shared under Attribution-ShareAlike 2.0 Generic (CC BY-SA 2.0) licence Now, assuming they decide to hire you, what are the next steps? You'll want to get a signed proposal or contract from the client, along with a deposit. Whenever you're working with a new client, you'll always want to get a deposit of anywhere between 25-50% before you start work (which should have been specified in your initial proposal). Once those are received, you'll want to schedule the milestones and deadlines that were outlined in the proposal's timeline. Keep your client up to date on your progress, especially if it's a long-term project (weekly or bi-weekly updates are often appropriate). If you know you're going to miss a deadline, let your client know as soon as possible. They'll appreciate the advance notice, especially if the next milestone requires some kind of action from them (such as reviewing artwork or beta testing). Keep on top of your clients to make sure they comply with any deadlines agreed upon in the proposal (such as providing artwork, reviewing the site, or making scheduled payments). When you send them files to review, include a note to remind them of their responsibility to provide feedback within the specified time that was outlined in the proposal. This will help reinforce that you can only meet your deadlines if they meet theirs. Constant communication with your client is key to making any project run smoothly. Make sure your clients know they can come to you with any questions or concerns they may have regarding the project. Do the same with them. If you have questions about something they've sent to you or some aspect of the project, ask them. It's better to ask and get it right the first time than to spend hours or days doing something you'll have to change later.

Further Resources:

Professional Web Design Proposal Template A downloadable template for creating your proposals. Writing a Website Design Proposal A great post from Propaganda Party on what makes a great design proposal. Write a Winning Graphic Design Proposal for Your Business A very detailed article on creating proposals. Creating a Winning Proposal for Web Projects An awesome article from Peachpit about the web design proposal process. Website Design Proposal Template Another great template to serve as a basis for your own proposals. How to Write a Web Design Proposal A detailed post from Bidsketch on creating web design proposals. 7 Tips for Writing a Winning Web Design Proposal This post from SitePoint offers some excellent tips for creating a proposal. Secrets to a Great Sales Proposal Another SitePoint post about writing a proposal, this one more focused on the sales aspect. Deliverables That Work: Design Description Documents An awesome post from Carsonified about creating a "Design Description Document". The UXD Stack A great post from 404 User Experience Design about project management in user experience design that could be very useful for structuring your own proposals (or at least deciding what information you need to include). 45 Incredibly Useful Web Design Checklists and Questionnaires Use some of these questionnaires to gather the information you need to create a better proposal. Writing a Project Proposal A step-by-step guide from Tutorial Blog for creating a project proposal.

Invoices

A clear and easy-to-understand invoice will contribute greatly to ensuring your clients pay their bills in a timely fashion. Below are some guidelines that will help you create an effective invoice.

What the Invoice Should Include

Your invoices should include basic contact information for both you and your client, as well as the date the invoice was issued and the date it's due. Always include a sequential or date-based invoice number, to help identify the invoice at a later date. The invoice should outline exactly what the charges are, which would be broken down in the same way they were broken down on your proposal, to make it easier for your clients to verify the charges. Include whether these are flat fees or based on hourly rates (and how many hours). Depending on your location, you may need to include some form of tax as a separate item. Check your local laws to see if this applies to you. Finally, include how you want to be paid — by check, bank transfer, or PayPal. You might consider setting up a payment gateway on your website to make it easier for your clients to pay you. Offering a discount for prompt payment can also be a good idea. It's common for payment discounts of between one and five percent to be given for payments made within five to ten days. You should also specify if there are any late payment fees or interest charged on payments not received by the due date.

Using an Invoice Service

There are numerous online services that offer invoicing ranging from full-featured bookkeeping to simple invoice-tracking services. Some of the better solutions let you create proposals from within the app, and can manage your entire project. These services can definitely make your life much easier when it comes to finances. Another advantage to using an online invoicing app is that it can track payments, and sometimes even calculate your income taxes based on what payments you've received, saving you time and hassle. See the "Further Resources" below for an overview of some available invoicing apps. In addition to these services, you may also use ready to use invoice pdf templates to easily send professional-looking invoices to clients automatically.

Further Resources

(ll)

Cameron Chapman

Cameron Chapman is a professional Web and graphic designer with many years of experience. She writes for a number of blogs, including her own, Cameron Chapman On Writing. She’s also the author of Internet Famous: A Practical Guide to Becoming an Online Celebrity.

28 comments

  1. Hi,

    Thank you very much for linking to my article! Great post, very useful information that.

    As a rule, it is very important to scope out the project from the word “go”, essentially this is what you’ll be building and working towards, and it is important that both you and the client see eye-to-eye on this one and agree on that, so that later you won’t have to deal with any scope-creep or misunderstandings (“but I was under the impression you did X” – “I thought you said the website did Y”).

    Keep up the good work! :)

    Alex

  2. I must say, you hit this right on the nose. I would not take any part of this article with a grain of salt. All parts are important to ensure your financial and copyright safety! Don’t cut corners, cause they’ll grow back and hurt!

  3. Great article. I especially appreciated the info and resources on creating proposals. I’ve known for some time that mine need a little work. Thanks for the great information!

  4. On the proposal part, on the scope part, It will be good to add a Limitations section in some cases, especially if you are working on a project that has a lot of functionality. Sometimes is good to say what the project won’t do along with what the project will do.

  5. Thanks for the awesome examples to follow with drafting a proposal or sending an invoice to get paid.

  6. This is a great article. It hit’s most if not all of the essentials for proposals and invoices. Even for people who think they know this stuff already, a great refresher!

  7. hey this is really interesting..something i ve been wating for so long, coz the design aspect of any proposal is always omitted and focused more on content all the time. Thanks for the good posts!

  8. The proposal should also follow basic rules of usability. That is, don’t make assumptions about what the reader knows (or doesn’t). A simple thing to you may be completely foreign to them.
    One technique I’ve used very successfully is ‘What I mean by this is…’ usually in a callout or highlighted box so that area’s where we mean one thing and they would understand another can be explained.

    Also especially cover the limitations so that the things that are not included are spelled out and the break point where you would need to start charging for stuff beyond the spec and good nature is known at the outset.

    Where there are multiple contractors involved, such as a database company for example, who supplies pre-formatted customer data to you, make sure the individuals responsibilities for the quality of the data are spelled out so that you don’t get into a multi-contractor blame game later where everybody says its somebody else’s responsibility.

  9. Very nice advise. It’s very important that your proposal contains all the important information so that there is no scope for misunderstandings later on.

    ~~ Sarah ~~

  10. I also include a Situational Analysis in proposals, based on an initial project questionnaire and meeting, highlighting:

    1. Information about the current website (where applicable)
    2. More importantly, the aims and objectives for having an online presence

    I’ve found my clients feel more comfortable and trusting if they know I’ve taken the time to understand what they want to achieve, and it also helps to make sure the designer and the client are both on the same wavelength before actually starting the project.

    Great article, thanks.

  11. Very useful post! There is a lot of little details that make the difference. Create a checklist based in the topics listed is my tip.

  12. I personally use Billing Boss to create my invoices. It’s free plus it offers me the ability to send recurring invoices. I can better keep track of my cash flow, and know who paid me and who hasn’t.

    One thing I like to do is to send clients an online payment method along with the emailed invoice. It seems like such a simple thing to do, but I find a lot of clients forget to pay invoices because they need to actively drop the cheque in the mail or call you during business hours to give you the credit card number. With an online payment method provided right along with emailed invoice, I’ve been getting paid an average of 2 weeks faster.

    Full Disclosure: This author has been compensated by Sage. I am their Social Media Consultant but I was using their product well before they contracted me. They found me when I sent them an email giving suggestions about Billing Boss!

  13. You can check out this site to have a look at an online accounting software. workingpoint.com/. Let me know what you think!

  14. Hiya, I had been reading 1 thing about this on much more website. Intriguing. Your perspective on it truly is diametrically contradicted from what I understand earlier. I’m nevertheless pondering from the opposite items of view, but I’m leaning to a truly good extent toward yours. And irrespective, that is what’s so best about modern evening democracy and also the marketplace of ideas on the internet.

  15. I really appreciate your article. I love that it is really easy to follow, especially since I have been reworking my proposal outlines. Thanks.

  16. I’m working on some proposals now so it was good to brush up on some of the essentials with this article.

Leave a Reply

Your email address will not be published. Required fields are marked *