Just in case you don't know, here's some a quick explanation of image size vs canvas size:
Image Size: When you are working with an image in photoshop, the image itself in it's entirety is the 'image size'. If you increase the image size it will increase the size of the whole image you are working with. If you make it bigger in the upwards direction, the whole image will stretch upwards. Every layer will be stretched in unison. Using this method you can increase or decrease the size of an entire image and keep it in good ratio.
Canvas size: Canvas size is very different to image size. Canvas size is just the work area you are using in Photoshop. If you increase or decrease the canvas size it will not affect the size of all of your image layers. If you decrease it enough, you will probably have to cut off some of your image. Adjusting canvas size doesn't keep your image in ratio, it just adjusts the work space of your Photoshop image.
Hope this helps!
Friday, February 4, 2011
Wednesday, February 2, 2011
Working with Layers
Photoshop offers very powerful layer capabilities, which can cause confusion. It is also quite common to find many who fail to use layer functions that would help to speed their work.
The basic operation of a raster program depends on a selected layer. You do not have to build multiple layers, but you do need at least one layer. Pasting an item or creating text in Photoshop automatically creates a new layer. For any other operation, you will have to manually add a layer before drawing. If you do not add a layer, the object will be drawn on the currently selected layer and drawn objects will merge together automatically.
Create a new layer
There are several ways to create a new layer. Select Layer>New>Layer from the Main Menu or use SHIFT+CTRL (Command) + L. I find I most often use the Layers palette for layers operations. With the Layer tab active, click on the side arrow to activate the pop out menu. Click on New Layer. The New Layer window will appear. I advise that you type in a name for your layer, since working with even a few layers will become confusing. Choose a name that you will be able to identify, even if you return to the document months later. Click OK and your new layer will appear immediately above the layer that was selected when you created the new layer.
You can also duplicate a layer, which will copy the selected area and create a new layer to place the copy. Select the layer you wish to copy. Activate the side pop out menu and choose Duplicate Layer. Windows users can also right click on a layer and choose Duplicate Layer from the flyout menu. You will be presented with the Layers Option window, and can rename the copied layer from the Photoshop default, which is the name of the current layer with "copy" added.
When the copy is created, it is placed immediately on top of the original layer, which makes it seem as if nothing has happened. Use the Move tool to move the layer and you will see the new layer as well as the original layer.
Create a layer from a selection
You may wish to copy only a portion of a layer, or perhaps you would prefer that one area of a layer was on its own layer. You can copy or cut any selection to a new layer easily. Activate the layer (click on it) that contains the information you wish to duplicate or move to a new layer and select the area you would like to work with. Choose Layer>New>Layer via Copy or Layer via Cut from the main menu. For a quicker method, right click (Windows) or Command click (Mac) on the layer containing the selected area, and choose the Layer via Copy or Layer via Cut from the flyout menu. The selected area will be duplicated to a new layer if you chose to copy, or moved if you chose the cut option.
I often use the layer via copy or duplicate layer functions when creating navigation elements. Careful naming as you create repeating elements is essential for efficient production.
Rename a layer
If you do not name a layer as you create it, or if you are not presented with the choice to assign a name to a layer, you can easily rename any layer. Double click on the layer in the Layers palette and type a new name into the Name area of the Layer Options window. This window is also available through a right click (Command click) or the side flyout menu.
Change Layer Position
Solid areas in layers will hide the layers below in the stacking order. Quite often, you will find that you need to change the order of the layers. This is a very simple procedure in Photoshop. Simply click and drag the layer to the position you desire. As you are dragging, a clenched hand will appear. Release the mouse when the layer is in the position you require.
Share layers between documents
You can also drag a layer from one Photoshop document to another. Have both documents open – the one containing the layer you wish to copy, and the document that will receive the layer. Click and drag the layer from the original document to the document where you would like to add the layer. The layer will appear in the new document exactly as it was in the original document, but it will also remain in the original location.
Linking and Merging Layers
Linking Layers
Suppose you have followed my advice, and have created layers for each step your drawing. Now you have an object with a fill, an outline and text. You would like to move this object over a few pixels. The only smart move is to merge the layers so that all will move as one unit.
That is one solution, but it is not the only one, nor is is probably the best one. You can link layers so that they are seen as one unit, but you can still separate them whenever you wish to make a change.
To link, simply select the main layer (any layer will do, but it is easier all around if you use a layer that makes sense as the "main" one in the link group.) Click on the second column from the left (as shown by the finger pointing cursor in this sample) to create a link. The chain symbol appears to indicate that this layer is linked to the active layer, and will appear any time the main layer in the link group is active. Repeat for any layer you would like to have as part of this group.
To unlink any layer, simply click in the link area on the Layers palette again.
Linked layers can be moved and transformed as if they were one layer.
You can fill selected areas on each layer independently, and even delete one layer in a link group. (Note: If you change your mind, and use the undo feature, the link will not be restored and you will have to link the layers again.)
What's a merge?
Merging layers creates one layer from two or more layers. Once layers are merged, they cannot be separated into the original layers, so be careful with this command. If you are certain you will not need the layers separate again, position the layer you wish to merge above the layer you wish to combine it with in the Layers palette. Click on the flyout menu and choose Merge Down. The layers will be combined with the name of the lower layer remaining.
If you have linked layers that you do not require to be separate, choose Merge Linked Layers from the flyout menu.
You can also merge all your layers together by choosing Flatten Image from the flyout menu.
Please make sure that you will not require the layers separate before merging. I will often link layers for a while before I make the decision to merge. This allows a trial period before committing to the merge. Why bother with merging at all if separate layers are so much better? It is not hard to build an image with 20-50, or more layers. Scrolling through the list or CTRL clicking an object to select a layer can become time consuming on a complicated image. If you are certain that several layers may be safely merged, it is best to simplify your work.
Enhancing Photos
Have you ever wondered why the Hollywood stars always look so perfect in the magazine photographs? Why is it they consistently look so good? Their hair, teeth and skin always seem to be perfect and so beautiful. Is this the magic of stardom or Hollywood? No, this isn’t magic. It’s just Photoshop.
Photoshop is the same photo editing software program being used by professionals in the entertainment industry to make movie stars look younger, slimmer and better. They have been doing it for years and now you can achieve the same results with a little training and practice using Photoshop for some of these same photo enhancements.
You can learn to make amazing enhancements to any photograph using the tools and functions available in Photoshop. The following are just a few of the improvements you can make to people pictures.
- Whiten stained teeth
- Remove unsightly scars
- Smooth age wrinkles
- Clear up acne
- Remove blemishes
- Double chin removal
- Fill in bald spots by adding hair
- Open closed eyes
- Remove tattoos
- Hide body piercings
- Change eye color
With Photoshop you can easily make yourself or anyone look better. You can even change the colors of the clothing people are wearing. You will be amazed by the results you can achieve with Photoshop. You will not only be able to improve the appearance of people but you will be able to completely remove people from the photograph, add people from other photos or change the background.
Master these Photoshop techniques and you will be in demand for photo editing and graphic design projects. People with these types of skills are in needed for photo retouching, web design work, logo design, advertising, and more. Not only can you have fun touching up your own photos but you could start a business doing photo enhancements.
Web Pages in Photoshop
Photoshop is a wonderful tool for creating web sites. It allows even a novice the ability to create a fully functional web site without much knowledge of HTML or JavaScript. You can create an entire web page template with Photoshop, and then use Image Ready to slice up the image and create the HTML for you. Or you can use Photoshop to create just the navigation for your web site, or to optimize images on your web site. No matter how you use Photoshop, it will definitely make your web site look much nicer, and also help it to run faster.
Photoshop can help you to create an entire web site without coding much HTML by hand. You can draw a complete web site in Photoshop, and then transfer your image into Image Ready so that you can slice up the image into smaller elements, and then save the images and the corresponding HTML to render the page very easily. Then all you have to do is use you’re newly created web site and entire content into the blank spaces that you have left in the template. After you have added the content to your pages, you will be ready to post your new web site to the web.
When I am creating web sites I use Photoshop to create the navigation for the web site and also to optimize all of the images, so that my web site will load faster. I usually create buttons for the navigation, and then create rollover effects from within Image Ready. This saves me quite a bit of time, because all of the JavaScript for the mouse over effects are done for me, which allows me to work on the more advanced coding of the pages. Even if you want to create all of the navigation and layout of your web site without Photoshop, then you should at least use Photoshop to optimize your images so that you web site loads within a reasonable amount of time.
Photoshop can give you 3 different optimized views of a particular image, and tell you how fast it will load on a particular connection speed. Then you can choose which optimized image you would like to use based on the ratio between how good the picture looks and how fast it loads. Without optimizing your images your web site will perform very slowly and visitors will be less likely to wait. You can create a web site on your own by hand coding the entire site, but using Photoshop will make creating your web site much easier and more appealing.
Photoshop Workspace
In the following tutorial you will learn about the overall scope of Adobe Photoshop CS3. This program is used mostly to manipulate images. People that do web development, graphic design, and photography will probably prefer the use of this program to edit their images. Once you have grasped this basic knowledge of the software, you will be able to dive into Adobe Photoshop and quite possibly Adobe Fireworks, which works in a similar way. Adobe Fireworks is just a little simpler and has less features. Adobe Fireworks was originated as Macromedia Fireworks. Enough of the chit-chat, lets get down to business!
When you first enter the Adobe Photoshop environment you will see a plethora of features and plug-ins to mess with. Fortunately, with a little training from me you won't have to be confused by these things. Go to the top left of the screen and select file/new.
Now you should see the picture above. This is the basic variables that you are able to change when you start a new file. You can change the name of Photoshop document to whatever you please. This is best suited when you are trying to organize stuff during your Adobe Photoshop training sessions on the web. The preset window lets you select what type of paper size, resolution, and color mode that you would like to have to start out with. Of course most will just go with custom so that they can personalize their specific project. Most of the time, the project you are working on won't fit into a category. Adobe has specifically put custom as the first on the list because of this fact. For today session, let's change the preset to Web.
Following these steps will present you with a black window with the name of the file, percent of the resolution it is viewing at, and the color mode you have chosen at the top of the window.
From here we can learn about what some of the things you see on the left and right of the screen are. We will start on the left side of the screen because this is the first thing you should learn when you starting to make and edit images in Adobe Photoshop. I am using Adobe Photoshop CS3 Extended, which has some extra features. I will go over these briefly to educate you. The first on the top left is the "move tool" It is an icon that has a cursor and crosshair on it. You can use this tool to move objects on the screen around to your liking.
The next tool is the rectangular Marquee tool. You can also just use this tool to make squares around areas in an image to cut them out easily. You can use that feature to cut out a piece of a picture and paste it somewhere else. I personally use this image a lot when I am working on images for my website or editing my digital photos.
This tool has four variations to it. Two of them are relatively new and you may know them or not. The second variation is the Elliptical Marquee tool that allows you to trace circles. The third is the Single Row Marquee tool. The fourth is the Single Column Marquee tool. These are great when you want to slice out the image of an excel spreadsheet and only post that specific data too an audience. It is most likely it will end up looking like an "L" shape and you will be able to write information around the image within a website. This is very useful for website designers with the proper knowledge of Adobe software products.
Next up is the Lasso tool. This tool allows you to highlight an image that you have made in an image or an image you have opened in Adobe Photoshop. This marquee tool likes to have smooth hard edges to follow. If you a photograph that doesn't have a easy to follow edge around objects you will find it hard to use this tool. You have probably seen this when people cut their heads out of a picture and paste it onto somebody else's body. It is a very funny feature and this is the tool that does it!
The lasso tool has three different variations. The second version is the Polygonal Lasso tool. This tool can make different shapes and curves when tracing around or cutting out a piece of an image. The third variation is the Magnetic Lasso tool that only works on images that have defined edges. The tool will clamp onto an edge and give it anchor points to shape the corners. This is good when you don't have that steady hand you used to have back in high school. I use this myself because I am not the man I used to be!
The next up is the crop tool. This feature does exactly what is says. It is like a marquee tool except it is made specifically for cutting square pieces out of images. That is pretty much all it does. However, this simple feature is used quite often to developed website images.
The next up is the Slice tool. This tool allows you to slice an image into smaller pieces. This is usually used in web design with the use of tables to display formatting on a webpage.
The next in line is a list of four tools that provide ways for the user to fix problems in images. The Spot Healing Brush tool first appeared in Adobe Elements 3. It was implemented into Adobe Photoshop CS2 after that. This tool allows you to fix areas of an image by replacing or blending the colors in an area so that it is like growing a new piece of skin over a bad rash. The Healing Brush tool allows you to fix problems in the image by sampling the surrounding area around the problem and trying to replicate the pattern in the area that is problematic. The patch tool is pretty much a mix of the Healing Brush and the Lasso tool. It is allows you to highlight the area that is scratched or empty and sample the surrounding area to fix the problem. Lastly, the Redeye tool allows you to select the common problem of red eyes and correct them with sampling a piece of the black pupil area and replacing the red eye with the natural pupil color. This is a widely used tool by many consumers.
The next tools are made for painting on the canvas freestyle. The first one of them is the Brush tool. The Brush tool is an old favorite for people that want to free hand draw things like they had a brush which they can decrease and increase the size of the contact point. You can also change the hardness of the stroke as well. This will show differences in contrast. The Pencil tool is just like a real pencil with some added tricks. The modes can give you complete freedom or help you make straight lines when you are trying to make objects. The last one is the Color Replacement tool. This handy tool allows you to select a color scheme on an image and replace it with something else. Unlike the bucket tool that will cover the complete area, this tool will allow you to draw in the replacement by hand as if you had a brush. Let's say if you had a blue cup in a picture. You can sample the blue color and decide to make it green. Then you just draw over the area of the cup and anything that is of the sampled color will turn green!
The stamp tools are a very nice addition to the Adobe Photoshop regime for photographers. Specifically it is great for editors that write tabloids and want to doctor the pictures. With the Clone Stamp tool they will be able to edit out an area of a picture and make it look like it was never there. They can do this by sampling the area around the object they want to not be there and adding it into the portion of the picture they want it too be in. The Pattern Stamp tool allows you to stamp a specific pattern at your desired brush hardness onto an image to make something unique. Like you can take a brick wall patter and make a complete building.
The History brush tool and the Art History brush tool are unique and sometimes overlooked. You can use the History Brush tool to restore the original image in only just section or part of an image. It is usually used when you take a color picture to black and white and then convert a part of it back to color. It's kind of like finding a dusty painting and then wiping it off to see the beauty that it holds underneath. It is a true treasure for the graphic designer or photographer that uses Adobe software product regularly. The Art History Brush tool allows you to copy the texture of an image through the use of art specific styles. Unlike the History Brush tool the Art History Brush tool takes the data from the image and creates something new out of it. It allows you to put a different style of art to an image without it losing its originality.
The next feature is the three types of Eraser tools. The most basic is the Eraser tool itself. You can change the size of the area that the eraser returns to the original background. The Background Eraser Tool does exactly what it states. It is able to erase the background without any use of changing layers. Once you have done this you can add in colors to make a new background at will. The Magic Eraser tool acts like the Magic Wand tool. It will erase an area based how it is clicked and verified.
The next up on the list is the Gradient tool and the Paint Bucket tool. These are old favorites from the long line of Adobe Photoshop releases. However, for all the new Adobe Photoshop CS users out there these items are something that may not be so familiar after searching through the web for image editing software. The Gradient tool provides the user the ability to make colors stretch in all directions from high to low in intensity. It is similar to the way you would view the sunset as the colors transition from light to dark. You can also use this feature to apply to certain types of patterns and textures. These features are also available Macromedia and Adobe Fireworks. The Paint Bucket tool is capable of filling in a space or a space inside of the Magic Wand tool to a certain color, patter, texture, or stamp. This is used as a quick way to change colors in a predefined area.
The following set of tools previously were found in another section of Adobe Photoshop, but are now offered conveniently on the left side of the menu. All three of these do pretty much what they say they do. I will still give you a brief explanation of their capabilities though. The first of them is the Blur tool. The Blur tool blurs the area where you paint. The Sharpen tool increases the contrast in the areas you paint. The Smudge tool blends the pixels where you paint. This is similar to when you drag something through wet paint that has various colors.
Oddly enough, three more features that were previously hidden to the human eye are now available for you to view on the left menu. This time though the names have almost nothing to do with what they do. First up is the Dodge tool. This tool lightens an area on the image. The Burn tool darkens an area on the image and the Sponge tool changes the level of saturation on an area in the image. These all have their special purposes that you will come to find out about. Burn and Dodge are usually used for making shadows or erasing shadows.
The next feature has a wide array of variations to it. This feature is the Pen tool. The pen tool allows users to create paths, curves, and anchor points to move lines around in weird shapes without the use of freehand drawing. Ironically enough, this leads to the rest of the tools. The next is the Freeform Pen tool. Unlike the pen tool that automatically makes anchor points where you draw, the Freeform Pen tool lets you draw as if you really had a pen. After you have used either of the tools you can use the next feature, which is the Add Anchor Point tool to create anchor points for new lines or freeform drawing. This helps when you want to attach a line to another line that has already been drawing without overlapping incorrectly. The Delete Anchor Point tool gives you the ability to delete an anchor point that you are not satisfied with. The Convert Point tool changes vector shape masks and paths. This allows different types of anchor points to connect to each other even if they are composed of different types of corners.
The next tools are the Type tools. They specifically describe the Horizontal Type tool and the Vertical Type tool. These pertain to the angle that you are able to write in (Horizontal or Vertical). Unfortunately, when you use this you must turn it into a bitmap and that makes it non-editable after you are finished. The Horizontal and Vertical Type Mask tool allows you to write with text that is filled with a patter or an image as the font color. It can be a nice addition if you are writing against an odd background.
The Path Selection tool and the Direct Selection tool are both used for paths. The Path Selection tool will allow you to select a path component even if it is surrounded by many different paths. The Direct Selection tool will only select a segment of a path. This is a way to reshape a segment to a different path after it has been created and saved.
The following tools are some of my personal favorites. I have started one too many images with these objects. If you look at my website you can see almost exactly where I started when I created it. The first of these is the Rectangle tool that makes a rectangle of various sizes. The Rounded Rectangle tool makes rectangles that are rounded. I used to use this exclusively in Macromedia Fireworks before I purchased the Adobe CS series. The Ellipse tool allows you to make seemingly perfect circles. The Polygon tool allows you to make polygons. The Line tool makes lines with anchor points at the end so that they can be managed by the Pen tool if you want to get fancy.
Below these more popular features are some cool features that you may or may not find interesting. I believe these have been in all the Adobe CS releases, but I am not sure about the Macromedia MX series. The first up is the Notes tool that allows you to add small notes to your images in the background. Also there is an Audio Annotation tool that allows you to add verbal notes to an image.
The tools described below are a set of useful features that you may find useful in addition to some of the other options. I believe some of these tools are used in conjunction with the other tools. However, this makes it a little simpler if you want to do it the old fashioned way. First is the Eyedropper tool that helps sample color from an area. The Eyedropper tool is pretty basic though. The Color Sampler tool has a few more features that allow you to gather the color data from any layer without calling that layer. You can see levels of gradient or replace colors and shapes back to an image. The Ruler tool helps you measure things inside of an image if you are trying to be precise about how you do things. This helps if you are a web developer and you are trying to make every symmetrical and in order. I personally try to do this sometimes and have to slap myself. I like to be organized myself, but I don't want my websites to look so fine tuned that they would be passed up as not being original. The Count tool helps you count.
The Hand tool is used to move objects that are in a layer in anyway that you would like that is 2d in fashion.
The Zoom tool helps you zoom in on a picture or object so you can do fine tuning.
The Default Foreground and Background Colors tool lets you return back to black and white when you have gone totally out of whack with you colors you are thinking you are in the 1960s!
The Switch Foreground and Background Color tool lets you switch the colors you using at will. It is almost like have a painters tablet to hold your saved colors on.
I forgot to mention that each of these features has its sub-features displayed at the top of the program when you click on them. You have probably noticed by now though. By now you have gained enough knowledge of the Adobe Photoshop CS3 basic features to jump in and start creating your own stuff. You will be able to find further information on each of these features in use with illustrations soon. I can tell you this because I am writing them right now. I believe the visitor will take from you if they can look at one person and know what type of information he is giving rather than it coming from a million different people that may or may not know how to effectively write information to people. Please check back often to view further updates to the website and even more great tutorials in various disciplines in Adobe Software.
Gradients in CS3
This tutorial will go over the use of the Gradient Tool in Adobe Photoshop CS3. This is a short and focused tutorial on the capabilities of the gradient tool. Many different things can be constructed from such simple features. Many new web 2.0 buttons, headers and images are using finely tuned gradients to give off a smooth effect. I personally like this look and feel, and will be developing it into some of my new tutorials. If you are looking for a more defined tutorial on how to use this feature, you can check out of the links to the side or a webpage from the resource site link. Also there is the full package of teaching tutorials that you will find summarized at the end of this tutorial. Enough of the idle talk lets continue with the tutorial.
Let’s start by opening up Adobe Photoshop CS Extended and making a document of a large square shape (500 pixels x 500 pixels). Then you can select the Gradient Tool.
Now drag a line from the top left portion to the bottom right portion like shown in the image below.
Now you will see what happens with the color patterns from blue to brown. You can see the color pattern at the top left of the program. That is the way it is shown for a gradient.
Now select that gradient box and you will see the default option within it. There are a variety of pre-made color patterns.
Let’s take a look at one in use. Pick the transparent rainbow.
Now drag a line from the top right to the bottom left.
Now you will get an opposing gradient image from another corner of the document. You could do with different layers and make all kinds of cool contrasting stuff.
Now lets get a fresh document and select the Linear Gradient located at the top of the screen as shown in the image below.
Now drag a line from the left to the right.
Now you will get a linear gradient with the transparent rainbow. The transparent rainbow is nothing more than a few blending changes. You blur the rain colors and then you set the opacity to about 50% and there you go.
Let’s make another clean document and select the Angle Gradient.
Select the option Foreground to Background, which will take your personally made background and foreground colors and make an angled gradient with them. You can do this with any of the gradients.
Now drag a line from left to right.
Now you will have an angled gradient. My gradient is from blue to white so it looks like it takes up only half the screen. You can make yours look like whatever you want.
Now make a new document and select the Reflected Gradient.
Drag a line from the bottom left to the top right.
Now you will see the image below.
Now select the Diamond Gradient from the top. I am sorry for not having the proper caption for this. Now select the black and white color option.
Now drag a line from the top left to the bottom right.
Now you will have an odd looking diamond speared gradient object. I probably should have demonstrated this in another color pattern.
The rest of the options are pretty self-explanatory. Next to the gradient types are the modes you can run them in. I kept it on normal for simplicity sake. They are shown below.
The gradient is a great tool that has many useful possibilities. It has been used since digital graphic editing started and it will continue on with these brilliant programs. Nothing catches the eye more than a well used gradient in an image. It mimics the changing faces of the sky that we see everyday. Some people would state that they have never seen anything more beautiful than a colorful sky. I believe they may be on to something. I hope this tutorial has taught you a few features that Adobe Photoshop CS3 has to offer with gradients.
Subscribe to:
Posts (Atom)