But what does it look like?

You’ve got all of the information you need to put your project together – now you have to figure out what it’ll look like. That’s where the Design stage comes in.

All the work you’ve done on the definition of the project now bears fruit. Depending on what type of project you’re working on though determines what happens next.

I’m going to use the example of a website as it’ll be easy to follow, but frequently you’ll have a mix of deliverables, maybe an email campaign, banners and a website at the same time.

A common problem of web site builds is that the designer wants to create a site layout around content that you don’t have yet. It would make sense, then, to get the copy written to design around, but then your copywriter will tell you they need to know how much copy they’re going to need to write and how it fits in the site, needing the design first.

The way out of this chicken and egg situation is one that is often missed out of good web site design, even in large marketing agencies: Information Architecture.

A good Information Architect can help not only improve the way that your site works but also reduce the time your designer and copywriter need to spend adding their magic to the project.

Your Functional Specification is key to everything in the Design stage, but before your designer or copywriter gets their hands on their computers you will need to have all of these:

• Site map
• User journey
• Wireframes

These documents, the Information Architecture, will give the copywriter and designer everything they need to hang their work off of. The sitemap will show them how many pages there will be, the relationships between the pages work, and an indication of the kinds of pages needed. The user journey will inform them of the route the users will be able to take through the site, and in some cases document how specific tasks will be performed. Last and not least the wireframes will show the relationships of the navigation tools and content, and often the annotation of the wireframes will also define recommended copy lengths, either in  word or character counts.

The IA documents are the starting point for the site design, but that’s not to say that the Information Architect dictates the look and feel of the site.

N.B. It’s worth noting at this point that Information Architect and Information Architecture both abbreviate to IA. You’ll often get to a situation where you’ll need to be clear about which one you’re referring to, so when talking about the Architects output you talk about the specific item (wire frames, user journeys, etc.) or to refer to them collectively as User Experience (or UX).

In larger projects you may actually have an Information Architect and a User Experience Architect, an IA and UA, with the former being responsible for the structure of the safe navigation to the information and the UA specifying the user interface specifications. For most jobs, though, an IA will do both roles.

Once the IA has produced the first draft of their work it needs to be reviewed not only by the IA, PM and Client Services representative but also by the designer and developer (front and, back end and multimedia if that’s how your team is formed.).

The input of the whole team is really useful at this point as it allows ideas to be exchanged that could lead to innovation and over-delivery within the time and cost of the project.

This is also the time of which every individual commits to a common vision of the project deliverables; after all you don’t want your designers putting together something that the developers aren’t going to agree to build.

Within one or two rounds of review you should be able to not only agree how the site will work overall, but also details of the individual components that make up the page.

Once agreed internally the IAs work should be shared with the client. Often they won’t understand the diagrams they’re shown so clear annotation with reference to the Functional Specification are essential.

The client will have an opportunity to add their voice ideas and reinforce the requirements at this review stage, possibly triggering another round of amends before finally settling on the structure of the site and its layout.

Graphic Design now becomes the focus of the delivery effort, with your digital designer taking their lead from the wireframes to produce clear and attractive page designs. A good designer will take about half the time your IA took to define the UX documents, at least to a first draft, and a quick review of the design by the same review team as before should highlight any issues or shortfalls in the designer’s interpretation of the user experience.

There’ll almost definitely be a round of amends and another review before passing the designs on to the Client fro their review and the inevitable changes that they request.

Now here’s a bone of contention – the copy writing.

I’m a big fan of making sure the page wireframes are designed to accommodate long and short content, especially text, as it allows you to deliver standard page templates within which the copy can be flowed, however there are always occasions where the copy has to be written at the same time as the designer is committing pixels.

You’ll often here designers bemoaning the fact that they don’t know how far to go with the page designs as they don’t know how long the copy will be. This is absolute tosh. Using “greeked” text (lorem ipsum to the rest of us) they should be able to test their designs with both short and long copy amounts, even if the content doesn’t make sense. If they can’t be bothered to type this all out themselves then make sure they take advantage of Lipsum.org, a website that’ll generate as much “greeked” text as they want. However, with pages where the content is unlikely to change frequently, if at all, you might as well get the copy writer on the case, producing the words that will be so important to the success of the website.

Don’t forget they’re not just providing the body copy – they’ll also be responsible for the page titles, form field names, instructional copy for forms and navigation – basically any and all written content on the site.

Again the copy writer will take their lead from the IA’s work in terms of understanding how many words they should produce, however they’ll take their creative lead from the brief and may even use existing Client literature or web copy as the basis for the new text.

Where you have a designer and copy writer working in parallel there are obvious opportunities to try the whole package together – user experience, graphic design and the text. This is basically prototyping the design and is great if you have the time or budget.

Assuming this isn’t the case, as with a majority of web sites, your copy writer will generally start work after the first Client review of the design. This is so the copy writer understands the boundaries they’re working in and the visual context too.

They may recommend adding images into the content too, to illustrate the topic being covered. This is something you’ll need the designer’s input on, possibly getting them to find and select appropriate imagery from Client image libraries or stock photography.

You should reach the point where you have draft copy and a concept design that can be shared with the Client for feedback – the feedback which will let you move on to the Develop part of the project.

Share/Bookmark