Creating Sagittarius in Photoshop

Creating Sagittarius in Photoshop

preview

Tutorial Details

  • Program: Adobe Photoshop
  • Version: CS3+
  • Difficulty:Intermediate
  • Estimated Completion Time: 2-3 hours

Resources:

Step 1

Let’s start by opening a new file with a size of 1000x1500px with a resolution of 300ppi (pixels per inch).

Step 2

Next, open the stock images we’ve downloaded. As you can see below, I positioned the stock images so you could have an idea of what we’ll be creating. As you can see below, the Archer’s elbow is missing, Fig. a, so I used another stock photo then cut the area I only needed, Fig. b.

Step 3

The next procedure is to remove the areas/backgrounds we don’t need. For this step I used the Pen tool (P) to define a path all around the outline of each components of our image. Once the path has been defined, press right-click then select Make Selection from the pop-up menu. Do this procedure for the rest of our images.

The final product should look like as shown below.

Step 4

Next is to change the color tone settings of our images to make it look as one. For this process, you can use Hue/Saturation, Levels and Vibrance to correct the colors of each component. This process is all trial and error so patience is needed, don’t hesitate to experiment. I recommend to use the Archer’s body as the reference color tone for the Horse’s body and Arm extension to follow. The main goal for this step is to set the color tones of each components as close as possible.

Step 5

Next is to make the connection of the Archer’s body to the Horse’s body. For this step I used the Brush tool (B) to paint the connection. I sample the color to be used from the Archer’s body then started to paint the missing parts. Using some shadings and highlights, I defined the archer’s abdominal muscles and the lower bones of the ribs. This step is only the primary procedure for the connection, further digital painting will be done in later steps.

Step 6

Next step is to remove the line on the Archer’s body. Using the Patch tool (J), select a small area of line we want to remove, Fig. a. After that, drag the selection and you will see the selected area change showing a preview of the area to be sampled, Fig. b. Use the areas close to the line as reference for the sample for the selected areas. Do this step until no trace of the line is to be seen, Fig. c. The final product is shown below.

Step 7

Next is to extend the strap for the bow case. To do this, just select the Pen tool (P) then make a shape just like as shown in Fig. a. Next, using the Brush tool (B), paint the selected area using the colors sampled from the original strap, Fig. b. Remember to apply a subtle drop shadow for the strap. The final effect should look like Fig. c.

Step 8

After that, let’s extend the bow. Using the Rectangular Marquee tool (M), select an area just like as shown in Fig. a. Once selected, press Ctrl/Cmd+C to copy the selection. Place the copied selection on to the top portion of the bow, then press Ctrl/Cmd+T to rotate the selection just like as shown, in Fig.b. Do this also for the bottom part of the bow. Finally, do this procedure again for the second set of extension for the bow. Make sure to erase some parts of both edges to make it rounded, Fig. c.

Step 9

Next step is to add the string/rope for our bow. To do this, using the Pen tool (P), define a path just like as shown in Fig. a. After that press right-click then select Stroke Path from the pop-up menu, Fig. a-1. From there, select the Brush as the tool of reference for the stroke, Fig. a-2. Make sure that the Brush settings is set to a Hardness of 100%, Size of ~3px and color# 000000 prior to doing the path. The effect should look like, Fig. b. Access the String’s layer Layer Style menu, then follow the indicated values as shown in Fig. b-1. Finally, using the Pen tool (P) or Brush tool (B), make the dropshadow for the string.

Step 10

After all the process we’ve made, we have to Merge all the layers that composes our Archer. But before you do it, I suggest you to duplicate all the layers first before merging, then group it into a folder, then hide it for the mean time. This will be our main backup just in case we want to change something later.

Once merged, change its Levels (Ctrl/Cmd+L) and Hue/Saturation (Ctrl/Cmd+U) settings with the given values indicated below.

Step 11

Let’s now prepare the background of our subject. First, open the files Mountain.jpg. Like what I did in Fig. a, I only used a certain part of the image. Next, open the Ground.jpg then press Ctrl/Cmd+T to activate the resizing handles. Distort the image just like as shown in Fig. b. Change the Hue/Saturation setting of the Ground with the values indicated in Fig. c. Finally, using a soft, midsize brush with color #000000, paint the areas indicated in Fig. d.

The final effect should look like as shown in Fig. e, here the merged layer of the Archer is placed.

Step 12

The next step is to add the ground shadow of our Archer. This step is easy for you only need to use a soft, midsized brush set to an Opacity level of ~50% and color #000000. Brush the areas indicated below paying close attention to details. Make sure that the closer a part is positioned in reference to the ground, the shadow is more darker, and as you go away from the ground you decrease the opacity for the shadow.

Step 13

Next using the Brush settings indicated below, paint the hair of the Archer as well as the tail part of the Horse. While brushing, try to use different shades of blacks and greys, so the hair will look shiny and give the illusion of fullness.

Step 14

Our image looks flat, to fix this we need to add a couple of different shadings and highlights to emphasize the body contour of our Archer. Before we start, we first need to know the position of our “light source” which, in this case, is right above of our subject.

Knowing that, let’s start our digital painting process!

Step 15

We’ll start our process by adding some shadings. Based on our light source, I indicated the areas needed to be painted with different shades of blacks and browns. For this step, I recommend you to use a soft, mid-sized brush with an Opacity level of only about 2-10%. The process is all up to you. You could follow the original dark shades/areas of our image then just enhance it.

Step 16

Next, after doing some shadings, let’s add some highlights. Using the same brush settings we used for the shade, but know using different color tones close to white, paint the areas indicated in purple. Highlights will enhance the shadings we’ve made. In this step, make sure to site the areas that needed to be emphasized or enhanced, such us the roundness of the Archer’s head, his arms, the horse’s chest, thigh, and neck to name a few.

Before we added the shadings and highlights, the image looks flat, but now some areas look as if their popping out.

Step 17

Next step is to add a series of color enhancement that’ll set the mood of our image and make the image look as one. First, add a new layer then, using the Paint Bucket tool (G), fill the entire layer with color #462d00. Next, set its Blending Mode to Overlay then decrease its Opacity level to 30%.

Step 18

Next, like what we did in Step 17, add a new layer then fill it with color #004a6d. Set its Blend Mode to Color Dodge. This step made our subject glow in a fantasy kind of way.

Step 19

At this point we need to save a JPEG file of our work. Once saved, open the JPEG file then place it directly above our “work layers” then go to Filter > Blur > Gaussian Blur then change its value to about 1.3 pixels, just like as shown in Fig. a. Next, using a soft, small size Eraser with an Opacity of about 50%, erase the areas indicated in Fig. b. This step will add a subtle glow for our subject thus creating a fantasy-like environment.

The final effect should look as shown below.

Step 21

Next, I did some further enhancement for the highlights we’ve made earlier but know doing it above the color enhancement layers we’ve made. For this step, use a soft, small brush with an Opacity level of about 25% and color #ffffff.

Step 22

Next, using a small brush of about 3px, paint the areas indicated in red with color #ffffff. This will emphasize the fold of the bandanna in his head and enhance the depth of the subject’s face.

Step 23

Next is to add a subtle cast of shadows of our subject. To do this, using the Brush tool (B) set to a size of about 90px with hardness value of about 26%, paint the areas indicated in red with color #000000. Finally, decrease its opacity level to 45%.

Step 24

Next, we need to add a color overlay to make our image warmer. To do this, add a new layer then, using the Paint Bucket tool (G), fill the entire layer with color #ff9600. Go to its Blend Mode settings then change it to Overlay. Finally, decrease the layers Opacity level to about 32%.

Step 25

Lastly, to complete our creation, I added a subtle sunlight cast from the upper-right corner of our image. To do this, using a hard, small brush, paint small dots like as shown below.

Next, go to Filter > Blur > Motion Blur then follow the indicated setting shown below.

After that, press Ctrl/Cmd+T to transform our selection. I distorted it like as shown below, so that the light rays are more compressed on the upper-right corner then spreading all out to the lower-left corner of our image.

Finally, go to Filter > Blur > Gaussian Blur then apply the indicated value shown below.

Conclusion

That’s it, we’re done. The final product is shown below. Hope you had fun working on this project and learned something new! Thanks for reading!

[download#68#nohits]

Interview with Designers James White and Fabio Sasso

Montreal Meets

I had our friend Simon interview two talented and in-demand designers James White aka Signalnoise and Fabio Sasso of Abduzeedo. James and Fabio are speaking at the first ever Montreal Meets on Tuesday, January 25th at Concordia University in Montreal, Canada. You can learn out more about Montreal Meets in my introductory post.

Fabio and James are two designers who embody the lifestyle of a Weapon of Mass Creation. That’s why we chose to sponsor Montreal Meets.

Signal Noise talks

Montreal Meets with James White and Fabio Sasso

Let’s Chat with James and Fabio

GoMediaZine: James, Fabio, could you provide a quick, 3 to 5 sentence introduction about yourselves for our readers (in the unlikely event some of them don’t know you)?

James White: I’m a visual artist and designer living in Halifax, Nova Scotia, Canada. I’ve been working in the design field for about 12 years now and have worked on everything from websites, identity design and print collaterals for companies such as Google, Nike, Universal Music, Wired Magazine, Toyota, VH1, etc. I own and operate the art & design blog Signalnoise.com which serves as my connection to the online design world, and also the Signalnoise Store where I sell my designer posters and t-shirts. I like heavy metal, video games and comic books.

Fabio Sasso: I’m a graphic and web designer from Porto Alegre, Brazil. I’ve been working with web since 1999 and in 2006 I started a blog called Abduzeedo.

Montreal Meets poster by James White

GoMediaZine: Could you guys talk about your debuts as designers? Did you become freelancers right away? Did you have a part time job at first? Did you work in a studio with other people?

James White: I worked with various local companies in Halifax for 10 years, mostly in office settings. By day, I would go to work and design websites and print stuff for local clients. I was hired right out of school in 1998, part of the big web boom at the time so I got a lot of experience right off the bat. By night, I would go home and continue working on my personal projects like my website, my own comic books, children’s books, rave flyers, anything cool I could apply my design skills to. I never really stopped, sometimes staying up until 3am working on my own stuff. After working like this for 10 years with no real direction, I decided to turn my then stagnant website, Signalnoise into a design blog to properly house my work and give me the opportunity to talk about design and processes.

Fabio Sasso: My first design job was an internship in a printshop, the main product was stickers so most of the times I had to prepare the arts to be printed and some times I had to create some designs too. After that decided that I wanted to focus more on the web, it was 99.

Advanced Photoshop cover by James White

Abduzeedo - Iron Man interface

GoMediaZine: Can you talk a bit about how you grew into professional designers? How did you measure your growth? Through more technical knowledge, more clients, more pay, more press?

James White: Professionally, sure we could adequately gauge our levels of “success” through things like money and clients. But I think the level of success is better measured with how well you know yourself. Having a bunch of clients doesn’t necessarily mean you’re doing the work you want to do. I think there comes a point in every artist/designer’s life where they take a step back from their work to look at what they enjoyed, what was successful and what they learned over the years. Personally, I think this is the key to growing as a designer because it brings focus to what you ARE doing, and what you WANT to be doing. Positivity resonates in the work we do, and people take notice of that.

Fabio Sasso: I believe I started growing more in the moment I started sharing my knowledge and everything I was learning while practicing. That really gave me more exposure.

GoMediaZine: You both seem to have achieved a lot of passionate fans and readers. What do you think was the reason why those readers are so loyal to your sites? Why do you think it’s difficult for other designers to cultivate such an avid readership?

James White: I think it’s simply the fact that my readership and I have things in common, we all tend to like the same nerdy stuff and enjoy using that inspiration to create things. As I said earlier, positivity resonates in what we do, and I try to keep everything on Signalnoise.com as positive as I can so readers can have a nice break from their day to swing by and see some cool art and learn about other designers. I keep things honest, where if I’m heavily inspired by another work I’ll post it and put links to where they can check out the source. In such a competitive industry I decided a while ago to do things differently, to forget about competition and enforce the fact that we’re all in this together. My readership all feel like friends to me, and I like that.

In terms of other designers trying to cultivate a readership, I’d say just forget about it and do the work you like doing. When I started the blog in 2007 my intention was never to get people to my site to raise my pageviews. I didn’t care, I just wanted a nice blog to update with my art and the rest happened completely by chance. Positivity has an odd way of coming full circle, man.

Fabio Sasso: In my opinion it’s all about doing what you love because with that you will be able to be consistent in what you do. It takes time to create a readership and I believe the main reason you create that is because they see that you are passionate about what your doing the same way they are.

Tron poster by James White

Abduzeedo - Desintegration effect

GoMediaZine: Let’s talk about Montreal Meets. Can you tell us more about it?

James White: Montreal Meets is an event organized by my pal François Hoang, and will be taking place on January 25th at Concordia University in Montreal. Myself and Fabio Sasso of Abduzeedo fame are being brought in to do hour-long presentations each about art, design, inspiration and advice for a packed room of young and seasoned designers. It’s a wonderful way to get people motivated to create and to talk with like-minded creative individuals whom I only know through the internet. François really knocked it out of the park, and we’re really looking forward to getting onstage.

Fabio Sasso: Montreal Meets will be a great opportunity to share experiences and talk with the Montreal design community. It’s also a great initiative of François Hoang, I’m really excited because of that and because I will be sharing the stage with James White, I am a huge fan of his, since the first time I saw some of his works a few years ago.

Montreal Meets poster by Abduzeedo

Abduzeedo - Light effect

GoMediaZine: Have you done speaking engagements before? If so, why are you doing them? Is this something every designer should consider doing to further his or her career? What are the benefits you get out of it?

James White: Yes, I’ve spoken at a few other events, most notably being FITC Toronto 2010 where I did my ‘Back to the Future’ talk. I really enjoy doing presentations like this because it’s a much better way to connect to the audience when you’re face to face, rather then in a tiny box on a computer screen. Being from Halifax, a small city, I rarely get the opportunity here to talk about Photoshop to any great length, so any chance I get to run around onstage and talk about Blending Modes, I’m all for it! Woohoo! I’m not sure presenting is for everyone, I know quite a few people that are mortified of standing in front of 200 people to speak, but I think it’s a lot of fun and brings with it a new set of skills where you really need to analyze your processes in order to speak about them clearly. I really enjoy it, and want to do more.

The main benefit I get out of speaking at events like this is the connection to other artists and designers. I know there are a lot of questions and confusion about how the industry works and what a young designer can do to get on the right path, and I like being there in person to let them know it will be alright and remind them to not lose sight of their personal creative goals.

Fabio Sasso: Yes I have done a few, and I think it’s a great experience because you have to organize and communicate your ideas in a concise way, it’s pretty much the same thing we designers do in our design solutions but talking. It’s also very challenging.

GoMediaZine: Do you want to reveal a few details about the program or is it a surprise?

James White: There are a few surprises mixed in with my jokes and banter, but the portion I’m most looking forward to is the Hobo With a Shotgun case study I’ll be doing. I included all of my progress pieces as the poster took shape and I’ll be telling stories and explaining things as I go. Outside of that, I’ll be offering up a short bio on me and my work, how I do what I do, what inspires me, and an advice section. I’m really looking forward to showing this new presentation.

Fabio Sasso: I will be talking about the importance of practicing and sharing your knowledge to evolve as professional. I will show some cases and tell some stories of how Abduzeedo started.

Hobo with a Shotgun by James White

Yer Dead productions

Abduzeedo - MSNBC effect

Abduzeedo - MSNBC - New background

GoMediaZine: Will we see you at WMC Fest come this June? Will our fans get the chance to meet you?

James White: Unfortunately I will be in Barcelona for OFFF when the WMC Fest is happening. So sorry, however I’ll let you know if things change as I would love to come visit.

Fabio Sasso: I will definitely go, especially because I am moving to the US in February so it is going to be easier for me to attend to the WMC.

GoMediaZine: A goodbye note?

James White: Thanks very much for the coverage and help with the Montreal Meets event, guys. It really means a lot when creatives come together to help one another out. We’re all in this together, man. Keep rockin’!

Fabio Sasso: Keep practicing and learning always. Also remember that the easiest way to get motivation to do that, in my opinion, is through sharing knowledge.

Daily Inspiration: Attack Your Obstacles Creatively

Daily Inspiration Videos by Go Media President Bill Beachy

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.

View all episodes of Daily Inspiration here

Sponsored by Weapons of Mass Creation
The Daily Inspiration video series is brought to you by WMC Fest – a grassroots event put on by Go Media to inspire and enable the creative mind. It takes place in Cleveland, OH on June 11 and 12, 2011 and will feature 20 speakers, 20 bands, and 20 designers in what aims to be the premier event for artists/designers in the midwest.

Weapons of Mass Creation Fest is in Cleveland, OH

Hope you enjoy the video!

Or download the podcast

[powerpress]

Distressing Techniques in Adobe Illustrator

Distressing Techniques in Adobe Illustrator

Hey designers, attend our all-inclusive soul-fulfilling three-day design retreat, WMC: Off-The-Grid, this October 5 – 7th. To learn more, head to wmcfest.com.

Simon from Studio Ace of Spade here. Jeff Finley asked me to compile a list of some common distressing techniques as a supplement for his eBook “The Designer’s Guide to the Apparel Industry.” Distressing graphics is a pretty integral part of designing t-shirts. This tutorial will demonstrate three easy to understand and easy to apply techniques for adding a distressed or grunge look to a design using Adobe Illustrator.

Be sure to check out some other tutorials the graphic designers at Go Media have whipped up as well!

Adobe Illustrator Technique #1: The Grunge Brush

For the first technique, we’ll learn how to take advantage of Illustrator’s brush tool and of some of the brushes that come bundled with it. Our subject will be a vector of a blimp I created a few weeks ago and used for one of my Studio’s entries for Signalnoise’s retro poster competition, “Air traveling”.

The Step 1 is easy: open your vector file.

studio_ace_of_spade_-_distressing_techniques_-_ai_01_-_001

Step 2 is easy as well: make sure your vector object or group is expanded.
To do this, select all (CTRL+A or CMD+A, depending if you are using a Windows or Mac box), then go to the menu “Object” then “Expand”. You might be prompted to select what you want to be expanded. Check all the boxes.

Once this is done, we’ll move to step 3: select the brush tool and get the brush that interests us. Don’t forget to de-select your vector art or else you will apply the brush to it.
Open the brush panel from the left toolbar (or with F5), then click on the menu icon at the lower left corner.

Make your way through the menus to pick the “Artistic – Chalk / Charcoal / Pencil” brush set.

Then pick the first brush and the brush tool.

Step 4
Now, we’ll have to pick a random color that is not used at all in the design element we’re planning to grunge out. The reason for this is because we’ll use the magic wand tool later to select the brush strokes we are about to make, and we don’t want anything else but these brush strokes to be selected. Here I picked a really loud blue (something like #3FE6FF).


Now it’s your call. Play with the brush tool and make a couple brush strokes in order to cover your vector element. In my case, 2 strokes were enough.

Experiment with different thicknesses, placements. You should play with how you position/draw the paths with the brush tool, with the stroke thickness… For instance, I was hesitating between a 2 pt. thickness and a 4 pt. one before settling on 3 pt., because it looked the best. I would also not be afraid of editing the paths afterwards with the direct selection tool (keyboard shortcut: A) to modify their directions.
You want to cover most of your design, but also make sure that you won’t go overkill with it. Also, watch how I tried to leave out of the blimp the big chunks at the top left of the top stroke. These would have been over the top in my opinion, and wouldn’t have looked so realistic.

Quick tip: to quickly toggle the brush stroke on and off,  switch the stroke color to your background color by tapping the X key repeatedly.

Once you’re satisfied with the result, time to move towards step 5.

Here, we’ll expand the brush strokes like that we can merge them with the design using the pathfinder tool. To do so, select your vector object and your brush strokes (I used CTRL/CMD +A since these are the only things I have in my art board).


Then, go again to Object > Expand in order to expand everything.

Step 6: the pathfinder. Now comes the time to merge everything.
Go to the pathfinder (Shift + CTRL/CMD + F9 by default in Ai CS3) and click the merge option. Depending on the complexity of your design, that can take a few seconds.

The 7th and last step is to use the magic wand tool (shortcut: Y) to get rid of the blue we don’t need in our final design.

Click anywhere on the blue strokes to select all of them. Delete (DEL key) and…

… And it’s distressed! Victory?

No. Ai sometimes leaves some transparent elements that need to be cleaned up too. To see them, select everything (CMD/CTRL +A), then use the magic wand once more (Y) to click on one of these left over points. Once they’re all selected, you can delete them.

And here it is, our distressed blimp.

Adobe Illustrator Technique #2: the grunge vector element

The grunge brush technique is easy and convenient (the brush comes with Illustrator), however it might not look very realistic — especially if you have to make the brush really thick, big or to repeat it a lot to cover the design. Real distressing looks more or less random and doesn’t repeat itself.

One of the tricks we have up our sleeve then is to use resources that are specifically made with the distressing purpose in mind. Head over to the Go Media Arsenal and grab some grunge vector resources.

For this one, I’ll use a texture of the Destroy I vector pack (first one of the preview actually). It’s subtle enough, yet you can duplicate it for more intricate effects (as will be demonstrated).

Step 1: Open the files you will need: the blimp vector and the grunge vector. As I explained previously, the grunge vector is from the Go Media Arsenal.

Step 2 is similar to what we did previously with the brush strokes: change the color of the grunge vector to a color that has not been used in the element you want to distress. Again, I choose a bright blue.

Step 3 is where it becomes fun: it’s sizing and placement time. I chose to center the vector, then to size it big enough to cover my vector blimp. But then I realized that the single instance of the texture wasn’t enough distressing for my taste.

So what I did as a 4th step was to copy the texture and then paste it in front (CTRL/CMD +F)

After that, I just had to rotate the top copy a bit to accentuate the grunge feel. I rotated it of 90° for that tutorial, but remember that experimenting is the key and that you should find what suits you.

Step 5: Expand the vector grunge elements (Object > Expand).

Step 6: Merge using the Pathfinder palette.

Step 7: Cleaning out. Like earlier, we are going to delete the grunge vector(s) used to distress the blimp in order to keep just the distressed blimp in the final art.

Here I used the magic wand (Y) to select the blue grunge vectors…

And deleted them selection (DEL)…

Selected the transparent leftovers, deleted.

And there you have it, another distressed, grungy looking, blimp!

Adobe Illustrator Technique #3: using a texture

Like in Photoshop? No, no. We are going to live trace it.

For this distressing last technique in Illustrator, I’ll use one of the free textures from Lost and Taken. The texture I’m going to use is taken from his 20 subtle and simple grunge textures post.

(Don’t grab that one, go grab the high resolution file, it’s going to look much better)

It’s going to be really simple and share a few common steps with the previous techniques. Our experimentation subject is going to be this vintage radio vector I did a few weeks ago as part of another entry to Signalnoise’s retro poster competition.

Step 1: open your file.

Step 2: let’s place (File > Place) that grunge texture in our document. The process is really similar to opening the file.

Now, our 3rd step is to live trace it. It’s going to be easy, as when you place and select the texture, the live trace button appears on the top toolbar of Illustrator. We could use some of the presets, but I believe we can get better results by experimenting with the values a bit. So instead of selecting them, click on Tracing options at the bottom.

I always set Path Fitting, Minimum Area and Corner Angle to 1 when using Live Trace. It’s supposed to give the most details from the object I’m using as an input. I also checked Ignore White since I just want the grunge of the texture to come out. Then I also check the Preview box to see what those settings are producing.

I bumped the Threshold to 160 in order to get a darker texture (more pixels are converted to black). Once you’re happy with the result, click Trace and don’t forget to hit the Expand button.

Then, step 4 is to place, size and change the color.

Step 5: Expanding. It’s crucial to be sure that it’s correctly done, or else it simply won’t merge.

Step 6: Merging.

Step 7: Cleaning up!

WOOBOX-MAIN-IMAGE

Hey Designers, make sure to check out our Arsenal Membership, which hooks you up with our huge product library for only $15 per month. Yes, seriously.

Creating an Illustrative Monogram

Creating a Monogram

Monograms are an interesting way to go about making an identity. By nature they can be straight forward or extremely ornamental and illustrative. In this tutorial I’m going to walk you through the steps I (Chris Comella, designer at Go Media, hi!) took to making Go Media’s own Heather Mariano (formerly Heather Tropp) a monogram for her business card.

What follows is a series of animated GIFs. Each show the steps I took toward executing my concept. They all loop, so if you miss something the first time, don’t sweat it. It’ll be back in a few seconds. Also, below each animation you’ll see the corresponding notes.

Creating the H

Step 1: Creating the H

I start off making the general form of the H with basic shapes. Then I add in the negative I’ll be using as guides to ‘carve’ away any excess form. After I draw out the shape, using the pathfinder I unite all the white shapes together to create one solid piece I can use to subtract from the black base. To polish off the H I add a swirl at the stem and carve out a point on the leg.

Creating the T

Step 2: Creating the T

We start off again by creating a basic shape from which to work with. I basically create two circles with a square joining the middle to create an elongated circle. Merge the three pieces and start on the negatives. The two white circles again act as my guide for carving out an unwanted form. Once I’m done drawing out the shape on one side, I duplicate and rotate the piece to fit the other side to keep it symmetrical. Lastly, combine all the white shapes and subtract it from the black base.

Combining the H and T

Once I have that initial piece (the Arm) done, I end up squashing it a bit as you can see. I finish off the T by using two circles to create a a curved stem and adjust the angle a bit with a third shape. I merge those together along with the arm, and the T is set.

Rendering

Step 3: Rendering the type

So now that we have the foundation of the monogram set, we can start thinking about how to render it. I wanted it to feel a bit more tactile, so what I did was create some contours that help define the shape spatially. I set the standard in my mind with the first line you see made above…following that precedent I just go ahead do the same around the letters. Next, I decided to take another look at the letters themselves. I end up adding in some open lines to two of the primary curves in the pair, giving it a more decorative, floral vibe. Also, you can see I added a horizontal line connecting the two letters.. here was something I kind of stumbled upon and decided to elaborate. What came to mind at this point was adding another aspect to the piece, I wanted it to appear ‘juicy.’

Creating Drips

So in that vain, I decided to add in some water droplets. I liked this because it was in line with the piece’s theme and created some more visual appeal. Following the contour lines I layed down previously, I used those as a jumping off point for the droplets. Drawing them with those curves in mind, I rendered an initial droplet and then elaborated further by adding a couple more throughout the type.

Adding the Color

Next up is the color. This step turned out to be very important, because not only is it making the leap from black & white, but it also defined the unique shapes of the letters themselves. What I did here, similarly to the contour lines, was set a precedent with the first piece and moved forward from there…essentially, winging it, but with a sort of mental guideline.

Step 4: Complimentary imagery

To emphasize the monogram’s theme, and to help round out the composition, I decided to make a flower to pair with the type. I started with the petal and finished by drawing the body out. This needed to be simple as it’s purpose is to fit in with the type.

Step 5: Putting it together

I pasted in the flower behind both the letters and trimmed it down to size (erasing any unwanted parts). Next I drew in a highlight and filled the flower with the same gradient from the type highlights. Taking it one step further, I decided to add in some (what I believe are called) Pistils… aka, antennae things. Finally I duplicate the flower and add it in at the bottom of the T to balance it out. From here I simply tightened the piece up, making any minor revisions or tweaks that were left. I decided to add a stroke on the T, a simple gradient to the water droplets, and create a small lightning bug riffing on Heather’s passion of photography (I always thought of lightning bugs as nature’s paparazzi). And there you have it!

Blank Canvas: Creative Resolutions

It’s that time of year again. January first always seems to bring out the best intentions in people, and us creative types are no different.

Some may choose to lose weight, get in shape or quit a bad habit. But Go Media is curious what you the design community wants to change, improve or quit in regards to your creative life.

I’ll kick things off by sharing what art-related resolutions I’ve made in 2011.

Most of my plans for the coming year are less on the creative side and more on the business side of my art. In general the theme for me is to expand the reach and availability of my art and creative services.

In particular, I’ve come to the realization that I’ve been offering a pretty narrow slice of my illustration talents — for the most part it’s been targeted to those seeking custom work. I had a bit of an “aha!” moment in late 2010 (which of course in hindsight seems obvious) that there are many more potential clients, customers and fans out there who don’t need to hire me for custom work, but would like to have some for themselves.

This will also help achieve the other goal I have for 2011 and beyond, which is to create more artwork for myself. I pretty much had a laser focus for the past 5+ years to grow my illustration business to something that was self-sustaining, and by doing so I focused completely on the illustration work I created for clients.

Of course the past years were not all about art, since in order to achieve the goal of running your own business you need to do, well, business. But it all revolved around commercial art. I’d like to get more into creating art I want to create, and being able to make it self-sustaining from a business standpoint.

I’ve actually spent most of the Christmas/New Year’s “holiday” working on putting these goals into motion. To paraphrase Newton’s laws of motion, it’s much easier to keep something going once it’s in motion that it is to get it started.

Part of this process also involves my third resolution, which is to get more involved with others in the creative community. Some of the other projects I’ve begun are being worked on in conjunction with other like-minded illustrators. I find it makes the process not only more enjoyable, but it helps keep you on point when others are working towards (or bugging you to complete) the goals you’ve taken on.

So that’s my 2011. Go Media wants to hear from our readers: what’s your creative resolution for 2011?

Go!

Dragon photo by Rollan Budi