<!-- --><!-- --><style type="text/css">@import url(http://www.blogger.com/static/v1/v-css/navbar/697174003-classic.css); div.b-mobile {display:none;} </style> </head><body><script type="text/javascript"> function setAttributeOnload(object, attribute, val) { if(window.addEventListener) { window.addEventListener("load", function(){ object[attribute] = val; }, false); } else { window.attachEvent('onload', function(){ object[attribute] = val; }); } } </script> <iframe src="http://www.blogger.com/navbar.g?targetBlogID=20981690469561729&amp;blogName=Neo-Faerie+Wings%3A+Your+source+for+hig...&a mp;publishMode=PUBLISH_MODE_BLOGSPOT&amp;navbarType=BLACK&amp;layoutType=CLASSIC&amp;searchRoot=http%3A%2F%2Fneo-faeriewings. blogspot.com%2Fsearch&amp;blogLocale=en_US&amp;homepageUrl=http%3A%2F%2Fneo-faeriewings.blogspot.com%2F" marginwidth="0" marginheight="0" scrolling="no" frameborder="0" height="30px" width="100%" id="navbar-iframe" allowtransparency="true" title="Blogger Navigation and Search"></iframe> <div></div> Neo-Faerie Wings: Your source for high quality neopets graphics

May 13, 2010

Saving an Image as a Brush in Photoshop

  1. Open the image pack on your photoshop.
  2. Click on the select tool and select the image you would want!

  3. Click on Edit=>cut. Then click on File=>New. A window will appear, just clikc OK.
  4. Click on Edit=>paste. Now it's time to save our image as a brush. Click on Edit=>Define Brush Preset.

    This window should appear:

    Name your brush and click OK. You now can use the image as a brush! :)

Labels: , ,

Taking Screen Shots with Photoshop

  1. First open the window you want to take a screenshot of:

    then press "F11", this will open up your window like this:

  2. Press "print screen" on your keyboard. That would be the key right after F12.
  3. Open your Photoshop. Click on File=>New and a window will appear. Just click OK.
  4. Click on Edit=>Paste. Now, your window should look similar to this:

  5. Now, to adjust the image size click on Image=>Image Size:

    Adjust the image size you desire. I adjusted the width to 300px and the height automatically adjusted to the proportion of the width!

  6. Save your image and this is how my screenshot turned out!

Labels: , ,

Sketched Images in Photoshop

Here's a simple tutorial on how to turn your colored images to sketched ones.

  1. Open the image you want to edit. Be sure your background is white. Make a new layer and paste the same image on Layer 2. For this tutorial, I will be using the image below:

  2. On Layer 2, select Color Dodge from the Layer Styles.

    Once you have done this your image would look like this:

  3. Now, go to Layer 1 and desaturate your image.

    Your desaturated image should look like this:

  4. Reverse the effect.

    The image should look like this:

  5. Now, go to Layer 2 and desaturate. (see step 3)
  6. Go to Layer 1. Now click on FILTER >> Blur >> Gausian Blur.

    Adjust the radius according to your taste. Just play with your image a little until you get the best result. I used 8 as the radius.

  7. Merge the layers. Click on LAYERS >> Merge Down. And now you have your sketched image!

Labels: , ,

Scan Lines in Photoshop

Have you ever wondered how they make those scanlines on images? Then, wonder no more, because here are some easy steps to achieve it!

  1. Open your Photoshop and create a new document 10x3 pixels. Zoom in and choose the pencil tool.
  2. Make a line across the top of the document.

  3. Choose your rectangular marquee tool and select the entire document.

  4. Click on EDIT >> Define Pattern. Then a "Pattern Name" window will appear. Click ok.

  5. Now, open the image you want to edit. For this tutorial I'll be using the image below.

  6. Now, create a new layer by clicking on LAYER >> New >> Layer. Or you can click on the new layer tool on your layer window, just as shown below:

  7. Now, choose the paint bucket tool, be sure you are on the second layer. Then change the fill mode from Foreground to Pattern. Choose the Pattern we just created.

  8. Fill your second layer with the pattern. When you've done everything right, you must have an image that would look like the one below!

Labels: , ,

Outlining Texts in Photoshop

Here's a step by step guide to outlining your text.

  1. Create a new document and write your text:

  2. On your layers menu click on the layer style:

  3. Now click on stroke:

  4. Then a window will pop up:

    Edit the size of border to whatever you want. For this tutorial I choose 3px. And edit the color with the color of border you want. I choose hot pink.

  5. Now click ok. And you should have a bordered text!

Now, placing a border around your image is the same. Just open your image and do the following procedures above! I hope this tutorial was helpful!

Labels: , ,

Making and Saving Patterns with Photoshop

1. First, get a pattern that you want to save. If you want to make your own, it doesn't matter what the size is but make sure that it repeats properly. I cannot stress that fact enough, if it breaks at the edge of the image it'll look bad. (By the by, it's easy to see if it works, just copy it and paste it in Paint over and over again {Moving each one to the side of the other} to see if it works and it's nice.)


2. Here's a little tip for you, you can make the pattern have transparent elements if you want to, just delelte the background layer. When you use that pattern it won't show anything in that color.

3. Now that you have your pattern and it looks nice, go to Edit then define pattern.
4a. To use the pattern go to the Style button and select pattern overlay. This will only allow you to put a pattern over the layer, e.g. if you have a filled circle on the page, it will only be on that circle.
4b. To use the pattern go to the Half-and-half looking button (it's name is the "Create new fill or adjustment layer" button, isn't that wordy?) and select Pattern..., this allows you to make a pattern but it does so in a mask, it also makes patterns only in selected areas or the whole image.

5. And you're done! Enjoy your new pattern and if you are making a main image blend with the background, you're going to have to position it properly so there won't be any bumps and other ugly stuff.
And a disclaimer: All elements used belong to their respective owners (though, I can't think of any). And this tutorial reflects MY way of making and using pattern, which may differ from person to person and may not be the best way to do it.

Labels: , ,

Gradient Overlay with Photoshop

I'll be using the image above for this tutorial.

  1. Right click the image above and paste it on your photoshop.
  2. Click on layer=>new and a pop up window will appear similar to the one below.

  3. Click on your gradient tool.

  4. Choose the color you want to use.

  5. Be sure you are on the layer 2. Now drag your mouse across the image. Just experiment on which direction to drag.

  6. Now here is my finished product!

Labels: , ,

Extracting Images with Photoshop

Extracting images can be done in a lot of ways. 1. You can cut around the image. 2. You can make use of the magic wand and cut the background off. 3. You can make use of the extracting option.

This tutorial will teach you how to make use of the extract option.

Open the image you would like to extract. Click on Filter => Extract, then a window will pop-up! Choose the higlighter tool and trace around the image. Just make sure that half of the higlight is on the image you want to keep and half is on the part you want to remove.

Then choose the bucket and click on the part you want to keep!

Then press ok! Click on Windows => History and unclick on the icon on the left of it. Then click on the left of the open or paste (if you copied the image and pasted it on the canvas).

Now click on the history brush tool and trace on the part of the image you might have removed in the process of extraction!

Now, that was the easiest way to extract an image! Wasn't it? :P

Labels: , ,

Cutting Images with The Pen Tool in Photoshop




1. First, choose an image. I'm using an image from Neopets backgrounds.
2. Somehow get it in Photoshop.
**For my image, I hit "save file", then, on the download screen that firefox gives you, double click the image and it opens up in my Windows Picture and Fax Viewer, right-click, and select Adobe Photoshop (in my computer, Photoshop must be open for it to show up in the dropdown list)**
**Again, that's how I get it on to Photoshop, you might use a different browser than Firefox and/or a different OS
3. Hit Ctrl+A, then Ctrl+C, then Ctrl+V (alternate: Go to Select at the top, hit All, then go to Edit and hit Copy, then Edit again and choose Paste) and give it a name (like cutout). This leaves you with two of your images, it's a failsafe that I use in case I mess up while cutting and can't fix it by hitting Ctrl+Z.
4. Make a new layer UNDER the layer that was pasted, fill this layer with a color that is not in the image and does NOT blend with the image. This is so you can see any mistakes after cutting the image.

5. Now for the fun part! Select the pen tool and give it these settings.

6. Zoom in as much as you need to, you can always change the zoom level later.
7. Click on the image where the points are or every now and then (like the beginning of a limb).

8. After you are done with the whole image, click the point you started on to close the path.
***
special point! In an image like mine with two characters, you can finish one path and start another without making one disappear!

***
9. Now change the pen tool to the pen tool that says "add anchor points".

10. Click in the middle of a segment, where you want to move the line.

You have to click and drag that point where you want it, mine should be on the outlines.

11. From here, click on one of the little things that come off it (highlighted in RED), drag this up/down/left/right until your line matches that of the outline. Then repeat it for other lines. You can add more than one point per line (see picture two).

12. Continue this for the rest of the image (or images if you have multiple characters to cut). Don't be discouraged if it takes a while to get it right, it's a hard concept to learn, but it gets easier with practice! Oh, and a note, if you have two characters with seperate lines, click outside the lines (e.g. the background) before starting the new character. If you don't, the last point you clicked on the old character will be pulled towards your arrow.
Finished Line curves

13.Now the easy part! First, click off to the background somewhere, the clear points should disappear. Then go to the tab tat says "Paths" (alternate: Windows on the top and then select Paths fourth section from the bottom.) If you don't see any lines at all (after you clicked the background), select "Work Path". Then click on the "Load path as selection" button (see image below) and your image should be selected!

14. From here, hit Ctrl+Shift+I (alternate: Go to Select at the top and hit Inverse).

15a. Depending on your image, do this step or 15b. This one is for images with outlines. Hit Ctrl+X (alternate: Go to Edit and hit Delete) to delete the background, then choose click the "add layer style button" and select stroke. Make your stroke look like mine. (The black can be a different color, just make sure it's the same color as your outline.)


15b. Sorry I don't have an example of this one; this is for images like people cutouts. Go to the top and go to the one labled Select, then go to modify, then contract. In the box that comes up, type in "1". Then hit Ctrl+X.
16. Time to micromanage! On the one with the solid color, change the color to severe colors, for example, mine is blue so I choose to do dark yellow and green, to check for any mistakes.
17. For those small spots, you can use the polygon tool or the pen tool, I use the polygon tool sometimes and the pen tool other times, depends on how big the spot is. (If the spot is small and you use the pen tool, you have to zoom in a bunch!)
18. Now delete the checking color and the background, save it as a transparent GIF, PNG, or as a PSD file.
19. You can download the finished product HERE.
And a disclaimer: NEOPETS, characters, logos, names and all related indicia are trademarks of Neopets, Inc., © 1999-2009. And this tutorial reflects MY way of cutting images, which may differ from person to person and may not be the best way to do it.

Labels: , , ,