Friday, May 4, 2012

Inspired Palettes in Ilustrator

Greetings, friends!

As you may have noticed, the blog has had a little makeover, and I thought this would be a fun time to show you how I like to use photos that I find inspiring in a piece of artwork. And how anything you find inspiring -- whether it's a photograph of a bird, or a painting, or a garment -- can become a new palette in illustrator. You can then turn this palette into anything you want: signage, blog layouts, business cards, mood boards, textile design, even mapping out quilts.

First step is to find an image that inspires you. Pinterest is a great website for that, and you all know I'm addicted to it, so of course I go there for anything image and inspiration related. Today, I saw an utterly gorgeous crocheted piece by the writer of Muita Ihania, a Finnish lifestyle blog that has a really beautiful, colorful, feel. Here's the image:

Muita Ihania blog photo

I love the colors in this afghan! I fell so in love with them, in fact, that I spent the next hour combing through every page of her blog looking for in progress photos to watch it all come together. While searching, I found just the type of photo I wanted -- a stacked up image of all the quilt pieces, which I then could use as inspiration for the warm, colorful blog layout that you see now! Here's how I did it -- first, copy the image into Illustrator by right-clicking to copy (on a Mac you hold down two fingers on the mouse pad and press to click, then drag to the option 'copy image'). Then go into the Illustrator window and paste the image onto the artboard. It isn't important where, but you want it to be a manageable size while still giving you lots of space to work around. As you can see, I dorkily put mine half on, half off the artboard, and now I have the lovely black line to show you. 

screenshot by me; original photo from Muita Ihania blog
From here, you may notice that there are eight little squares in the upper right corner of that image. Those are made using the rectangle and eyedropper tool, and literally just 'eyedropper-ing' the colors into each square, pulling them from the image. After you find eight colors that work together, here's how you turn them into a saved palette on Illustrator. 

The first, and simplest step is to pull your color swatches into the swatch window (which you can see by going to Windows > Swatches) -- select each swatch with the eyedropper and then, where the color appears in the fill section, pull these over into your swatch window. You might want to delete all the other swatches in the swatch window before doing this, if you're like me and like a clean workspace! Now that all eight colors are in the swatch window, it's time to define your palette.

Illustrator does two types of palettes. The first type is a 'color group'. This is designated in the swatches window by a small folder, which is followed by each of the colors in the color group. You can have multiple color groups to a saved swatch set, which is useful if you just want to play around with different colors in one project. Make sure you have all your swatch colors selected (click the first swatch in line, hold down shift, and click the last swatch in line), then click the icon in the Swatches window that is a little folder with a plus sign. It will group the colors together and ask you to name them. 

Maybe you want to create three or four useable color groups, and then bundle them together in a Swatch packet. When your Swatches window looks exactly like what you want, click the little button in the left corner of the Swatch panel that shows two folders on top of each other, and drag down to 'Save Swatches'. You then get to title the Swatch, and you can access it later by clicking that same button, dragging down to 'User Defined' and finding the Swatches you want! Create your artwork as you like using your new colors! 

If you are using a platform like Blogger, and you don't do CSS or HTML or any type of coding, you might just be using the templates and advanced changes feature in the editing dashboard. If you are, you can use your palette here, too -- just open up Illustrator and double-click the swatch you want to use for the color of say, your background, or text. You'll see a window like this:

This is the Color Picker. You notice how on the right side it has a bunch of boxes with numbers and letters? Do you see the one near the bottom that is just a #? That is the HEX, or hexidecimal, number code used to show a color in HTML. In the Blogger interface, there are plenty of options to put in this six-digit letters and numbers code, and you'll have exactly the same colors in your template as in your banner art! 

Neat, huh? I don't share this stuff a lot, but if you enjoyed this post, let me know, and I might be able to do more. Now that I'm working mostly from home, I should be posting on the blog more!

No comments:

Post a Comment

Say something!