How to Make Your Work Look Good (Digital + Print)

From pictographs found in caves up until the internet gave way to digital design, the only way to digest visual media was by viewing a physical object. Much design work in 2021 and beyond is the creation of digital products — art that is made on a screen, meant only to be consumed on screen.

There’s still a place and purpose for print in marketing and branding. Since printed assets are no longer the primary way consumers receive brand messaging, print design has a renewed ability to surprise and delight. However, the joys of tangible design work is easily thwarted when developed incorrectly. 

The required color spaces, sizes and file types greatly differ between what’s effective in print versus digital. It’s vital to know these differences and design with medium in mind to ensure designs are properly produced.

Color Spaces

Whether working in print or digital, using the wrong color space will negatively impact the look and feel of a design.

Color palette is a huge aspect of branding — it can convey whether a brand is youthful and playful or serious and reliable. Color speaks to a brand’s tone or voice, and even helps establish their values.

Digital design uses the RGB (red, green, blue) color space. These colors are what’s represented on monitors, so each hue in your design is created using some combination of these three colors. Using RGB for digital products will ensure your colors are vibrant on any screen.

If you’ve ever refilled ink in a printer, you’ll know there are four cartridges: cyan, magenta, yellow and black (CMYK). If you’re designing a print publication with photography or many different colors, the CMYK color space will ensure crisp colors once it’s printed.

Another option for color spaces in print is spot colors. Spot colors use specific Pantone colors. Instead of adding and subtracting levels of C, M, Y and K to achieve the correct hue, established print vendors will have special printing plates with premixed inks.

Using Pantone colors ensures brand colors are produced to the exact tint and shade intended. (But keep in mind, photography is too complex to utilize spot colors and the more spot colors used in a publication, the more money it costs to produce).

Consistency across mediums helps define and solidify a brand’s image. Misrepresenting a client’s brand colors could go so far as to subliminally dilute a consumer’s trust in said brand.

Image quality

Have you ever seen a print advertisement or publication with a low resolution image? If so, I wouldn’t be surprised if that’s the only thing you remember about the ad.

When designing for digital, it’s standard for images to be 72 dpi (dots per inch). This lower resolution image will still show up sharp on your monitor. If you’re designing a website and the images throughout are too high resolution, modern, on-the-go audiences won’t wait that extra moment for everything to load. Big images with slow load times can also hurt your search engine ranking.

Print pieces, on the other hand, have no load time. Any and all photos intended to print should be 300 dpi. (If you’re in a bind, the very lowest you can get away with is 240 dpi). In photoshop it’s easy enough to go to edit > image size and make any image 300 dpi — but beware of this convenience! Convert the measurements from pixels to inches and see how large the native file truly is. If the image you have access to is only 3” wide, but you’re trying to use it for an 8” spread, even if you feign the resolution to be correct, you’re going to be looking at a low-resolution final product.

Although Photoshop, Sketch and Figma are ideal programs to use for digital design, Adobe Indesign is specifically created for designing print layouts. To double check that I don’t enlarge images beyond their original size, I use the Direction Selection Tool to click on the image itself (versus the frame), and if the Scale X and Y Percentages are 100% or lower, I know my image will print well.

File Type

When saving out or exporting a graphic or image, there’s an intimidating list of file types to choose from. Different file types are better suited for different uses, so it’s always important to have the final usage in mind when saving images.

Digital design has a broader range of acceptable file types than print. Saving out a photo for web requires the JPG file type to ensure the image is well compressed.

PNG is one of the most diverse file types. If you were to use PNG in place of JPG, it wouldn’t negatively impact your final design — however, using a JPG when you should’ve used PNG could.

PNGs allow for a transparent background. This file type is necessary when working with cut-out photos (without backgrounds) and when saving out icons or graphics for the web. PNGs ensure only the graphic itself appears in layout, otherwise, a white bounding box will appear behind the image.

SVGs are a very specific kind of file type that’s only used digitally. SVGs are a newer way to save out vector graphics to ensure they look crisp and clean on the web. Although SVGs is preferred for vectors on the web, PNGs can still be used in its place.

TIFFs have no place in digital design but are vital in print. TIFFs don’t compress a file the way JPGs do, and ensure full resolution, crisp images when printed. TIFFs also have a transparency feature — you just have to remember to check the “save transparency” box in photoshop before exporting!

Lastly, when saving out icons or vector graphics for print, PNG, EPS or even keeping the file in its native .ai (Illustrator’s raw file format) will still print properly.

Don’t undermine the effort it took to create an illustration or photoshop a picture by exporting it incorrectly.

Specs

Specs — or the dimensions of a piece — are equally important in both digital and print. Correctly sizing digital design work ensures the graphic will appear properly, whether it’s used as a cover image, blog header image, social post, advertisement or appears on a website or app. 

For print, questions like, “how will it fold?”, and “how should each page or section be laid out to optimize the user experience?” need to be answered before a working file is even set up.

A design for a folded brochure can look strange or seem unintuitive when seen on a flat screen. For example, for a horizontally folded brochure to print correctly, the back page will have to be on the top and upside down as seen on a screen.

Additional questions to ask during the layout phase are “are there other elements that go with this product?”, “is it going inside an envelope?”, if so, “how big is the envelope?”, and “once the asset is folded to its final size, will it fit inside?”

One easy strategy I’ve used to set up more complex print pieces is to return to pencil and paper. Even after years of experience in print, a complicated, folding asset is hard to envision. I cut and fold a piece of paper the way I intend the user to interact, and will write on each section what I intend to use that space for. Once I open it up and lay it flat, I have a perfect guide to set up my document.

When a design is transformed from a flat image on a monitor to an interactive, three-dimensional object, you don’t want to be caught with pages out of order, or even upside down. It’s as important as ensuring a digital banner image won’t get cropped awkwardly on the web!

Conclusion

This information may be second-nature to you or maybe it’s your first time seeing all the technical aspects to consider from the moment a document is set up to how to go about exporting. Either way, these seemingly small and technical aspects of design can make or break a piece you’ve spent hours perfecting. You wouldn’t pack your suitcase the same way to go to a luxury resort as you would a backpacking trip! Always keep in mind where you’re going, so you come equipped with the right tools.