About PM4Web

The PM4Web blog was born as an outlet to return knowledge back to the web development community. My goal is to share my experiences as a project manager from over the years in a manner which helps you succeed with your own projects.
Showing posts with label graphic design. Show all posts
Showing posts with label graphic design. Show all posts

09 September, 2009

Writing a Design Brief

Questions to ask before undertaking any creative project.

Comedian Chris Rock mused in one of his stand-up shows that "you can drive a car with your feet if you want to; it don't mean it's a good idea!" The same can be said for starting a creative endeavor without first taking down a design brief; you can certainly do it, but that doesn't make it a good idea.

What's a design brief meant to do? The idea behind the design brief process is to tease out what the client has in mind. It's meant to extract the visual communication requirements of the project. Whether it's the creation of a website or a brochure, the questions answered during the process will act as a guide for the development of the end product.

Why is a design brief even needed you may ask, can't we just 'wing it' and see how it turns out? After all, creativity shouldn't be constrained by bureaucratic procedure. This is definitely true, you don't want to apply stringent protocols to a creative endeavor, it can actually stifle the flow of creative juices. That said, a design brief is about moving from a vague idea to something firm that everyone can agree on. It's about moving away from "I'll know what I like when I see it" to a shared sense of the project's purpose.

Should you run into the attitude of "just get on with it", it falls upon you to explain the importance of undertaking the briefing session. Something along these lines should suffice: "the design brief session takes about 15-25 minutes. It needs to be done so I can produce a high quality product for you."

So what does a design brief document look like, and how do you conduct the briefing session? The template I use is a simple Word document about a page and a half long. It consists of 15 questions. There is also a preamble section with a short paragraph describing the document's purpose and another one on why the design brief is needed. On average, the briefing session itself takes about 20-30 minutes to complete. It can be done in the board room or at a cafe, it makes no difference since its an interview-style format.

Let's take a look at some of questions you may want to include in your own design brief document. I should state that this template is best suited to smaller projects, like the creation of a ad for a niche magazine, or the development of a business website presence. It won't cut it for that Coca-Cola campaign you're pitching for. It's simple enough for anyone to use, not just professional graphic designers.

Target audience - You are trying to find out who the material is intended for. You want to know things like the audiences' age, gender ratio, locality (national vs. international), occupation, etc. Why would such information be relevant? Take age for instance, if you were making a business card which is destined to be handed to seniors, it wouldn't be a good idea to use a tiny font on it.

Organization background - you should have a basic understanding of what your client's business does. Getting a brief history of your client's business will give context to the work you are doing.

Communication objectives - what message is are you trying to convey? What feeling or metaphors reflect the spirit of the product or company? For example; is the client going for a corporatey image or something more fun and friendly?

Market positioning - this connects closely to communication objectives. Is the client trying to appear like a big established company or an innovative new-comer? Do they want to appear as an international player or something more exclusive?

Business objectives - what is the client actually trying to do with this piece of marketing material? Is it meant to act as a sales tool, is it meant to encourage inquires, or is it meant to promote brand awareness?

Overall design goals - is the client going for continuity with their existing marketing material or are they trying to establish a new brand or product?

Keywords indicative of the product - this is an opportunity to get some alignment with what your client has in mind. For example; you may ask "what are some words that describe the logo I'm designing for you?", the client may come back with "simple, credible, professional".

Colors - is there a company style guide you need to follow? It could be that the client has some particular colors they wants you to try out. Otherwise, you would state you intend to stick with the existing corporate branding color scheme.

Hierarchy of information - what should grab the audience's attention first? This question is especially relevant for websites. Take a website selling a new product, you would expect the 'call to action' to have a very prominent position on the homepage.

Where to find inspiration - ask the client to show you examples of work similar to the style they want used for the project. With a website, you may ask "can you show me some websites you like?"

Design examples - it’s not enough to just see the examples, you want to find out what the client likes or dislikes about them (e.g. "its a simple design, I like that" or "our competitors website is cluttered with text"). There could be many aspects which appeal to your client, including: color, imagery, typography, atmosphere, etc.

Artwork and content readiness - its best to find out early if things like logos are available in a high-res digital format, or if the copy text is ready. This often serves as a heads-up to the client, letting them know they have work to do as well (i.e. preparing the content for their website). It may also act as a signal to indicate a copywriter is needed on the project.

Time constraints - its vital to know when the work has to be ready. Your client may have an expo coming up which requires brochures to be printed and ready before-hand.

Budget and resource constraints - how much time and money is available for the project? There has to be some kind of alignment between your client's expectations and what you can deliver based on their budget and deadline. You may even find you can't take on the project, better to know this early on than commit to something you can't achieve.

Language to use - should the text appearing in the product be informal, corportey, inspirational, emotive? This may not be relevant to you if a copywriter is involved in the project.

Dilbert, graphic design department rushed

As mentioned earlier, the design brief acts as a guide. It should be looked at periodically at various stages of the project to make sure you're on track. It should also be reviewed when the product is completed, to check that the original objectives of the project have truly been met.

Join RSS FeedSubscribe to RSS Feed.

03 January, 2009

Creating Storyboards for Flash Animations

Fleshing out the sequence of an animation using a storyboard and MS Word.

Why would a project manager or business analyst need to know how to create a storyboard for a Flash animation? You could argue that this is the dominion of a graphic designer or animator, and you would be right. But using storyboards is an effective method for determining the cost of an animation, and certainly budgeting considerations are a responsibility of a project manager.

To begin with, we should have some kind of definition of what a storyboard is. At the most basic level, a storyboard is a series of pictures which map out the sequence of a movie or animation. It’s widely accepted that a functional specification should be produced before any coding occurs, so why wouldn’t you use some form of planning process prior to creating a Flash animation?

Before you say “but I can’t draw. Last time I drew a stick figure, people thought it was a potato”, you need not worry. Artistic skill isn’t as important as you may think, sequence is of greater significance (e.g. first, many camera flashes go off, then the limousine drives up, etc).

The format I use for a storyboard is very basic. This is intentional since it needs to be understood by both graphic designers and clients.

The structure is as follows:

Document Purpose - this is for the benefit of anyone picking up the document for the first time. It’s a brief statement of what the document is about. For example; this document presents a storyboard for the animation appearing on the Blue Widgets website. The idea is to present a series of illustrations in order to help visualize the sequence of the interactive animation.

The Animation - this is where you say what is going to happen in the animation, and in what order. It’s also where the ‘illustration panels’ appear, nothing fancy is required, its enough to put in labeled squares or circles (e.g. a circle with 'client logo' in it, the text 'tag-line', a box with 'button 1' in it, etc).

Below the illustration panel will be a series of bullet points. These describe what is happening in this particular portion of the animation. This is why you label the shapes in the panel, so you have something to refer back to, for instance; ‘the client logo will fade-in gradually’, or ‘the bouncy ball will move across the screen from left to right’.

Storyboard example panel

The bullet points are where the real detail goes, hence why artistic skills aren’t such a big requirement for this style of storyboard (leave the artistic stuff to the experts). The more detail that goes in here the better. You want to make statements about what happens when the user interacts with particular elements of the animation (e.g. when the user places their mouse over the client logo, a yellow glow appears around it and a pleasant chime sound plays once). Timing, or saying how long things will go for is important here (e.g. the slogan text will fade-in over a period of 1.5 seconds). This is also a good place to specify what images, URLs or text will be used on the panel (e.g. when the user clicks the client logo, they will be taken to index.aspx).

As the saying goes, ‘the devil is in the detail’, and this is where the bullet points come in handy, they serve as an important tool for clarifying what the animation is really meant to be. The bullet points are designed to generate discussion (e.g. client: “we don’t want a male model in our banner, our target market is female, they’re the ones that tend to buy our lipstick”).

Don’t forget to say what the state of the animation will be when it first loads up, will there be a progress metre because the animation is expected to be large? What will the initial banner image be? Will any buttons be highlighted by default?

Appendix - this is the last section of the storyboard document. It can contain anything else which you think needs to be documented (e.g. screenshots, mockups, JPEGs to be used for reference purposes, etc). The two standard sections I place in the Appendix are: Support Files, and Technical Notes / Non-requirements. The Support Files section is actually a ZIP archive embedded within the MS Word document. The ZIP file contains any relevant graphics files intended to be used with the animation. The benefit of packaging these files together is that the most up-to-date graphics travel with the storyboard document itself. This is especially helpful when the document needs to be emailed to off-site contractors. Of course, this only works if the ZIP archive is below 2-3 MB in size.

The Technical Notes / Non-requirements section is where you say what you’re not going to do. For instance; there will be no sound-effects or music used with the animation, no special effects will be used within the animation other then fade-in/fade-out, the animation will run for no longer then 30 seconds. In addition, you may want to give specific instructions which are relevant only to the Flash developer, such as: the completed animation should be no more then 1 MB in size, all text appearing in the animation should be retrieved from a XML file, etc.

A big part of creating a storyboard is helping a client translate what’s in their head into something more tangible. Failing to do so could result in an iterative cycle which is not only costly, but unnecessarily time consuming.

Download MP3 of article