Behind the Scenes: Turning a Concept into a File Ready for Print or Web

When creating a design for print, or a website, we go through a process that clients are usually not aware of.

For print pieces, first I create a mockup of several concepts, usually in Photoshop. The resolution of the final file usually needs to be 300 DPI, but when I create concepts I may create them at 72 DPI, because the smaller file size allows me to work faster. Then I save the Photoshop document as a JPEG and post it online so clients can see the static concept mockup.

Creating concept mockups in this manner is much easier now that Adobe Photoshop allows vector type. This was probably the most exciting update Adobe came up with, along with layers and the history palette! However, setting type in an official layout program like Indesign is still the professional standard, and Indesign allows much more flexibility to fine-tune type. So, after a concept is chosen and approved, the second step will be to transfer most of the text into Indesign.

The JPEG mockup is a low resolution file that looks fine online but would look blurry if printed. The third step is to prepare the “art” background of the concept so that it is print quality. It needs to be recreated at a higher resolution if I used 72 DPI to start, saved as a TIF, and then brought into Indesign as the background.

The process for finalizing a website concept is similar. The concept mockup has no functionality; in other words, the links will not work and there are no other pages that exist.

To turn the concept into a functioning website, first I’ll slice up the art background so that the pieces that can be inserted into a Dreamweaver template (like putting together a puzzle). Dreamweaver is the industry standard program for web design. The art background stays at 72 DPI since it will only be viewed on-line. Second, I’ll transfer much of the text into Dreamweaver, and finally, I’ll add link functionality.

That sums up the process that goes on behind the scenes!