Design Process. How the work gets done.

Brief

Hooray! You contact us and brief us on your requirements. The brief is your statement telling us clearly and precisely what the design needs to achieve. The importance of having a proper brief from the outset cannot be overstated; it is is the key information that we will refer to throughout the design process to ensure that we’re doing what you have asked us to do. See our FAQs for more about why a good design brief is so important.

At some point (no later than the Proposal stage, see below) the brief will need to be formalised in writing. We can do that for you if necessary, but we would honestly say that a brief is always better if originated by the client. If you are not sure quite what a design brief should contain or how to go about writing one, the following links might prove to be of assistance:

• The Design Council: How to write a design brief
• Jacob Cass: How To Write An Effective Design Brief
• David Airey: How do you write a design brief?

Consultation

An informal face-to-face chat (geography permitting), although it can be done over the phone or by email if a meeting is not possible. We will ask questions to get as good an understanding as possible about your business. How many questions will depend largely upon the quality of the design brief submitted previously (see above).

This Q&A process is also known as a Needs Analysis.

Proposal

Based upon the brief, the consultation and our understanding of your requirements, Shark Attack will put together a written proposal, together with cost estimation and approximate timeframe. This will explain how we intend to meet (and exceed!) the project requirements, and to highlight the various ways in which we think our proposal represents good value for your business. This is presented to you, the client, and might take the form of a simple written document or of a pitched presentation, depending upon the nature of the project.

The proposal does not include ‘mock-ups’ or other such creative work.

Agreement

You (hopefully!) accept the proposal and contracts are signed. At this point we ask you to make the required downpayment on the cost of the project. This is typically 50%, although for very large projects this can vary (see the FAQs page for further details).

Work cannot commence until contracts are signed and the initial payment has been received.

Research

We conduct further research into your business, your competitors, and your market in order to better address your requirements.

Initial Designs

Working to a combination of the Brief, our more in-depth discussions and the results of the research phase, initial designs will be worked up. This is itself a multi-stage process, which can be sumarised as:

1. Concept Sketches

   Initial designs are sketches in a notebook. This allows a complete freedom of ideas in the early stages. Typically dozens of sketches will be generated and refined, although the majority will later be discarded and only a few will progress to software prototyping.

2. Development in software

   The most promising sketches will make the transition into computer software. The most common applications used at Shark Attack are Adobe Illustrator, Adobe Photoshop and Adobe Indesign (depending upon the nature of the project.

3. Initial presentation

   You receive a number of proposed designs for their consideration. Normally between 3 and 5 variations is sufficient, especially if the original design brief has been informative and accurate. Additionally, experience has shown that showing a client a barrow-full of ideas simply makes it harder for them to pick one.

   You can now take some time to consider what the designer has provided and to decide whether you wish to suggest any revisions or other changes.

Revisions

After discussing your feedback with you we now make any revisions needed to the design, submitting them to you for approval in an appropriate format (often email-able jpegs or similar). Revisions are of course included in the original cost estimate, although contracts generally stipulate limiting revisions to a given number of rounds — a policy which benefits both parties, as we explain on our FAQs page.

Once you are happy with the design you ‘sign-off’ on it, ie. you confirm that this is the design that you want.

Final Artwork

With the design signed-off, final artwork will be generated. For logos this will normally mean an EPS file, whilst page layouts will normally be prepared as press-ready PDF files that can be given straight to the printer. Multi-page documents will also require pagination, which is the shuffling of the pages so that they appear in the correct order once the document is printed and bound.

Project Hand-off

When all is ready, we will ask you to make the final payment to ourselves (exact installment details depend upon the scope of the project); if you have requested that Shark Attack arrange printing on your behalf then we shall also require advance payment for the printing costs (for which you will have previously been given comparative estimates).

Once payment is received we’ll send you your artwork files and, if requested as part of the project, the artwork will be sent to the printers.

If assignment of copyright formed part of the contract then you will also receive a letter officially assigning copyright of the artwork to yourselves. This is an important point; many designers never bother with this and so technically retain copyright of the design for themselves.

Print checking

Lastly, if Shark Attack was responsible for getting your designs printed then we shall examine and approve (or reject) printers’ proofs, and arrange delivery of the final printed goods.

Back to tabs

Brief

Kick off! You contact us and brief us on your requirements. The brief is your statement telling us clearly and precisely what the design needs to achieve. The importance of having a proper brief from the outset cannot be overstated; it is is the key information that we will refer to throughout the design process to ensure that we’re doing what you have asked us to do. See our FAQs for more about why a good design brief is so important.

At some point (no later than the Proposal stage, see below) the brief will need to be formalised in writing. We can do that for you if necessary, but we would honestly say that a brief is always better if originated by the client. If you are not sure quite what a design brief should contain or how to go about writing one, the following links might prove to be of assistance:

• The Design Council: How to write a design brief
• Jacob Cass: How To Write An Effective Design Brief
• David Airey: How do you write a design brief?

Consultation

An informal face-to-face chat (geography permitting). This can be done over the phone or by email if a meeting is impossible, but meeting in person is preferable by far. We will ask a lot of questions! This is to get as good an understanding as possible about your business, and about what you are looking to get from your web site. How many questions will depend largely upon the quality of the design brief submitted previously (see above) but web projects always need more than print-based ones because there are so many more aspects to consider.

It might seem tedious, but skimping on this vital preparatory stage is a terrible false economy; skipping an hour-long meeting now might add 100 hours of development time further down the line due to misunderstandings or poorly communicated information.

This Q&A process is also known as a Needs Analysis.

Proposal

Based upon the brief, the needs analysis and our understanding of your requirements, Shark Attack will put together a written proposal, together with cost estimation and approximate timeframe. This will explain how we intend to meet (and exceed!) the project requirements, and to highlight the various ways in which we think our proposal represents excellent value for your business. This is presented to you, the client, and might take the form of a simple written document or of a pitched presentation, depending upon the nature of the project.

The proposal does not include ‘mock-ups’ or other such creative work.

Agreement

You (hopefully!) accept the proposal and contracts are signed. At this point we ask you to make the required downpayment on the cost of the project. This is typically 50%, although for very large projects this can vary (see the FAQs page for further details).

Work cannot commence until contracts are signed and the initial payment has been received.

Concept & Scope

This is the point where we start to get down to the nitty gritty. In discussions between Shark Attack and yourselves, the project is defined based upon the proposal that you accepted. This means being clear about the site’s functionality — what needs to provide to its visitors, what they must be able to accomplish during their visit, what interactivity is to be built in, which browsers it must support as a minimum, whether it is a static site or a dynamic one driven by a database and a CMS, or whatever — as well any agreements about ‘concept’ (”it has to have a circus theme!”).

A document is drawn up stating what has been agreed. It is sort of a response to the original Brief and it is equally important; later on both parties can refer to this document and determine whether the designer has addressed all of the issues specified in the Scope, or whether the client has started to request extra functionality that was not part of the original proposal (a very common phenomenon called ‘Scope-creep’).

Research

We conduct further research into your business, your competitors, and your market in order to better address the requirements of your business and your web site.

Content development

Normally this stage and the following stage, IA/Design, progress simultaneously and have a direct bearing upon each other. Information Architecture, for example, should be reasonably well worked out before content development begins, but as content evolves it might require a re-adjustment of the IA.

IA/Design

Design goes through several stages:

1. Information Architecture

   The design of how the content of the site will be arranged and grouped, not visually on the page, but logically within the site as a whole. The Dewey Decimal Classification used by libraries is an example of one kind of information architecture. Hierarchical lists and flowcharts are typical tools used.

2. Wireframes and prototyping

   Wireframes are the most basic of page designs, where content is represented in the most general way simply by blocks on the page. Buttons, scrollbars, menus, are all shown in the most generic way possible, with no colour used. The idea is to see how well the page works at a functional level without being distracted by any actual visual design.

   Prototypes are a way of turning these rough ideas into a testable format, either with paper or with an onscreen clickable form like a PowerPoint presentation.

   These prototypes are then used for early-stage usability testing to see how well the page layout copes with the ‘human element’.

3. Visual design

   This is when the graphical look of the page is created, normally in an application like Adobe Photoshop. These static ‘page images’, in combination with the wireframes and prototypes, give a clear vision of how the designer envisages the site being used.

   It is vital that the design is ‘signed off’ (ie. officially approved) by the client before the development stage of the process as it will be harder to change later on.

Development

This the point where we start to hammer out code and actually build the web site, its templates and, subsequently, individual pages. The code has to be constantly checked for Quality Assurance (QA), eg. cross-browser compatibility, validation, accessibility and web standards compliance.

At the end of the development stage we usually advise clients to invest in some more usability testing. This used to involve having access to a proper usability testing lab, putting it out of the reach of small businesses; thankfully that is no longer the case. At Shark Attack we use Silverback for our usability testing, which means that the process can be carried out for a tiny fraction (perhaps as little as 1%) of the amount that it used to cost.

At the end of the process the site is effectively complete, and we will ask you to sign off on the project, thereby indicating that you are satisfied with it. We will then ask you for the final payment installment prior to uploading the site files to your web server for the site’s launch.

Launch

Files are uploaded to your nominated web server, and a link check is performed to make sure that everything is plumbed in as it should be. Then we shout Hurrah! and everybody has a beer, or something.

Post launch

With the site live we will (optionally) arrange a maintenance plan with yourselves. A few weeks after launch date we like to contact the client and have a bit of a post-mortem to see how it is all working out. There are always lessons to be learnt, after all.

Back to tabs