If you aspire to create your own clip art, you’re not limited to just using graphic elements. As you can see in the gallery below, you also can alter photos to achieve a variety of effects. Don’t know how to use Illustrator or Photoshop? Don’t worry; you don’t need to. You can use the free online Web application Picnik and still achieve professional results.

If you’re unfamiliar with Picnik, you might want to read the previous post detailing how it can help you make your own clip art. In this post, I’m only going to cover how to alter photos. Some of the methods that apply to making clip art from scratch are used with photos, too, so I’ll link to the other tutorial from the word Shapes any time it’s applicable.

1. To begin, you’ll need a photo. If you don’t have any in your personal collection, I suggest downloading one from Stock.Xchng. (See WordPlay’s Stock.Xchng review for the very liberal parameters surrounding using photos from their site.) Most of the photos below came from StockXchng, and as you can see, the quality is excellent.

Even if you don’t have a great photo to start with, the good thing about using Picnik for making clip art is that you could even turn a bad photo into something beautiful. Another great Picnik feature is that if you’re a Firefox or Internet Explorer user, you can just right-click any photo you find and have it open in Picnik. (Click here for more information.) If you use Stock.Xchng to get your photos, though, I recommend also saving a copy of the photo to your hard drive with its original name. This will allow you to go back to Stock.Xchng later, enter the photo name into the search bar and find the photographer. You can then leave a comment in the photographer’s Comments box with a link to the photo’s location. Not only is this the right thing to do, but some Stock.Xchng photographers make it mandatory if you use their images. But there’s a benefit to you too. Each time you leave a link in a comment, you get a link back to you from Stock.Xchng.

2. Once you have your photo, either right-click and choose the option to edit it in Picnik go to Picnik.com and click the Get started now! button, and then the Upload Photo button. (If you decide you don’t want to use that photo at any time, click the Home navigation tab and you’ll be given the option to delete that photo and upload another.) The photo will automatically open into the Edit screen. Unless you need to make adjustments to your photo (crop, resize, fix red-eye or other edits), click the Create navigation tab.

3. Once in the Create area, the three tabs you’ll use to create the effects shown below will be Effects, Text and Shapes. I went over Text and Shapes in my previous tutorial, but many of the looks below will also require the use of the Effects menu. Fortunately, Picnik has marked each effect clearly, so it’s easy to choose the one you want. If I’m undecided, I often “audition” each effect on a photo until I see something I like. You can find some surprising and wonderful new looks this way. You also can combine effects by saving each one and layering others on top, and making adjustments to each look by using the features within each effect. If you ever don’t like the look you get from Effects or any other Picnik feature, just click the Undo button at the top right of the page to remove it.

4. Once you get the basics of using Effects, I suggest playing with them to become more familiar. There are myriad ways each can be manipulated, which leaves endless possibilities for being creative once you’ve gotten the hang of it.

Visit Picnik

Here are the images I created with Picnik:

Click any of the photos below to see a larger version.

Original Photo	Photo Altered with Picnik

As you can probably tell by now, I’m a little obsessed with free clip art. In the past I’ve written about other free graphics programs that can help you turn photos into clip art and do other fun things like create your own cartoons. But I think I might have found the most versatile free tool yet in Picnik. Not only can you alter photos with it, but you also can use their extensive selection of free graphics to make professional quality clip art. Here are some examples of clip art images I created in Picnik in just one afternoon:

Click on the images above to see larger versions. Click here to see more samples of clip art made with Picnik. Also, see our 2008 election clip art made with Picnik.

To make images like these and many others, just follow these simple instructions:

1. To make your own free graphics, you need a file like this one, which is just a 200 pixel x 200 pixel square or this one, which is a 200 pixel x 400 pixel rectangle. Both have white backgrounds. (Because of the backgrounds, these files will seem invisible when you click on them. To download, put your mouse in the upper left corner of the resulting blank screen.) Feel free to use either of these or make your own blanks of any size in Photoshop, Fireworks or any other image program. The reason you begin with a blank slate, so to speak, is because Picnik requires that you upload a file to alter. Most people use Picnik to alter photos, but since you’re going to make your own clip art, you’ll need a white background. You also could use a colored background but for the sake of simplicity, let’s stick to white for now.

2. Once you’ve downloaded a blank .jpg onto your hard drive or created your own, go to Picnik.com and click the “Get Started Now” button.

3. Once inside the program, click the “Upload Photo” button and choose the blank file from your hard drive. When your file has been uploaded into Picnik, you will see it (although barely, because it’s a white image on an almost-white background) in an interface that has five tabs across the top. Choose the “Create” tab.

4. Once inside the “Create” tab, the button you will use the most will be “Shapes.” (If you want to add text to your clip art, you’ll also eventually want to use the “Text” button too.) To begin designing your own clip art, choose “Shapes” and then scroll to see all the available images on the left. Keep in mind that all the images in black can be altered to appear in any color, so at this point all you’ll care about is choosing a shape. Click on an image to insert the shape onto your white “canvas” .jpg, then drag the corner with your mouse to make it the size you want. (See the image above.)

5. There are a variety of Picnik features you can use to alter your clip art. They require a little getting used to, but once you’re familiar, you’ll probably love playing with them. Here are some of the main features:

Change colors by moving the white circle that appears on the color spectrum.

“Fade” the color by sliding the Fade bar. This not only mutes the color, it allows it to “float” over other colors and create layers. (See the butterflies and bird clip art above for examples.)

You can insert an image on top of another image (in this case, a flower on top of a circle) and then rotate it. To rotate, hover your mouse over the circle that sticks out at the top of the image. When a circle with two arrows appears, move your mouse to rotate the image in the direction you want it to turn.

To create a mirror image, as I did with the flower above, just add another flower, then click the “Flip” button on the left. You can also flip vertically by clicking the “Flip ” button on the right.

To add text to your image, click the “Text” button at the top of the “Create” screen, then type in the word(s) you want. Then, choose a typeface by clicking on it and size the type by sliding the “Size” bar. You can also fade the text color by sliding the “Fade” bar. If you want your text to appear on two or more rows, you’ll have to go through this process separately for each row.

Once you’re done playing, click the “Save & Share” tab to save, e-mail or post your masterpiece to any number of locations, such as Flickr, MySpace, Facebook or even your own Web site.

If you experiment with the features shown above, you can create some amazing things. And if you need software to edit photos, Picnik can perform that function as well. But that’s a subject for another post!

* Visit Picnik *

Clearly the bandito who uttered that immortal line from Blazing Saddles didn’t have a blog. If he did, he’d be thrilled to have access to these free graphics, which include some pretty cool official-looking badges and seals.

I’m a real advocate of lightening up when it comes to blogging, which is neither rocket science nor the cure for cancer (unless, of course, you actually blog about rocket science or cancer cures). But even if your subject matter is serious, it’s often still appropriate to have a little fun with your content.

The following free Web graphics applications can help you interject a little of that fun into your blog. They allow you to choose your own text and colors to create badges and seals that can be used as icons, to illustrate a blog post or even as part of your blog design.

The Says-It.com Official Badge Generator offers three badge styles: fire, police and sheriff. You can use any colors you can think of, because they have an intuitive HTML hex-code color selector for each component of the badge.

If the term “HTML hex-code color selector” intimidates you, don’t worry. As you can see from the image to the right, their color selector only requires that you drag icons to the color you want. For me, playing with the colors was part of the fun; there’s just something humorous about a purple and teal sheriff’s badge.

I played with this tool for hours because it’s like a coloring book for grown-ups. Except when I was done playing, I had a collection of cool usable Web graphics.

The Says-It.com Official Seal Generator is equally fun. I played around with this for my movie trivia blog and ended up with an icon I now use on the home page. Here are some of the designs I came up with:

The Official Seal Generator uses the same interface and tools as the Official Badge Generator, so once you’ve used one, you’ll know how to use the other. They’re oh-so-easy to use, so as a newly appointed member of the Web Police (and I have the badge to prove it), I command you to go and have fun with these free Web graphics tools!

Update (5-21-08): New designs have been added, so there are now five badge and seven seal designs.

You might also be interested in these other resources:

• Free clip art
• Free photos
• Free cartoons
• Avatar Central, your home for free images, image software and information about avatars
• Guide to online social networking

Anyone who reads this blog knows I’m a collector of free clip art and free photos. That’s why I fell in love with the Image Chef online free images generator. It gives you the opportunity to turn Image Chef’s large selection of photos into your own personalized clip art, and even create animated video clips with the text of your choice.

Image Chef’s slogan is “just add words and serve” and they aren’t kidding. If you can point a mouse and type a word or two, you can create amazing custom-looking graphics, perfect for blog posts or avatars.

The easy-to-use Image Chef interface >>

You can use Image Chef even if you don’t sign up for a free account, but you’ll have to save your images to your hard drive before you leave the site. (They only store images for account members.) But it’s worth signing up for, because members receive other free benefits. For example, you can e-mail your images or easily post them to MySpace, Hi5, Blogger, TypePad widgets and your Friendster profile. You can also use Image Chef photos on mobile phones for image-based chat, personalized wallpapers, video greetings and video ringtones.

Visit Image Chef

My Image Chef gallery
Here are some samples I created for WordPlay:

_______

_______

And here’s an image I created for my cat Joseph who has recently started peeing all over the house:

_______

Visit Image Chef

Thanks to FronTools for bringing Image Chef to my attention.

You might also be interested in these other resources on WordPlay:

• Free clip art
• Free photos
• Free cartoons
• Avatar Central, your home for free images, image software and information about avatars

]]> http://wordplayblog.com/image-chef/feed/ 5 http://wordplayblog.com/avatar-resources/ http://wordplayblog.com/avatar-resources/#comments Sat, 26 Jan 2008 18:35:40 +0000 carlajc http://wordplayblog.com/?p=208  

Welcome to Avatar Central!

A lot of people come to WordPlay looking for resources to create avatars, so I thought it would be helpful to aggregate all our tips and tools for making free avatars all in one place. This post contains everything you need to make an icon that’s uniquely yours: tips for creating a compelling avatar, sources for free clip art and free photos, and free image modification applications.

AVATAR RESOURCES
_

Gain readers with your blog’s avatar

The WordPlay icon Hall of Fame gives examples of good avatars, as well as explanations of why each attracted me to click on it. Sometimes the best icon isn’t fancy; it’s one that conveys in one glance the image you want to project.

Read more about what makes good avatars

Show your style with a Gravatar

What’s a Gravatar? It’s a globally recognized avatar that helps you make a lasting impression when you comment on blogs.

Read about Gravatars and get one (or more) free

Free Clip Art Sourcebook

This free PDF e-book contains links to literally thousands of free contemporary and vintage images you can use for avatars. It’s produced by our sister site, VintageHolidayCrafts.com, so we can vouch for the quality of the images!

Go to the Free Clip Art Sourcebook

Image Chef free images generator

Image Chef’s slogan is “just add words and serve” and they aren’t kidding. If you can point a mouse and type a word or two, you can create amazing custom-looking graphics, perfect for blog posts or avatars.

Read our Image Chef review or go to Image Chef

Picnik lets you create professional quality clip art!

There’s no software to download and it’s easy to use. Just follow the easy instructions and you’ll be creating your own cool clip art in no time.

Read our Picnik review or go to Picnik

__

Free photos

The Stock.Xchng site is searchable, easy to use and the selection of free photos is great. There are, however, a few very minor restrictions, which are covered in our review.

Read our Stock.Xchng review or go to Stock.Xchng

Free clip art

I’ve scoured the Web to bring you a collection of free clip art sites that don’t make you wade through page after page of affiliate ads and pop-ups to actually get to the art.

View our free clip art collection

___
BeFunky image modification

It’s easy to create stunning images with the free BeFunky online application. All you need is a photo or a clip art image and a few clicks to create one-of-a-kind avatars.

Read our BeFunky review or go to BeFunky

____

GIFWorks image modification

The free GIFWorks online allows you to create free images and have a blast while you do it.

Read our GIFWorks review or go to GIFWorks

______

Says-It.com badges and seals generators

These official-looking badges and seals help you interject a little fun into your blog or avatar.

Read our WordPlay Says-It review or go to Says-It badges or Says-It seal

____
Picasa image organization and modification

Now that you’re collecting all these cool images, the free Picasa software will let you organize them. It also lets you take them to the next level with their image modification tools, which are different than those offered by BeFunky or GIFWorks.

Read our Picasa review or download Picasa

But if you came to blogging through the wordsmith door and you’re not a designer, you might need a little help when it comes to creating images. WordPlay already offers resources for free photos, free clip art and cartoons, but if you’d really like your blog to stand out, the free BeFunky Web application can help you create free images that are uniquely yours — even if you have no graphics experience at all. You can use these free images in your blog header, in posts and, in some cases for your avatar (depending on the resolution in the image).

The Uvatar maker

BeFunky allows you to create strange and wonderful graphics. They feature two types of image modification applications: a Uvatar maker and a Cartoonizer. An example of a BeFunky uvatar is shown above. As you can see, the application allowed me to capture the moment when Woody Allen joined me at my palace while I was relaxing in my Catwoman outfit. I also made uvatars that chronicled my visits with other celebrities and a furry animal friend, which you can see at the bottom of this post.

The Cartoonizer

As fun as the Uvatar app is to play with, the Cartoonizer would probably have even greater use if you’re trying to create images for your blog. All you need is a good image to start with and the Cartoonizer does the rest.

Just upload your photo or clip art and click the SKETCH button. This creates a black and white sketch of your photo. You can adjust the settings on this feature, based on the image you’ve uploaded. Once the sketch is created, click the COLOR button, which takes the colors from your original photo and inserts them behind your sketch.

To the left you can see an original photo of some kind of wild space happening and how it turned out after being run through the Cartoonizer. I also used the same process with a piece of clip art (below) to see how that would work. I suspect this had good results because I used clip art that was originally from a painting and had a lot of detail. But you never know how an image will turn out, so it’s worth a try, even if you only have low-resolution clip art.

The original image (left) was used to create a cartoon image, and then had one of many BeFunky borders added.____

As you can see in the sample above with the red curtain, the Cartoonizer allows you to add a border to your image. Many of their borders are geared toward use in e-mail cards, but they can also be used for blog images. The Cartoonizer also gives the ability to warp an image, which can create some pretty strange effects.

So, the next time you want to create an image that’s truly yours, hop on over to BeFunky. You’ll probably have a lot of fun and generate some interesting images at the same time.

My BeFunky Gallery

I tried to convince Snoop Dogg to go roller-blading with me near the canals in Venice, but he told me that tiny wheels scare him. He also was a little leery of the ferret on my head.

____

Here I am with Halle Berry, trying on dresses to wear to the Oscars. We both feel wearing fur isn’t cool, but that doesn’t apply to live animals, so the ferret stays.

____

Hugh Grant has a reputation as a ladies man, so I felt it would be best to supplement the protection provided by the ferret and wear a black shroud on our date at the aquarium.

Go to BeFunky

You might also be interested in these other resources on WordPlay:

• Free clip art
• Free photos
• Free cartoons
• Avatar Central, your home for free images, image software and information about avatars

Copyright 2008 WordPlayBlog.com

Well, this might give you some incentive to move that project to the front burner: There’s a great online application called GIFWorks that allows you to create free graphics you can use as avatars and have a blast while you do it.

GIFWorks is easy to use, even if you have no graphics experience. The only requirement is that you modify a .gif file. (You probably already guessed that from the site name.) It also goes without saying that you have to have permission to use the photo. You can use one of your own, or you can choose one from Stock.Xchng, which offers quality photos for no charge.

There are are a variety of looks that can be obtained through the GIFWorks application. To show you its capabilities, I’ve taken a photo of my nephew and turned it into the following five distinct icons. The GIFWorks features used to create them appear next to each avatar. There are different versions of GIFWorks for Firefox and Internet Explorer (IE), so I’ve included the features paths for each. Click on any of the icons to see the full-size image.

_____________

IE: Effects menu /Artist Medium / Cartoon Strip

Firefox: Effects menu / Cartoon Strip_

______

______

__________

IE: Effects menu /Artist Medium / Raster

Firefox: Effects menu / Raster

________

__________________

________________

IE: Effects menu /Color / Colorshift

Firefox: Effects menu / Colorshift

________

__________________

IE: Effects menu /Sharpness / Sharpen/Unsharpen, then Effects menu / Offset / Shadow, then Warp / Sphere

Firefox: All on Effects menu: Sharp/Unsharp, then Shadow, then Sphere_______

______

________________________

______________

IE: E: Effects menu / Offset / 3D Glasses

Firefox: Effects menu / 3D Glasses___________

____________

___________

These examples (plus many more that didn’t make the final cut) took under an hour — and I had a great time playing while I made them. I hope these inspire you to experiment with GIFWorks and create a little fun of your own!

You might also be interested in these other resources on WordPlay:

• Free clip art
• Free photos
• Free cartoons
• Avatar Central, your home for free images, image software and information about avatars

Copyright 2007 WordPlayBlog.com

Here we go again with the “a picture’s worth a thousand words” cliché. This time it’s in reference to your blog’s avatar, or as I prefer to call it, your icon. And once again, the cliché is true.

But before I wow you with my opinions about the anatomy of a good icon, I have several questions for you:

If you visit social media sites, have you thought about how your icon stacks up against the icons of other blogs? Also, did you put any thought into your icon or did you just grab whatever image you had handy and use that?

If you didn’t think about your icon’s design, you’re probably in the majority. With so many other things to think about — producing valuable content, marketing, monetizing, networking and who-knows-what-else — your icon was probably way down on the list of concerns, if it was on the list at all.

Since I was a graphic artist long before I was a blogger, I couldn’t help but notice that some icons stood out. As a newbie blogger, I didn’t know anyone, so all I had to go on at first were looks when I was stumbling around in MyBlogLog, BlogCatalog, etc., trying to find my way around. In many cases, the only reason I clicked on some of the blogs were the icons. And if a compelling icon image was combined with a username that made it clear what a blog was about, I was even more likely to click on it. I might be wrong, but I don’t think this just applies to newbies. Whether we know it or not, images affect us all.

Unfortunately there’s no formula for the perfect icon, except maybe that it should come as close as possible to expressing both your personality and your blog’s content. The best way I can explain what a good icon looks like is to show you some that did an admirable job of drawing me in. Below are some of those. (My apologies to anyone not featured below. There are a lot of great icons out there, but I had to cut the list off somewhere.)

Here’s my Icon Hall of Fame:

Blogstruk
I love this icon because I have no idea what it means, yet it makes me want to know. Did this disembodied eye come from Shrek or just a regular human with an unfortunate complexion? I still don’t know, but when I clicked on it, I found its owner dispenses quality advice for newbie bloggers.

Vic from BloggingZoom and BloggerUnleashed
If it’s possible to project the image of a bad boy and a nice guy at the same time, this icon does it. Not only that, ladies, wouldn’t you agree he looks awfully cute? But this icon appeals to more than just hormones. It’s well-drawn, unique and the combo of the white background and color makes it almost pop off the screen.

Court Tuttle and BloggingZoom
This is straight-up branding. Not only is Court’s name the focus, but the background is white, which stands out among the many icons that use photos. Using a name is a bold move and one that works because of the authority Court projects in the blogging community.

How to Make Money Online for Beginners (Grizzly)
If you know Grizzly, you’ll know his icon depicts him perfectly. Notice that the bear has a curious but friendly look. This fits Grizzly because he’s always questioning the status quo, and he’s ever-willing to teach newbies about making money online. This icon is so effective that if I ever met Grizzly in person, I’d be shocked if he wasn’t a big hairy — but kind — bear.

MarkkWrites
Anybody unsure about what Markk does? I like this one because it’s clear, while also having a welcoming feeling. It makes me want to sit down and have a cup of Joe with him.

LordLikely
I never would have become aware of the LordLikely blog had I not seen this icon on BloggingZoom. For some reason, the juxtaposition of a Victorian man in a top-hat in the high-tech world of blogs struck me funny, so I just had to see what that image represented. When I went to the blog, I wasn’t disappointed; it’s as funny and ironic as its icon.

BlogIssues.com
This is another one that made me want to click on it when I saw it on BloggingZoom. Anyone with the guts to brand herself as a big-mouth deserves a click.

Alex Frison
Now that’s just silly, and I mean that as a compliment. Alex obviously doesn’t take himself too seriously. In addition to the icon being cute and funny, we again see another good use of a white background.

FlicksLists
This one comes under the obvious category, and that’s a good thing. Since I’m interested in movies, I had to click on this. Not only does the image convey the blog’s content, but so does the username.

Mommy Cracked
This one is funny and gets the message across. Although I found out she’s a freelance writer and former teacher only after visiting her blog, all I had to do was look at her icon to know she has a humorous take on motherhood.

CardioGirl
I clicked on this because it looked like someone (maybe CardioGirl herself?) painted this just for the blog. It made this list because it conveys her theme nicely, plus the colors are easy on the eyes.

So, there you have it, my Icon Hall of Fame. As I said before, it’s nowhere near all-inclusive. It’s just meant to show you some examples of what I think works. But your icon doesn’t have to be like any of these. If you’re satisfied that yours gives a good impression of who you are and what your blog is about, then you’re more than halfway home. If you ask others and they feel the same, then you probably already have an icon that’s drawing readers to you.

If you ask around and find that your icon does need some work, however, WordPlay has plenty of free resources to find just the right image:

• Free clip art
• Free photos
• Free cartoons

You might also be interested in Avatar Central, WordPlay’s home for free online image software and information about avatars.Copyright 2007 WordPlayBlog.com