Custom Printing: Effective Design for Both Web Layout and Commercial Printing Work

A single publication design that “works”–aesthetically and functionally—both on the computer monitor and on paper (in a commercial printing product) is rare and wonderful. Sort of like a unicorn.

With this in mind, I received an online prospectus from my fiancee’s financial planner this week and was struck by the graphic artist’s awareness of design theory, content organization, and how the reader’s eye works. I wanted to share this with you as an object lesson. Much of what you need to know as a designer, you can learn by studying this Blackstone financial prospectus.

The Financial Prospectus

More specifically, this is a Blackstone Real Estate Income Trust prospectus (usually provided as a small format print book), the driest of material unless you’re a stock market geek. It is one long document, clearly intended to be read online as well as on paper. So given the differences in reading style for online and paper-based information, this document poses a challenge. Moreover, it is mostly a black and white design. What it does best is organize information into manageable chunks (like an informational graphic), while highlighting the most important elements. Because of this, the reader can skim the document, immediately grasp vital data, and then come back for a closer review at a later date.

How It Was Done

The first chunk of copy comprises the title and the date in a large, Modern-style, serif typeface. It has been determined that online text is easier to read in a sans serif face and print-based text is easier to read in a serif typeface. Interestingly enough, the designer has improved legibility by making the headline and date large enough to be an aesthetically appealing design element (as well as content/information). She or he also set the title in a bold face and the date (in just a slightly smaller type size) in a roman face. The contrast identifies the two separate levels of importance.

Moving onward, the next graphic element is a solid, black box containing reversed type. Reversed type is harder to read in a print book (or other printed product) than black type on white paper, and this rule of thumb is doubly true for online reading. To compensate (and facilitate online readability—by old and young alike), the designer has made the type slightly larger and bolder than needed. This significantly improves the legibility of the white type on the solid black background.

Moreover, the designer has greatly increased the size of the statistics (“Total Asset Value,” “Number of Properties,” and “Occupancy”) of the Real Estate Income Trust prospectus. This huge size difference highlights three statistics that by themselves will hook anyone potentially interested in this financial opportunity. The reader’s eye goes directly to the statistics because of the size difference (with numbers about four to six times the size of the text copy).

In addition, the lines and strokes of the Modern-style typeface are attractive. The text is not purely informational. It is a design element. But if you have only an instant, you will see the large numbers, digest the data, and then have enough information to either read further or move on.

To distinguish among various chunks of copy, the designer also uses contrasting type size, bold vs. roman and bold italic type, and a thick white rule line to separate content into chunks and to identify the relative importance of these bits of information.

So far there has been no use of color. In a world full of color printing and online color, this financial prospectus already stands out because of its uniqueness (like the black and white Volkswagen ads of the 1960s). Therefore, the multiple tints of light yellow green added to highlight the four classes of investment shares in the next section both jump off the virtual page and are at the same time elegant. The green looks sophisticated and understated on the solid black background.

Supplemental type in the solid black box is set in a smaller (but still readable) serif typeface. While a bit harder to read than the preceding bar chart in various shades of green, the reversed type is still legible. At this point, since the reader will already have absorbed the gist of the information, the clarifying material can be a little harder to read without annoying an interested reader.

The Next Section

The next section is entitled, “Diversified Portfolio Concentrated in Growth Markets.” For many people, reading anything like this document would be akin to reading the phone book or a dictionary. But again, Blackstone has used graphic principles to pique interest, create elegance, and facilitate reading.

So far, visual information has been displayed in an info-graphic format, with the most useful information dramatically enlarged for instant recognition while also reflecting an aesthetic value in itself. This next section approaches communication in the same way.

This section is laid out in three columns, with a photo, “Property Type,” and “Metrics” side by side. The photos are all black and white, with a little more contrast than usual, which makes them look artsy. The numbers are, again, extremely large. Their letterforms, in the bold, Modern-style typeface, are graceful as well as informative. The explanatory letters and glyphs (“k,” as in “10k,” and “M,” as in “141M Square Feet”) are typeset either in “small capitals” or, if lowercase, in a slightly smaller type size than the main text. This two-tiered effect adds to the sense of elegance.

In fact, the whole vibe of the prospectus, with its mostly black and white color scheme and graceful large numbers and rule lines is a bit Art Deco in style. In fact it reminds me of F. Scott Fitzgerald’s work and the art of the 1920s. (The design seems to echo the tone of the Jazz Age.)

The Third and Following Sections

A “Performance Summary” chart follows, and it is organized with thin rule lines, a few much thicker rule lines, and tint screens, plus lots of white space. Everything is crisp and elegant, as before—in black and white. Finally, there are two pages of boilerplate financial information. It’s there if you want to read it, but because of the superb organization of all of the other material, you already know what’s most important. In fact, if you only read the huge type in the overall prospectus, you can still decide whether this financial product interests you.

Two pie charts accompany the text, and these are the final and only use of color along with the aforementioned light green bar chart. By being kept to an absolute minimum, the color absolutely screams for attention.

And now I will leave you with one final observation. Everything is flush left. Granted, this is easier to read than justified type, whether online or on paper. But beyond that, since as a culture we now have so much less time to read so much more information, we tend to skim. In fact, experts have determined that we quickly scan down the left margin of an online page and then only read toward the center of the page at the headlines. (This eye movement resembles the cross strokes or “bars” of an “E” or “F.”) We move across briefly and then jet down the page deciding what to read.

In Blackstone’s financial prospectus, the designer has used this awareness, along with an awareness of many other characteristics of reading style for online and printed text, to facilitate the reading experience. If you can get the reader to read, and if you can make this process easy and pleasurable, only then can you transmit the content that is the reason any printed or online product exists in the first place.

The Blackstone designer did just that.

What We Can Learn

1. 1. Readability is paramount. If you make reading hard, you’ll lose the reader. Enough said.

1. 1. Learn the differences between reading online text and reading text in commercial printing products. Study the mechanics of vision, and learn how the eyes change as the reader gets older.

1. 1. Group related information in your design work. Show the reader what’s most important, secondary, tertiary. Lead the reader’s eye through and down the online page or printed page.

1. 1. Consider the connotations of type styles, color schemes, and design grids as they relate to the purpose or theme of your document. A dramatic use of type size differences, in the preceding sample, both facilitates readability and gives the piece a feel of Wall Street during the Roaring Twenties.

1. The best way to learn all of this and make it second nature is to copy good design. (Stravinsky, Faulkner, and Steve Jobs all voiced some version of “Good artists copy; great artists steal.”). Create a swipe file containing print work (or print outs of online work) you like. Be able to explain how the form and style choices support the theme, meaning, or content of each piece.

This entry was posted on Monday, July 5th, 2021 at 7:03 pm and is filed under Design. You can follow any responses to this entry through the RSS 2.0 feed. Both comments and pings are currently closed.