[null, {"document_url": "http://apeonthemoon.com/2009/12/15/ben-the-illustrator-pattern/", "unformatted_src": "http://farm3.static.flickr.com/2753/4187696580_ae09533758_o.jpg", "src": "http://farm3.static.flickr.com/2753/4187696580_ae09533758_o.jpg", "formatted_filename": "ae o", "alt_text": "Ben O'Brien Tutorial on Ape on the Moon", "rendered_width": 600, "rendered_height": 485}, null, {"document_url": "http://apeonthemoon.com/2009/12/15/ben-the-illustrator-pattern/", "unformatted_src": "http://farm3.static.flickr.com/2765/4187680026_db0d8d7814_o.jpg", "src": "http://farm3.static.flickr.com/2765/4187680026_db0d8d7814_o.jpg", "formatted_filename": "db d d o", "alt_text": "Ben O'Brien Tutorial on Ape on the Moon", "rendered_width": 600, "rendered_height": 600}, null, {"document_url": "http://apeonthemoon.com/2009/12/15/ben-the-illustrator-pattern/", "unformatted_src": "http://farm3.static.flickr.com/2748/4186918609_21e2cc5fbf_o.jpg", "src": "http://farm3.static.flickr.com/2748/4186918609_21e2cc5fbf_o.jpg", "formatted_filename": "e cc fbf o", "alt_text": "Ben O'Brien Tutorial on Ape on the Moon", "rendered_width": 600, "rendered_height": 600}, null, {"document_url": "http://apeonthemoon.com/2009/12/15/ben-the-illustrator-pattern/", "unformatted_src": "http://farm3.static.flickr.com/2583/4187680542_5396a36c88_o.jpg", "src": "http://farm3.static.flickr.com/2583/4187680542_5396a36c88_o.jpg", "formatted_filename": "a c o", "alt_text": "Ben O'Brien Tutorial on Ape on the Moon", "rendered_width": 600, "rendered_height": 600}, null, null, null, null]
A few months ago I featured a selection of Ben the Illustrator’s special vector pattern illustrations.

In an interview-style tutorial, Ben is back to teach us how he makes them, showcasing one of his brand new patterns in detail. For those that don’t know about him, Ben the Illustrator (Ben O’Brien) is based in Cornwall, England, working on numerous projects with the help of his wife Fi. Ben always seems to be busy on something intriguing, so I’m very pleased he and Fi have found a bit of time to share their digital design expertise with us.

I’ve asked Ben a few questions as part of this pattern tutorial.

Tools required: Pencil, paper, scanner, Adobe Photoshop, Adobe Illustrator

How do you come up with a new idea for a pattern?

It’s pretty much the same as an idea for a regular illustration, it’s a matter of our mood, something that’s inspired us, or something we’ve not done before.  Pretty much everything I create along with Fi is landscapes, from the natural to the man-made, whether it’s for a pattern or an illustration, for a client, for fun or for our homewares products.

We will generally have the theme or subject matter before we’ve figured out how it will work as a pattern.  You could flip that and set out to think of something that will work as a pattern, but I relish the challenge of creating these patterns, it’s not something I have been doing for a long time, probably around a year now.

The key things I’ve learnt is to start fairly simple. Playing with crazy angles or textures and trying to get them to repeat, can be a nightmare if you’ve not got your head around the basics.  So we’ve done repeating patterns of mountain ranges, terraced houses, cable cars and sea otters, but we didn’t have one of perhaps one of our favourites views, hills, trees, lakes and cabins!  So now we’re creating one… Firstly, it’s often easier to work within a square, it will make your pattern a lot tidier once repeated (although a pattern will still work if the single tile is rectangular).

You’re going to draw your artwork, your one single pattern tile inside a square.

The golden rule is that if a line goes off an edge, then it has to continue in from the opposite edge. So if you draw a flat piece of land, and it goes off the right edge of the square, then that line has to continue into the left side of the tile. So in Figure 1, you can see the 7 lines that go off the right hand side, all come in again on the left.
 The same applies to the 4 lines that go off the top and bottom of the square.

To get these lines to always meet perfectly you could draw a measured grid, or work on a lightbox with a grid underneath.

If you have a line heading for an edge, but you don’t want to bring it into the other side, make sure it concludes right at the edge, like points A and B on the right hand side of the drawing.  The artwork in the middle of the square can do whatever you want it to!

What steps do you take before colouring the illustration?

I might clean-up the drawing a bit, especially if I’ve draw in my own guidelines or rulers all over it, then scan it in to the computer.

I’ll take it into Photoshop first, crop the page to the exact requirement and test the repeat, by just copying and pasting the square once on either side and above and below.  The quickest, neatest way to do this is to ensure the layer you are drawing on isn’t a background layer (if so, double click the padlock in the layers panel then click OK to make it a normal layer).

Click ‘Image > Canvas Size’ and enlarge both dimensions by 300%.

Select the ‘Move’ tool (the black select arrow) and hold down ‘Shift’ and ‘Alt’ while dragging the image to one side, it will pull a copy of the image and keep it in-line, snapping into place along an edge.  Repeat the copy/drag until you’ve got a cross, which will enable you to see every side of the original, central image tile, with repeats on every side as in Figure 2.

Figure 2: What is involved in adding colour and the finishing touches to the work?
I take it straight over to Illustrator and we experiment and play with it. I’ve always got the colour scheme and mood of the piece in my head when I get started, and I’ll already know the level of details I’m going to put in there, whether it’s a quick and free and easy doodle or a precise time-consuming and exact design.
In Illustrator you can fine-tune those pattern elements, the lines that will go off the sides to make the repeat work, use the rulers and grids and everything else to achieve the precision required of a good repeating pattern.

Figure 3 shows the final, coloured single pattern tile.

Figure 3: Below is the completed repeated wallpaper pattern, done and dusted! ⓒ Ben O’Brien, 2009
I’m going to get started on my repeating pattern right now, thanks Ben!



