JBi-Film-Cover
JBi-Film-Cover
A person uses their Apple Macbook laptop while seated
Black and White Macbook by Sergey Zolkin
A person uses their Apple Macbook laptop while seated

9 Steps To Writing A Kick-Ass Web Design Brief

Fail to prepare, prepare to fail. So the saying goes. In order to avoid a website which fails your expectations, breaches your budget and wastes your time, it is vital you prepare a comprehensive design brief to pique potential agencies interest. This document will guide you through the entire design process and become the central reference point for all parties involved. As a web design agency, we’ve experienced the best of briefs, and the worst *shudder* so we have a pretty good idea of what makes up a good one! In this blog we outline the ‘whys’ and the top 9 ‘whats’ to give you all you need to know about writing a kick-ass web design brief!

Download Design Brief

Logo Ideas
Logo Ideas
A person looks through printed logo concepts

You may be thinking that it’s easier to discuss your website requirements over the phone, or by arranging an immediate meeting but we have to disagree with you there. As much as we will rarely pitch or submit a proposal without a meeting, it should all start with a great brief and here are 4 essential reasons why it’s an important starting point for you:

  • It avoids time wasting by removing ambiguities
  • It will enable you to receive a more accurate quote so you can compare like for like with other potential agencies
  • It encourages you to think subjectively and creatively about the role your website will perform within the business
  • The process becomes much clearer when your goals and objectives are in writing
  • Agencies will take well thought-out briefs more seriously and therefore you will get a quicker, more efficient service

On a more selfish note, a web design brief significantly helps agencies by:

  • Helping them to understand your business, background and requirements
  • Gives them an indication of your experience and if you need a lot of creative help or already have very clear brand guidelines – either is absolutely fine
  • Again, it avoids wasting time – let’s be honest, no-one enjoys that!
Typing on a Macbook
A man types on an Apple Macbook Pro
"Express your initial thoughts as early on in the process as you can to avoid assumptions being made and second guessing"

So now you understand why a web design brief is considerably helpful for both parties, here follows the top 9 things to include in your brief, separated into 3 categories… Helpful, huh?

The Basics

Lay the foundations you and your business to help your agency build an image

1. A brief overview of your company

Assume the designer knows nothing about your company. They often work on multiple projects at a time, creating bespoke designs for hugely varied organisations. This week, a law firm, next week, a pub or restaurant chain! Sharing key company details will enable the designer to understand your needs, which in turn will considerably affecting the tone, feel and voice of the site. An agency can’t draw your company if they don’t know what you look like.

Typical questions: When was the company founded? What services do you offer? Where are you based? Do you currently have a website? What social media channels do you use?

2. Your target market

To answer this question you ultimately need to note who will use your website and what they will use it for. One of the project’s aims may be to engage with and meet the needs of the current market more effectively. It could be to appeal to a wider audience, or as a start-up company you may be looking to gain an audience. Either way, you really need to hone in on the specifics for this question, as the demographic of your target audience will directly affect the look and feel of your new site. By digging deep into your analytics or detailing the audience you hope to attract, your designer will be able to make supportive and beneficial design decisions on how to improve these relationships.

Tip: Character profiles are a great way of bringing your audience to life by determining how they use the Internet, their likes and dislikes etc. It will assist your designer in better fulfilling your audience needs 

3. You vs. your closest competitors

What better way to decide how you want your digital space to look than by measuring yourself against your rivals. Be realistic and look directly at those competing against you for audience, services, products, price range (if applicable), and social media. That’s not to say you should ignore the market leaders, you’ve got to be aspirational, after all!

Then, the agency will need to know what makes you so special. Tell them how you differentiate yourself from your competitors in the industry. What is your USP? Once your designer knows all of this, they will have a far better chance of portraying your company’s selling point and creating a site that’s unique to you and attractive for those all-important consumers.

Tip: List 2 to 5 competitors and provide their website links plus what you like & don’t like about the site.

Black and White Macbook by Sergey Zolkin
Black and White Macbook by Sergey Zolkin
A person uses their Apple Macbook laptop while seated

The Project

What, why and how much? The three key questions on everyone’s lips

4. Project Overview

This is your time to explain what it’s all about… Agencies want to be just as excited about your project as you are! The functionalities, designs and, importantly for you, the price range are all very different depending on the type of website you’re after, whether it’s creating, redesigning, or rebuilding. Do you need an ecommerce site with user logins? Or a simple brochure site to showcase your work? Use the design brief to go into some detail about the basic site requirements. This document will have a hugely positive impact on the running of the project between the account manager, designer and developer.

If you’re not sure what sort of functionalities you need and simply wanted some advice, just be honest and say that. Most web agencies are happy to offer their expertise and help shed some light on what may seem a rather daunting prospect for you and your business.

Answer these questions: What type of site are you looking for? E.g Ecommerce, brochure. Will it have multiple user accounts and logins? Do you need a blog? What is driving the project?

5. Key Objectives

Simple but vital. This is the part where you explain the problem and invite agencies to tell you the solution. Understanding your key objectives enables agencies to maximise their expertise to ensure every element of the website is geared towards helping you achieve your digital goals. Aiming to increase your social media following? Add channel icons and calls to action, easily done!

Top tip: Use bullet points. We really like bullet points

6. Budget and Timeline

Budget is often a particularly sensitive subject for clients and we understand some can be a little reluctant to share this information on the worry of being overcharged or quoted for the least amount of work for the most amount of money. However, what agencies are actually doing is tailoring their service to your budget. This allows you to get the best value for money possible, from experience, quoting blind almost never goes well. At JBi, we create fully bespoke websites and, based on project specifics and your budget, price can vary enormously.

If you’re working on a lower budget to that of the agency’s typical benchmark, disclosing your budget saves time for both parties by agreeing they’re not the right company for you. Some agencies target top brands only, whilst others clean up providing a great service to small companies – you just need to find the agency that is suited to your business. At JBi, we tend to service medium and large companies, our whole ethos supports this and so we will not be cost effective for smaller companies and one man bands. However, if you are in our market, we are well placed to give you excellent value for money.

Additionally, sharing this information will allow the designer to plan and schedule work appropriately according to the timescale and budget. This ensures the demand can be met and your expectations managed from the get-go. It also means that any timelines and milestones can be accurately placed.

Advice: You don’t have to give a timescale to the date or a budget to the penny, ballpark figures are ample at this early stage

Macbook, iPad and iPhone
Macbook, iPad and iPhone
An Apple Macbook, Apple iPad 2 and Apple iPhone 5c sit flat next to each other on a desk surface, accompanied by a succulent

The Design

This is the section of the web design brief where you can really go to town on descriptions, bringing to life the vision you have for your site and laying it out on paper for the designer.

7. Designs and sites you like

Unless they’re clairvoyant, designers aren’t great at guessing what you want, so it’s vital that you express your initial thoughts as early on in the process as you can to avoid assumptions being made and second guessing. Put together a list of designs or websites you do like; it might be the colours that take your fancy, the headline fonts, a particular feature or the easy navigation. Any information is good information when it comes to designing a site which brings your vision to life.

Tip: These sites don’t have to be competitors. Just make sure you explain why they’re on your list of likes. For cutting edge new designs check out Awwwards and Pinterest

8. Define ‘don’ts’

In order to narrow the guidelines, explaining what you don’t like can be just as telling as what you do like. You can declare something as simple as ‘I don’t want the colour pink’ to create a clear no-go; this could be the difference between receiving Barbie’s dream site instead of the grunge look you imagined.

9. Key Pages

At last, we’ve arrived at the final stage of what makes a good web design brief. Knowing the key pages at this early stage is helpful because it gives the designer an idea of how many mock-ups and final designs will need to be produced, and therefore the workload can be scheduled appropriately. Secondly, if copywriting or imagery is required, these tasks can be scheduled into the overall project timescale, ensuring each page receives adequate TLC.

Advice: Don’t worry if you don’t know specific page names yet, as long as you have a rough idea of the number of pages and their concepts, the rest can be finalised at a later date. A normal company site might include: Home, About Us, Products, Case Studies, Meet the Team & Contact Us


So there you have it; 9 essential things to include in a web design brief. Once you’ve spent the time creating this kick-ass document, hold on to it and refer back to it throughout the entire website design project to ensure you and your agency stay on track to creating the website design of your digital dreams.

Feeling confident and compelled to speak to JBi about your web design project? Fill in our design brief form now and put your newly learned knowledge to the test!

Download Design Brief