My print colours do not match the screen

Understand that the colours you see on the screen are not necessarily completely accurate in terms of what you will get at the end of the print design process. This is mainly down to the difference between the way colour is created on screen and the way colour is created on paper: on CRT or LCD monitors, the monitor combines Red, Green and Blue light [RGB] to produce colour using very small pixels and any tiny, barely visible gaps between the pixel elements are black whereas the common process of printing with Cyan Yellow Magenta and Black [or Key as it is sometimes known] [CMYK] uses a combination of inks printed at various angles to give the impression of colour tone – all space between the distributed ink is white. Different input and output devices dealing with colour all have a different gamut – ie the range of colours a device can display or print, and the effect of the material or technology used to present this colour also has an effect.

Screen vs print

A screen’s gamut is usually much bigger than the printer’s gamut and this must be accounted for when dealing with images for print. The human eye has a much larger gamut of colours that can be viewed – monitors and printed material can only ever represent a reasonably small proportion of the colour available to us in the natural world.

Adobe users have the opportunity to set their colour spaces for local [eg US, European or Asian] printer technologies in the settings for Photoshop, Illustrator and InDesign providing a reasonably accurate environment for the images to be imported, processed and saved in suitable colour spaces – though Adobe’s colour engine requires considerable calibration and testing.

I am not the designer. What can I do?

Calibration Hardware

Buy yourself a piece of hardware for calibrating your monitor [and if you can stretch to the expense, your printer too]. See the Design-Design article Why Bother Calibrating? This will give you a fairly accurate starting point though personally my X-black Sony VAIO seems to overcompensate black and therefore shadows are slightly heavier than they should be – watch out for this sort of inaccuracy.

Colour Management – the printed photo method

Unless you have been trained in Colour Management then the most appropriate course of action would be to calibrate using a special image from your printers – my current choice of printer provide a test image on their typical gloss and matt stock and request that people manually set the colour of their monitor or graphics card to match the printed image with an image on screen. In cases where you can use a test image then this is recommended because, if you can get a ball park colour value from using a calibration device, then adjust manually so that what you see on screen matches the lithographic print, you should never be disappointed [though may never see 100% perfection either! - but that's a very tall order]. Ensure that your colour management policies are set to off when you calibrate. For further information please see the Why bother calibrating? article.

Colour Management – the Adobe method

If you find that this process is not yielding the results you want [though if you constantly use the same printer then it is probably best to use the first method mentioned for increased accuracy], then try setting your Adobe software to the appropriate region settings for example in European countries choose EUROPE  GENERAL PURPOSE 2 and ensure that Preserve Embedded Profiles is set for RGB, CMYK and Greyscale. This is a catch all method for ensuring that files are reasonably accurate, though if you really want to improve colour accuracy then read this incredibly detailed document from Adobe if you dare!

Does the printer understand your design?

When I’ve finished designing and I am preparing the file for print, I usually create proof files in the form of low resolution JPEGs to send off accompanying the file – this helps to ensure that your vision of the document boundaries, colours and content is communicated clearly and that changes in the PDF between your computer and the print unit’s machine can be identified.

If you feel it is necessary to clarify the print job further then it would be recommended that a physical proof is sent to the printers. This may indicate how pages fit together, where perforations are located or where there may be problems in the PDF. These proofs should be annotated. Usually printers have received all sorts of documents containing all sorts of problems with vectors, bitmaps and colour models eg screen colours as opposed to print colours and so are often experts at identifying potential print issues – I just don’t rely on that knowledge as print is so expensive.

I recently completed a car sticker job for a client. The client was surprised at how much detail I wrote in the accompanying email as I made a list of assumptions of how the process would occur and asked important questions that needed consideration. Assumptions included the understanding that all text would be cut out of the stickers rather than another sticker placed over the top in white – the client did not know that the colour of the car body is white and that this will be expected to show through in text areas. Also, I was concerned that the 4-piece logo items would need some sort of template in the application of the sticker to ensure all parts were accurately spaced – the print guy told me that there was a special coating on the stickers to allow easy application of several elements in the right place. It is really worth getting into the fine detail before money / time / effort is spent.

Turnaround

Never underestimate the time that a printer requires to complete a job – printers run to a carefully planned and priced schedule and will not be able to deviate from this as it would affect their pricing model. In many cases the client can pay a premium to receive the printed material such as stationery within 2-3 days. For example, RCS, the print company I use, have an 11am deadline for the receipt of print and from that point, it is classed as day 1. Within day 1 payment must be made for the job to run within the time guidelines.

It is worth looking at the variety of print options available to the client – RCS offer an economy turnaround time which is twice the normal turnaround but can make savings on the overall cost of the job by 10% – 15%

Colour Proof

Printers can provide a proof of the artwork but this will come at a price. A chromalin or laser copy can be generated which will provide around 85% – 95% accurate representation. It is worth finding a local photocopy shop with industrial quality laser printers to speed up this process but do your research and testing first to ensure that the results are reasonably accurate.

Savings and Offers

Check to see if your printer has special offers and pass these savings on to your client. This always brings a cheery smile to the clients face and shows him or her that you are a loyal designer!

* the brief states that the Flash animation must not be a linear Powerpoint style presentation.

Design Tools

Two of the most efficient tools for beginning a design project are a pen and an A4 or A5 pad. These can be used in a variety of ways:

• Spider diagram or Mindmap exploring initial thoughts from the design brief and gradually narrowing down more clearly defined lines of thought through the use of a tree structure. This tree structure can also contain links between some of the branches where there are relevant links between similar levels of the tree structure. You could use something like FreeMind.
• Consider all the topics and issues surrounding a subject by entering it into the search box at WikiMindMap.
• To do lists. A very important part of a designers thought processes – acting as a reminder for tasks, lists within certain areas of a mind map or a break down of timescales and deadlines for delivery of design work. Try creating a Google Homepage using iGoogle and adding Remember The Milk as an addon to iGoogle – this is a great way to help keep activities listed in a useful way.
• Sketches of the layout, logos and colour scheme for the product. A designer rarely begins this part of the process on his or her computer. Ideas can be quickly tried out and explored using this method and the pen and pad is a couple of tools a designer should rarely be without.

The designer may use the sketches created to show to a client in a meeting or scanned and sent over the net – using [free] screen sharing facilities on www.acrobat.com or even Skype can be very useful – in tests Skype has always come out as the most efficient tool for this purpose. This can often lead to a significant leap forward in client / designer communication [depending on the quality of sketches] without sacrificing too many hours of the project. These precious hours can then be spent refining the final chosen design.

One thing that should not be underestimated is the use of written documents and emails. These should be stored for future reference and will often act as security or insurance for decisions made or problems to resolve. When an email can be referred to during any part of the process it allows the designer to be confident in his or her development of an idea. Ultimately, the best approach to dealing with a client is not to need these emails to refer back to in the way that ‘proves a point’ but to foster a culture of trust and understanding as described in the Design Process 1 article.

Evaluating Your Design

One of the main ways to evaluate your design is to compare it to the original brief and associated questions asked at the beginning of the project. If your questions were not detailed enough then evaluating your design and concluding the project becomes more difficult. Your brief and questions should be the key statements whereby the design is evaluated and should you feel that you have made your case then you can proceed with contacting the client and demonstrating your product. On the right is the sort of development image that could be presented to a client along with an explanation of how the app would work. The reaction to this initial presentation is crucial in terms of establishing whether you are on the right lines or not.

When contacting the client, be prepared to take notes, negotiate changes to the design and evaluate new ideas. Clients are busy going about their daily business and will often not have considered how many options and trials the designer reached before his or her conclusion and will need talking through these clearly in many cases so that the benefits to the work you have done are clearly identifiable. Agree another evaluation date and set a list of tasks to conclude this next design evaluation. Be careful not to undersell your skills if the costing is set but also ensure that the client gets the maximum value for their money.

The process of evaluation and conclusion will be covered elsewhere in this blog at a future date. For the moment, the principles mentioned above and their relationship to establishing a solid and clear brief are sufficient.

< Home >

Hardware and Software

Buy yourself some calibration hardware and software. This will measure the coloured light emitted from your monitor and automatically adjust the computer’s colour settings to represent the closest to some of those diffiult calibration problems such as achieving reasonable skin tones.
Personally I use the Spyder2Express system for my calibration – though, as the link demonstrates, this has now been upgraded to version 3. There are several other budget options available including Pantones Huey amongst others.

Calibration Image

You will need to request a printed example of this image – this is usually included as part of a colour chart. I usually put my design work through RCS plc because they are usually very careful to obtain the highest standard in print quality – plus they offer checking and proof reading for a small fee which is always useful as an extra backup after both I and the client have looked through the job.

Discuss

If your printers are not so happy to advise [though please not the use of advise rather than 'hold your hand at every step' which ends up wasting their time] then it is worth looking for a company who will give you a little customer service to ensure the best results possible.

In Conclusion

Please note that, using this process, there are no guarantees that your colour will be entirely accurate but it is safe to assume that, without spending thousands of pounds on consultancy and equipment, using these methods will significantly improve your colour accuracy.

Students at Loughborough University’s Department of Design and Technology have been given the task of completing an interaction design exercise. The first part of the brief was to demonstrate two or three examples of applications that could be created to assist users of the Joggler. Marks are awarded for innovation, design and value to the customer. I have been asked to assist the students during the second part of the project where students must create a simulation of one of their designs using Adobe Flash.

The Brief

The Adobe Flash interaction design brief is outlined below:

Here you will be required to create a Flash application (.swf) that interactively demonstrates the one application you have developed. You will not be expected to show the entire functionality of the application, but one or two features in some detail. The Flash application should conform to your individual screen layouts & flows handed in for assignment 1. The application should be shown on the appropriate Joggler layout (this does not have to be a photo realistic joggler, just the same screen and button dimensions). This will require good design and construction of graphics and navigation options.

The Flash application is to be used to show the client how the specific new application or feature works so must include clear instructions. It must however allow the client to be able to interact and navigate in a non-linear fashion (this is not a linear power point project!). This is an exercise in a variety of design disciplines, user-centric analysis, planning, graphic, interface, information, usability. The principles of interaction must be applied to the Flash file. Accompanying the .swf file you must fill out a ‘Flash element summary’.

Product Familiarity

Often, a client will be able to refer to other products, websites they like, print examples they have seen or other media that has some features or elements that they like. In this case, the product is now in the shops and the brief is open in that the end application can fulfill any task or function – but the designer must be able to convince the client that there is a need or desire by the target market to justify further financial investment.

I need to become familiar with the product we are developing an application for. There are several methods I have chosen in this instance and they are ranked in the chronological order they occurred though in reality there is flexibility in this.

• Look for promotional material from the manufacturer to get a feel for the intended functionality, target market and typical use of the product in addition to a technical specification outlining the integrated technological features. For example, the O2 Joggler is WiFi capable, can receive SMS messages and will play many audio and video file formats. Below is a YouTube video showing the original Joggler advert designed to outline its use and functionality in simple terms.
• When searching for further YouTube material from O2 I discovered an demonstration video that both shows the product in use and shows some of the interesting interactive features of YouTube that could be exploited in my own work. In this case the O2 video seems to be slightly ‘clunky’ as there are many options to choose from but none of them are covered in alot of detail.
• The product can easily be investigated by visiting an 02 store in most cities and towns, providing a hands-on demonstration. By trying out the O2 Joggler I can gain a feel for the way users may interact with the product in terms of ease of use, speed, tactile features, heat output, pleasure in use and assistance to a daily routine. Using the product should be a source of inspiration and food for thought for the designer – knowledge and experience of current phone and web technologies is very important to this process as they provide multiple lines of questioning related to what is possible and what will be possible in the near future.
• Read customer comments from the website, tech review sites and other sources. This should compliment the initial research and help highlight any areas of investigation or analysis that have been missed or need to be revisited. A poor designer uses tech reviews as the basis for the research whereas a good designer looks for experience of the product, knowledge of its capability and seeks others opinion. Joggler examples include: MiniReviews, PC Advisor and PC Pro. It may seem a little odd that I am not refering to phone related websites but the O2 Joggler performs more in line with a simple PDA system and the interviews indicated are only design to provoke design questions thought.
• View competitors products to see what functionality has been added. The most obvious examples to my mind would be the iPhone with its large fanatical fanbase of users, constant evolution and support for ground breaking, design led applications. Try out the competitors products and ask yourself what sort of features really appeal.
• Monitor technology sites such as Electronista.com where there are constant updates related to technological innovation, roll out of new systems such as 4G phone networks, improved 3G data speeds and predictions as to what technology will be like in the near future.

Detailed Questions

There should immediately be a variety of questions regarding the style, technology and programming of the device as well as some test statements related to expectations. When a brief is presented to me I will often ‘test the water’ by explaining my perception of the design brief, how I will conduct myself during the process by estimating how long each phase would take based upon previous experience and where I would need assistance from the client or other skills. I would also test the client by suggesting that “the project will have concluded when we are….” [finished testing the website? taking delivery of the final printed product? preparing for print?]. A designer is able to make a full assessment of the task and its potential pitfalls [and account for these in planning] if they effectively complete this stage.

In this instance, having tried out the 02 Joggler I would want to ask the client some questions and check some of my assumptions – so in this situation, if I was a student working on the project, I would ask the project tutor the following:

• It is presumed that the style of the new application should follow the style and colour scheme of existing Joggler applications.

Not strictly true, O2 are looking for good ideas in terms of graphics and application ideas. I want designers to feel free to experiment with layout, iconography and style. O2 products do have a style and scheme but we can address this where necessary in further development phases. Don t worry about it for the moment.

• Are there any limitations to the inclusion of new technologies and ideas related to new phone technologies such as Bluetooth 2.0 EDR, GPS and other hardware / software developments? The current Joggler hardware would not allow some of these features to be integrated without redevelopment

Again, lets see what you come up with – sky’s the limit in the first instance. O2 can look at requirements for a new product if they take any of these further.

• Is it important to maintain the image of the Joggler being primarily a product for the kitchen? With the target market aimed at housewives or house husbands who need to keep track of their kids and generally weekly activities?

O2 have spent some time marketing the product as such, so let’s stick to that unless you have any inspiration that creates some strong reasoning to market the product in a different way.

• What sort of deadline and time limit are set for the project?

You have 10 hours studio time with support and other personal development time to create an idea, develop this and present a non-linear flash presentation. Put as much additional time of you own in but remember to balance graphics with a reasonable representation of functionality – the brief demands a reasonable level of both.

• What do you expect the final presentation to be like? What media types do you expect to see?

I’m expecting a Flash design that plays from a browser such as Internet Explorer or Firefox, along with your sketches to see how ideas have developed.

Firstly, it is worth pointing out that, unlike a mathematical problem, the design problem is one that cannot necessarily be resolved to perfection but must be resolved perfectly for the circumstances under which it exists. As I often mention to my clients, if you throw enough money at a solution – you can have any solution you like. The designer’s challenge is to fulfill the needs and desires of the client within parameters that will range from budget to client needs / desires to media type.

Ensuring Client Satisfaction

In addition to a quality piece of design work, a client must be completely satisfied with the job and feel that the financial sacrifice they have made has been rewarded with a product, advert, website or DVD that will work for them as a company, educational establishment, photographer or restaurant to further their cause or increase income.

There are several ways to do this but the one that works for me the most is to clearly analyse the design process with the client prior to the job commencing. From the point at which a fee is being negotiated to the conclusion of a project, the process should be explained at appropriate points to a client in easy-to-understand bite sizes. At what point should this discussion take place? The most common guides to this discussion are the points at which a piece of design work will be assessed by the client – the test phases if you like. The emphasis is upon the designer to advise the client as to when a discussion will be necessary and so as not to annoy or take up too much time – anticpating the required information and evaluation periods is paramount.

Design Brief

In my experience a design brief can arrive in the in-tray or inbox in a variety of formats:

1. The client contacts the designer by telephone for a brief discussion. During this conversation the client is looking for signs that the designer will respond intelligently to a given brief and so the designer must be prepared to react quickly and appropriately to statements made by the client whilst making notes regarding the requirements. These notes form the basis of the brief.

2. A client or client representative requests a meeting and gives a little information about what the project may be. This can be more vague than the telephone conversation as there is little or no time for questions – the designer must respond to questions at a meeting.

3. A client sends a brief out to tender. This means the designer has the opportunity to outline how they would approach the project and some initial designs may be required here. This leads onto the subject of speculative working which will be covered in another article, another time – in the meantime, check out these two links related to spec. design:

Why Speculative Design is Wrong
What is Speculative Design Work? – the video is worth listening to after the first 30 seconds

Types of Brief

The most common types of design brief are OPEN and CLOSED. An open brief is where the designer is allowed to experiment and develop a solution to a design problem with no initial guidance on what the end solution might be. A closed brief is where the solution is given [eg a device that performs task x and fits into box y] but is unclear how the design will look.

There are often grey areas in these design briefs – a typical example being that a designer has freedom to design a solution but must follow the corporate colours or must use a logo or identifying mark on the product, website or advert.

A designer should use his or her experience to make suggestions as to the benefits of changing the design brief where appropriate. This may result in the reduction of financial expenditure [for example, where a designer sees that part of the brief may require more creative freedom to allow other parts of the brief to flow and conclude more effectively]. If a client is completely opposed to making changes to the brief then the designer must carefully consider how the process will work within these constraints and take appropriate action.

Next time

In part 2 we will look at the design process and a live project example.