What are brand guidelines?

A definition of brand guidelines

Brand guidelines document how your brand should be presented to the world. They are used to ensure a consistent look and feel across all forms of communication.

Consistently demonstrating your brand’s identity and values helps to build trust with your customers and increase brand loyalty.

Why are brand guidelines important?

The process of defining your brand strategy and creating a brand identity is incredibly rewarding, but also a lot of work. It’s essential that this investment of your time and money is capitalised upon in the ‘real world’ of your organisation.

Brand guidelines do just that. They take all the elements of your brand identity and distil them into an easy-to-access format. This makes it simple for everyone involved in communicating about your business to be consistently “on brand”.

This consistency ensures that you are creating a clear and memorable identity in the eyes of your customers. It demonstrates your values and builds trust and loyalty with your audience.

Who should use your brand guidelines?

Anyone who is involved in creating marketing or sales materials for your organisation needs to read and understand your brand guidelines.

What form should brand guidelines take?

Brand guidelines can be printed documents, pdf files, videos, posters, presentations…the best format will always depend on who is using them.

For example, a video presentation might be an accessible way for those in your organisation who only need to work with your brand guidelines occasionally, such as your salespeople. A detailed digital version would be better for sharing with external design agencies.

The most important thing is to ensure that your brand guidelines are easily accessible for everyone who needs to use them.

What to include in your brand guidelines

Ideally your brand guidelines should include these elements:

  • An overview of your company and its culture, your brand strategy and your values – ie who you are, where you’re going and how you want to get there.
  • Brand colours, which will generally include the pantone, RGB, Hex and CMYK codes to ensure an identical look across your marketing collateral. This should include the colours within your logo as well as any complementary colours you use.
  • Which fonts to use (which may differ between print and digital), including sizes and if/when to use variations such as italics and bold.
  • How your logo should be used. This could include:
    • Minimum and maximum sizes.
    • Dark and light background versions (if relevant) and any other colour variations allowed.
    • Landscape, portrait and square orientation versions and when to use them.
    • Spacing (padding) required around the logo.
  • Use and positioning of any tagline associated with the logo.
  • Specifications for creating design elements, such as icons, infographics, tables, buttons, etc.
  • The style of photography and videography to use.
  • Tone of voice, or how to speak for your brand. This can include:
    • An overview of how language should be used. Should it be formal or informal? Technical or jargon-free? Contemporary or traditional? Aspirational or down to earth?
    • A library of specific words and phrases which it’s good to use.
    • Grammatical preferences (such as the use of contractions, or the passive vs active voice).
    • Punctuation preferences (for example, do your bulleted lists start with capital letters, have full stops, commas?)
    • How the tone of voice might differ between communication channels (technical documents might sound very different to social media posts).
    • Examples of how to write for your brand, explaining what is good about each one.

In creating your brand guidelines it can be useful to include what is not acceptable, for example changing the aspect ratio of your logo or using slang terms in copywriting.

As well as writing the rules, your brand guidelines should include plenty of illustrations to help guide the reader.

Your brand guidelines may also include templates for commonly used items, such as:

  • Business cards
  • Headed paper
  • Word documents
  • Presentations
  • Video opening/closing images
  • Email signatures
  • Advertising
  • Social media images

Larger organisations may require separate or adapted guidelines for internal company communications.

Examples of brand guidelines

Extracts from our brand guidelines for Fantasy Football Hub and Albion Languages:

Brand guidelines for Fantasy Football Hub.

Brand guidelines for Fantasy Football Hub.

Define your brand guidelines

We help ambitious businesses to align their brands to the type of customers they want. Creating pragmatic brand strategies, eye catching brand identities and effective brand guidelines.

Get in touch to discover how we could benefit your brand and your bottom line.

Pantone Colour of the Year 2022

This year’s colour of the year is PANTONE 17-3938 Very Peri.

About Pantone Colour of the Year

Pantone created a standardised colour system back in the 1960s, enabling designers around the world to talk about colour in the same language.

Each year Pantone looks at global trends and influences to select a single colour which they feel will epitomise the year to come.

Very Peri

We love the positive feel of this year’s purple tone – Very Peri.

As Leatrice Eiseman, Executive Director of the Pantone Colour Institute, puts it:

As we move into a world of unprecedented change, the selection of PANTONE 17-3938 Very Peri brings a novel perspective and vision of the trusted and beloved blue colour family, encompassing the qualities of the blues, yet at the same time with its violet red undertone, PANTONE 17-3938 Very Peri displays a spritely, joyous attitude and dynamic presence that encourages courageous creativity and imaginative expressions.

Will lots of brands suddenly switch to purple?

Purple is an interesting option for a brand identity. It’s a close relative of blue, which is the most popular choice for a brand colour, but it’s most definitely not blue.

Purple is said to be associated with luxury, quality and authenticity.

Cadbury
Cadbury is possibly the best know purple brand, using the colour to symbolise the luxurious feel of its chocolate.

It’s also a popular colour with some tech brands, think Yahoo and Twitch for example.

Yahoo!

It’ll be interesting to see how much this decision influences marketing, or the wider world, over the coming year.

Seeking a purple patch for your brand?

We can help

Look back at the Pantone colour of the year 2021.

Pantone Colour of the Year 2021

This year’s Pantone Colour of the Year is PANTONE 17-5104 Ultimate Gray + PANTONE 13-0647 Illuminating.

About Pantone

Pantone revolutionised the world of graphic design when, back in 1963, they introduced the Pantone Matching System to catalogue colours.

This created a colour standard which allowed designers across the world to communicate in the same language.

Pantone Colour of the Year

Since 2000 Pantone have analysed trends and influences in the world of design to select a single colour to represent the zeitgeist of each year.

What this year’s colours mean

This year’s colours combine the practicality of grey with the positivity of yellow. Leatrice Eiseman, Executive Director of the Pantone Colour Institute, explains:

“The union of an enduring Ultimate Gray with the vibrant yellow Illuminating expresses a message of positivity supported by fortitude. Practical and rock solid but at the same time warming and optimistic, this is a colour combination that gives us resilience and hope. We need to feel encouraged and uplifted; this is essential to the human spirit.”

This is all very nice, but what does it mean in the real world?

To be honest, the Pantone Colour of the Year is really about promoting the Pantone brand.

But it does also remind us of the importance of colour and the impact it has on creating the right (or wrong) identity for your business.

The bright, happy, energetic feel of yellow works well for brands who want their identity to reflect these traits. This can be particularly beneficial if targeting younger generations, think Chupa Chups lollies or MTV.

Meanwhile, the more conservative tones of grey are understated and inoffensive. Hence grey is a popular choice for brands seeking to appeal to the widest audiences, such as Apple.

 

The colour psychology behind your brand

If you’re keen to know more, here’s an insightful article from canva.com about colour psychology and big brands. Can you guess which colour doesn’t feature at all in the logos of the Fortune 500 companies?

Colour is just one aspect of your brand identity.

Our work looks at the full spectrum of your brand, what it means to your clients and how it can be developed to grow your business.

Contact us to discuss improving your brand identity

Get in touch

How to create a website design brief – download your free template

So, you’ve been asked to create a website design brief.

This guide, How to Create a Website Design Brief, together with our free downloadable Website Design Brief template, will help you understand the process from the point of view of the agency or web designer, so you know what to include and how much detail to provide.

We’ve broken the guide down into sections to make it a bit more manageable. There are 14 sections in total.

Have a read through this guide first, then

Download your free website design brief template

Download

Why a good website design brief is important

If you’ve got to this point, you’ve already established that you need a new website, and given some thought as to what sort of website you need.

The next step is to make contact with the right people to work with you on the project to design and build the website you need. These people might come in all sorts of shapes and sizes; from freelancers and one-man-bands to small or large creative agencies.

Whoever you decide to approach, you’ll get a better, clearer response from them if you can give them a good website design brief.

A good website brief tells the designer everything they need to know to give you an accurate quotation for the project.

You should certainly expect a good web agency to give you guidance or ideas that add value to the project, and you should always have a detailed consultation period before any work gets underway, but by following this guide you can tell them everything they need to know about your business/organisation so they can give you an accurate quote.

Creating a brief for a brand project? Read our post How to create a brand design brief and download your free template.

What you should include in a good website design brief

Let’s take a look at the different sections you should include in your brief;

About you

First of all, the agency needs to know a bit about your company to understand the background to the project and get an idea of what you do. In this section, try and include:

  1. Basic company information – the company name and website address
  2. What you do – try and sum this up in one or sentences
  3. When the company was established – don’t worry about an exact date, but it’s useful to know if you’ve been trading for 2 years or 20
  4. A brief history charting key changes of direction – if you started doing one thing, then moved into new markets, this is useful to know
  5. Where you’re based
  6. How many staff work for the business
  7. Annual turnover – this is the quickest way to get an idea of the scale of your operation
  8. The short and long term goals of the business – try and keep this to one or two sentences. For example “We want to increase our sales by 50% in two years, aiming for a 20% increase after the first 12 months.”

Aims of the project

A good web agency will design a website that helps you achieve your business goals, so it’s important they understand what your aims are. The more specific you can be here, the better.

  1. Why do you want a website? Sum up in one sentence what you’re hoping the website can do for you
  2. What needs to be achieved for you to consider the project to be a success? This could be a specific volume of sales or an increase in website traffic, or conversely you may be looking to save money through efficiencies. What targets do you want to set?

Download your free website design brief template

Download

Target audience/markets

The new website needs to be designed for your customers, so the web company needs to understand as much as possible about who your customers are. Include all the following points that are relevant to you:

  1. What specific industry sectors do you work in?
  2. Geographically, where are your customers based? Are they local to you? How local? Within 10 miles, an hour by car? Are they nationwide, or even global?
  3. What does your existing customer base look like? Try to sum up in a couple of sentences who you work with at the moment
  4. What would you like your customer base to look like? Is it simply “more of the same”, or would you like to get more of a particular type of customer?
  5. Describe your ideal customer – this could obviously be more than one type, but try to keep it to just two or three – the aim is to give the web company a bit of a steer as to the direction you want to go in
  6. Who are your three main competitors? These could be existing competitors or those you would like to become competitors. Give the company name and website address for each
  7. When they land on your website, what do you want your customer to do? What’s the end game? Do you want them to buy something through the website, or make an enquiry? Maybe you want them to subscribe to a service. List out the thing(s) you want the customer to do.

Don't know who your target audience is? Find out with a Discovery session

Find out more

The current website

If you have a website already, knowing a bit more about it can help the web company understand where you want to go with the new one. Obviously if this is your first website, you can skip this bit.

  1. When was the current website built?
  2. How much traffic does it get? Log in to your Google Analytics (if it’s set up) and take a look at the number of Sessions per month. An average over a year or two is as much detail as we need
  3. What devices are people using to visit the current site? It can be useful to know whether there’s a particularly high percentage of users viewing your site on mobiles or tablets. Check your Google Analytics for the percentages over the last year or so
  4. How many sales or enquiries does the current site generate per week/month? How do you feel about it?
  5. What’s wrong with the current site? What don’t you like about it, what’s annoying, what could be better?
  6. What’s good about the current site? What do you like, what works well?
  7. How well does the existing website reflect your brand? Do you feel it represents you well? If not, why not?
  8. What’s being re-used from the current site, and what’s being chucked out? Are there bits that absolutely must stay?

The more the web company knows about why your existing website isn’t working, the better, so include anything else you feel is relevant.

The new website

Now you need to focus on what you need from the new website.

In a previous post, we explored the different types of website, and the list of potential features is too long to include again here, but you should consider the following:

  1. What are the aims of the new site? This provides more detail on the earlier question of the Aims of the Project. Some aims we often discuss with our clients are:
  • To increase traffic to the website
  • To raise the brand profile of the company/organisation
  • To generate enquiries/sales
  • To move into new markets
  • To attract the best new recruits

What’s the approximate size of the website? Typically this is expressed as an approximate number of pages

What are the key features you want/need to include? Some features we often talk about are:

  • Portfolio/Case Studies/Gallery of previous work
  • Ecommerce (include an approximate number of products, and any ecommerce-specific features you want to include)
  • Events calendar
  • Online bookings
  • Listings (properties, cars, jobs)
  • Interactive map
  • Filters, to help users find specific information
  • Members-only areas – content that can only be accessed via a secure login
  • Blog or News section
  • Social Media integration – a Twitter or Facebook feed, for example
  • Discussion Forum
  • Current Vacancies

What content needs to be updated frequently, and who do you see doing it? Do you have the resources and skills in-house for someone to make changes using a Content Management System (CMS) or would you prefer the web agency to look after any changes for you?

  • If you want a CMS, are there any specific requirements (for instance, allowing access to multiple users)?
  • What’s the website’s Call to Action? (also known as a CTA). This adds more detail to the earlier question about what you want the customer to do when they visit your site. If you want to generate enquiries, do you want them to fill in a contact form, send you an email, or pick up the phone to talk to you?
  • Are there any third party systems you need to integrate with? If you’re an Estate Agent, do you need to link in  to RightMove or Zoopla? Do you need to link to a CRM or Accounts software?
  • Does the website need to be available in other languages, and if so, who’ll be doing the translations?

Download your free website design brief template

Download

Future developments

In order to deliver the best return on your investment, your website should be future-proofed as much as possible. If you can help the web agency look further down the road, they can make your new website work harder for longer.

  1. What future plans does the business have that need to be taken into consideration at this point?
  2. Will you want to add ecommerce or one of the other features listed above? Maybe there are some features on your wishlist that you don’t have the budget for right now
  3. How does the website need to cope as new content’s added? What happens when, in two years’ time, you”ve got five times the blog posts you do now?

Content

Start thinking about the content for the new website as early as possible.

  1. What copy have you got already? It’s tempting to just move all your existing content across to the new site. We strongly urge you not to do this. If your current site’s no longer up to scratch, a big part of this might be because the content needs to be overhauled
  2. Do you need a content audit? We suggest taking the time to review all the content on the current site. Some of it will probably stay, or form the basis for the new content, but a lot of it will need to go, or be restructured
  3. What new copy needs to be written? And who’s going to do it? Do you have the resources in-house to not only do it (copywriting can take up a lot of time), but to do it properly? We frequently see clients spending a big budget on a new website, only for it to be let down because there’s been no investment in proper copywriting
  4. What images do you need, and what have you got? Poor images can undermine even the most beautiful website. Consider employing a professional photographer to take the exact pictures you need
  5. Have you got the right quality video clips or other assets that you need, such as graphics or downloadable documents?
If there’s one thing you can do to help make your web project run smoothly, it’s to get your content sorted early.

Design brief

The web company needs to have an initial design brief to understand the direction you want to go in. The best web agencies work closely with their client in the early stages of the project to define the brief fully, but this gives them a good starting point.

  1. List 5 words to describe your company
  2. What are your USPs? What sets you part from the competition? Why should a customer come to you instead of someone else?
  3. Provide a bullet list to describe your company values
  4. Provide any other brand collateral you might have – the website needs to fit with the rest of your brand material, so it’s useful to provide examples of things like business stationery and any brochures you might have
  5. Reference websites – provide 3-5 examples of websites you either like or those of your competitors. Note any aspects about the sites that you either like or dislike, being careful to be objective and put yourself in your customer’s shoes. Remember to avoid one of the most common mistakes when creating a website design brief; a good website isn’t going to be designed for you – it’s going to be designed for your target audience

Marketing

To get the most from your new website, it should work alongside your other marketing activities, both online and offline. To deliver a website as part of a properly joined-up campaign, your web agency needs to know what else you’ve got going on. Tell them about:

Digital marketing – what other online activity will you be doing?

  • SEO (Search Engine Optimisation)
  • PPC/Google Ads
  • Social media (if so, which platforms are you active on?)
  • Email marketing – is this something that needs to be included as part of the project?
  • Content marketing

Offline marketing – what other traditional marketing are you involved in?

  • Direct mail campaigns
  • Brochures, flyers, leaflets
  • Outdoor advertising
  • PR campaign
  • Sponsorship
  • Vehicle livery
  • Is the website project part of a rebrand? Is the rebrand part of this project – do you need the design agency to quote for this too?

Don't know whether you need a rebrand? Find out with a Discovery session

Find out more

Budget and timescales

Don’t be in any doubt; providing a budget is extremely important.

Agencies can propose the right solutions for your circumstances, and you’ll be able to compare responses on a like-for-like basis.

Timescales are also important to know from the start – if your deadlines can’t be met by the agency, it saves everyone time if they know up front. In your website design brief, be sure to include:

Timescales – provide both your ideal start and finish date. Have you got a specific deadline to work to (perhaps a product launch or another marketing commitment)? If you’re not sure how to work out timescales, or don’t know what’s realistic, here’s a rough guide as to what to allow for each stage:

  • Planning and specification – 2-3 weeks
  • Design phase – 3-4 weeks
  • Development phase – 3-4 weeks
  • Content population and initial testing – 2-3 weeks
  • Final snagging and pre-launch testing – 2-3 weeks

Budget, for:

  • Initial site design and development
  • Web hosting
  • Ongoing support and maintenance
  • Ongoing digital marketing

Maintenance

This is often overlooked in a website design brief, but is actually very important. Any good website needs to be maintained to some level, otherwise it will go stale and won’t fulfil its potential.

  1. Who’s going to be responsible for updating the site – will you do it in-house, or would you prefer to outsource it all to the web agency? Consider whether you have the skills and resources to do it properly; oh, and what happens if that person leaves the company?
  2. What needs updating frequently? These might be the updates that it makes sense for you to do yourselves using a CMS. Less frequent changes, or changes requiring creative input might be better carried out by the design agency
  3. How much input will you need from the web agency and how often?

Download your free website design brief template

Download

Technical

Outline the key technical considerations for the project.

    1. Is web hosting required? Do you have specific requirements from an SLA (Service Level Agreement) regarding back-ups, guaranteed up-time etc.
    2. What domain name’s being used for the new site?
    3. Do you require email as part of the project? Bear in mind that changing email providers is fraught with danger – it it ain’t broke, don’t fix it
    4. Do you have any particular requirements or preference for the platform used to build the website? This is usually a consideration if members of staff are trained on a particular system and you want to stick to it, but unless you have a specific need, we suggest letting the web company come back to you with their recommendation

  1. If your project’s for an ecommerce website, do you have your payment provider set up? This can take several weeks or months to sort out, so if you haven’t got started already, now’s the time to get the ball rolling
  2. Do you have any special technical requirements? Maybe you require a particularly high level of accessibility or know that your users are likely to be using very slow connections
If you haven’t got your online payments provider sorted already, now’s the time to get the ball rolling.

Contact points

It’s a good idea to have worked out who in your organisation needs to be involved with the project and who’s doing what.

You need to decide:

  1. Who needs to be involved in the project
  2. Who will be the main point of contact
  3. Who’ll be responsible for collating content
  4. Who needs to be involved in sign off at each stage
  5. Who will be updating the site

Next steps – what you need from the agency

Finish your website design brief with a short summary of what you want to get back from the design agency.

At Tomango, we usually provide a written proposal, outlining our intended approach from a creative and technical point of view, the costs (for both the initial website build and any ongoing fees), timescales and any assumptions we’ve made.

When you’re completing this section, remember to include:

  1. What you want from the agency (proposal, tender, outline quote, examples etc.) and when you want it
  2. Who they should send it to
  3. How you can be contacted if there are any questions

Write your website design brief

Save time creating your website design brief by downloading our template. Our example’s based on a fictional company that needs a brochure website, so some sections might not be relevant to your project, but the format’s the same and it should save you a lot of thinking time.

Download your free website design brief template

Download

Good luck with your website design brief, and don’t forget to include Tomango on your list of agencies to quote for your project ;o)

Should you use a marketing agency or freelancer?

Over the past year or so I’ve been heavily involved in the project/studio management at Tomango working on various branding, website, and marketing projects. This work requires managing multiple projects, clients, and third parties like freelancers on a daily basis.

Working with a freelancer

Some of these projects have seen us work with freelancers; either ones that we’ve brought onto a project to bridge a skills gap or ones that the client has already built a relationship with and wants to use for a particular part of the project.

While working on these projects, I’ve been able to gain great insight into both the benefits and disadvantages of using a freelancer for the creation of your brand, website or digital marketing.

If you’re not sure whether to use an agency or a freelancer for your project, I’ve listed a few things to consider to help you make a decision.

DISCLAIMER: This is by all means not an article about dismissing the use of freelancers; there are many very talented individuals out there who will be more than capable of tackling your project and giving you a great end result, this is more to question about which route is best for you and your business!

1. Budget

This is the main one.

There’s no way of getting away from it – using a freelancer will be cheaper (on paper) than using an agency. However — there are hidden costs to consider when opting to go down this route!

Let me explain, using a different sort of freelancer as an example.

I’ve recently completed a major renovation on my house, and — mainly due to budget constraints — I decided to manage the individual trades myself rather than instructing a single contractor to carry out the work.

This undoubtedly saved me money. However…it took far longer to complete than I thought. THIRTEEN months to be precise. It also took up all of my spare time, and with a young family, there wasn’t much to begin with!

Using freelancers will take longer and require more of your own time and input

At Tomango, I have the privilege of working closely with a number of different clients on a daily basis. Some decide to use all of our services, but there will always be some who prefer to carry on using their current copywriter, photographer, designer or developer.

We always try to accommodate the needs of our clients when working on a project, however, there’s no getting away from the fact that the project will take longer and require more of your own time and input in managing the different disciplines – which in turn will take you away from the day to day running of your business.

It’s probably better to only be pulled in one direction than two, three or more!

2. Planning

For us, getting a solid plan in place is such an important part of a project — especially when it comes to creating a website.

If we’re working with you, before we even think about writing the first line of code, we need to understand what you’re trying to achieve. We work closely with you to develop a brief, which leads to the creation of a project plan, which forms the foundations of the project.

“You know what they say; fail to plan, plan to fail”

If you decide to use a freelancer, you’ll probably need to create the brief yourself. This can take time; first for you to get your head around exactly what you want, and then to make sure you’re communicating this in a clear and comprehensive manner to a freelancer.

FYI if you’re unsure where to start with a website design brief, take a look at Mark’s article on how to create a website design brief, you’ll also find a handy template that has already been tens of thousands of people!

3. Knowledge

There are many freelancers that claim they’re a one-stop-shop, able to design and develop for the web, and also have experience with digital marketing. All I would say here is to be wary!

At Tomango, I’m lucky to be able to work closely with people that have chosen to specialise in one of these areas and as a result have gained valuable experience and knowledge in their chosen field. Every day, I see how having people that are actual experts, rather than a ‘jack of all trades’, can make a huge difference to a finished project.

4. Support

Tomango will be six this year, and we’re planning on being around for many more years to come. On the flip-side, there are a few freelancers that I’ve come into contact with recently that have decided that going it alone isn’t for them any more and are looking to return to a permanent role.

If you’re faced with this situation, you might be left with a website with no support or, even worse, an unfinished project.

Either way, it’s then going to take you time and possibly further money to find someone else. What happens if your freelancer takes a well-earned break and whilst they’re off your website/emails go down? You might need a plan B!

From time to time you might require additional support. If you work with Tomango, we’ll always try and respond to your queries in a timely manner and keep you updated on the progress – no support tickets here!

How we can help – whichever decision you make

If after reading this article you feel that using a freelancer is your preferred option, then please feel free to get in touch. I have a number of freelancers that I can happily recommend, however, if you would like to find out more about our services and how we can help grow your business, get in contact via our contact page or call us on 01273 814019.

Big brand impact from a brochure

With the new website now live, we continued the brand rollout for the Concept Tag with the creation of a new brochure for Agon Systems.

The brochure was created to promote the Concept Tag; the “World’s most secure EAS Tag”. This revolutionary new product from Agon Systems eliminates illicit tag removal and is proven to reduce losses by 66%.

Detailed brief

By obtaining a detailed brief from the client it became clear the brochure had to reinforce the key values of the product; quality, reliability and durability. This was achieved by the use of strong typography, engaging copy, high impact images and the final print finish.

The finish

It was agreed the brochure was going to be finished in a matte lamination.  Lamination adds a layer of protective coating to the printed surface whilst also improving its sturdiness and water resistance. Lamination also has the added benefit of improving the tactile feel of the printed surface, lending it a smooth finish.  Matte lamination creates a very luxurious and elegant finish to any printed materials.

Another crucial aspect of creating a quality experience for the recipient is the density of the paper. Paper density refers to the thickness of the paper stock and is measured in GSM (grams per square metre). Due to the high quality look and feel we wanted, we decided on using a board thickness of 350 GSM.

To ensure the best possible finish was achieved we not only designed the brochure but also created the copy, art directed the photo shoot and managed the printing. This ensured the highest quality of all the elements we needed to bring together to deliver such a great result.

Part of a wider marketing portfolio

This is just one of the items of marketing collateral we’ve created for Agon Systems. Other items include stationery, product sheets, leaflets, signage, artwork for exhibition stands just to name a few.

Next steps

If you like what we’ve done with this brochure and would like us to help you with yours, call Mike or Mark on 01273 814019 or get in touch using our contact form.

Why we use InVision

For the past six months we’ve been using a website called InVision – a prototyping and collaboration tool. The concept is simple – upload the designs, share with the client and they then leave feedback.

Before InVision: a long process

Before we started using InVision it seemed to be a long process in reaching a final design. This used to involve a large number of emails and telephone conversations back and forth, with the client having to explain where and what they required changing. Using the note tool, the client can add a pin to the exact area they want to change which allows us to quickly pin point what part of the design they are talking about.

Boards

Another key feature are ‘Boards’; these provide organisational tools for creating context around a project for presentations, asset management, and more. Layout options allow you to create visual hierarchy for ideas.

Boards also allow commenting and downloading, bringing the design process together into a familiar, central location. Plus, you can share your Boards with clients and other team members.

Several integrations

InVision can easily be integrated with Dropbox and project management tools such as Slack and Trello. We use Dropbox as a backup just in case files are accidentally deleted from the InVision app.

Needless to say, we’re having fun using InVision and we can’t wait to see what new features are rolled out in the coming months.

Working with Tomango

Do you need help with your branding and design? Chat to the team today and explore how Tomango can help.

How to create a website design brief – common mistakes to avoid

Creating a website design brief is a vital part of any web project.  By focusing on the aims of the project and who your target audience is, you make sure you stay on track and get an end product that provides a much bigger return on investment (ROI).

But…

We’ve seen several common mistakes made during the project brief stage that you should be careful to avoid.  True, some of these border on the comical – but some of them are very easy traps to fall into.  By avoiding them, you’ll dodge making a costly mistake.

1. Designing for yourself, not your customers

This is the most common mistake of all.  I’ve lost count of the number of times a prospective client presents a brief (or is talking about it) and says something like “I really like the – choose one from Aston Martin/Rolex/Apple – website.  Ours should look something like that”, forgetting for a moment that their own customers are the polar opposites of these brands’ target markets.

Don’t design your website for your Managing Director.  Design it for your customer.

In the worst cases, this can turn into little more than an ego-trip – something for the MD to show off to his friends at the golf club.  AVOID AT ALL COSTS.

You must be brave.  You must put your own personal tastes to one side and put yourself in your customer’s shoes.  What will they expect/want to see?  What will reinforce your brand values and get your message across?   How can the design encourage them to buy from you?

My own difficult experience

I can speak from first hand experience about how hard this can be.  When I was first shown the concept for the Tomango brand identity, we encountered a potential flashpoint about colours.  The fact is – for childish reasons relating to the football team I support – I HATE RED.  Always have, probably always will.  My initial reaction to the colours being put forward for Tomango was one of complete revulsion, but I quickly realise that this was, frankly, pathetic.  The logic and rationale for using these colours was completely sound and I decided to put my personal feelings to one side and put faith in the design.  It was what our customers would want to see – my tastes didn’t matter.  Because I managed to get over myself and put our customers first, we got a much better end result.  The same applies to the design of your website.

2. Trying to be like Amazon/Facebook/Google

At some point back in 2010, I met an interesting lady called Pam (not her real name) who wanted to discuss some “ideas for websites”.  Mentally quietening the alarm bells that started ringing in my head, we had a civilised-but-not-particularly-productive chat about some of her ideas, most of which were rubbish.  And then, just as it seemed we were nearly done…

Her: “So tell me – what would it cost to build something like Facebook?”

Me: “Erm…”

Worryingly, this isn’t the only time this has happened to me (although not specifically about Facebook).  Often I see a website design brief that will include a legend such as “Search facility required – like Google” or “Related products must be shown, like you get on Amazon”.

Concentrate on your website’s core features and make them work well.

Firstly, do you really need this level of functionality?  Unless your site deals with massive amounts of data/orders/users, you probably don’t need to go that far – especially in the early stages of the website’s life.  Concentrate on your site’s core features and do them well.  You can always add to them or develop them later, when a need has been established, and when the website is starting to become viable.

Secondly, be aware how much time, money and resources have gone into the development of these huge sites.  Years of research and analysis, millions of dollars, and teams of scores – if not hundreds – of highly talented designers and developers work on these projects.  That might just be a little out of your budget.

3. “Let’s make it different”

There is a Danish man called Jakob Nielsen who, for those of you that don’t know a great deal about the web, is THE guru on usability – i.e. making websites easy to use.  What this guy doesn’t know about web usability you could write on the back of a very tiny postage stamp.

Jakob’s Law of the Web User Experience states that “users spend most of their time on other websites.“  What he means is that your users form their expectations for your site based on what’s commonly done on most other sites and if you deviate, your site will be harder to use.

Consistency is one of the most powerful usability principles
Jakob Nielsen

You see, consistency is good.  It’s one of the most powerful usability principles; when things always behave the same, users don’t have to worry about what will happen.  This increases their confidence in using your site, which means they’ll like it more.

Recognise these conventions and stick to them.  Don’t be different for the sake of it.  Unless you want to lose as many users as possible, of course.

4. Everything must sit above the fold

Here’s a very common misconception that threatens to undermine the entire design of your website.  And it drives web designers absolutely nuts.

Above the fold – a graphic design concept that refers to the location of an important news story or a visually appealing photograph on the upper half of the front page of a newspaper.

When referring to web design, “Above the Fold” refers to the part of the page the user sees when they first land on it, without needing to scroll.

Misleading statistics

The problem usually starts with this often-cited statistic, from our erstwhile friend Jakob Nielsen, back in 2010; 80% of users spend their time above the fold, and only 20% go below the fold. Holy Moly! We’ve got to keep everything above the fold, right?  Well, hold on just a sec…

This stat’s a bit misleading because most of the time the navigation and search is at the top of a page, so when you get to a website, the first thing you most often look for is the menu, which is why the stats are so heavily skewed.

But when people get to the page they’re looking for (and if they found you from a search, this might be the first page they’ve landed on), they will scroll.  And scroll, and scroll.  Be sure of this fact: everyone knows how to scroll.

So although it’s still important to put certain things above the fold (see point 3 about conventions within web design) don’t feel you have to try and cram everything in there.  Maintaining white space, telling a story and encouraging your users to scroll down is actually more engaging and in some cases will result in more sales.

It’s not just our point of view either:

Life Below 600 pixels Why “The Fold” is a myth – and where to put your call to action

5. Opening new browser windows

Time and time again we see this on a website design brief: “All external links must open in a new browser window”.  Why?  The thinking is that by forcing a new window or tab to open, no-one actually leaves the client’s website, because it will remain open in the original window.

We’re yet to see a compelling argument to back this up, but can think of plenty of reasons why it’s actually a bad idea that you should avoid.

If you don’t trust in your own website to be interesting enough for a user to go back to, that sends out a pretty negative message, no?

Firstly, many people still don’t use tabs when browsing multiple sites.  Those that do would surely like to be the one in control of it – that’s just plain politeness.  Secondly, many users might not realise that a new window has been opened, leaving them confused by a greyed out Back button.  Thirdly, using the Back button is probably the first (or maybe second, at a push) thing that a user learns when they start using the web.  This is the way most people will normally get back to previous sites.  Finally, it’s about trust – if you don’t trust in your own website to be good enough or interesting enough for a user to go back to, that sends out a pretty negative message.

A guide to creating a website design brief

So we’ve covered some common things to avoid when putting together your website design brief, but how do you go about putting together a good one?

The key things to make sure you cover in your brief are:

1. An introduction

It’s useful for the website designer to know a bit of background.  Include a paragraph or two about your company and what you do, what you sell etc.

2. Your current site

Make sure you cover when it was built, how much traffic it gets at the moment, what’s good and bad about it and what frustrates you about using it.

3. The new website

Outline the aims of the site and how it fits in with the overall aims of the business.  Is it to attract more traffic and sales, or to communicate better with existing customers?  Is it there to support other marketing activities? Do you want to sell through the website (via ecommerce)?  Who is the target audience?  Maybe this has changed, or you’re aiming to reach a new market.

4. Reference websites

Listing some competitors’ websites can be useful – together with some notes as to what you feel is good or bad about them (remembering to look at this from your customer’s point of view – see point 1 in our Common Mistakes list above).

5. Budget

Outlining your budget is important.  You’ll get better and more accurate quotes from everyone if they’re all working to the same brief and know what the budget is.  What’s the budget for the design and development of the website?  Do you have a budget for ongoing online marketing?  What about ongoing support and maintenance?

6. Website content

Resist the urge to just copy and paste your content from your old site to the new one.  A well-planned website project should consider the entire structure of the site, including what content is going on which pages.  Who will write the content?  Do you need the web agency to do this?  Oh, and one other thing – don’t wait til the last minute to do the content – start it now.

7. Technical stuff

Do you have an existing domain name that you need to use?  Where is this managed – can the web agency have access to it to manage the go-live process?  Is your site likely to be targeting people with special needs or requirements like limited mobility or visual impairment?  What proportion of your new site’s users are likely to be using mobiles and tablets?

8. Maintenance

Who will be responsible for the ongoing maintenance of the site?  Will you be doing it in-house?  Will you need training on using a new system?  How many people might this need to include?  Would you prefer your web designer to handle updates on your behalf?

Next steps

We can help with all aspects of your website, from your early website design brief to finished product. Get in touch today to discuss more.