Articles by Month: November 2011
Some introductory words
As someone who’s far from being a believer, Jim’s series first caught my interest because of the beautifully crafted visuals. Did someone say textures?
That said, I soon realized that Jim also publishes comments about the design and the word he’s illustrating. After reading a few, I realized that Jim was actually doing a pretty critical reading of the Bible, sharing his personal conflicts about the pieces and the book itself. This critical thinking has been of the utmost importance in my adhesion to the project.
As you’ll see in the interview, not everyone was necessarily happy with his approach or with the results of his reflections. Pretty strong stuff in my opinion. You’ll also see some amazing pieces of art, with great details. And even some humor. In short: good stuff.
Hello Jim, could you introduce yourself to our readers that might not know you?
Jim LePage: I’m an artist/designer from St. Paul, MN. In early 2010 I started a personal project called “Word” where I create designs for each book of the Bible. My goal was to combine something that often bored me (reading the Bible) with something I’m passionate about (design).
I saw on your About Page that you’re a designer for a church. Can you talk a bit about your experience with that? Anything that makes it really special?
JL: I work in the Communications department at Woodland Hills Church, mainly overseeing our graphic/web design areas. My co-workers are awesome and there’s a real high value on good design which is pretty unusual for a church. Church design is usually pretty safe and is rarely the place you’d find art and design that pushes boundaries. However, Woodland Hills has a bit of a reputation for their challenging, and often controversial, teachings. I think that has given us in the Design and Communications area some room to push boundaries and try things that other churches may not be able to do. That culture of boundary-pushing has definitely played into my Word series. And if you still aren’t sold on Woodland Hills, you should know that last summer, the church even helped send me and my co-worker to WMC Fest. So yeah, it’s a pretty awesome place to work.
I’m also guessing that faith is an integral part of your design process in that case?
JL: Definitely. According to the Bible, God is the most creative being that has ever existed. He rarely does what’s expected and sees things in completely unique ways. He’s the ultimate artist and is most definitely an inspiration in that sense.
Let’s talk about the “Word” series. Can you talk a bit about the inception of the project?
JL: I’ve always believed that the Bible was a powerful book. I really wanted to dig into it more, but honestly, it bored the heck out of me. Every time I resolved to read it more, I inevitably got bored and gave up. I thought that if I combined Bible reading with something I’m truly passionate about (design) that maybe I could stick with it and actually get something out of it. Every Friday, I’d post a new design and do a short (and usually irreverent) write up with my thoughts on the book and design. Nearly 2 years and 91 designs later, I’d say it worked out pretty well. If you’re interested, I have spots on my site that go more in depth about the origin of the project and what I learned from it.
Were you expecting to make it last that long from the start, or is it a project that just kept growing on you?
JL: From the beginning I intended for the project to run 66 weeks (one for each book of the Protestant Bible). It turned out that some books had too many great passages, so many books ended up with more than one design. I also broke from my usual schedule during Easter 2011 to add a 7 design series based on Jesus’ death and resurrection.
As faith is so personal, I’m guessing some of your designs sparked some intense debate and discussions. Any examples of that?
JL: I’ll start off by saying that most of the feedback I’ve received has been and continues to be positive. In fact, I heard from quite a few folks that don’t consider themselves religious at all saying how much they liked the project. I’d like to think that my designs offer a different take on the Bible than most religious art, and it seems like there was an audience that appreciated that. That said, the main negative feedback I got was from Christians. Many of my designs and write-ups are irreverent and contain images and words you wouldn’t associate with church. My design for the book of Nahum features a close up of my hand giving the viewer the finger. Some designs are violent or depressing. There are designs and write ups that contain swearing and many others contain some very honest confusion and doubts. Like I said, most folks really seemed to connect with that, but there were some people who thought I crossed the line a few too many times. And I probably did, but for me, with design and faith, I think there’s a lot more opportunity for growth and honest discussion when you’re willing to cross a few lines than when you’re being so careful that you never get close to one.
The post that sparked the most debate and feedback was “Jesus Christ: Terrorist Killer?” It wasn’t part of my Word series, but was based on the stuff I was learning by doing the series. After Osama bin Laden was killed, many American churches participated in the celebration that followed and in some cases even endorsed the killing and insinuated that God was happy about it. My design and post questioned how so many churches that claim to follow a man who willingly died for his enemies could take part in celebrating the death of their enemy. It got a lot of reactions and not all of them were from people who agreed with me.
How did the work on “Word” influence the rest of your work?
JL: It influenced me in a lot of ways. Before the project, I never would have called myself an artist. I was a designer, someone who takes other peoples ideas and helps to communicate them. With Word, it was a very personal thing. I was the one coming up with the ideas and I was expressing myself. Having to do one every Friday also helped me hone my design and writing skills. Also, due to some publicity about the project, I got more requests for freelance work, which has been great.
Any favorites in the series? Why?
JL: I like different ones for different reasons, but I’ll go with a couple of the older ones here. I was going along pretty well until I hit the book number 6, Joshua. For those of you who haven’t read it, Joshua is an extremely violent book. God’s chosen people, the Israelites, regularly massacre entire cites (men, women, children, animals) seemingly at God’s orders. This was the point where I made the decision that I wasn’t going to do what I’d seen done so many times, which is to gloss over or minimize difficult verses, passages or books. When I read it, the book seemed bloody, brutal and ugly and so my design was as well. I didn’t like reading the book or creating the design and I said that in the write-up. Looking back, I realize that book was the one where I made the decision to value honesty over propriety. If there’s crap like that in the Bible, I need to acknowledge it.
When I began the series, I planned to use the same font and background image all the way through. I thought that would make things easy, simple and keep the project from becoming so intimidating that I bailed on it. By the time I got to the eighth book, I realized that the parameters I’d set up to help make things easy were actually making things boring. The creative part of me felt boxed in. I decided to ditch those parameters and start making each design unique. The first design I did that with was 1 Samuel and the story of David and Goliath. As I read it, I was struck by all the smack talking that went on, which reminded me of how boxers will some use verbal sparring to hype things up before a fight. Before I knew it, David and Goliath became a vintage boxing poster. Looking back, I see how that design launched me in a direction that allowed me to explore and experiment visually.
Were any of them a problem to come up with, conceptually or design wise? Why?
JL: A book like Genesis is easy. There are so many great stories in there, the hardest part is narrowing it down to one (which why I did 3 designs for that book). But there were some really tough books too. In the Old Testament, there’s a series of 12 Minor Prophet books. In a nutshell, they are short and full of wrath (at least that’s how I was reading them). I thought I’d never get out of that section. It ended up being a really great exercise though. I had to learn how to create a design for books that were very short on content and that, frankly, I wasn’t very inspired by at the time.
Any last words before we part?
JL: Yes! Several last words, in fact…
First of all, a HUGE thanks to Simon and all the Go Media folks (From the editors: you’re absolutely welcome!). My designs were in many of the monthly Go Media Flickr showcases over the past 15 months or so. Plus, I was able to make it to Jeff Finley and Go Media’s WMC Fest in June of 2011 which was super inspiring and has definitely influenced my work since then. (You should all go in 2012.)
One of the most common questions I get now is what my next project will be. I’m actually working with my buddy Troy DeShano (AKA Strong Odors) to put together a collaborative design project called Old & New. What Dan Cassero’s 50 and 50 did with state mottos and Evan Stremke’s Momentus did with U.S. history, we want to do with the Bible. We plan to have a wide variety of contributors. From Evangelical Christians to Atheists to those who may have been burned by the church. My Word project had only one voice – me. Old & New will have many. We’re hoping to launch that in early 2012 so stay tuned.
Another question I always get asked is “Are prints available?” The answer is yes. All the designs are available as prints in the U.S. and Canada as well as internationally.
Lastly, since the Go Media community has given so much to me, I thought it would be nice to return the gesture and give away a 16×20 print of my Word Bible designs. They are museum quality Giclée prints. Follow the guidelines at the bottom of the post to enter.
The (selected) works
As Jim said, there are 91 designs in the series. You can go on his site to browse through the whole collection. Here are some of our favorites.
The icing on the cake: a giveaway!
As Jim just said, there’s a giveaway!
Pretty simple rule: leave a comment below to be entered, with a valid email address for us to be able to reach out if you win. The winner will be chosen at random one week after this post is published. The prize is one print of your choice, and it’s open to readers worldwide!
LetterMPress, or the art and craft of letter press design… On your iPad!
I was sincerely blown away by what this app can do. I knew drawing apps could be amazing — just look through George Coghill’s Flickr stream, he has some sweet preliminary sketches done with Sketchbook Pro — but simulating letter press design?
Another fact of interest is that the app’s development was funded through Kickstarter, like the last WMC Fest.
After a series of email with John Bonadies, the co-creator of the app, we got a chance to get the app for both the iPad and for Mac OS. My goal here is to offer an overview of the app and a series of observations I made while using the app on the iPad and on Mac OS on a MacBook Pro from early 2008.
The application simulates a letterpress; it’s a simple as that. And, it’s beautifully done, even the sound effects.
The main screen is the composition screen. This is where you’ll actually design and place the letter blocks to compose your project. The second screen is the print screen, where you’ll generate the digital output of your composition.
A little disclosure: I’m here using the screenshots provided by the LetterMPress development team. They’re able to showcase the abilities of the app way better than I would.
Aside from these two screens, users have access to drawers (sub panels) full of goodness:
- The type and art panel where you select the blocks you want to use in your design
- The furniture panel where you can find the elements for spacing and alignment purposes
- The lockup panel where you can access the elements that can lock the blocks you have on the press bed
- A digital ruler
- The gallery tray where you save and can retrieve for later use the compositions you’re working on.
These were for the compose screen. The print screen gives you access to:
- The paper tray where you select which paper you’d like to output your composition on
- The paper rack where your outputs are stored
- The ink palette where you’ll be mixing your primary colors to get the one you want (RGB or CMYK)
- The coverage panel to decide where the ink will be applied. You can also do multiple impression on one sheet, to play with color/symbol layering and overlays.
Some examples of what you can do with the app
There’s also an official Flickr group where people upload their designs:
Some conclusion notes
Well, first of all, the app is wonderful and produces beautiful results. The output is usable as an element in another design software (the Mac app can output up to 8192 pixels, around 26″ at 300 dpi). I surprised myself smelling the air around me for the really peculiar fragrance of the printing ink sometimes. With headphones on, this app can transport you into a virtual print shop.
I definitely favor the Mac version over the iPad version simply because of the additional precision given by the use of the keyboard and mouse combo.
With that said, I still must admit that the iPad app is one of the most beautifully crafted apps I’ve seen to date. It takes patience to place elements correctly, but the result is always worth it. The app also renders the fact that these blocks are physical objects and that when hitting other elements with a block you’re trying to place, everything that’s not locked in place will move — and mess up the carefully crafted kerning and spacing you just spent an hour perfecting. Luckily, the undo button goes up to 20 states back.
The paper and typefaces are amazingly well rendered. The ink textures (or the absence of ink for that matter) too. The interface can be overwhelming at first, but after reading the extensive help file and a bit of “trial and error” experiences, there shouldn’t be too many dark areas left.
This app is not a toy though. It’s a real design app. But well worth the $5 to $10 it’ll cost you.
How Imaginary Forces brought the Science Channel’s “Morph” logo to life
Like a tadpole that becomes a frog or a caterpillar that transforms into a butterfly, the Science Channel rebrand began with a fledgling logo designed by Discovery Communications that had a lot of potential. Fittingly, they called it “Morph.” And, they wanted Imaginary Forces to orchestrate the metamorphosis of the little black oval-shaped logo into a character with a shape and personality that could literally morph in different ways to correspond with Science Channel’s programming.
Imaginary Forces gave Discovery’s black, egg-shaped Morph logo a wide array of characters and personalities to correspond to different network programming.
The idea, says Ronnie Koff, creative director on the project and the designer responsible for a long list of titles and trailers, including “Transformers: Revenge of the Fallen”, was to make Morph visually compelling, but also imperfect. “We wanted the science robot, for example, to have scratches, and look worn and dented,” he explains. Confronted with the design challenges of the project, Imaginary Forces opted to use Maxon’s Cinema 4D, “because it’s fast and allows artists to work in an intuitive way.”
The robot-like Morph character looks menacing but retreats into its shell when it gets scared.
It becomes robot-like for Popular Science’s “Future Of” and other science/technology shows — Morph is funny, bouncy and full of energy for sports programming. Changing again into something more organic in an amoebic way for sci-fi shows, Morph can also become a mechanized-looking nautilus shell, a jellyfish, an urchin-like creature and the universe. At some point, though, Morph always turns back into its original, black, egg-like shape. (You can see the network rebrand on the Imaginary Forces website.)
Koff says the unconventional rebrand is meant to “take the edge off science a little bit” and give the Science Channel a fresh, new look that appeals to wider audiences who appreciate offbeat offerings like ‘The Idiot Abroad.’ “Science doesn’t traditionally have popular connotations, so we wanted to do something that turns science on its head and offers the perfect storm of elements that make a really good brand,” he explains.
IF’s creative team used Cinema 4D’s displacement maps to create the urchin character’s many spines.
From the start, the network embraced the idea of creating a wide range of Morph characters for promos, network IDs and logo bugs. “They were in it to make it good and they were great to work with,” Koff recalls. “I would throw ideas by them and they would love them or we would work together to change them until we all loved them.” All told, very little actually changed between initial concepts and final execution. If anything, he says, some ideas became simpler and more iconic “for the immediacy of TV.”
Not just eye candy
There is a fine line between making eye candy and making something clever, Koff and his team believe. That meant nothing they created was arbitrary. The robot, for example, was based on a pillbug or (or roly-poly bug). “He has the same kind of shell and exoskeleton and we designed him so when he gets scared, he can roll up inside his shell,” says Koff. (Check out the robot clip here.)
Modeled from propane tanks and auto parts, the nautilus shell was hand-animated in C4D.
And though the nautilus shell is designed to look more mechanical than natural, it is based on an actual nautilus shell found in nature. Made from car mufflers, lawnmower engines and propane tanks that they cut into pieces, the shell is meant to look as if it were built in someone’s garage by backyard hobbyists. “Throughout the brand we tried to give Morph more layers of meaning, aside from just looking cool,” Koff explains. “So it’s mechanical in content but rooted in science.”
Imaginary Forces used The Pixel Farm’s PFTrack to track the motion of the hand in the universe-themed spot. Data was brought into C4D where they created the universe, which includes a destroyed planted, modeled with ZBrush.
With just two months from start to finish to complete the project, Koff and two other designers had to work fast to design the 200 elements that made up the final rebrand. He credits C4D with helping them make their deadlines. “We did have some time to craft things,” he says. “But in TV you do something and they show it to 15 people and you have to redo a lot, so nothing can take an hour per frame.”
The urchin’s spikes, for example, were all done with displacement maps in Cinema 4D. (Click here to see the urchin clip.) “We didn’t have to model it all out first we just used deformers,” Koff recalls. “Same thing with the robot and other characters: we just modeled, textured, animated and rendered in Cinema and we were able to do so much so fast.” For depth of field Koff’s team relied on the Frischluft’s Lenscare plug-in (Learn more at the Frischluft website.)
The jellyfish, which was used for programming about unusual hobbies and creatures, retains the jelly-like aesthetic of Morph, says Koff. “And by taking it out of the water it becomes an oddity.”
C4D’s noise shaders also came in handy when the team needed to layer many different textures for things like the meteors in the universe network ID. “When we made the universe Morph we thought it might be intriguing to put this tiny alien universe in the palm of someone’s hand,” recalls Koff. That way, the logo could connect more directly with shows like “Through the Wormhole” by marrying human investigation and space.
Making space feel miniature was a unique point of view for the design team to take on, he says. In contrast, the urchin Morph, which should logically have been small, was scaled as if it were a huge building. “So we were able to go from micro to macro in a single network package,” Koff adds. Watch the universe ID here.
No longer bound by static, print conventions, the Morph logo is free to move around and assume many forms. This, IF says, is the future of logos.
While final compositing is done in After Effects, Koff usually has everything go through Imaginary Forces’ Flame department before delivery to be sure everything is good to go. “I like to do final color correction in the Flame and in this case, with so many elements to deliver, it really helped to just pull them all into our Flame to keep them organized.”
Logos for the future
Imaginary Forces describes Morph as the logo of the future. No longer grounded by the constraints of print design, the logo is free to move around, making it suitable for the motion-graphics-driven media of today.
“Static logos are a thing of the past,” says Koff, who has a graphic design background. “It’s not that I don’t understand the logic behind print design. It’s that things have changed and now every time you see a logo it’s usually in some form of moving media, so there’s no reason to have print design be the foundation for logos anymore.” Not surprisingly, this stance has drawn some critics. But that’s okay with Koff.
“People are polarized about this network branding and whether it’s the future and that’s what makes it worthwhile,” he says. “It’s fun to kind of pull at those strings and stir people up. We’re supposed to evoke emotions.”
Go Media president Bill Beachy sits down to give you some daily inspiration and advice. Bill shares his years of experience building Go Media into the company it is today. Topics in this video series include Getting Started, Happiness, Humility, Patience, Flow, Focus, Productivity, Business Systems, Courage, Eating Well, Obstacles, and Creativity.
For more information about Bill Beachy, check out his bio on gomedia.us. Bill is currently accepting opportunities to speak at your event, university, or business.
Sponsored by Prooflab
The Daily Inspiration video series is brought to you by Prooflab – a client and project management app built and used by Go Media for designers.
Hope you enjoy the video!
Or download the podcast
Hey everyone. A while ago the awesome folks at Go Media asked me if I was interested in writing a tutorial/case study. I was absolutely honored by the inquiry so I obviously took the opportunity.
The result of the case study and tutorial is this post. With it I will give you some insight in one of my recent projects, as well as a tutorial on how I made the concepts that pass along in this article.
So, who am I? I am Maarten Kleyne, a freelance graphic designer from the Netherlands who specializes in design for music. If you went to the Weapons of Mass Creation Fest earlier this year, which Go Media/Jeff Finley hosted, you might have seen some of my work at the design show. I was one of the proud designers who had their work exhibited at the Wall Eye Gallery during this incredible festival.
For this article I chose to dive completely into the album design project I did for Irish artist Andrew Danso and his newest EP named ‘f i n d‘. Here’s a preview of the final design:
When Go Media asked me to do this I was pondering over which project might be the best fit for such an article as this. After some thinking I decided to use Andrew’s project because it was, as you may notice during this read, not a very typical client project. There’s quite a story behind its process, so I thought that would be interesting. Because of the nature of this project I am also able to show you how we (Andrew and I) went at it from start to finish. This article contains the occasional quote from conversations between Andrew and me in order to show you why we made certain decisions as the project progressed.
How it started
Back in February 2010 Andrew Danso contacted me about his second solo-album project which he had planned. He asked me to do the artwork for it. A little more background detail: I had already done the design work of his first solo-album and his band’s (/Tera’s) debut-album prior to this project. So we were quite familiar with each other when we started it. This project started out with the name Blue2, which was a reference to Andrew’s first solo-album named: Blue Hat Thinking.
“Blue2 is me getting away from everything, and especially the buildup of me leaving my home country to live elsewhere. It’s also about me getting away from the political and social loathing of Tera. I’ve even got away from my Metal influences, looking more toward the other genres that I love (electronic music, jazz, avant-garde etc). The EP is made up of 9 tracks, which reflect different themes that I’ve been killing myself to do for a long time. The EP revolves around many themes, but I don’t want it to rest on one genre, or one theme. I want it to reflect many themes, and other types of music I would’ve rejected perhaps a year ago. Most of all, I want the EP to reflect a sort of appreciation of art, and how much more open minded I’ve become over this year in particular.”
In terms of artwork, Andrew gave me a free pass to do whatever came about in my mind based on his explanation and some more details. A few days later I presented the near-final concept to him. I will keep this shorter because we ended up revamping the entire thing a year later. Here’s that concept I made for Blue2:
With this artwork I reflected the feelings of leaving for good, being free and more accepting of rejections from the past. There’s some more aspects, but like I said: I’m keeping this one short. In this cover I highlighted a new start and the path towards a brighter self. I also tried to reflect the part of appreciation and being more open minded; the acceptation of past denials.
I visualized that with the visage on the front cover, the man with his arms spread open embracing his new future image. Evidently the EP sets a more dramatic mood, both that and the actual title of the EP made me go for the color usage as it is.
Reinitiating the project
A year had passed.
In the meantime, Andrew Danso and his project had been through a whole bunch of changes. Because the story had changed over time we felt that the EP had outgrown its artwork. In a cover design I strive for a solid visual interpretation of the story, which was not the case anymore due to the shifting of ideas. So we decided to revamp the entire artwork to match the new story of the EP.
Before I start showing some actual images, I’d like to show you how the concept phase went. It mostly consisted of conversations, brainstorms, sketching thoughts and whatnot – you know, the dry (yet important) stuff. If you bear with me, this will give you some true insight into the “Why?” on which I later on based my design choices, arguably the most important role of the designer.
“I guess I’d give you a much more concrete idea of what I think the EP is about now, but I’d also want you to make it feel about something personal too; for you to go on your own journey when listening to the music and relate those thoughts into the cover design.”
However, instead of roaming free I suggested we’d collaborate closely on forming the new album design. Andrew told me he had always wondered how I went about creating my designs, so I figured this would be a great opportunity for him to see up close and personal. Firstly I asked Andrew to elaborate on that idea of what the EP is about.
“There is no big vision. There is no grand story pulling all of this together. There is no schematic background. It’s a little record on a collection of ideas. The ideas themselves have their own backgrounds. The two themes that reoccur throughout the EP are something moving away and coming back.”
He also provided me with detailed background stories on each track. Most of it was quite moody and perhaps even sentimental. All together it explained something of a two-part journey. Aside from his thoughts I asked Andrew if he could give me some rough versions of the tracks he had so far, so I could truly experience the mood of this EP. Most of the tracks were experiments, embedded in those various genres which Blue2 started out with. The whole vibe contained several mood swings.
I decided to make some sound sketches on paper to visualize those moods. That’s not something I usually do but I wanted to make sure I’d catch the right vibe, tempo and atmosphere so I wouldn’t create something out of place. (For example: a crowded and heavy design opposed to relaxing and calm music.)
He gave me 3 tracks which defined the entire outlines of the EP. I listened to those tracks and started drawing simple figures based upon the tempo, volume, instruments and overall sound. Like figurative visualizations of those tracks.
My notes to Andrew about these sketches:
“As you can see they mostly are pretty calm and relaxing, which I think your music is as well. My conclusion would be that a crowded heavy album design would be out of place. Considering the sample tracks I think we should go for a more relaxing/calm cover (in its overall presence). I do think we should strike a moody nerve, because I think that fits the big picture best…
•…I want to give it a serene vibe with a moody color palette. I have made a mood board according to these two terms.
•I’m thinking of creating a feeling of nature, much like some of the pieces on the mood boards. Only then I will create the entire imagery myself using several photographic materials. Afterwards I will give it this serene and moody coloring. I feel that it would fit the relaxing vibe of the music and the dramatic essence, however small that may be, of the story.”
Mood board #1
Mood board #2
Andrew Danso also sent me a heap of cover designs he personally liked, here’s a few:
During the concept phase I constantly shared my thoughts with Andrew about how I interpreted the music and story. He would then reply to that, which totally made me grow into his story. I actually made a few mind maps with terms that I felt related to all revolving Andrew’s music and story. At one point Andrew told me the extensive concept phase resulted in a better understanding of his own EP for him. That was very interesting and it felt quite nice; that the way we handled things resulted in a better understanding on both ends. On another note, it also made him decide to rename his EP.
“…trying to explain the EP as best I can. It’s actually been very useful to figure all of this out.
I have been thinking of renaming the project. I’m not sure how the Blue² title really relates with the current material now. Initially it was supposed to represent a continuation on from Blue Hat Thinking, along with the colour representing calm, and a kind of placidity, as the album isn’t grounded in anything metal. But now, since the vision has changed, I’m going to try and go with something more relevant. Something perhaps relating to a journey. Anyway, I’m still figuring this out.”
“Setting a great title is hard, I can imagine. Perhaps you should make a mind map yourself as well. Write down EP in the centre and start adding words around it which come to mind when you think of the EP, make sure to do it unrestrained. Just write down anything, even if your feeling says it’s irrelevant and makes you refrain from writing it down. Just let it flow. When you’re down try associating words together with the same relevance and I’m sure you will come up with something good inspiration wise. (It’s just a technique, but of course there are many more and I don’t know which work for you.) I will be doing the same for the design process.”
“I’ve definitely learned tons about the EP, and in that, even a little more about myself. It’s been a really valuable, and exploratory experience.”
So somewhere along the road Andrew had decided to change the EP title to: f i n d.
“I’m going to call the project/EP “Find”. I think it suits the ethos of the entire piece. I figured out earlier that a lot of what I’ve done has been a catharsis of sorts, and that my head has been at a different place over the past year, trying to discover and adapt with change.”
Here are some font explorations I tried with that new title:
And a little how-to
Time for some action, don’t you think? With the concept phase behind us, I finally started designing. My traditional drawing skills are very poor, so I’m afraid I have no pencil sketches I can show you. At this point I dove into Photoshop and went ballistic.
In a bit I will show you, step-by-step, how I made this concept. But first here’s the final image of that and some explanation behind it to start with:
I set the atmosphere of this concept out to be incredibly dark. (Which would bite me in the ass later on.) I tried filling it with dread and horror, making it feel very hallowed. This concept was mostly based on the mood boards I made earlier on and the following terms: searching, experimenting, moody and striking. Because the EP contains a lot of experimenting and ‘searching’ I used a kid image in this concept. I feel that as a kid you’re always busy adventuring, searching for interesting things and experimenting. I emphasized that feeling with a dark house in the woods, which would be a true adventure to a kid. Do I dare to go in or not? There was more to it connecting it to the concept phase, even a metaphor of sorts, but I’ll keep it at this.
Now I’ll show you the step-by-step process this concept went through. If you want to experiment with me you’ll need to following things:
- A computer/laptop with Photoshop (obviously)
- A decent amount of various source/stock images
Start by making a selection of the various source/stock images you’ve gathered for your concept. (Always have back-up subject images, in case the ones you plan to use don’t work out during the process.) Fire up Photoshop and create a new document on 300DPI and the desired canvas size. (The canvas of my document was: 13 x 13 cm on 300DPI.)
This might be a no-brainer; but make sure that the source material you’ve selected is large enough for use on the canvas you’ve selected. The following stock photographs were the 2 core images I used, alongside a bunch of others from which I picked minor details (such as the trees and bushes):
Add the core subjects to your canvas and create the base composition. In this case: remove all the saturation from the images and work on a sketch look (low transparency). We’ll heavily bump up the contrast on all of this later on. Place the subjects on separate layers and give those the blending modes: soft light, screen and/or multiply. Also add a layer with shades of grey underneath (on multiply as well).
Add more of those layers with shades of grey (try experimenting with the transparency levels as well) underneath the subject layers. This way we build up the contrast. At this point I still kept the area of the boy rather highlighted.
Work more on the darker parts/shades to dramatize the lightening on the scene. (The true light fall will come later on.) Also add some shadow to the corners to add a vignette kind-of effect, to draw the eye more inwards. I also lessened the highlighted area around the boy a bit by adding more shade to the outer parts of that glow.
As you may notice this entire piece falls or stands with the lightening/shading. Which is why I’m still working with black and white at this stage. You can do all this with black and white brushwork on separate layers, experiment with blending modes and opacities.
Try to keep a keen eye on the depth aspect. If you have a look outside you will see that the farther something is the more blue-ish/vague it becomes. So: depth, keep an eye on it. Compare it with a view outside if you must, I personally think that’s an easy method. The point is to make it feel ‘natural’ so that the viewer might actually believe it. Even if you’re creating an abstract or surrealistic piece, try to make sure that the depth of the image is believable.
I added more bushes to the left bottom corner and house to fill it out more. I also amplified the vignette effect slightly.
Now go dark. Add the adjustment layer ‘solid color’ to your document using a dark grey color, such as: #404040. Place this layer on top of all the others with the blending mode: overlay. Duplicate this layer and set transparencies to 50% and 80%. All the shading and highlighting we did before will come back later, so don’t worry. (Suggestion: try experimenting with different transparency levels.)
Go even darker. (Yes, even more.) Add the adjustment layer Black & White on top. Set it to: high contrast blue filter. Be sure to check if this still works out for you once you start coloring the artwork. Also add the adjustment layer ‘Brightness/Contrast’ with the values: -15 and -20. Which pushes back the lighter areas and makes them feel more natural (or ‘nightly’ in this case).
Let’s add that dramatic light fall. Draw some soft white and light grey brushstrokes from the top right towards the roof of the house and a bit over the centre of the scene. Use gaussian blur to soften the effect and make it look like fog. Set the layer’s blending mode to overlay with an opacity of 40%. Duplicate the layer or simply create another one to emphasize the effect.
So, the composition and lightening are solid. Now let’s add color. For this concept I wanted to create this incredibly dark atmosphere. So I chose to use colors matching that and the mood boards I had made before. In my mind these had to be darker shades of green and blue. Here are the mood boards again for easy reference:
There are various techniques which you can use to add color. I will show you a mixture I regularly use when working with a black and white start. First add the shades of green to form the foundation, we’re going to build up on that green base. I added the following gradient twice with the blending modes normal and overlay and opacities 15%/30%. Focus the gradient on the composition/subjects on your canvas.
Some color codes I used which you can try: #facb61 (yellow), #587153 (mid-level green) and #112120 (dark green/blue).
Then I added some grungy textures with low opacity blending modes on multiply and soft light. These textures also contained matching greenish and yellowish colors. This resulted in the following:
(A proper texture you could use for yellow is this one. Use it on a low opacity with the blending mode: multiply.)
So that’s way too green, right? Compared with the mood boards it is. So let’s draw that more towards a blue tint. To do so, add the adjustment layer photo filter set to cooling filter (82) with a density of 25%. (Blending mode overlay on 30% opacity.) This also boosts the contrast, makes the image less pale and the blue of this filter enhances the actual feeling of the sky in this image (because it mostly alters the green levels we have there).
You might think this isn’t going to cut it, because it doesn’t feel right yet. That’s because I only needed these colors to form a base upon which I was going to continue the rest of my coloring. So at this point they are just that: a starting base so we can start creating the right mood.
I brought in one of my favorite adjustment layers, one which can completely alter the vibe of an image. A tool which you can use to quickly adjust the colors of any image. Add the adjustment layer: color balance.
Experiment with the various tones of the shadows, midtones and highlights. Adjust them until you find a color scheme to your liking. This is a very powerful adjustment layer in my opinion and I highly recommend experimenting with this in various artworks.
In this case I had set the following values:
Now that’s more like it (more natural feeling). Again, I kept the mood boards as a reference point. At this point I still felt that something was missing, something truly striking. So it’s time to add the true drama, time to work with reds and oranges. To be more specific: we’re going to work on the boy and his highlighted area, because that’s the main subject of this scene and the only thing we can enhance. (Also, the dirty yellow area around the boy simply felt wrong and out of place to me.)
You can brush on layers set to multiply and/or soft light with lowered opacity. You can also use textures or water color images containing red, yellow and orange colors. If the edges of those source images are too rough you can use Gaussian blur on them for a better color flow. Use any technique you prefer.
Here’s how my brush work looked on 2 layers, which I then set to multiply:
What I did there resulted in the final version of this concept:
I hope you learned a thing or two from these few steps. To summarize the core steps involved: brushing, highlighting/shading, using the blending modes of layers, using the opacity function and the adjustment layers. As you can see, the lack of traditional drawing skills doesn’t matter in my case, you can build up an artwork using images solely for their subjects form. Creating a scene with a sketch look and work its lightening plus coloring from scratch.
End of tutorial #1
OK, so now we have this dark concept. Earlier on in this article I told you this would bite me in the ass. Here’s what followed:
“In contrast the music on the EP feels quite different. It feels relatively spacious, and calm. It feels brighter. Maybe my ideas come across dark, and complicated, but the end result seems to be something quite colourful. I’m ultimately not sure if this image fits with the sound. It might reflect some of the darker feelings I’ve felt over doing the EP, but I don’t think this is a dark record. I suppose as dark as moody goes in my eyes. Don’t get me wrong; I think this an awesome piece of art. It reminds me a lot of a metal or rock cover, as most of these bands are usually airing negative sentiments. Something Katatonia, or Opeth would vein in.”
“I do agree that I set out to make it calm and spacious. I tried to reflect that in the mist and natural vibe of the design. Anyway, it may be a good design but if it isn’t fitting, it’s nothing more than that. I think I focused a bit too much on your darker perspective over the entire past year.”
So we went for a second concept. This time I weighed more heavily on the terms: calm, spacious and colorful. Yet still quite moody and with a twisted atmosphere. I thought the boy concept quite fitting so I kept that intact. Which resulted in this:
Before I dive into some tutorial details, again, here’s what followed:
“Yeah, that concept is beautiful. I think it relates to the musical idea of the EP nicely. It’s got a huge ambience about it, it feels bright, and distant. To me it’s almost existential in a way, with the boy traversing in such a grand landscape. The radiance or flurry of light surrounding the boy says to me some kind of empowerment. The colours feel powerful too. They’re really striking, as I had to peel my eyes a few times before I could understand the colour scheme. On hindsight, that kind of said some sort of awakening to me – I’m not even sure you were trying to make this point, but nonetheless, it’s a beautifully subtle one. Metaphorically it says a huge amount, to be so brightly lit amongst a barren landscape.
But then, I’m wondering why I felt doubtful toward the image. I’m not sure why I can’t really get to grips with the art, but something in me keeps nagging. Is it the boy? Is it the distance? On the other hand, is it the power? Is the image too dramatic? Is it the colours? Ultimately, why didn’t it feel right? I think I’m looking for something less on Find, I’m sorry about this.”
While discussing these first two concepts Andrew Danso shifted towards a favor for macro imagery. Some more conversation and reconsiderations came to pass in the meantime. Eventually we decided to drop the chosen subject and move on to a more abstract macro concept, mainly because he wasn’t completely feeling this second concept either. Here’s a part of our conversations in which he supports that macro thought:
“…I kept looking at the leaves, flowers, shrubbery even just the greenery itself and I was thinking that shots like these would somehow encapsulate my ideas. I’ve only realized now, that I keep thinking of a macro shot for the EP’s cover (and thank you so much for getting me to this point). The reason for this, is that the small details of macro photography tend to reveal a bigger picture – and I think this says tons about the EP. It’s so simplistic, and close.”
I created this concept the same way I created the previous one, I applied the same techniques and workflow here. Considering there’s not much difference between the workflow on both concepts, I will simply show you the parts which were slightly different, parts which I think could interest you.
(Fire up Photoshop and create a new document on 300DPI with a canvas of: 13 x 13 cm. Add the core subjects to your canvas and create the base composition. Again: remove all the saturation from the images and work on a sketch look (low transparency.)
Here’s the build-up of my composition from scratch:
OK, so now we have the rough concept sketch. What’s different in this image are the rays surrounding the boy, with which I tried to empower the boy and focus. I will show you how I built that up. My buddy and fellow designer Michael Ostermann once gave me a set of wired images he made with a vibrating pen (yeah those old school things) which I used to create the rays. Here are a few examples of the ones I had chosen to manipulate.
I started cutting out a bunch of the wires from these images and inverting them to white, then I started adding them to my image. The first thing I did with these wires was creating something of a halo effect around the boy’s head.
Then I added some the left and right sides of his body:
Followed by some main wires surrounding the boy entirely:
I added all of these wires in circular forms to truly ‘surround’ the boy. So the head contains a small circle of wires, the torso a wider circle of wires and the entire body is surrounded by another larger circle of wires. By doing so they make the boy radiate, as if this ‘flurry of light’ is emitted from him.
Here’s how my layer palette looked like after merging the single wires together in groups:
As you can see I also used some layer masks, which I used to erase some unwanted parts.
The final coloring of this piece differs quite a bit from the first concept. I did however use similar techniques to achieve it. I will skip the ‘in depth’ part of that process on this one, I will however show you my layer setup and the individual settings of the adjustment layers I used.
I started by creating a minor yellow highlight for the focal point (you can use this texture for that if you like):
Followed by green, red and brown for the overall vibe (by using a gradient map and adding some brush work):
Which I then bumped up some more (by using more gradient maps):
That was followed by the true change of colors to something less ‘sickly green’ (by using the marvelous color balance adjustment layer):
The last thing I did was a very subtle contrast adjustment (by adding a Black & White adjustment layer):
Here’s my final layer setup for the color process:
End of tutorial #2
Like I said earlier on in this post, I developed these concepts in a similar way which was explained with the dark concept. In a nutshell, I made the basis and composition in black and white, switching to coloring only when I felt their core was fitting to the concept. That also applies to the final concept (which I will show you in a bit). I am telling you this now because the final concept does not include any tutorial steps. Because it’s the actual EP design I want to keep that more ‘closed’, even though that’s slightly ridiculous since I worked on it in the same way.
The album artwork as it is
For this part I will mostly use images of the artwork guided by quotes from our conversations about those designs.
In this final album design I kept to the color scheme of the second concept and visualized the abstract macro thought we worked on. There’s a whole bunch of hints to elements of nature in this cover, like leafs and their veins (like in the upper right corner).
I decided to approach a natural feeling and underline the spaced and progressive feeling of this EP with an overall minimalistic vibe. The logotype I created of Andrew’s initials are also shaped like a rock to support that natural vibe, which fell in good taste with Andrew:
“Man, that’s gorgeous. Just seen the update a few minutes back. I need some time to digest it, but this is absolutely fantastic! Thank you so much. I’ll get back to you with a more fitting response, once I can get past my “wow” factor.”
A few days later:
“That front panel is lovely. The logo sits great. The macro shot fits wonderfully. The whole thing “feels” like something to me. As if it is tangible, like something I can touch – that’s what hit me hardest about it. It must be the colour combination, natural aesthetic, and the textures creating this sensation. It’s as if the cover is being archaeologically dug out of the ground to a degree, and dust is blowing off the surface, revealing its meaning. Metaphorically this is amazingl. It jigs with the whole meaning of “find” really well.”
I reflected the two-part journey – which was mentioned in the concept phase – by the specific coloring of the interior and exterior as opposed to each other. The darker interior was only partially based on concept, there was also a practical function to it: readability of the text elements.
“…darker in colors to increase the visibility of the texts. I figured, because it is the interior, it makes sense to go a bit darker when you open it. Like your literally looking at the inside, the ground, of something.”
“I do get that ground, looking inside vibe you’ve thought off, and I’m loving it. Cheers man!”
Andrew Danso had chosen to release this EP as a slim case, so with the exterior and interior artwork complete all that rested was the CD label for the actual disc.
“The CD label, I don’t really have much ideas here. A smaller leaf might be lovely here, even just water might be beautiful. I’m not sure, but I trust you. If you have a specific idea here, feel free.”
“For the CD label I figured it would be cool to add the interior background to it. When you first open the case you’ll see the exterior and the CD label which then hints to the interior. It gives you that top-bottom (ground) feeling I was looking for in one instant.”
“Man, this is beautiful, thanks. I wasn’t sure what to expect regarding the CD design, but what you’ve done here is completely logical and very fitting. Yeah, I fully agree about the top bottom feeling which you described; what you’ve produced certainly carries that effect.”
With all this you should have quite some insight in the progression of this project and how I created the concepts. Now here’s some more photographic material of the physical release followed by some final notes:
Thank you for your time
So that was about it. I hope you enjoyed this case study and I’d like to thank you for taking the time to read it. It was rather long, but I felt that none of it was unnecessary. Feel free to let me know what you think of it, I’d love to hear your thoughts. Finally, I would like to thank Go Media and the GoMediaZine editors for providing me with this incredible opportunity. Simon, Jeff, Jon and Adam: thanks a bunch guys, you rock!
If you’ve never heard of Threadless, chances are you wouldn’t be reading this. If you haven’t, head on over to http://threadless.com to get a quick idea.
For years the t-shirt designs submitted on Threadless have been a source of inspiration and aspiration for me. It’s even a place where a few designers and illustrators like Olly Moss have gotten initial recognition. Threadless’ brand has a youthful fun spirit and it seems only appropriate that Mig Reyes is their designer.
It was funny to see him in person because I immediately remembered his face on a t-shirt model I had mocked up a Threadless design on. A man truly involved with his work, and a dude full of great advice. Read on; it’s a long one but it’s worth it.
Here’s What Happened:
After hearing Ken Hejduks’ talk I was put in a very serious mindset about design and how it affects others. This immediately shifted when Mig Reyes took the stage and put up his beginning slide reading “Please enjoy the dance party while we wait.” and played pumping club music. As we all waited I knew I was in for a fun talk—but it was better than I expected.
Mig showed his funny side immediately by leading the audience into false ideas about him talking about Threadless’ business model.
“So I know why a lot of people like to hear people from Threadless talk, right? You wanna know how to do the whole crowd sourcing thing. So that’s fine, that’s what I’ll talk to you guys about.”
He proceeded to show a couple fake graphs, and ramble with jargon with such speed that he briefly had me fooled. He then ended his rouse with: “I’m just fucking with you guys.” And proceeded with a personable message that would show off the bones of his talk.
He then gave a fun anecdote about Jeff Finley asking for the title of his talk.
“I said Stay Scrappy and Make Cool Stuff. I feel like that’s what we do at Threadless, I feel like that’s what I do myself. But, then I thought to myself, “Well, in the spirit of Weapons of Mass Creation I’d rather [the title] be ‘Fuck The Police. Make What You Wanna.’”
Once again, he was making us laugh. But in tandem, we all thought, “He’s got a point there”. I feel this was my perpetual reaction to his talk.
Mig continued on saying that this is true because of the fact that the whole reason people like Mikey Burton and Aaron Draplin were at WMC Fest was because they make things they want to work on. That’s why so many designers like Burton and the women from Quite Strong quitting their jobs and going freelance.
Mig then began to talk about his time at art school — which I took interest in immediately. Mig said that all of his teachers hated him because he didn’t do a lot of the work but loved him because he would still show up with his projects completed.
“This is what I realized. Everything I was working on had nothing to do with school.”
Mig proceeded to give an anecdote about a college experience in which he ignored his finals to learn After Effects just so he could enter a film in the very exclusive film festival at his school. Just because he wanted to show up the film students, Mig, in a few days, motivated himself to learn a new skill.
This was just a project he had done for fun and he accomplished his goal of getting it into the film festival. Little did Mig know that when he put the video up on YouTube to show his friends and family, other people would see it too. This ended up being a great method of exposure for Mig, and got him a job offer. Because of this Mig has become a strong believer in side projects. He continued doing them for a monthly design contest called Word It. He kept the amount of time he spent on them relatively short so that he could just try new things and keep it loose. He would use each short project as an opportunity to practice new techniques, programs, or skills like drawing. As he showed the various pieces from this project, Mig’s passion for learning became even more impressive and inspiring.
“It’s just about playing around, and having fun. And not taking yourself seriously because you pigeon hole yourself if you sweat everything you work on.”
These exercises he did, in turn lead to his invitation to participate in Layer Tennis, a ‘for fun’ contest where two designers exchange a file back and forth, adding on and embellishing to the previous designers work. Because each designer only gets 15 minutes at a time Mig was already perfect for the game. And even though he went up against great designers such as Jessica Hische and Mark Weaver he ended up winning by popular vote.
“What I learned from it was that all the really rapid paced work I was doing in Layer Tennis and side projects lead to me performing at my best at Threadless. At Threadless we do ‘Loves’ competitions where we collaborate with really cool companies. I have less than a day to make one of these. So again — that rapid ‘try new shit’ approach really came into play. I didn’t have any set visual aesthetic I just said, “How do I make something?” If it works it works, if it doesn’t it doesn’t; you can fuck up and try again next time.”
Mig went on to say that this kind of motivation and personal work is not only important to freelance designers but it’s important to companies. Not only does Threadless look for it, but Facebook does too when they are looking to hire someone. “Portfolio includes self-started personal projects”. It is important that people understand you are passionate about what it is that you do.
Mig then proceeded to show off another side project of his, a website called Humble Pied. His old college wanted him to come and give a talk to inspire the students with of all his success and great work he had been doing. Mig then showed his own humility and said to himself:
“Me being really young and fresh out of school I said, who am I? To go to a conference and speak and to inspire people. Who am I to do that? I’m not in that kind of position.”
Instead he got everyone that has inspired him in his life to record pieces of advice. He wanted to make something to share all the advice he had received with everyone. Ambitiously, Mig then started making a site in WordPress—however he didn’t know how to develop for WordPress. So Mig spent a hungover afternoon in a café; once again teaching himself another skill. I found this ambition highly admirable and have been striving every day to get closer to that level.
“I have the power to make things. I’m going to fucking do this!”
After getting his friends and mentors on board, Mig began doing theses videos as iChat sessions where he asks for one piece of advice. His After Effects skills came back into play as he made the videos into a nice presentation. The result is a simple site full of short clips of advice from incredibly talented and influential creatives.
Mig continued on saying that the more you do personal projects the more you are attached to them. In turn others become more attached to them as well. With that Mig says there are ego checks you must perform on yourself. Every project you get can be potentially great and you should not think about whether or not it’s award winning work.
“First off, who cares about design awards, it’s not helping anybody but your own ego. Second, this is our chance to show people what we’re good at, no matter how cheap or little you think the opportunity is.”
He then related an anecdote about a DJ friend asking him for a new flyer for his disco night. Though a pretty small project for Mig to be working on, he took the opportunity and used it as a way to make another fun project. It made his friend ecstatic and it branded his disco night which became really popular in Chicago. It’s these instances, where you make something for someone close to you that you can have personal proof of the influence your design has. Because Mig’s friend enjoyed it so much he asked if he could do more. Mig agreed to do a whole series, and it not only gave his friend posters, it buffered Mig’s portfolio. Because all of these small projects can lead to more work for you it proves it’s best to not be “above anything”. Accept work that will not only help others, but that you can have fun doing. Whether you try something new, or are just practicing a certain skill set, these small personal projects are unexpectedly valuable.
One of the best quotes I would hear all day would be “perspiration over inspiration”. The only problem Mig has with going to any conference like WMC Fest, is that inspiration, at least to him, is temporary. We listen to speakers, see awesome work, and get overwhelmingly inspired. Then we go home unpack and kind of forget all about it. We go back to our lives without doing anything about the inspiration. Mig encouraged everyone to put in the time and effort to make awesome stuff, because inspiration is a fleeting thing.
“Great work is the byproduct of heart, soul, and sweat. So we can talk about making design, we can read about design, we can listen to speakers. But that’s not making cool shit. You’re just listening to people talk about making cool shit. All of you in here, you all have no excuses because you’ve all seen great speakers today, and more tomorrow. Do something with it, because otherwise why are you here?”
Mig ended his talk on a fun note; showing not only the new designs for the Threadless website he is working on, but hilarious work he did in college. Saying that whenever he sees someone speak he’d always like to know how they started.
Mig: “No I don’t sleep and it’s hard, it’s a struggle. And I think one thing you always hear about in magazines and blogs is how you balance life and work. But I think if you do it in a certain way life and work can live happily. This is important to me, this is important to us; obviously because we’re all in Cleveland listening to designers talk about design. So I don’t know…I don’t sleep and I’ll regret it when I die 10 years earlier than I should.”
Audience Member: “How do you find the time?”
Mig: “I also spend a lot of time drinking IPA’s and dancing. It’s not like I’m constantly staring at my laptop, when I go to get drinks sometimes I get to talk shop with people. That’s why I like going to Quite Strong’s place. We get to talk about design, and drink beer, and eat tacos, and eat Cheeze-Its, all the time. That’s inspiration to me, I don’t have to flip through old design annuals to be inspired. That’s just visual reference, that’s just visual literacy, that’s not inspiration. Inspiration to me is going to a play, watching a movie, and sharing stories with your friends. That’s a part of the process to me, it’s not how do you work, and how do you live life. I try to do it at the same time.”
Me: “What do you recommend to students of design or young designers.”
Mig: “That question sucks because I ask that to everyone else, and I never have my own answer. I really believe in just doing your own side work and your own passion projects, and actually making things. Stop talking about making things and make things. The personal projects like The Lions Roar video, Humble Pied, that’s the stuff that’s helped me get work, that’s the stuff that’s got me jobs. Everything that I did in school was like “Okay you went to this school, I can tell because here’s an infographics piece about the rainforest you and 30 other kids did that. But this Lion’s Roar thing, kid ya got something here.” So do side work and shit that means something to you. Do your own work, work that makes you happy.”
Listen to the Talk
As I watched every talk, I kept Garage Band open on my MacBook and recorded everything I could. The quality of the mp3 below may not be the best, but you can get an idea of what it was like from my perspective in the front row. Bootleg version!
Good news: better content on the way!
Hello guys, Simon here. Jon and myself have great news to share with you!
After WMC Fest 2011 wrapped up, Jeff, Adam and the others at Go Media were brainstorming hard about “what next.” Part of that “next” has to do with the Zine. Here’s what was decided: to revamp it a tad, as well as to start a new tutorial author recruiting campaign.
The objectives that were set for the recruiting campaign weren’t that complicated: find people being the best at what they do and have them write for us he most unique tutorials. The cool thing is that we were given lots of guidance and a solid backing from Go Media (aka cold hard $$$) to go knock on doors.
Setting the bar
In terms of quality, we decided to set the bar pretty high. Luckily for us, some of the previously published content of the Zine is matching up these renewed expectations. Remember the Lady Luck tutorial from our very own Bill Beachy?
This tutorial is 4500 words long. It describes extensively the process that Bill went through with his client Paul Davis from Black Ace Clothing, and that resulted in the creation of a pretty sweet vintage pinup illustration to be used as an apparel illustration. It covers the initial email exchanges with the client during the need assessment phase, the brainstorming and initial conceptualizing phases and sketches, further brainstorming and changes from the client’s end, and the execution.
We decided to not settle for less than that.
Who did we get in touch with?
Well, we want to keep it surprise, but let’s say that if you were in the Gordon Square Arts District on June 11 and 12 2011, you might have meet some of the future authors :-) From the first drafts we’ve been getting, I can already tell, it’s going to be awesome.
One more thing
Think you have what it takes to write one of these? Don’t forget you can always submit your tutorial ideas… And you should! We’re ready to listen to anyone willing to share their knowledge, for the benefit of all.
Page layout is not as glamorous or interesting to a lot of designers and digital artists as creating t-shirts, posters and album covers. However, page layout is an important function for a lot of design projects, and there is an opportunity to do quite a bit with a layout. While QuarkXPress was once the page layout tool of choice for nearly everyone, Adobe InDesign has become the industry standard.
Here, I’ll introduce the basic concepts behind a simple page layout in Adobe InDesign CS5.
- Become familiar with the InDesign work environment and fire setup procedures.
- Learn how to create text boxes, link them, insert and format text.
- Learn how to place images in an InDesign document.
- Learn basic image manipulation techniques.
- Become familiar with preflighting and output.
The basic InDesign work environment isn’t significantly different than Photoshop’s or Illustrator’s layout and can be reconfigured in a variety of different ways. I’m using CS5 and you can pick a variety of default views using the menu in the upper right. My choice is Essentials, which is a solid option for whatever you want to do without cluttering the space with specific tools.
It’s always a good idea to setup your file defaults before you create anything. If this is your very first time even opening InDesign, go to Edit->Preferences. The first thing I like to set is Units & Increments.
Select the unit types you wish to work with. InDesign’s default unit of measurement is the Pica. Since I’m American, I will set my default to Inches. Points are good for Text Size & Stroke with the Postscript setting.
I also set my Origin to Page. This puts my 0-0 for the x and y axis on my rulers to the top of my page, instead of the top of my document. I also like to set my display preferences to maximize the quality of everything. This can be taxing on your computer relative to how powerful it is. Still, I prefer to display everything at high quality so I know exactly what the output will look like.
Creating a new InDesign file is the same as any other application; ctrl or cmd + n will do the trick. When the new document dialog box comes up, click the More Options button. Under Intent, select Print. The Web setting in InDesign is useful for creating lightweight PDFs that are not intended to be printed. InDesign CS5 also possesses the ability to create interactive Flash documents.
Uncheck both Facing Pages and Master Text Frame. Facing Pages is for creating multi-page documents. A Master Text Frame could be useful if you plan on creating multiple single-page documents with the same layout. We’ll use both in a later tutorial.
We’ll leave the setting at letter size and portrait orientation. I’ve set our intro document to have 2 columns, leaving the default gutter. Using Imperial measurements, the document defaults to a .5” margin; change that to a more realistic .25” or its equivalent. I am also setting the bleed to a standard 1/8”.
Now we have our blank document with our basic guides already laid out and ready to work with. Looking at it, 25” margins may be a little tight to the edge of the page. Go to Layout->Margins & Columns and change the margins to .375”.
First up, we’ll insert and format text. Select the type tool and draw a type box in the left column,
Copy the text box it in the right column. We now want to link the two text boxes so that text will flow between them. On any text box, you will see a square on the lower left side of the box. Click on the square and then on the box you wish to link to.
Now, our text will flow into the right box if and when it overflows the left text box.
When the text tool is selected, the top toolbar displays the character options by default. Most of the character and paragraph options will seem familiar. InDesign provides the most control you can get over your type, including the ability to define type styles, which will be covered in another tutorial.
Since I haven’t already, I’m also going to change the typeface and set my kerning to Optical. This is a good time to un-check hyphenate.
Next we’ll insert our graphics into the layout. InDesign doesn’t embed images in the file, but maintains a link to the file where it resides on your computer. It’s necessary to maintain a fairly high level of organization working with InDesign files. Ctrl or cmd + D will place your graphic on the workspace.
If you have nothing selected, the graphic will be placed wherever you click your mouse or tap your pen. If you have an object like a text box or another content frame selected the graphic will be placed in that frame. Graphics will be placed on the document in their own frame.
Grabbing the frame handles to scale will actually scale the frame, not the graphic it contains. Hold ctrl or cmd + shift to scale the graphic and the frame together. You can also fit the image to the frame proportionally.
Since this layout is a simple PR mailing, we’re almost done. InDesign has built in preflight feature that will check your document for potential printing errors. In earlier versions this options is found under File->Preflight. In CS5 and up, it’s a panel located under Window->Output->Preflight.
This is what we want to see. The main errors you will frequently see are linked images using the wrong (RGB) color space.
Now we’re ready for print output. We can package the document, which will create a folder with a copy of the attached images and fonts used, use one of the pre-defined PDF or a user-defined preset.