Prepress tips for graphic designers

When you design artwork for print, standard practice is to send a PDF to your printer. But are you 100% sure you got the settings right? Are you confident the size is correct? Have the colours been set to print standards or client brand guidelines? What about font usage?
So many things can go wrong, costing you and your client money. So to help, Sigurdur Armannsson — art director at the Icelandic Ad Agency — has prepared these 16 prepress tips that cover the major aspects for correction in your artwork. By checking each tip as you go your file will be in excellent shape for sending to the printery.

01. File the job into a tracking or accounting system
Every business needs a tracking system where information about the client and his or her jobs are filed. Systems range from high-end business software to simply using FileMaker or similar to store information. Freelancers should also use something that takes care of this. I use iBiz.

02. Use files and folders that bear the job number
Tracking systems create running numbers. You should use them for your files and folders too. The running numbers act as keys to further information about every project and client, and save you from creating new files and folders for every job. You could use abbreviations or codes for your client and then the number and a short descriptive name, e.g. ABC 12345 Brochure Spring 2010

03. Stamp the artwork
Put information inside the artwork. If the client does not object, put a short line in small type 4-4.5 pt., inside the artwork, on the back of a brochure. Include your companies name, the job number and a date. MyCompany ABC 12345 10/09. The name of the printery would be a good addition too. This will help identify the work later.

04. Make it clear who is responsible for the design
Before you start, make sure you have a design brief. What is the main purpose of the design? What are the clients motivations? Who is responsible for the job? An art director? You?

05. Proofread
The odd thing is that clients can be calm about minor errors in the design, like lines not being of same thickness or such. But errors in text are fatal. Use a good proofreader. If the client wants to proofread himself, be sure to have that in writing. An email is great confirmation.

06. Make the artwork the correct size
Does the design brief specify the size? Have you checked Document Setup again? Or the outmost frame in Illustrator? Is everyone using 210×297 as Width by Height? Did the client say an A4 because it looks like an A4 or is it 220×286? For ads, contact the magazine or website. They will love to hear from you. Always double check if you aren’t sure.

07. Define bleed and trim marks in the file
Bleeding — the distance the artwork needs to extend beyond the final size of the artwork — can vary. 3mm is most common. In some cases it may not be needed at all, nor the trim marks. Clarify before you create your PDF, and open the PDF afterward to check inclusion.

08. Ensure the typeface(s) used correlates to the clients corporate identity manual
Are you using the correct typeface for your client? Are there any unnecessary fonts that shouldn’t be included the file? In Illustrator check Document Info or Find Font… and in InDesign Find Font… under Type in the menu. When delivering artwork as a PDF there is normally no reason to outline the fonts.

09. Ensure logo usage correlates to the corporate identity manual
The client loves her logo and usually wants it bigger than we want it to be. Stick to the size in the manual or the size used for recent works. If she wants it bigger have that in writing and be sure to tell her if it’s overshadowing other information.

10. Keep the colour of the logo in the right format for the media used
For print, use the logo in vector format if possible. Logos sent to you inside Word documents are no good unless the design is for web or a PowerPoint presentation. Make sure the colours of the logo are in accordance with the corporate identity manual. For print, the format should be CMYK, not Pantone unless the work is going to be printed with spot colours.

11. Keep the colour of the artwork in accordance with the media used
Now, this depends on what kind of colour workflow you will use. For CMYK workflow, all colours should be in CMYK. Pictures should be in CMYK, colour separated for the paper used. No colour profiles should be attached to the pictures. If you are still using pictures as EPS it’s time to switch over to using native Photoshop files. The reason: If you are using transparency in your artwork, like drop shadows or transparent type or colours, your PDF will most likely have torn the photos into strips. This can be avoided by using the pictures as native PSD.
For RGB workflow, you can still use CMYK colours, except you should have all photos in RGB. It’s important to have all photos in RGB and they should have a colour profile attached. Use native PSD — it’s great, and has options not available to other formats.
If you are including Pantone colours, make sure only the colours used are in the file. In InDesign and Illustrator, go to the Swatch panel and in the fly-out menu choose: Select all unused and delete those colours. If in doubt, contact your printer. He will love to help you and he will most likely send you the correct settings for Photoshop that fits the jobs going to his printery.

12. Colour correct your monitor every four weeks
There is no way you can use either CMYK or RGB workflow with confidence if your monitor is not colour corrected at least every month. Colour correction software like iOne has a reminder built in.

13. Ensure all pictures are the actual size shown
Pay close attention to the resolution of the pictures used. Most common resolution is 250-300ppi. You should try not to enlarge or minimise pictures by more than 20% of the original size. This is just a thumb rule. When you change the size inside your document you will change the output resolution too. A 300ppi picture will be 600ppi if you minimise it by 50%. Way too high a resolution. Enlarging too much might get the resolution below what is needed to pass the printery’s preflight.

14. Preflight the artwork
Preflighting the artwork before sending to the print shop is a must. If you have done all the things mentioned above, you have manually preflighted a great deal of what is needed. Using a preflight program like FlightCheck from Markzware or similar will help further. It’s most annoying to discover just before you deliver your work that it’s not in line with necessary printing standards. If you don’t have a program like FlightCheck you can go far by using the built in document info and preflights.
In Illustrator you have Document Info. Turn off the default Selection Only and browse through the items in the list, one by one to see what’s inside your file.
InDesign has a preflight feature. In CS4 it has been moved over to Window > Output > Preflight. There you can see an overview of the document, check fonts, links etc. Also, in CS4 you can see the red or green dots at the bottom of the window that indicates various errors you may have in your file. Great help but it doesn’t beat a professional application like FlightCheck.

15. Ensure the final PDF is high resolution
Did you send your client a low resolution PDF earlier in the day? Did you remember to switch over to a high resolution output? Are you using the built in PDF settings of InDesign or Illustrator? Ask your printer for PDF job settings. The built in settings are usually not what is used for professional PDF output. Or at least know which of the built in settings you are supposed to use.
High Quality Print and Press Quality settings are tempting to use if you want quality (because of the names), but in most cases you will have to use PDF/X-1a:2001. Consult your printer here. They will love you.

16. Have artwork approved as final
Get in writing (preferably email) a client approval before the job is sent to the printery. Or in bigger agencies the approval has to come from an art director or account manager. Verbal communication cannot be relied upon if something goes wrong.
These 16 pointers may seem overwhelming at first. Don’t fret, because when you’ve worked through the steps a few times they’ll become a part of your prepress routine. You’ll be able to quickly run through the list and discover that you’ve covered almost every one while working on your design. Once again: Talk to your printer to get the best results.

And finally, here are the 16 tips without the above explanations — you can keep this handy since you already know what they mean:

1. File the job into a tracking or accounting system
2. Use files and folders that bear the job number
3. Stamp the artwork
4. Make it clear who is responsible for the design
5. Proofread
6. Make the artwork the correct size
7. Define bleed and trim marks in the file
8. Ensure the typeface(s) used correlates to the clients corporate identity manual
9. Ensure logo usage correlates to the corporate identity manual
10. Keep the colour of the logo in the right format for the media used
11. Keep the colour of the artwork in accordance with the media used
12. Colour correct your monitor every four weeks
13. Ensure all pictures are the actual size shown
14. Preflight the artwork
15. Ensure the final PDF is high resolution
16. Have artwork approved as final

Web design tips & tricks

In these pages you can found articles, tutorials, tips... that I hope can be useful for web page creators. Some of the articles were created in relation to discussions in which I took place at the WebDesign-L mailing list, a very interesting list for web designers.

Vertical align for navigation lists with multiple lines

Let's see a quick tip for aligning vertically navigation lists that use the tipical floated box approach to display the list in a row, but that have several items displayed across multiples lines.

Vertical align for navigation lists with multiple lines.

Making web pages extend to the bottom of the browser window

If you ever made a web site with the content in a center column and a different background for the body, or with a navigation bar not too tall, probably you experienced the problem of some elements not extending to the bottom of the browser window when the content height is lesser that the content area of the browser window.

Making web pages extend to the bottom of the browser window.

A fix for float-margin inconsistences across browsers

While in the process of redesign one of my sites I stumbled upon some inconsistences in the margin applied to the floated boxes that I have in one of my pages. At first I thought that it was due another IE float bug (and it's in part true), but some tests proved that all browsers have issues when applying the margin.

A fix for float-margin inconsistences across browsers.

How to install Apache (and PHP+MySQL) on Windows

When you are making a web page, the easiest way of view a page stored in your hard disk is double-clicking in the file, which usually results in the page being opened in your default browser. Although this method (which I still use sometimes) it's good enough for simple static pages, it's not useful if you you are using server side languages, or even with pages that are static but use links relative to the server root. In this situations the a good solution can be set up a local test server for making all the design and tests in the same computer.

How to install Apache (and PHP+MySQL) on Windows.

Optimization of JPEG images: good quality and small size

Depending of the program you use for saving JPEG images, there are available some options for adjust the compression of the image. In this article I'll try to explain how to adjust that options and optimize the ratio between image quality and file size.

Optimization of JPEG compression settings.

Tables vs. Definition Lists

In a question posted to the list, Maximillian Schwanekamp wondered this: when presenting data which is a set of related key-value attributes, what would be more appropriate from a semantic point of view: a table, a definition list or something else?

Tables vs. Definition Lists.

Standard (and valid) DOCTYPE definitions

Web pages should include a valid DOCTYPE definition at the beginning of the HTML document, not only to validate the page against it, but also to activate the standards compliant rendering mode in Internet Explorer 6 and Mozilla/Netscape 7.

Standard (and valid) DOCTYPE definitions.

CSS Image replacement for submit buttons

Expanding the techniques for CSS image replacement by Mike Rundle and Seamus P. H. Leahy, and inspired by a question posted by Susan Petracco to the WebDesign-L mailing list, I have developed an image replacement method for submit buttons, and in general for the

15 mac applications for web designers

We have lot of nice apps available for Mac OSX that aren’t available for Windows.
I’ve compiled a list of Mac Apps I have in my OSX dock that I use on a daily basis and should be useful to other Mac users and/or web designers.

1. Adobe Creative Suite
An obvious and primary requirement (I feel) all serious web designers should have. I couldn’t get through the day without Photoshop while Illustrator and Flash are constantly called upon. I hear Fireworks is good too, especially for compressing images, but I’ve yet to use it myself.

2. Transmit
Transmit is an FTP client for Mac. Edit remote files, synchronize, search, SSL, tabs; it covers all your daily FTP needs.

3. Coda
Coda is a light-weight all in one text editor. You can edit your code, preview your web page, upload to server (integration with Transmit), edit CSS and run commands in Terminal; all from within this one app. I would use Coda for front-end development.

4. Textmate
Textmate is another text editor that I prefer using for back-end development. Code completion, snippets, syntax colouring are some of the things I enjoy about Textmate along with ease of customizing fonts and colours.

5. CocoaMySQL
CocoaMySQL gives you an interface to work with your MySQL databases. This is a desktop alternative to PHPMyAdmin, which is a lot quicker and in my opinion a lot easier to operate.

UPDATE 13/12/08: CocoaMySQL has been abandoned and replaced with Sequel Pro. Works just as well and looks even better. Check it out.

6. MAMP
MAMP is an easy way to get Apache, MySQL and PHP up and running on your machine. Just by running MAMP all these three services will be up and running, no messing around in Terminal needed.

7. Things
Great app for getting things done. Set yourself project tasks and daily tasks and check them off as and when you get them done.

8. CSS Edit
A very good CSS editor. It allows for real time previews of your website and styles and is a very efficient app allowing you to easily find all styles being applied to certain elements.

9. Transmission
Transmission is used for downloading/uploading torrents over the net. Useful for sharing files with friends and colleagues (among other things)

10. MarsEdit
MarsEdit allows you to compile draft blog posts on your local machine before publishing them live on your blog. I use it daily to take notes on various blog topics I think of and then I can easily compile a blog post over the course of a week.

11. Skitch
I was only recently introduced to this by GoodOnPaper @ FOWA. Allows you to easily share images/screenshots on the web and using the Skitch editor you can add notes to your image or highlight areas of a screenshot. Very useful and saves having to load up Photoshop for simple tasks.

12. Parallels Desktop
You can run Windows XP or Vista on your Mac using Parallels. Handy for being able to test your websites in versions of IE (using Multiple IEs) and if there are any Windows only apps you need to use, e.g. Microsoft Access.

13. Office
A good old favorite for creating text documents, preparing slideshows or looking after sets of data. There are a few Mac alternatives, and of course online alternatives, but I personally prefer Office.

14. Paparazzi
Paparazzi takes full screenshots of webpages. The problem with Cmd+Shift+3 is that it only takes a screenshot of the visible screen. Paparrazi takes the whole height of the page, even below the fold, so it’s great for showing screenshots of your web designs.

15. Twitterific
Easily interact with Twitterland via Twitterific. Saves you having to make the trip to Twitter to see what’s going on as it can retrieve and send tweets for you.

How to Create a Flag Graphic with Type in InDesign

In this tutorial, I'll show you how to use InDesign's ability to create type on a curve, and flow that type from one curve to another. Along the way, you'll learn a slick technique for step and repeat and how to apply gradients to text. This technique will work in InDesign CS or later. This technique would also will work in Illustrator, with minor modifications.

Final Image Preview

Below is the final image we will be working towards. Want access to the full Vector Source files and downloadable copies of every tutorial, including this one? Join Vector Plus for just 9$ a month.

Step 1 - Draw a Curve in InDesign

Use the Pen Tool (P) or Pencil Tool (N) to draw a wavy line. Use the Stroke panel or Control panel to give the line a 1 pt stroke. We'll remove the stroke later, but it is helpful to have a visible stroke on the line for the next few steps.

Step 2 - Prepare the Curve to Receive Path Type

Click on the Path Type Tool (buried under the Type Tool, or press Shift + T. With the Path Type Tool, click on the curve you drew in Step 1. This will turn the curve into a text path.

Step 3 - Duplicate the Curve

With the Selection (Black Arrow) Tool, click on the curve you drew in step 1. Hold down the Alt and drag the curve down and to the right to duplicate it.

Step 4 - Duplicate the Curve Three More Times

Choose Object > Transform Again > Transform Again, or press Command + Alt + 3. Repeat this two more times, so that you end up with a total of five curves.

Step 5 - Place the Text on the Top Curve

Click on the top curve with the Type Tool. You should see a flashing text cursor on the left side of the curve. Choose File > Place to import a text file onto the curve, or choose File > Paste to paste some text onto the curve from the pasteboard.

Step 6 - Thread the Text to the Next Four Curves

With the Selection Tool, click on the top curve. You should see a red overset text symbol appear on the right end of the line. Click on this overset text symbol to load the text cursor. With the loaded text cursor, click on the second curve. Repeat this procedure (clicking on the overset text symbol and then clicking on the next curve) until you have clicked on all five curves.

Step 7 - Skew the Type

To make the type look more like it is on a wavy flag, the type needs to be skewed. Select all five curves with the Selection Tool. Choose Type > Type on a Path > Options. In the dialog box that appears, change the Effect to Skew, and click the OK button.

Step 8 - Format the Type

Select all the text with the Type Tool, and then use the Character and Paragraph panels, or the Control panel, to format the type as you'd like it to appear. Note that I applied full justification to all the text, to ensure an even right edge, even on the last line.

Step 9 - Remove the Stroke from the Curves

Select all five curves with the Selection tool again, and use the Swatches panel to apply a stroke of None.

Step 10 - Create Two Colors

To make the flag text look more realistic, we are going to apply a gradient to the text that consists of alternating light and dark colors. In the Swatches panel menu, choose New Gradient Swatch, and create two colors, a bright red and a darker red, or any colors you'd like.

Step 11 - Create a Gradient

In the Swatches panel menu, choose New Gradient Swatch. In the dialog box that appears, click on the left-most square under the Gradient Ramp. This square is called a Color Stop. Then change the Stop Color to Swatches, and choose the light color you created in Step 10. Next, click under the colored gradient ramp to create a second color stop, and make this color stop the dark color you created in Step 10. Repeat this three more times until you have five color stops, alternating from light, to dark, to light, to dark, to light.

Step 12 - Apply the Gradient to the Text

Select all of the text with the Type Tool, and then click on the gradient you created in Step 9 in the Swatches panel. You will not be able to see the effect of the gradient until you deselect the text.

Conclusion

Use the Pen Tool to create a path for the flag pole, and add a background photo if you'd like, and you're ready for Independence day!

Subscribe to the Vectortuts+ RSS Feed to stay up to date with the latest vector tutorials and articles.

Graphic Design Glossary, Terms and Definitions

This graphic design glossary contains vocabulary that many designers use on a daily basis and may be confusing to new designers or non-designers who need to communicate with designers. Remember, the following terms are defined as they relate to graphic design and desktop publishing. This is a work in progress and updates are made frequently. If there is a term you think is missing, misrepresented or incorrect, please suggest me.

 

A

AI-
Illustrator Document extension.

 

B

Bleed-
Bleed is the part of a printed document that is out side the bounds of the final size of the piece. It is used to make sure images and other design elements print all the way to the edge of the paper. It is the designer’s responsibility to set up the bleed in a document and an accepted standard is 1p6, or 1/4 of an inch, out side the size of the paper. When placing objects in a document that must go all the way to the edge of the page, make sure they extend to at least this quarter inch mark. Photoshop and Illustrator do not have an automatic way to add bleed, so it must be taken into account when set ting up the page size. In lay out pro grams such as InDesign, the bleed is set up separately from the actual page size; in other words, the bleed is in addition to the defined page size.

Bleedthrough-
Areas with heavy ink cover age can soak through thin paper and show up on the other side. This is not the same as being able to see the printing on the other side just because the paper is thin. With bleedthrough, the ink actually soaks into the paper and appears in dark blotches on the other side.

Body/Copy-
The body of a lay out (also called copy or body copy) is the main text.

 

C

CMYK-
CMYK stands for Cyan, Magenta, Yellow and Black, the colors a printer works with, as opposed to the screen color space, RGB. This is also known as process color. CMYK is a subtractive color space; in other words, to make white, you take away all the colors.

Compression-
The process of an algorithm making file sizes smaller by combining similar data. Most of the time this is a good thing, but it can also cause severe loss of quality, especially in regards to images.

Comps-
Also known as comprehensives, these are the step after thambnails in the creative process. This is usually where the designs are taken into the computer and the details such as back­grounds, color schemes and images are more thoroughly worked out. Comps are the “first draft” of design. Many times designers show several different styles in comps to a client and let the client decide on a look and feel that he or she desires. Then the comps go back to the designer with some feed back and changes from the client and usually several rounds of this feed back process occur. Some times the client may ask (or the designer may want to present) mock-ups.

Crossover- Images and/or text running across two or more pages.

 

D

DPI-
Dots per inch is the more exact way to define the resolution for a file that is to be printed. Some use DPI and PPI inter-change ably, though this is technically incorrect.

 

E

Elements of Design-
The Elements of Design are Color, Shape, Size, Space, Line, Value and Texture.

EPS-
EPS stands for Encapsulated Post Script (not to be con fused with ESP: Extra Sensory Perception). A common file for mat for exporting Illustrator files, it contains a bitmap pre view of the image as well as instructions writ ten in the Post Script language that describe how the object is to be printed. An EPS file is usually a vector, but some times people place photos in Illustrator and export them as an EPS, though I’m not sure why. Images for print should ideally be exported as TIFFs.

 

F

Font-
Technically, a font is the complete collection of characters and glyphs, including numbers, symbols, accented characters, punctuation marks, etc. in a given face design. A font also includes the design in various weights, such as bold or italic; it is more comprehensive and com­plicated to design than a typeface.

Free hand-
Free hand is the Macro media equivalent of Adobe Illustrator.

Fire works-
Fire works is the Macromedia equivalent of Adobe Photoshop.

 

G

Ghosting-
Also known as screening back, it is where an image is made transparent so that the back­ground shows through. Some times this can be an undesired effect in the printing process due to too little ink being transferred to the paper. Be sure to check for unwanted ghosting on the press check.

GIF-
A proprietary file for mat from CompuServe. It is used in web graphics and is best for images that are made of solid colors, like logos. GIFs support transparency (how ever, pixels are either transparent or opaque, nothing in between) and they can be animated. GIFs are also considered a loss less format–meaning they do not suffer compression artifacts–as long as they do not exceed 256 colors.

Gradient-
A gradient is a fade from one color to another. There are many shapes a gradient can take, but generally it is either linear (straight) or radial (round, where it fades from the center out wards). Gradients can also be highly customized with many different color pat terns so that it is difficult to tell if an object actually has a gradient. Generally gradients are used to add depth, or some­times a shiny or metallic look, to a design element, but they can also be used simply to color an object.

 

H

Hickey-
Yes, this is a real term in graphic design! Hickeys hap pen when foreign matter like dust, blobs of ink or bits of paper make marks on a print piece. You should look for them at the press check.

HSB-
Hue, Saturation, Brightness is a color space that you can use when dealing with images in graphics pro grams. It sep a rates the hue—what you think of as color—from the saturation—how much white is mixed with the hue—and the brightness—how much black is mixed with the hue.

 

I

Illustrator-
A vector program often used by designers to create logos and work with or manipulate type.

Imposition-
The process of setting up pages in their correct order for print. This order is some times referred to as a Printer Spread.

INDD- InDesign Document extension. InDesign is used for page layout—assembling images and text—and is the Adobe version of Quark. It is capable of much more in tricate and precise control over text.

InDesign-
A page layout or desktop publishing program used by designers to combine text and images. There was a series of InDesign articles published on Creative Curio: You Still Use Quark?!, Making Changes Easier with Master Pages, Avoiding Disaster with Paragraph Styles, Under standing InDesign Layers and reference guide for InDesign Short-cuts.

 

J

JPG-
An abbreviation for Joint Photo graphic Experts Group, the committee that created this file type. It is best used for photographs or images that have gradients. Jpgs do not sup port trans­parency and cannot be animated.

 

L

Lab-
Stands for Luminance, a, b, where a is the amount of green/red in an image and b is the amount of blue/yellow. An L of 0 (zero) would be seen as black, 100 would be white. a and bare measured on positive/negative scales, with negative a being green and positive being red (or magenta) and negative b representing blue while a positive value indicates yellow. Lab is sup­posed to simulate more scientifically and accurately how people view colors and which colors humans can actually inter pret. It was developed by Commission International ed’Eclairage (translation: International Commission on Illumination), or CIE and is some times referred to as CIELAB.

Loupe-
A little magnifying glass just like jewelers use to exam ine gems (pronounced loop). Pressmen use this to check the registration on a print job and make sure all the little ink dots are lining up on top of each other like they should. Designers can use this tool at the press check.

Loss less-
The opposite of lossy, loss less describes file types where there is no image data deleted or erased when that data is stored. Image for mats like GIF, PNG and TIFF (with out compression) are considered lossless.

Lossy-
Describes file types where compression is applied and image data is deleted or erased in order to decrease the files size. If done properly, this loss is not critical and it makes the image much smaller, which helps to speed up down load time and saves hard drive space? JPG is a file for mat that is lossy.

 

M

Mock (or Mock-up)
A close-to-reality rendition of a project. This is often used in packaging design to show how a pro posed design would look on a box or other type of package. It is used to give the client/stakeholders a better idea of the final product. It can also be used in web design to show a rough approximation of what the final web site would look like in a screen shot of a browser.

 

P

PDF-
Portable Document Format. This file type is often used to send print materials to a print shop. It is also very useful for web, when there are multi-paged documents, reports, forms, etc. that have been designed in a specific format, which cannot be easily translated into HTML. Note: PDF is an Acrobat file, not an “Adobe” file. Adobe is a company and the manufacturer of Acro­bat, Photoshop, Illustrator, InDesign and many other pro grams related to media design and production.

Picking-
When ink is too sticky; it can take bits of the paper with it as the paper travels through the press. This is the opposite of slurring and both should be looked for at a press check.

Pixel-
Picture element. It is the basic digital component that makes up a raster/bitmap image.

PNG- (PNG-24)
Portable Network Graphics are the ideal web graphic file types. They are completely loss less and they sup port alpha transparency. PNG-8 is essentially a GIF.

Press Check-
A press check is where the designer goes to the print shop while the job is being set up to print. The printer will give you a press sheet to look at and this is the final time to check color and print quality, not the time to check for typos; that should be done with the proofs! When you go to a press check, in addition to accurate color, look for crossovers, slurring, picking, ink smearing, hickeys, bleed through and registration (ask to use a loupe). Circle any problems you see and ask for another press sheet. It’s ok to ask for the pressman’s advice on fixing color (sincere flattery will do wonders for get ting what you want!) and don’t be afraid to go back sev­eral times and ask for adjustments and a new press sheet.

Principles of Design-
The Principles of Design are Unity, Balance, Contrast, Economy, Direction, Emphasis, Proportion and Rhythm

PPI-
Pixels per inch is part of how you would define the resolution of an object that is screen-based. Some use DPI and PPI inter change ably, though this is technically incorrect.

Print-
Print encompasses all design that is not on a screen in its finished state. Print can include brochures, reports, post cards, menus, bill boards or identity systems (letter heads, envelopes, busi­ness cards).

Printer Spreads-
The order in which the printing company will layout pages, generally for a multiple page composition. The pages are not printed in the order that they appear in the final book. For example, in a 16 page book–assuming the front cover is page 1 and the back cover is page 16–page 2 and page 15 would be printed on the same sheet of paper next to each other. Pages 3 and 14 would be on the next sheet, on the other side of that same sheet goes pages 4 and 13, etc, so that when the pages are nested in the final book, they appear in the correct order. The process of set ting pages up in this order is called imposition. Compare this with Reader Spreads.

Process Color-
Also known as CMYK

PSD- Photoshop Document extension.

Photoshop-
A design program used to manipulate raster (bitmap) images.

 

R

Raster-
A raster or bitmap image is made out of pixels. Raster images are typically photos, but they can also be illustrations that have been turned from vectors into pixels.

Reader Spreads-
The pages of a com position set up in the order a reader would see them, page 1, 2, 3, 4, etc. Compare this to Printer Spreads.

Render-
A render is a rendition or draft of a project. When some one talks about render, it can mean the project’s appearance: “It’s a pencil render” means it’s a sketch. A render can also be a draft: “I’m waiting for the 3D model to render” means the computer is calculating the appearance of the model, which can include textures, lighting, transparency, etc. A “final render” is the fin­ished project, ready to be presented, printed or shipped.

Resolution-
There are so many different meanings for “resolution” depending on who you are and what you do. The best definition I’ve read is from Real World Photoshop. The authors define resolution as “the number of pixels in each unit of mea sure.” There are two main ways to discuss resolution: you can talk about resolution in terms of image size: “The document is 5x7 inches at 300 ppi,” or you can talk about resolution as dimensions: “The document is 1500x2100 pixels.” Some people talk about resolution and want to know the file size, but then you have to start becoming familiar with a new way to measure things. Remember the image size dialog box in Photoshop? There is an input field for Resolution (the pixels per unit), and also a drop down box for the unit of mea sure, which is separate from the fields for the width and height of the image. In reality, these are all just different ways of talking about the same thing: the amount of image information. So if some one asks you the resolution of an image and you merely reply, “300 ppi,” you’re not telling the whole story.

RGB-
Red, Green and Blue are a monitor’s color space. RGB is considered an additive color space, meaning to make white you add all the colors together. You view the world in RBG, not CMYK.

 

S

Slurring-
If ink has a low “stickiness,” it can create a soft or blurry look. Look for slur ring, which is the opposite of picking, on press checks.

Spot Color-
Inks that are not mixed from the four process colors. They are used for items, like logos, that need to be a consistent color no matter how or where they are printed. Any time you add an extra ink to a print job, it increases the price. Metallic inks are also spot colors.

Stock-
You often hear terms like “stock photography” in a graphic design environment. Stock refers to some thing that is pre-made–photos that have already been taken in a variety of general scenar­ios with a general selection of smiling people, illustrations or icons with a general or abstract theme. Notice the term general here; you probably won’t ever find that perfect artwork you need, but it’ll be close enough and cheaper than, say, staging your own photo shoot. (Stock can also refer to the paper a project is printed on)

 

T

TIFF-
The raster version of EPS. TIFF can be a loss less for mat if you choose the No Compression option, which is the default in Photoshop. TIFF supports percent ages of opacity like PNG and is ideal for the final file type of pixel-based images for print. You can also have layers in the TIFF format, but this will increase the file size.

Thumbnails-
Small scale rough sketches of a design concept. They are among the first stages of the cre­ative process. Before thumb nails, designers often collect a design or creative brief, do research and/or word associations and some times wire frames as a sep a rate step. Thumb nailing is a process that designers use to quickly illustrate ideas for a design. The longer a designer spends in the thumb nail stage, the more detail that is put into these sketches, the faster the next stage, comps, goes. Thumbnails are to design what an out line is to writing a paper.

Type face-
A type face is simply a design or look of letters and maybe numbers. It does not include glyph and character variations or weights like bold (think display or ornamental faces such as Grave Ornamental or Willow), and may not even include numbers or upper or lower case letters (obviously it would have to include either upper or lower case letters, but not necessarily both). A type face also does not mean that a design is complete; many movie title treatments are merely type faces (only the letters in the title have been created), though some have been developed fur­ther into fonts.

 

V

Vector-
Vectors can most readily be recognized as illustrations, particularly from programs like Illustrator or Free hand. But not all illustrations are necessarily vector-based. Vectors work by defining points and what fills the space between those points in a document and they are stored as mathematical formulas. Vector files (like Illustrator files) are fractions the size of raster files because there is less data needed to create the images.

 

W

Wire frame-
A wire frame is a basic lay out with out design elements. It is generally used in web design as a means to plan where navigation and con tent will sit on the page.