Texture is a great trick to have in your back pocket. It can add a human, tactile element to otherwise cold digital work, or add a sense of vintage wear and tear. And while you can start piece in Illustrator, save it out, and texture it to high heavens in Photoshop, a lot can be done within Illustrator too. This is my preferred workflow, since it keeps you able to modify the artwork where it was made, and reduces the number of save-outs. I’ve included a handful of examples at the bottom of this post to show you what you can do with these tiffs.

Most of the textures that I work with are in the form of Bitmap .tiffs. Bitmap is an uncompressed image format made up of an even pixel grid. In terms of the textures I most often use, it starts with a black and white, pixel image — whether it’s a halftone, gritty speckles, a dither, or natural textures.

When you render an image into bitmap mode, you can save it as a .tiff and bring this into Illustrator to use as a texture. When you import the tiff, the parts of the tiff that are black can be colored, and the parts of the tiff that are white will remain transparent. It’s a handy trick to use, especially when you put them into clipping masks to help give the texture a defined shape and purpose. I’ll come back to this once we’ve made a few to play with.

How do you make a bitmap tiff?

In Photoshop, you’re probably already familiar with the RBG and CMYK color modes. Think of Bitmap as just another color mode, one that only renders an image in stark black or white. To get to Bitmap in Photoshop, you’ll first have to convert your image to Grayscale (Image » Mode » Grayscale).

There are lots of ways to make tiffs, but the most useful for me is a simple gradient. It can be in halftones (dots, circles, stripes, or if you’re fancy, you can make custom halftone patterns), or a grainy dither, but I find that having a nice fade in value is helpful for adding shading and highlights.

First, I’ll set up a file at 3000x3000 pixels, at 400 DPI in Grayscale mode in Photoshop. I like to work big when making these tiffs, so it’s easier to hide the jagged pixelated edges that come with tiffs. Then, using the gradient tool, make a gradient going from black to white. It can be helpful to leave a little padding on either side where it has space to be fully white and fully black.

Then, convert to Bitmap by going to Image » Mode » Bitmap. You’ll get a little pop-up that lets you configure bitmap options, and this is where the customization begins. Keep the resolution at 400, and change the method to Halftone Screen. Hit OK, and Photoshop will give you a second pop-up with more options to choose from.

Set the Frequency to 8 to start. The lower the number, the bigger the dot will be. This can be a bit confusing at first, but once you’ve done a few experimentations with the halftone settings, it’ll start to click! Set the angle to 0 to start out, and select round. Hit OK.

This is how it looks:

Depending on the illustration you’re working on, this might be perfect. If so, save it out as a .Tiff file, but do not change it to Grayscale before doing so. This is important! In order for this to be colored in Illustrator, it has to stay in Bitmap mode. If this looks too close together, undo and try increasing the frequency to 15 or 20. If it’s too small, decrease the frequency.

You can also change the shape of the halftone pattern:

And the angle. I like to keep the angle at 0 or 45, because they’re easier to tile next to each other. The tiff can always be rotated in Illustrator, so making an unusual angle has never really felt necessary, but play around with what works for you!

You also do not need to start with a gradient. Sometimes an even halftone is handy to throw into clipping masks. Experiment with the percentage of black you start with, because it will impact the outcome:

Instead of choosing the Halftone Pattern on the first screen, you can also choose 50% threshold. This is handy to use natural textures from photos you’ve taken—the tiff to the left is the stucco wall in a former apartment, and when the levels are jammed out to extremes, it can be a helpful speckle or gritty texture. There are no shortage of cool ways to make bitmaps. Experiment with your own photos, the different output methods, and frequencies and save a batch to play with. Add some texture to a gradient to create a more vintage-looking halftone, or try making a less linear gradient. Use natural textures from your own photos — see what you can do with marble, sky, wood, dirt or sandpaper textures.

Using the Tiffs in Illustrator

Now that you have a couple tiffs to use, open a new file in Illustrator and drag in one of these tiffs. It will import in black and white. Once you select the tiff, you can change the fill color! Everything that was black will now render in the color of your choice, and the parts that were white will remain transparent. There is no way to color this as a gradient, or to give it a stroke.

Success! Most of the time I use these within clipping masks, giving the texture a shape to live in. To do this, draw the shape you want, make sure it’s on top of your tiff, and with both the shape and the tiff selected, make it into a clipping mask (Object » Clipping Mask » Make, or ⌘+7). If you have two or more shapes you want to function as one clipping mask, you’ll have to first turn the shapes into a Compound Path (Object » Compound Path » Make, or ⌘+8), and then make a clipping mask as usual.

Things to be aware of

A couple quick cautions before showing examples! When using halftones, be careful of creating moiré patterns. Moiré’s are the optical illusion created from overlapping halftones, and often happen with two different angles or sizes of halftone overlapping. Whether this means you have halftones at 90° on top of one that’s set to 115°, or you have them rotated and scaled differently. While these can be fun to play with, and effective if used correctly, they often look really distracting and headache-inducing.

Because these tiffs work as linked files, I also recommend making a folder on your computer that you don’t plan on moving. I keep them all together in a folder called Textures, organized by Halftone, Dithers, Natural Textures, and so on. Otherwise, you’ll have to re-link the files every time you open the file. And when sending files to clients or to vendors, make sure you package your Illustrator file so that the tiff textures come with it.

Examples

I learned much of this process while working at Delicious Design League. It’s handy there especially because of how much work they do for screen printing, and even in digital work, clients come to DDL looking for that screen printed texture and aesthetic.

That’s it!

Learning about bitmap tiffs was one of the most versatile tricks I’ve picked up. It’s a great way to add a hand-made quality, show a little grit, and get weird.

For more examples of these textures in use, follow me on Instagram, or check out my website. Happy texturing!

Concept

With Typeforce on the horizon and my political anxiety reaching a fever pitch, I brought in a half-baked idea to my studio mates at Delicious. Now in its eighth year, Typeforce is an exhibition of typographic works based here in Chicago, founded and curated by Dawn Hancock of Firebelly and Ed Marszewski of the Co-Prosperity Sphere in Bridgeport. It’s an annual highlight and absolute madhouse, and I thought potentially the perfect venue for something like this.

Most mornings Tyler, Jason and I were the first three in the office, and increasingly often, we would find ourselves in a similar conversation about another weird article we’d come across. Blatantly false and widely spread think pieces were popping up faster than they could be tallied, and more worrying, they were backed with immense conviction. No amount of fact-checking could limit their spread, and worse still it felt like social media algorithms were being programmed to keep differing opinions away from us. It kept coming back—how do you speak truth to people who don’t share the same definition of truth? How do you bridge that great divide?

It was an idea I couldn’t shake, and one that eventually led me to sketch up an idea for a cut paper piece that would be layered to reveal a kind of dense typographic topography. Using snippets from fake news, hate mail, and whatever dark fan fiction Breitshart dreamt up, we’d build a maddening texture that felt as chaotic and overwhelming as my morning news digest. And so, with a hope and a prayer, we submitted the project. And to our delight, we were included in the lineup!

The Real Deal

Tyler and I grabbed lunch the Monday after the lineup was announced, and worked up a schedule backwards from the opening. A little more than four weeks and a mountain of work stood between us and the big day. We were organized, full of falafel, and excited.

After a little bit of trial and error, we came to a fork in the road. While we could continue as planned and construct the entire piece from paper, it was becoming increasingly clear that doing so would be a tremendous risk. The fear of going through all of this printing, cutting, and building time to have the piece wilt was just too big—coupled with the realization that we’d have to make some less than appealing design decisions to make the structure sound. So, with the curators’ blessing, we decided to print it on plexiglass, a huge leap of faith from the Printshop, who, I should add, were more than willing to tackle it. While Tyler went about ordering plexi, I brought my type sketches and layout into Illustrator, and we both dove head-first into the weirdest corners of the internet to pull headlines for the news texture. And with that, I handed the piece off to the more than capable hands of our printshop, and likewise, Tyler will take the writing from here.

Production

The sheer size of each panel pushed our screens and press to the absolute max with a 40” wide flood of ink—not to mention we printed all 24 layers using the same three screens over and over. In addition to the size, we had to print each layer backward, in reverse order on the underside of each panel of Plexi. Talk about a mind-bender. Our bigger press, Tatiana, was outfitted with a custom jig to hold each layer of Plexi in the exact place until every color was pulled. We pretty much registered each layer blind since there was really no way to use registration marks in the design. First, we went through and printed all of the red layers using the same transparent ink, then went back and printed each opaque color over top to create our layered effect.

In order to make this thing happen in two weeks, we needed to be extremely organized and systematic with how we approached the printing. Having only 3 screens large enough to print the design, we could put down a maximum of 6 layers a day. Our days in production looked like this: expose and print 3 layers, reclaim and let screens dry, throw a fresh layer of emulsion on each screen, let them dry, expose the next few layers, print those layers, repeat. Once we were set-up on press to print a layer it took 15 minutes total, but with 24 setups most of our time was spent waiting and balancing our regular workflow with this special project.

Once we had the printing down, the rest went so smoothly it’s hard to believe it even happened. As a printmaker with a few years and a lot of mistakes under my belt, I fully expected some silly slip-up to set us back, but because we put together a strict system and order of printing, nothing went wrong. When you looked at each layer side-by-side, they looked pretty similar (even in the digital file), but by dedicating a drying rack to this piece and labeling each layer number, we were able to work our way up the rack and print every layer in order. More than once Kyle confirmed our layer order and orientation, but once all the red was down it was easy to see how the opaque layers matched up.

The trickiest hurdle in printing these 24 layers was only having one shot per layer. We pulled test prints before each real impression to make sure the screens were burned correctly and leaving clean impressions, but when it comes to the Plexiglass, we had to trust in the press and let it do its thing. Each layer did not print 100% perfect, but knowing that it wouldn’t we were prepared with a paint brush and the appropriate ink color to touch up the impression as soon as it was off the press.

The Frame

With the panels printed and protected on the rack, we could start with building the frame. We brainstormed a number of ways to go about building and ultimately hanging the piece, all the while being conscious about the amount of wood we used.

Essentially, every frame was constructed like a giant shadowbox. For the sides and front of the frame we sourced a high-quality pine and used spare cedar planks from our office renovations for the spacers between layers.

We wound up losing a day or two with mis-cuts and other projects, but that’s bound to happen and with all hands on deck, we were quick to identify and rethink problems on the fly.

The bulk of the time spent building the frames was around finishing the wood. Once we’d constructed the outer shell for each frame, it was just a matter of nailing in spacers and dropping in each layer of Plexi. To top it all off, we built a top frame from pine, to secure the front layer in place. By the time we’d started the second box, we had our process down to a fine science and had everything tidied up between client projects.

The Great Divide

Delicious is a collaborative studio, made up of illustrators, designers and printers, but we don’t often get to go all-in office-wide on a project like this. This piece let us showcase the skills of our whole team, and we couldn’t be more pleased with how it turned out. And while we endlessly mocked this up, ran tests, and collaborated on its production, we couldn’t see the final piece until it was all finished. This meant relying on the trust of our team to see our project all the way through.

We also printed a limited edition run of 18x24" 3-color edition of the piece on French Paper’s unbelievably sexy Butcher Blue. 50% of the proceeds will be donated to the ACLU, who continue to fight hard for the rights of every American. You can purchase one here, and see more detail shots of the piece on the Delicious Design League site.

Link party:
Delicious Design League, Kyle Letendre, Tyler Deal.