Foil stamping is always a fan favorite, due to the elegance and high visual impact that it can provide. Foil stamping (also called hot stamping, dry stamping, foil imprinting, or leaf stamping) can be used to add flair to products like business cards, book covers, gift cards, office folders, and a whole host of professional or personal items. Instead of using plates or inks to print words and shapes, foil stamping uses dies, or sculpted metal stamps.

Foil Stamping: How it’s done

The heated dies seal a thin layer of metallic leaf/foil onto a surface. The foil comes in a wide roll, large enough for several passes, backed by mylar. The hot die works similarly to a letterpress. Once it’s heated, the die presses the foil against the substrate material with enough pressure that the foil sticks only in the intended places, leaving a slight imprint.

Foil leaf is available in every imaginable color and pattern. Rarer types of leaf come in matte, pearlescent, holographic, opalescent, or glossy finish. There are also semi-transparent foils that allow an under color to show through. Not only does it provide a uniquely vibrant image with depth, but foil stamping can be applied to a much more diverse selection of substrates when compared to ink. Businesses typically use foil stamping to identify folders, cards, signs, and magnets with their logo. The reflective and unusual treatment is sure to catch the eye of your potential customer!

Foil Stamping: A Finishing Favorite is a post from: GoMediaZine

Go Media is a creative agency that specializes in brand development, art direction, and interactive media. The GoMediaZine began in 2006 as our company blog but has since grown into a thriving community for designers of all skill levels. For a closer look into our 14 person team and the work we do for our clients, visit gomedia.us.

Hard drive failure. Not something creative people think about often. At least not until it’s happened to you. I went from not even considering a “backup solution” to being (probably) overly cautious and redundant about my backup setup for the Mac and all my creative files.

Yes, you need a backup.

The first step to getting a backup system in place is to realize you do need one. Many people have probably even used a Mac and bought a new one with no hard drive failures at all. Most likely you could go years never even needing a backup. Why spend all that money on something that may never happen? Precisely because it only needs to happen once for you to realize how important it is to do this. Save yourself the heartache and learn from my pain.

Oh, and keep in mind that dragging your files to your “backup” drive and then deleting them from your main hard drive is not a backup; the files are only in one place—there’s only one copy of them. You want a minimum of two copies of all your files.

Hardware

The hardware side is pretty simple: either some internal hard drives (if your Mac supports them), or some external hard drives (FireWire or USB 2.0). Most (non-iMac) desktop Macs since the G4 lineup support up to 3 additional hard drives internally. Users with an iMac or a MacBook/Pro (or any Apple laptop) with need to go the external hard drive route.

As far as purchasing drives, if you go the internal route you only need to consider the connection interface—older Macs (and PCs) used the ATA interface; newer Macs use the higher-speed SATA (Serial ATA) connection. You can find tech specs for Apple products here. For external, I usually go with FireWire drives since they can be daisy-chained together. This means you only need one FireWire port as additional drives hook into the previous FireWire drive. FireWire drives also allow you to boot your Mac up from them, so they are my preferred external drive connection.

Where to buy

Seems many people have hard drive preferences, so the choice should be made by reviews on Amazon or my preferred geek/gadget supply store, NewEgg.com. Personally, I go with Western Digital drives after having too many problems with Maxtor and Seagate. Never had an issue with any Western Digital drives. However, other’s mileages definitely vary. The only real criteria is that the drives are reliable.

You’ll see a bunch of nerdy numbers for the specs: cache, RPM, etc. For the most part, a 16MB cache and a 7200 RPM should be more than sufficient and is mostly standard anymore. In reality you don’t really need a fast drive for backups. As far as storage size, I would go with drives that are twice as large as the drive you will be backing up (more on that later). At the very least, it should be the same size of the drive you’ll be backing up, for obvious reasons.

Formatting

Hard drives are not PC/Mac specific—any compatible drive will work although you may need to reformat the drive. The hardware is all the same. PC-formatted drives will work on a Mac, but in general it’s recommended that you format for the Mac unless you have a specific reason for not doing so. And if you do, you are probably informed enough that you don’t need to read this post…

Drives are formatted using OS X’s built-in Disk Utility. Follow the drive manufacturer’s installation and setup instructions, and if they do not cover Mac formatting, check out this article for details. Also, this article on formatting and partitioning a hard drive is also useful.

Setting Up Your Backup

So now you have your new drive(s) installed. How does one back stuff up?

This is the real meat of the post. I’ve had many different systems in place, and feel the current setup is perfect for an individual user. I’m going to rough out the overall setup, then go into details:

• “Failsafe” backups with OS X 10.5’s Time Machine
• Bootable, differential “clone” backups of my startup hard drive
• Differential “clone” backups of my other hard drives (I keep all my art on it’s own separate internal hard drive)
• Offsite backup

Now lets go into details about each of these backup methods, and why I use multiple systems.

“Failsafe” backups with OS X 10.5’s Time Machine

OS X 10.5 and newer includes the “Time Machine” feature which essentially monitors your entire hard drive(s) and keeps as many versions of your files as it has hard drive space for. Time Machine is unique in that it saves multiple versions of your files, so you can revert back to and older version, say for example when you intended to save a Photoshop file using “Save As…” but instead did a regular save, overwriting the file unintentionally. With Time Machine you can easily go back to previous versions of the file and “restore” that earlier version. You can even save the newer version right alongside the older one (or replace it). Time Machine monitors your drives and performs the backups on the fly. No backup to “schedule”.

This is super handy for those small mistakes. If you were to only run one backup, I would recommend Time Machine as the software is free (it comes with any Mac running OS X 10.5) and it covers not only backups, but earlier versions of your files. In the case of Time Machine, since you are able to not only back up files but also save earlier versions of those files, the bigger the drive you use with Time Machine the better.

Time Machine also uses some code voodoo so you aren’t saving actual earlier copies of all your files, but references to just the changes (or something similar). In this way, far less disk space is needed. But the larger the hard drive, the more earlier versions you can have on hand.

Time Machine has saved my butt many times.

Bootable, differential “clone” backups of my startup hard drive

Differential? Clone? Wha…?

By “differential”, I just mean a rotating, ‘every/other’ backup. Here’s how it works: I have a startup drive of say 500GB. My backup drive for this drive is 1TB (terabyte, or 1,000 Gigabytes). My backup software runs a “cloned” (or “mirrored”) backup every morning to one of the two 500GB partitions on the 1TB backup drive. Then, once a week on Sunday my backup software runs another clone backup on the other 500GB partition.

Why do I do this? Because if some problem creeps into my boot drive, my backups will also contain that problem. By having a separate backup that lets me go back a week further, it’s insurance that I may be able to revert to a setup before the problem started. Sure, it might not be far enough back in time, but it’s just a bit of extra security that could really come in handy. I’m a bit paranoid, I know.

The “clone” backups are what they sounds like: your hard drive is cloned to the backup hard drive. Just copying the files isn’t good enough if you want to actually start your computer from your backup drive—you need to clone it to do so, so that all the hidden system files are also copied.

Why would one need to boot up their Mac from their backup drive? Picture yourself wrapping up the final tweaks to an 80-page magazine, and having your hard drive fail. All your files are safe with Time Machine, but you can’t start up your Mac without reinstalling the System software, and then reinstalling all your graphics software, entering license codes, etc. We’re talking potential hours of work, just to get back up and running.

With your clone backup, this is an exact copy of the drive you were just using (and just failed on you). Since hard drive failures are typically physical in nature (i.e. something broke), the bootable backup is exactly what you need here. You can boot a Mac right from an external FireWire drive. Boom, you’re back in business to meet the deadline, and you can sort out getting things back to normal later when you have more time to do so.

As a minimum, I would suggest a combo backup of both Time Machine and this differential cloned backup method. This should cover almost all situations you could run into, and will get you either back to the old file or get your Mac back up and running in almost no time at all.

Differential “clone” backups

Same as above, but no need for these drives to be bootable. Again the differential approach allows for one further step backwards in case something got really screwed up. Technically these do not need to be “clones”, but it’s not going to hurt anything to back up this way. Typically the backup method you want to use in all of these situations is an incremental backup, which means that during the backup process, only the files which have changed will be backed up (or deleted), saving huge time for all backups after the initial backup.

One thing to consider with the “clone” backups: deleted files on the main drive will also be deleted on the backup drive. This is referred to as mirroring. Most backup software has settings to allow the “backup” drive to keep files even if deleted on the main drive, but keep in mind that since there is now only one copy of them, they are not actually “backed up”. For me, hard drives are cheap enough that I never throw any files out unless I am totally sure I will never need them ever again. It’s just safer overall that way.

If you only have one hard drive to back up, then this step is optional. Another use here would be to back up your backup drive for an added level of security. However if it is also your startup drive, you’ll want to make sure the backup is also bootable.

Offsite backup

There are two ways to go about offsite backups: either an upload method like Mozy.com, or the “sneakernet” version where you have yet another cloned backup hard drive which you physically move to a location outside your home/studio/etc. to another location. Some even go as far as renting a bank deposit box for this, but your parent’s house will work fine as well. The idea here is fire or other disasters. All the backups in the world will not mean a thing if they are all at your location and there’s a fire.

Backup Software & Services

There are lots of backup software applications for the Mac, and I have purchased quite a few. My recommendations are purely the ones I have found to be easy to use and reliable, with features I like. I am sure there is other great backup software out there, but these are the ones I use currently for my backups.

SuperDuper!: SuperDuper! entered my arsenal when I learned about the need for bootable clone backup drives. This is it’s primary function, and it does it well. On the plus side, it will mount your backup drives (and unmount them when done backing up) as long as they are plugged in and have power. Also, backups can be scheduled. The downside: scheduled backups only run if the Mac is awake, so you’ll need to set a wake timer in the System Preferences (Energy Saver -> Schedule… button) so it can do it’s thing.

ChronoSync: I started using ChronoSync to synchronize files from my MacPro to my MacBook, and back before version 4.0 there was no bootable backup option which it now has. However ChronoSync works great for syncing files, so I am sure the new bootable clone drive features lives up to the quality. Honestly I have yet to use the bootable clone in ChronoSync since I already had SuperDuper set up, but it might be a nice all-in-one solution of you need both backup and sync features. ChronoSync has a feature to wake your Mac for scheduled backups.

Apple’s Backup (part of the MobileMe service): I use Backup & MobileMe for some rudimentary offsite backups of main data files—Address Book, iTunes library (the database, not the music—the music files get their own backup locally) and other system files such as preferences and such. Mostly I backup databases and other small-ish files that won’t take forever to upload to a remote server.

Mozy.com: Mozy is one of many offsite backup services available to Mac users. A free account is available, but with limited drive space offered. Paid accounts can get more storage space at reasonable costs. The downside to any online offsite backup is bandwidth—it’s going to take not only a very long time to upload everything, but downloading of your backed up files will also take some time. However these backups are not about speed, but about security.

Other Mac-friendly offsite backup services include BackJack, Carbonite and Crashplan. I have only used Mozy, and while it worked sufficiently well overall it wasn’t something I felt a need for, especially to pay a monthly fee. For now I use Backup/MobileMe for my basic offsite backups since I am already paying for the service and storage space.

You’re Covered

Following all the steps above should protect you from just about any type of catastrophe that could affect your files, whether a hard drive failure or some sort of fire or natural disaster.

Most people have never dealt with a hard drive failure, and therefore a backup system is not on their mind. Let me tell you, eventually it will happen to you. Backing up is only helpful if you do so before you need it.

If I had to recommend one solution for most Mac users, I would suggest running Time Machine. That has the broadest protection and the least amount of setup and technical knowledge needed. Most users have one hard drive, so one additional drive for Time Machine will suffice.

The next step would be to run the scheduled bootable clone of that same drive — that way you have two backups of your hard drive, and can boot from the backup in an emergency. Throw in Time Machine and you have the added bonus of accessing earlier versions of files.

Users with additional drives beyond the hard drive that shipped with their Mac will want to look into backing up those drives as explained above.

The added bonus of having a robust backup system in place? You can work with an eased mind that pretty much nothing you do can screw things up too bad. Think of it as the ultimate “Undo” for your entire digital life.

—

Back Up Your Mac is a post from: GoMediaZine

Go Media is a creative agency that specializes in brand development, art direction, and interactive media. The GoMediaZine began in 2006 as our company blog but has since grown into a thriving community for designers of all skill levels. For a closer look into our 14 person team and the work we do for our clients, visit gomedia.us.

Today we’re going to take our design into Photoshop for some tender love & care. We’ll learn about adding tactile character using Photoshop’s Bitmap filter, applying Spray Paint Textures for a handmade urban vibe, polishing with motion blur, and finally adding selective contrast with the dodge and burn tools.

Phase Four

Giving your design a face lift in Photoshop

Now before we get started in Photoshop lets open a new file and set size to 15×20 300 dpi.
Next place the jpeg of the poster into this new file.

Step One

Duplicate the layer three times, simply hold down alt and drag layer up.
Label and set first layers opacity to 70% simply hold down alt and drag layer up.

Author’s Note: It is important to properly name your layers so you don’t get confused.

Step two

Next create a bitmap, select bitmap layer and click image mode gray scale. You will get three pop up notices just click first button for all three, and let’s move on.

Step three

You will see one single layer. Click on image, mode and select (bitmap).

Step four

Set to 300dpi, halftone screen hit OK.

Step five

Set frequency to 35 or 45, set shape to round for best results.

Author’s Note: Feel free to try other things change up the shape and experiment with different settings.

Step six

Now convert bitmap back to gray scale. Click to Image>Mode>Grayscale

Step seven

Now convert grayscale back to RGB. Double click on layer and name it bitmap. Now select everything using ctrl + A. Copy the bitmap layer using ctrl + C.

Step eight

Now that we’ve got our bitmap image we need to apply it to our original design. Go to the history pallet and revert back to before you created the grayscale image. This will bring back all your original layers. You will want to replace the old bitmap layer with the new one. Just delete the original and ctrl + V to past in new layer. Change the fill to 59%.

Phase five

Adding spray paint texture

Lets add some spray paint from Spray Paint Textures, Volume 1 to spice it up a bit. I enjoy using these to give the design some character.

Step one

Place the spray paint above the compass rose size to your liking.
Author’s Note: You can play around with different colors and transparency effects.

Step two

Set to darker color and opacity to 75% make sure its above the opacity layer.

Step three

Duplicate the layer move into place as show above.
Author’s Note: Use the erase tool with a soft bursh and opacity set to 35 and erase around square till lines are gone.

Phase six

Adding light and aged effects

Step one

You will need to download the aged action to continue the tutorial.

Step two

First create a new layer and name it “Light Grunge”. This is the layer that we’ll be using to add the aged effect.

Step three

Create a new layer fill it with black

Step four

Filter, render, lens flare

Step five

105mm prime, move to into position as show above set brightness to 118%

Step six

Step seven

Alright, now it’s time to use that aged texture action. Load it up and play it. See that? We took a standard lens flare and made it a little messy. Now, let’s do it again by hitting play a second time.

Step eight

Set the light grunge layer blending mode to Screen. Now change opacity to 75%. See how adds realistic aging effects?

Phase seven

Adding light and aged effects

Step one

Select the motion blur layer we created earlier. Open the motion blur dialog by clicking Filter>Blur>Motion Blur. Set angle to 48% and distance to 999 pixels.

Step two

Set our motion blur layer blending mode to Screen. Lower opacity to 61%. We’re almost there!

Phase eight

Adding dark contrast

Step two

Select the burn tool. Use it like a brush on some dark areas that you’d like to make even darker. Keep experimenting until you’ve achieved contrast that looks good to you.

That’s it! We’re done! I hope you had a good time taking our Illustrator design to the next level with Photoshop. The final results may very, I took it a bit further using the same techniques. Have fun Designing your own madness.

Design a Vintage Poster, Part II is a post from: GoMediaZine

Go Media is a creative agency that specializes in brand development, art direction, and interactive media. The GoMediaZine began in 2006 as our company blog but has since grown into a thriving community for designers of all skill levels. For a closer look into our 14 person team and the work we do for our clients, visit gomedia.us.

Self-promotion is a must for any self-employed or freelance graphic designer or illustrator. This installment of Blank Canvas asks our readers: how do you promote your services?

Cold calls? Mailing lists? How do you use the internet for your marketing? Social networking? What works best? What have you tried and abandoned? What services or methods do you recommend as the most effective?

I’ll start things off with my own approach. The bulk of the promotion I do for my illustration services is online. The main thrust of this is by proper, Google-recommended search engine optimization. Nothing shady, just good practices for the content of your website. And by content I am referring to the text content. People search using words, so you need those words to be on your website.

A big part of this is not just on my own website and blog, but also being an active participant in online design & illustration communities and artist/designer blogs, collectives and related websites. I also create accounts on as many relevant online portfolio sites as I can and I regularly submit my work to photo-sharing sites such as Flickr.

One drawback to this approach is that I am limited to clients who are searching for an illustrator. Certain portions of the industry such as children’s publishing, editorial/spot illustration for magazines and websites and apparel design/illustration are most likely not out there doing a Google search for illustrators. This is where a direct-mail marketing approach or cold-calls might fare much better.

The upside to this approach is that you have built-in interest from the potential client. Typically these clients are starting up a new business, which also has the potential for additional design work for branding and other marketing materials for the client’s new company or service.

For the past year I have been considering a direct-mail approach, but currently my online marketing keeps me busy enough that it hasn’t been a priority.

One aspect of reaching out to larger companies that is a big lure to me is the added exposure of your work which can come from working with a larger company, as well as the name-dropping you can do when promoting your services to future clients. I do have some “dream clients” I would like to work for, which is the biggest impetus for me to strike out with this approach. I love the clients I work with, but getting some “street cred” is appealing.

And getting an “in” with a larger company also has the added benefit of ongoing work. If they like your work, you’re likely to get more of it. Probably keeps the stress levels somewhat lower.

Your turn — Go Media wants to hear from the readers, please let us know in the comments section below how you handle your self-promotion and marketing. Go!

Blank Canvas: How Do You Promote Yourself? is a post from: GoMediaZine

Go Media is a creative agency that specializes in brand development, art direction, and interactive media. The GoMediaZine began in 2006 as our company blog but has since grown into a thriving community for designers of all skill levels. For a closer look into our 14 person team and the work we do for our clients, visit gomedia.us.

Font Sleuth is an interesting new font browser application for Mac OS X. The first thing I noticed about this app—pretty darn fast. No font manager I have ever used is lightning fast when it comes to previewing fonts. Font Sleuth however was close. Give it a few seconds to load the fonts on screen and you’re scrolling.

Font Sleuth has a very spartan interface, focusing pretty much on the previews of the fonts. There is a slide-out drawer for creating groups where you can store collections of fonts in your desired groupings.

There’s no auto-activation plugins, no metadata sorting. This is purely a font browser. What I like most about it is the size of the previews in both the main window as well as the Groups drawer. If Font Sleuth fits your needs, $12 seems a more than reasonable price for this utility software.

Here’s an overview of the main features offered in Font Sleuth:

View And Activate Uninstalled Fonts

Select any folder of fonts and view them in their font faces. Font Sleuth can optionally display fonts contained in folders nested within the selected folder. Activate uninstalled fonts with a single click.

Create Font Groups

Create font groups visually by dragging fonts from Font Sleuth Viewer to the Groups Drawer. Group fonts according to your own criteria to make font finding even faster.

Browse Fonts Quickly

Use Font Sleuth’s display window to go through your fonts. Try different combinations of display attributes such as text color, size, alignment, and style.

Run Font Slideshows

Run slide shows of installed fonts, uninstalled fonts, and your custom font groups. Adjust duration, text color, size, alignment, style, sample text phrase, and background color even while the slideshow is in progress.

Save Favorites

Keep a list of sample text favorites and access them from any font display window.

Save and Print

WYSIWYG Font Lists

Save and/or print WYSIWYG list of installed fonts, uninstalled fonts, or your custionfontfontfoKeep a list of sample text favorites and access them from any font display window.

You can download a 20-day trial of Font Sleuth here.

Font Sleuth: Find Fonts Fast is a post from: GoMediaZine

Go Media is a creative agency that specializes in brand development, art direction, and interactive media. The GoMediaZine began in 2006 as our company blog but has since grown into a thriving community for designers of all skill levels. For a closer look into our 14 person team and the work we do for our clients, visit gomedia.us.

A Picture Worth a Thousand Points:

To start things off, we need a source image to serve as our template for this gradient mesh image.  For this tutorial I’ll be using a light bulb photograph from the stock.xchng.  I chose this particular image because it has clearly defined edges, as well as components that the subject it can be separated into.  The outline of the light bulb as a whole is crisp.  Also, you can easily subdivide the object into several components, such as the glass bulb, the metallic base, and the wire filament.  This will make it easier to work with, as you’ll see further along in the tutorial.

After downloading the source image and putting it into an easy-to-find location, open up Illustrator and create a new document that is 768×1024 (I’m using Illustrator CS3).  Make sure to open up the Advanced section to make sure that the Color Mode is set to RGB.

After your new document is created, go to File > Place…

Now Place our light bulb stock onto Layer 1 of our canvas.  When it’s on the canvas, adjust the height/width of the image so that it better fills the space.  With the stock image selected, use the Free Transform Tool (shortcut:  E).  You can easily and proportionately resize the image by holding Shift+Alt while dragging one of the image corners.  This allows you to resize both the height and width proportionately, while the center point remains firmly in place in the middle of the canvas.

Now go to the Layers tab and double click on Layer 1, which is where your stock image should be sitting on.  A popup window will appear with the Layer Options.  Rename it to “Original”, select the “Template” option, and deselect the “Dim Images…” checkbox.

All Gradients Start Off with a Single Color:

First, create a new layer.  Bring up the Layer Options popup for this one.  Rename the layer “Bulb”.

Next, use your Rectangle Tool (shortcut: M) and create a rectangle about where the middle of the bulb is.  Turn off the outline of this shape, and give it a green fill (0,255,0).

Then, go to Object > Create Gradient Mesh…

In the Popup, give your gradient mesh the following settings.

When that’s done, your green rectangle should look like this:

Now, select your Free Transform Tool again.  Use this tool to resize the rectangle so that its top, bottom, left, and right sides line up with sides of the light bulb’s glass part.  Then change the overall opacity of the rectangle to 50% so that you can see the bulb through it.

Once this is all in place, take your Direct Selection Tool (shortcut:  A) and adjust the outer points of the rectangle so that they line up relatively with the outline of the bulb.  As you select these points, you will notice that they have handles attached to them.  Use them to adjust the curve of the outlines.  Try to make minimal adjustments to the points vertically.  Adjust the points by moving them primarily horizontally.

As you can see, there are not enough points to make this shape completely conform to the outline of the light bulb.  So we will add some.  Select the Mesh Tool (shortcut: U).

After selecting this tool, place the cursor over the edge that you want to modify.  Then, when you click on the edge, it will create a new set of points on the gradient mesh.  Once those points are created, you can use them to further refine the outline of this shape.  Repeat this process until your gradient mesh shape is the same as the outline of the bulb.

Now some of you might be wondering why I chose to create the light bulb shape like this, instead of just by tracing the bulb’s outline with the Pen Tool.   Take a look at this 2-row, 2-column gradient mesh I created using a shape I made with the Pen Tool:

This is the shape:

And this is the gradient mesh created from it:

As you can see, when the gradient mesh was created out of this shape, it didn’t use any of the vector points from the original shape when it created the columns and rows.  It created its own points on the top, bottom, left, and right sides.  Using the Mesh Tool and clicking on individual points will result in a similar issue.  It may use the point I selected on the left side, but it will create a new point on the right side to connect to, completely disregarding any other points that might be close by.

So essentially, it’s my preference to use a rectangle when I create the initial gradient mesh because it allows me to make better use of all the vector points at my disposal.

This Shade of Green is Not Very Realistic, is it?

Now it’s time to start changing the colors of this gradient mesh from neon green to something that resembles an actual light bulb.  Take your green gradient mesh and restore the opacity to 100%, so that the image is a solid color once more.  Then, change the view of the canvas to Outline Mode.  You can do this either by going View > Outline or by using the shortcut Ctrl+Y.

Now there are two tools you will be using extensively from here on out:  the Direct Selection Tool and the Eyedropper (shortcut: I).  Take your Direct Selection Tool and select the vector point in the middle of the bulb.

Then take the Eyedropper and select the color of the background image as close as you can to the vector point.  In this case, the color will be white.  Now, if you turn off Outline View, instead of the gradient mesh being solid green, there will be a spot of white in the middle.

Turn Outline View back on and repeat the process to change the colors of all the vector points on this bulb.  Every vector should be made to match with colors right next to them (with the exception of the several vector points that are along the middle vertical line running through the bulb.  Aside from the ones that are attached to the outline, those should be made white, like the initial vector color change illustrated above.  We’re ignoring the filament related features of the light bulb for the moment).  When you are done, there should not be one spot of green left on this image and it should look similar to this:

In the original light bulb picture, there is a great deal of white in the middle of the light bulb before it starts turning gray.  We’re going to remedy this not by adding more vector points, but by adjusting the ones that are already in place.  If you take your Direct Selection Tool and select the center vector point, a set of handlebars will appear.  They may be hard to see against the gridlines, if they’re perfectly horizontal and vertical like in the image below, but you can tell they’re there by the four dots that end each handlebar.

These handlebars are used to control not only the curve of the gradient mesh lines, but also how far the vector point’s color extends before blending into the color attached to the next point.  If you keep the handlebars close to their originating vector point, the color will be strongest only close to the point.  If you extend the handlebars out farther, the color will extend further too.  If you extend some lengths of the vector point handlebars, and then shorten up the handlebars of the other vector points connected to them, you’ll see how much the colors are affected by these changes.  This image is what happens if you shorten the middle vector point’s handlebars, and then lengthen the outer edge vector points’ handlebars…

…And this image is what happens if you lengthen the middle vector point’s handlebars and shorten the outer edge vector points’ handlebars.

Now using the original image as a guide, make it so that the white color of the bulb fills most of the gradient mesh, using just the handlebars.  When you’re done, the mesh should looks something like this:

It’s All About the Fine Tuning

Now we have a basic shape and look of the bulb portion of this image.  However, we want to make this as realistic as possible.  The ultimate goal is to create something that, at first glance, someone would mistake for a photo of a light bulb.  So we’re going to have to take a look at the original image again.

Go back to Outline View and let’s take a closer look at the very top portion of this bulb.

As you can see, there are some rather distinct color changes between the edges of the bulb and the white portion of the middle part.  So what we’re going to do is create a few new vector points so that we can recreate this more defined gray area.  Take the Mesh Tool (shortcut: U) and make a point where illustrated below.  Then take the Eyedropper and select the gray color that is right next to point you just made.

Now repeat this action, but this time use the Mesh Tool to create a point right below the one you just made, right where the white/light gray area meets the dark gray.  Use the Eyedropper to select the nearby color for this point too.

Now when you go turn off Outline View, you’ll see that there is now a more defined gray area where you made those points.

It looks a little unnatural for the moment, but this will be fixed after we go through and do some more editing.  Adjust the handlebars.  Add additional points where necessary to the gradient mesh.  It will take some time, but in the end you will end up with a bulb that looks like this:

Compare this image with the original light bulb…

Pretty close, isn’t it?  Here is a look at what the gradient mesh for the bulb looks like after all my tweaking to make it resemble the original:

As you can see, I created more closely packed vector points and lines around the areas where I wanted to add more detail, which were at the edges and their varying shades of gray.  In order to edit some of those points, particularly around the places where they bunched up really closely, I would have to zoom in anywhere from 200% to 800% to be able to adjust the vector point colors and handlebars.  That attention to detail, though sometimes time-consuming, will pay off in the end.

Just Because You Can Doesn’t Mean You Should

Let me let you in on a little secret (well not really a secret… more along the lines of common sense reminder).  Even though this is a tutorial about using gradient mesh in Illustrator to recreate a realistic image, is that reason enough to make EVERYTHING in the image out of a gradient mesh?

Simply put…

No.

If you can get away with replicating parts of the image using regular vector shapes with creative use of gradient fills, strokes, and other filters provided by Illustrator, then by all means do it!  It will save you time and maybe even a little bit of your sanity in the long run when doing gradient mesh images.

Case-in-point:  The filament of the light bulb.

The filament of the light bulb is made up of some very thin pieces of metal with even thinner pieces of wire suspended or placed between them.  In my opinion, it is not necessary to use a gradient mesh because their appearance can be replicated using some very thin strokes for the wires, and then using some shapes with gradient fills for the metal.

First, turn off visibility of your Bulb layer so that you can see the original photo.  Then make a new layer and name it “Filament”.  Then zoom in so that you can clearly view the filament portion of the bulb.  Turn off your fill color, make your stroke color some bright, non-black/white color, and use your Pen Tool to trace the outline of one of the metal pieces holding the wire filament in place.

Then, with the shape selected, open up the gradients palette and give the shape a linear gradient fill with a .75 pt stroke.  The stroke should be colored #0D0D0D, and the fill should be #383838 on the far left, #575757 at 50%, and 1F1F1F on the far right.

When viewed up close, this clearly looks like a flat shape.  However, when viewed from its normal dimensions or smaller, it becomes very hard to tell the vector object from the original.  Can you tell which is which?

Now, using shapes and lines at your disposal finish building out the filament portion of the light bulb.  When you’re done, your partially completed light bulb should look something like this when both the Bulb and Filament layers are visible:

Divide and Conquer

Now that you know the basic for manipulating gradient meshes, all that’s left to do is to finish creating the rest of the light bulb.  What you will want to do is to single out specific components of the original image to recreate.

Here is an example of one way could subdivide the remainder of this image.  If it’s easier for you, go ahead and further subdivide larger portions of these components into smaller, more manageable pieces.   Take your time, pay attention to details, and cut corners where you feel that you’re able to.  Also make sure to create a separate layer for each component, so you can keep your work organized.

When you’re done, you should have a gradient mesh light bulb that looks as close to a realistic one outside of an actual photograph or 3D rendered object.  In Illustrator, the image may look slightly grainy.

Here is a screenshot of just the gradient mesh of the above image, sans all the colors.

Though it might appear grainy in Illustrator, when you export this image as something like a Jpeg, the gradients become smoother and more refined.

The files used in the creation of this tutorial can be downloaded here: Tutorial files - Gradient Mesh Lightbulb (138)

In Conclusion

Using the techniques taught in this tutorial, one can go about creating many different kinds of realistic vector images using gradient meshes.  The techniques used here work best with images of things that can be cleanly divided into segments, such as mechanical devices, automobiles, insects, instruments, plants, etc.  It is also very possible to recreate more complex organic objects using gradient mesh, such as birds, fish, reptiles, mammals, and even human beings.

Subject matter like that will be covered in future tutorials at a later date.  Till then, I hope that I was able to enhance your knowledge of gradient meshes and Illustrator by another degree.

Vectors Imitate Life with Gradient Mesh is a post from: GoMediaZine

Go Media is a creative agency that specializes in brand development, art direction, and interactive media. The GoMediaZine began in 2006 as our company blog but has since grown into a thriving community for designers of all skill levels. For a closer look into our 14 person team and the work we do for our clients, visit gomedia.us.

After countless hours of looking at type, learning how type and image work together, filling up sketchbooks, learning how to code HTML and CSS and even sleeping in the art building, two soon to be “little fish” in the big sea that is graphic design wanted to get to know one of Cleveland’s heavy hitters (Go Media President William A. Beachy).

Where did you receive your education?

I attended The Ohio State University in Columbus Ohio. My degree is in Industrial Design which included studies in product design, interior design and my focus, visual communication. Ohio State’s design school is highly competitive only accepting approximately 60 students per year.

When you got out of school what did you see yourself doing? How does that match up with what you are doing now?

When I first graduated I immediately attempted to break into the comic book industry as a writer and illustrator. When I couldn’t get someone to hire me I decided to self-publish and open my own studio. That failed miserably. Eventually I found that I could get enough jobs illustrating to fill that need and spend the rest of my time doing layout and running my company. In truth, I’m not far from where I expected to be. I’ve always wanted to run my own company, I’ve always wanted to draw and I’ve always wanted a cool warehouse studio. Right now I have all of those. It didn’t come as easily as I had imagined, but I’m here – so I’m thankful for that.

Who influenced your career choice? Any reason you chose design?

Todd McFarlane. He is a comic book artist. He was the most influential artist in my generation (in my humble opinion.) After I took one quarter of fine arts I realized that I needed more technical skills that I wasn’t going to get as a fine art major. I read Todd’s biography and it said he studied design. I checked out what Ohio State had to offer, and its industrial design department was ranked 2nd in the nation. All I had to do was take a portfolio exam and beat out 300+ other students that were applying for the 60 spots. I got in!

What made you want to merge businesses with Next Level Multimedia? Did you think it would make you more successful together than separate?

When you run a business there is a LOT of work beyond just design services: billing, accounting, legal stuff, payroll, advertising, selling, on and on and on. One person only has so many hours in a day. I had watched my friends at JakPrints build their business much faster than I was. I’m sure a large part of it was that they had a few partners to divide up the load. There is truly efficiency in division of labor. I could focus on the book keeping and Chris could study programming code.

The reason that I picked both of my partners; (first Chris Wilson then Jeff Finley) was because they were both doers not talkers. When I was running around town passing out flyers – there was Chris doing the same thing. When I was at the printer picking up stuff, so was Chris. He was out actively building his business. Both him and Jeff were quick to take action and build their business. So, that’s why I knew they would make good partners.

Not only did I think it would make us more successful if we worked together, it DID! I couldn’t imagine running this company without their daily support. I think we have a magical partnership. There is serious mojo here at Go Media. We love what we do and the sky is the limit.

Your website refers to Go Media as a Progressive Design Studio, what does this mean to you?

It means that we’re on the “cutting edge” to use a cliché term. Actually they have another term – the “bleeding” edge. That means we’re sometimes so ahead of the curve that people don’t get it. Not designers mind you – I think fellow designers get us easily. But when you’re on the bleeding edge of design or technology sometimes there is a price to pay. It means you make a sacrifice for your love of the art. You say: “everyone might not get this, our clients may tell us to dumb it down, but we’re going to invest the time and energy to do it the very best and deal with the consequences even if that means we lose money.”

What makes Go Media different/better than other design studios in the area?

Hmm, I wouldn’t necessarily say better. Each firm has its own strengths. Our strength is artistry and creative thinking. We got started working in the entertainment industry so, that kind of set up a really high standard for the art coming out of our firm. It also lead us to hire characters that I would say are “out of the box.” One of our most senior designers (Oliver Barrett) is a bass guitarist for the rock band Above This Fire. These guys are seriously hard-core musicians. Several other employees have also put together a punk band. Last fall they held a concert in our building. And that all fits right into what makes Go Media special. We’re highly creative and expressive individuals that are ridiculously passionate about the things we do.

Music seems to be the connecting point for many people in your firm. Is doing work for the music industry something that you strive to produce? Or does the music industry find you?

It’s funny how I answer one question and it leads immediately to the next. We all love music – who doesn’t. And there is a rich history of innovative art and design being associated with music. Whether it’s the packaging, apparel, music videos or gig posters, music has been one of the very best vehicles for driving innovative art. Initially we made massive efforts to break into the music industry. Once we had done that and became known as a reliable go-to creative firm, then they started seeking us out. It’s been great.

What do you think about knowing how to design for the web? Most people seem to think it’s a must for people coming out of school. Do you agree?

Ha ha… well, do you want to find a job and make money? If you answered yes, then I highly suggest you dive into web design. The facts are that the demand for web design is massive, and you can charge more money for web design over print design. The number of students coming out of school with GOOD web skills is not what it should be. No offense, but print designers are a dime a dozen. I get 5 resumes a week from designers looking for work that don’t know web. I’m not saying you HAVE to have web skills. But I would guess that web skills will quadruple your chances of landing a job, probably more. And the job you do get will pay more.

When I left school I had almost no web designing skills. But the demand was there immediately. So, I learned Go Live (a precursor to Dreamweaver) and started building websites. Since then I’ve hired lots of web designers and I don’t do that work anymore. But when you’re getting started you don’t have the luxury to write your own perfect job summary. You have to take the jobs that are available. Right now the web is where the demand is.

What would be your dream company/brand/person to design for?

Marvel Comics of course! If I could do a massive marketing campaign for the entire comic book industry, that would be amazing.

Who/What influences you now? Where you do you find inspiration?

I still like comic books. I am also influenced by my staff. They each have their own styles and skill sets. I am also heavily influenced by great business minds. Since that is now a huge part of my day, I read lots of business magazines and biographies.

What is your process to deal with unruly clients?

We work VERY hard to “kill them with kindness.” We bend over backwards trying to keep our clients happy, maybe too much. Occasionally when we have a complete and total jerk (or crazy person) we will refund their money and respectfully decline to take on any future projects.

It’s very important to always be professional, courteous and kind. It’s a small world. The older you get the more you realize that the things you do get around. When you kick ass for a client, they tell their friends. And when you make a mistake, they tell their friends that too.

The trick is to not give them any reason to be unruly in the first place. You need to communicate clearly from day one. You have to establish a good relationship and set reasonable expectations. “Under promise and over deliver” is a phrase we use around here a lot. If you say it will take 10 days to complete this project and you complete it in 7 – you have a happy customer. But if you tell them it will take 5 days, and it takes 7 – you have an angry client. In both cases you did the job in 7 days. But the expectation of the latter was higher. So, it’s important to manage those expectations!

Explain the Go Media hiring process?

I ask potential employees to send me a cover letter, resume and 5 jpeg samples of their best work. If they follow my directions I keep their documents on file. When it comes time to hire, I start reviewing everyone’s files. But I also recruit potential employees. The truth is that Go Media doesn’t hire a lot of people. We have almost 0 turnover. Our employees are happy. We haven’t hired a single new designer in over a year and a half. So, by the time I need to hire someone – there is probably someone in the community that I’ve already identified as the next Go Media employee. They need to have mad skills and the right attitude.

Once we’ve identified several candidates we will have interviews and maybe go out for a drink. Sometimes getting out of the office is a good opportunity to get to know the REAL person.

When we do hire it’s on a 3 month probation period. Sometimes designers will have these AMAZING portfolios but when it comes time for them to perform they’re nowhere near that talented. I wonder where all the art in their portfolios comes from.

In the hiring process, do you look to further develop that personality in potential employees?

Personality is very important. This is a check-your-ego-at-the-door firm. Work ethic, loyalty and humility are hugely important to me. I love my employees and will “go to bat” for them. I expect the same in return. When the chips are down we will all have to work to right the ship. And when the times are good, I share the profits with my staff.

What’s the most important thing you look for in a potential employee’s portfolio?

You have to be good and well rounded. I want to see a variety of skills, because you’re going to need it all. For instance, I will get a lot of nice portfolios from illustrators. Their drawings may be amazing, but if I ask them to layout a print article – they will be clueless about how to organize the text. That’s a problem. Here is a base set of projects you should have in your portfolio: Illustration, corporate Identity (logo), brochure (with lots of text layout), web page and some specialty skill like 3d modeling or animation.

What’s the best advice you could give soon to be Graphic Design graduates, preparing to enter the work field? What do you wish you had known at the time?

Other than my previous lists of skills that I think people need, I would emphasize humility. The real world is not necessarily what your teachers taught you. I have a lot of designers come in here with some false impressions of what their lives as designers are going to be. The real world is not a stereotype.

One way to quickly get an idea of what the real world is like, while simultaneously increasing your value to potential employers is to start freelancing. Do it while you’re still in school. Walk door-to-door from business to business and volunteer your design services for free. The experience of working with a real live customer will help you learn faster than any book or any class.

Any other comments, words of wisdom or advice?

Keep an eye on Go Media, our GoMediaZine and the Arsenal. We’re working VERY hard at enriching the design community. We have tons of tutorials, products and services that will help designers coming out. So, just stay in touch with us and we’ll keep kicking ass for you.

This questionnaire was prepared by two soon-to-be-graduates of Kent State University with bachelor degrees in Visual Communication Design, Lauren Goldberg and Adam Smith.

An Interview with Bill Beachy: Go Media President is a post from: GoMediaZine

Go Media is a creative agency that specializes in brand development, art direction, and interactive media. The GoMediaZine began in 2006 as our company blog but has since grown into a thriving community for designers of all skill levels. For a closer look into our 14 person team and the work we do for our clients, visit gomedia.us.

Introduction

When you think about the design process, what comes to mind?
I believe it is the combination of thoughts, mixed with emotions and pure forms that capture a person’s attention. We are all part of this thing called “madness. ”

The definition of Madness:

1. 1. The state of being mad; insanity.
2. 2. Senseless folly: It is sheer madness to speak as you do.
3. 3. Frenzy; rage.
4. 4. Intense excitement or enthusiasm.

In this tutorial, we’ll be modifying vector elements from Vector Set 16 to create a retro-vintage poster. Along the way we’ll uncover tips in Illustrator and Photoshop that can lend your designs a little extra TLC. I tend to work in both Illustrator and Photoshop. Both programs have their strengths and weaknesses, but together they’re unstoppable.

Phase one

Collection of assets and file setup in Illustrator

Before we start we need to gather our assets. We will be using a few pieces from the fresh release of Vector Set 16.

I’ve looked through the Set and selected the images that I think are best suited to create a vintage, retro looking poster. The use of vintage pieces mixed in with some color radials will really bring the madness together!

I choose these vectors to show how flexible they can be. Please, go ahead & have fun! Experiment, tear them apart, change their color and size to make them yours.

Picking the right background for your vintage poster is vital. Paper, cardboard, and grunge textures can really bring your poster to life. This is a good time to look for some inspiration, so take a look at a few Bauhaus poster designs.

Author’s Note: Experiment with different paper textures. Here are some free options.
DeviantArt
Zen textures
Lost and taken

If you’d rather just use the background that I did, you can download it and get started.

Step one

In Illustrator create a new document. Set the color mode to RGB and set the size to 15×20 inches. Next, import the background texture file.

Author’s Note: If you use another background image make sure to re-size it to 15×20.

Step two

Copy the retro loop image from Vintage Elements and paste it into your document. You will notice these are very flexible, you can change colors and re-size different individual sections of the shape.

Using the Direct Selection Tool (white arrow), select the top end of the four lines and drag upwards to lengthen the loop. Repeat this on the left side.

If you’re having trouble editing this shape, take a look at this video overview.

Step three

The color palette plays an important role in setting the mood for a retro poster. If you’d like to use the same colors that I’m using, download these color swatches for free.

Now lets change the color of the segments in the loop image. With the Direct Select Tool, select a line that you’d like to change.

Hold down SHIFT and select all the segments of the line. Now select a color swatch to change the color of the line segments.

These are the ones used above: Blue-green #66A9A6 Tan #D9D5A9 Red B93826 Black 000000

Author’s Note: Experiment with colors, you’ll surprise yourself sometimes. For added inspiration in the color selection process, visit Colourlovers.com – a great community site with all sorts of color schemes and patterns.

Step four

Let’s add a drop shadow, this will help create some separation from the background.

Step five

Now it is time to bring in other vector elements to round out the poster. I added one mean-looking Ape from Primates and the state of Alaska from Maps of the USA to the eye of the loop.

Make sure these new shapes are arranged underneath the loop that we just altered in steps 1-4.

Author’s Note: I added some quick homemade ink drops for fun right under the chin.

Step six

Lets use this color wheel from Color Radials to give the background some color. Set the blending mode to overlay and opacity to 22%. Now select and drag from the corner to make it larger.

Step seven

Oooo, that looks good. In fact, lets add another Color Radial and place it just above the primate below the vintage element as shown above. Make sure the blending mode is set to multiply and opacity is 49%.

Author’s Note: Use your best judgment for size and placement of vectors.

Step Eight

Now select ctrl+c and ctrl+f to place in front, select and expand it till the center is filled with the smaller circle. Make sure the transparency is set to multiply and opacity is 49.

Step nine

We’re using the same color radial so re-size and place below the chin of the ape.

Step Ten

Add a compass rose from the Maps Vector Pack, and lets set the transparency to multiply and place it over the color radial as pictured above. Now we’re done with adding the vectors and creating the poster’s composition.

Phase Two

Adding Text

Used the font Blockhead and played with the color and transparency to give it a washed out feel. Simple but effective.

1. 1. Font size 120 set the AV to 50
2. 2. Change color to 66A9A6
3. 3. Now go to effect and choose style inner glow. Set mode to screen, opacity to 84 with a blur of 15.2
4. 4. Go to filter, click on style and add a drop shadow. Set mode to multiply, opacity to 75
5. 5. Make sure the font transparency is set to multiply.

Phase Three

Creating a vintage pattern background
Alright. We’ve finished the foreground elements, but I think the poster is still missing something. Let’s add in a retro background pattern and see where that takes us. To make the background, we’ll grab a simple shape from the Vintage Elements Vector Pack.

Select the shape and change it’s color to FCBA63. Next, change it’s blending mode to Multiply, and lower opacity to 38%. Now we’re ready to stretch Adobe Illustrator’s legs a bit. Drag the shape to the right, holding Shift (constrain movement) and Alt (drag duplicate). Now, without clicking anything else in between, hit Ctrl+D to duplicate this move eight times. Ta-da! A row of eight vintage shapes.

Watch the video below to get caught up and see Ctrl+D used to finish out the background.

The end of Part I

Congrats! You’re done with your layout and work in Adobe Illustrator. From this point on we’ll be working in Photoshop to add fairy dust & final touches. Get a load of the image below for a sneak peek at the final piece. We’ll be covering these techniques this Friday, so stay tuned for part II.

Share your thoughts, questions, and comments with us below. If you take the challenge to follow this tutorial yourself, post the results in our User Showcase and link to it in the comments.

Design a Vintage Poster with Vector Pack 16 is a post from: GoMediaZine

Go Media is a creative agency that specializes in brand development, art direction, and interactive media. The GoMediaZine began in 2006 as our company blog but has since grown into a thriving community for designers of all skill levels. For a closer look into our 14 person team and the work we do for our clients, visit gomedia.us.

Discount code below! But first, a few years ago, I uploaded some images to sell as prints on ImageKind. At the time I thought it was amazing how you could just upload some high res artwork and immediately customers could purchase them as prints and even get them framed. I was impressed by how easy it was for anyone to pick a design, select the print size and paper stock (even on canvas) and then choose from a bunch of different frames. There was basically no work on my part. I started to get some sales and people were buying prints of our work. Cool! But like anything else, I got sidetracked and let the store gather dust and I never updated it or even told anyone about it.

Then a few weeks ago I got an email from Nate Jolovich who works at Imagekind. He was calling me out on my laziness (my words, not his) and how Go Media really needs to add more work up in the store. I was surprised to actually hear from Imagekind in this regard. I would assume a company as big as they are (they are part of CafePress now) could care less about who has a store. There are far too many people selling stuff on the site and to single us out was kinda flattering.

So anyway, to help entice me, he offered me a few samples of printing and framing. He actually sent me some finished samples to show me the quality of their craftsmanship. Here are some photos of two new prints of mine that YOU can buy in Go Media’s Imagekind store.

Free Shipping Coupon Code: FREEGOMEDIA

Buy “FATE” from Go Media’s Imagekind Store

Buy “I’D RATHER BE EATEN” from Go Media’s Imagekind Store

What’s next? Well, there is more in store for Go Media and Imagekind on the GoMediaZine. In the next week or so, we’ll announce a contest/giveaway where one of our lucky readers will win some free Go Media prints of his or her choice and a free Imagekind Platinum Account!

New Prints by Go Media for sale on ImageKind is a post from: GoMediaZine

Go Media is a creative agency that specializes in brand development, art direction, and interactive media. The GoMediaZine began in 2006 as our company blog but has since grown into a thriving community for designers of all skill levels. For a closer look into our 14 person team and the work we do for our clients, visit gomedia.us.

Here’s how to win:

This giveaway has ended. Thanks for playing!
Look through the packs that are included with Vector Set 16. Pick your favorite. Then, tweet about why you want the pack!

Note: This only works for packs, people, so be specific. Packs are $9.99. Tweeting that you want the whole set for free results in instant dequalification. :-)

Requirements:

1. 1. Must tweet @go_media
2. 2. Must include link to the product you want

Example entry:

The best part? Everybody wins. Yep, this is the Go Media’s Arsenal version of a busting open a Pinata. Everybody wins. We’ll be keeping an eye on all of the tweets sent to @go_media and sending out prizes all day long. If you’d like to speed up the process, follow adam_wagner or go_media – because we need to direct message your download instructions.

Alright players. Do your best. May all of you win!

Note: The Vector Pack 16 Twitter Promotion is officially finished on Thursday October 29th 12:00pm (noon) EST.

Want a free Pack of Premium Vectors? Just Ask! is a post from: GoMediaZine

Go Media is a creative agency that specializes in brand development, art direction, and interactive media. The GoMediaZine began in 2006 as our company blog but has since grown into a thriving community for designers of all skill levels. For a closer look into our 14 person team and the work we do for our clients, visit gomedia.us.