Author Topic: Photoshop Chalk Talk - A Comprehensive Introduction to Photoshop  (Read 19552 times)

Offline Pants

  • Member
  • Posts: 119
  • Pants are superior.
    • Tracker Profile
Photoshop Chalk Talk - A Comprehensive Introduction to Photoshop
« on: November 28, 2010, 08:25:23 am »

Second Video is up and posted

Sorry but you are not allowed to view spoiler contents.

This will be up until I reach something assembling completion

I've recently been possessed by an impulse to share my relevant knowledge of Photoshop with the BT community.
I sent a PM to Duki with an outline of what I wanted to cover and a place to put it, his response:

Technology board, if it's any good I'll pin it.
However an extensive tutorial like that one you may port it over to the wiki (it will look much cleaner).
It's not exactly BBT tracker relevant material, but there's no problem having it there as some informative section.


So, here I am.

Current subjects to be included: (strike-through = included material)
(1.)   Introduction - Explanation of what I'm doing, what I'm intending to do, the scope of the information, various disclaimers, and hyper-linked table of contents.
(2.)   Thanks to users who have contributed/corrected/expanded upon my material. (Revision list?)
(3.)    Links to outside sources that I've found consistently useful in learning Photoshop (independent tutorials, videos, etc), Photoshop resources (brushes, textures, plug-ins, etc), also to be edited to include references that other users recommend.
(4.)   Photoshop 101 - what it does, what it doesn't do, terminology, anatomy the work space, customization of the work space.
(5.)   Opening a new document, background transparency, canvas vs. image size, desk-space vs. canvas-space
(6.)   Layers - what are layers, how to wrap your head around them, anatomy of the layer window, functions of layers, layer styles (superficial explanation).
(7.)   Tools - Introduction to the toolbar, it's content and their features - introduction per tool (non-comprehensive).
(8.)   Text in Detail - 'Character' and 'Paragraph' dialogues, examples of text modification.
(9.)   Brush tool - 'Brush Presets' dialogue (loading new brushes, saving brush sets), and 'Brush' dialogue (showing basic usage: 'Brush tip shape', 'Shape Dynamics', 'Scattering', and 'Color dynamics').
(10.)   Pen tool - Intro to vectors & paths, how it works, tips-and-tricks to keep it from being the bane of your Photoshop experience.
(11.)   Moving - Move tool & transformation.
(12.)   Layer styles more in-depth: Each option in detail.
(13.)   Stamp and healing tools with example of use and specialization.
(14.)   Advanced selection techniques. Refine-edge.
(15.)   Shortcuts, special user navigation/interface.
(16.)   How to remove the background of an image - several examples with pros/cons.
(17.)   Saving and Export procedures
(18.)   How to upload files to the web for posting in forums.
(19.)   How to make and upload a basic BT banner.
(20.)   Example of how to clean up Manga pages with recommended export settings/process.

In these twenty posts I will attempt to convey the summation of my relevant Photoshop knowledge onto the BT community. I do not claim to know everything about Photoshop, not even its developers do, but I know enough to be able to give to those who know a bit less. Learning something like Photoshop is sort of like learning a new language, I'm may not be a native speaker, but I'm fluent in some environments - I may not know the word for 'toothbrush' but I can debate the finer points of Fyodor Dostoyevsky's works.

Granted, this series isn't intended for the Russian literature obsessed, but for those who want to shop anime screen-captures, clean up manga pages, or make a bishōjo avatar or banner for their favorite forum. This is what I am here to help you with, Leo Tolstoy can wait for another post. My intent is to have someone who doesn't know anything about Photoshop (but something about how to use a computer) to walk away from these posts with a through understanding of the basics, and a basic understanding of common techniques with references to where to go from there.

The version of Photoshop I'm using for this tutorial is Photoshop CS5 Extended, but anything from CS3 on will be perfectly relevant; I'm not going to go into any of the new features these versions won't have. Anyone using Photoshop 6 or later can use this information as well, but know that you may need to compensate for an outdated user-interface and there may be some modifiers to tools that my be missing; no real biggie, the skills are the same. The one thing I will say about Photoshop version is don't use any version of Photoshop Elements; the program is intended for basic photo retouch and not at all the creation of web-graphics. Photoshop itself, in all reality, wasn't intended for our particular uses, it's just become the standard for them and the good people at Adobe have adapted features to the demand.

For those individuals using Macintosh machines: Yes, I'm using Windows. But, as far as I can tell, the good people at Adobe have made all features perfectly identical between the systems. The only significant differentiation in the user experience is the use of the [apple] key in various commands instead of the [ctrl] key. If where I give a [ctrl] command, substituting the [apple] key does not work, determine the correct key sequence and post it here for me to update.

On the subject of preference: The recommendations I may give for various setting and techniques are simply what I prefer. I will not claim that the way I do anything is the 'best', it's simply the methods that I've come to use. If you posses knowledge of any method similar to the ones mentioned here and find yours to be comparable or superior in result, post it here - and after attempting it, I will update the first page and give you credit.

Also, I'm going to highlight key terms, just like a high-school history book. It's a bit of a trope, but it should help you pull the most import information from the page at a glance. The other tutorial specific nomenclature I'm going to use are things like Edit > Copy for shorthand of "Go to the Edit drop down in the Menu Bar and select Copy" (this gets boring to type and read). The other being [ctrl] + V when I mean "Hold your control key and press your 'V' key" - I'm not a kindergarten teacher, you don't want me around your kids.
« Last Edit: July 12, 2011, 07:51:08 am by Pants »
When you spam, you go all out don't you? God bless the select all and delete selected button... ~Duki3003

Offline Pants

  • Member
  • Posts: 119
  • Pants are superior.
    • Tracker Profile
Hall of Thanks - Your Name Here!
« Reply #1 on: November 28, 2010, 08:27:15 am »
« Last Edit: November 29, 2010, 02:14:05 am by Pants »
When you spam, you go all out don't you? God bless the select all and delete selected button... ~Duki3003

Offline Pants

  • Member
  • Posts: 119
  • Pants are superior.
    • Tracker Profile
« Last Edit: December 20, 2010, 10:30:58 pm by Pants »
When you spam, you go all out don't you? God bless the select all and delete selected button... ~Duki3003

Offline Pants

  • Member
  • Posts: 119
  • Pants are superior.
    • Tracker Profile
Map of Photoshop - You Are Here
« Reply #3 on: November 28, 2010, 08:28:33 am »
00:23 Don't panic!
01:18 What you're looking at
02:58 Tabs
03:35 Customizing window orientation (start)
04:07 Working with window columns
04:54 Dragging/removing windows
05:25 Docking/undocking windows
06:38 Resizing docked windows
07:40 Docking to a new column
08:31 Nesting/organizing tabs in windows
09:53 Docking windows to collapsed columns/docked fly-outs
10:88 Customizing the Tool Bar
11:25 Saving window Workspace
Sorry but you are not allowed to view spoiler contents.
« Last Edit: May 21, 2011, 04:41:19 pm by Pants »
When you spam, you go all out don't you? God bless the select all and delete selected button... ~Duki3003

Offline Pants

  • Member
  • Posts: 119
  • Pants are superior.
    • Tracker Profile
Starting a Project - Square One
« Reply #4 on: November 28, 2010, 08:29:12 am »

00:23 Starting something new
00:56 Units
01:43 Pixels
02:34 dpi/Screen resolution
03:27 New Canvas dialogue window
05:49 Arranging canvases
06:51 Canvas layout presets
Sorry but you are not allowed to view spoiler contents.

Gentlemen, I give you - THIS THING:

Yes, it's a solid square, but I'm not going
to teach you how to make one just yet.
I know... I'm silly.

If you've already created the new document described above, right click and copy this square and paste it into your canvas.
If you haven't, copy this square, go into Photoshop, create a new canvas with the default settings and paste it.
If you want to try something else, click and drag the square from your browser into the Photoshop window.

All three of these procedures are valid ways of bringing this square into Photoshop.

"What are we going to do now?" You may ask.
Well, I'm going to congratulate you on a job well done:
You have imported your first Photoshop image.

Lets play with it a bit, shall we?

Navigate to Image > Image Size...
or press [ctrl] + [alt] + I

See the chain links between the Heights and Widths?
This keeps the ratio of Width to Height constant, 1:1 here.
Don't touch that quite yet...

Instead, change the units in Document Size to percent.
Then change Width to 200% and click OK.
You should notice that your square is still a square,
and that it's twice as big as it was before.
Go figure, right?

Go back to the Image Size dialogue box
and change the Height to 50px.

I can tell from that over-confident look in your eye
that you feel you've got this.

Pop-Quiz: Make your 'square' 2in tall and 99px wide.
Hint: un-check the Constrain Proportions check-box toward the bottom.

OK, so you've got this.
Reset back to your 100x100px square,
and go ahead and re-check Constrain Proportions.

You're now ready to learn another feature...

Navigate to Image > Canvas Size...
or press [alt] + [ctrl] + C

Set the size to be 200x200px and click OK.

Now, tell me honestly, do you understand what just happened?
If you didn't let me explain: You changed the size of your canvas,
and didn't touch anything about the image.
By default the extra canvass has been filled with your background
color - which should be white by default.
If it isn't don't worry, that's not the point.
The point is that your image wasn't affected
by the action you just took - instead you quadrupled the space
of your project.

Undo with [ctrl] + Z and try it again.
This time click the top left square in the 3x3 grid beside Anchor.
This time change your canvas to be 300%x300% and click OK.

You've now made it so your canvas is 9 times larger
and your square is in the top left.
This is because you've anchored your pre-existing image
to the top left and then expanded the canvas around it.

I'm sure you can appreciate the similarity between the square you
clicked in the anchor and the final placement of your square.

Don't undo, instead reopen Canvas Size and check Relative.
Select the top left anchor again, but enter a width of -200px.
Notice that some of the arrows will now point ward this anchor.
Click OK. Read the pop-up and click Proceed.

If you read the pop-up, you may have expected this result.
The canvass size is now 100x300px with your square at the top.

To complete the cycle, use Canvas Size to remove the
lower 2/3 of the image and selecting the right anchor.
The particular method is up to you.

Note, you can anchor to any of the top three
because you are not modifying the width.

Now that you have returned to your 100x100px square,
experiment with these two dialogue boxes
until you feel you understand them.

If you're still not understanding Canvas Size,
I've made this cheat-sheet.
Each of the 9 squares represents a 300x300% expantion with
the anchor corresponding to the position on the grid.

If you really want to test what I've just taught you do the following:
Start with the original square. Double it's size.
Expand the canvas by 50% around the square.
Make the image 125x225px.
Add 50px of canvas to the left while
removing a total of 100px from the top and bottom.
You should come up with... this:
If you did, Great Job!
If you didn't, you can do it, it is possible.
« Last Edit: May 24, 2011, 12:10:39 pm by Pants »
When you spam, you go all out don't you? God bless the select all and delete selected button... ~Duki3003

Offline Pants

  • Member
  • Posts: 119
  • Pants are superior.
    • Tracker Profile
Layers - Give Everything Depth and Complexity
« Reply #5 on: November 28, 2010, 08:29:49 am »
Layers, ladies and gentlemen, are what make Photoshop. Without Layers, it would simply be a shiny alternative to MSPaint. But, what are layers? Layers are discrete sub-images within a project that overlap each other providing a greater degree of complexity, depth, and editability. Let me give you an image of layers and then explain some more:
Here I have the diagram of the six layers I used to make a BT banner (I'm using this as a familiar example, not a shameless plug - also, it's purple).

In the final product you see all layers even though there is significant overlap. This happens primarily because of transparency within the layers.

Think of it this way: Remember those overhead projectors that all your teachers used in school? Layers are like overhead transparencies, one-on-top-of-the-other with the total image being the summation of all those layers.

Along with Red, Green, and Blue values (which control the color), each pixel has an Alpha value which dictates it's transparency. If an image's pixel has a value lower than the maximum, that layer has a degree of transparency.

The opposite of transparency is referred to as Opacity. When something is 100% opaque, is not transparent at all.

One thing you should know: Alpha is measured in units from 0 to 255 (256 in total) like RGB, but Opacity is measured in percent. Don't worry about Alpha because most don't normally need to fiddle with Alpha Channels anyway. Opacity, on the other hand, is commonly used.

There is a misnomer in common usage you should be aware of: when a tutorial says to 'change the transparency', they're really intending for you to change the Opacity. By dropping the Opacity, you increase the Transparency.

I shouldn't belabor the subject, but I've been told this is a difficult concept for some.

Here we have the layer window:

If you don't have this open, press F7 or Window > Layers

Let me explain what I have highlighted
Blending Mode:
Controls how this layer interacts with the layers behind it. This will gone into in greater detail in section 12 [Layer Styles]. Default is Normal.
This controls the total opacity of the layer. Currently shown at 50%.
Clicking one of these options toggles a lock for transparent pixels, image pixels, position, or all. Locked part of layers cannot be edited.
Layer Visibility:
Clicking a layer in this column toggles its visibility. When a layer is invisible, it is not seen on the canvas and cannot be edited. Useful when working on layers below it, or hiding a helper layer (as in this example).
Layer Group:
Groups of layers can act as single entity when applying Visibility positioning, or other edits. Layers in a group can still act individually when selected independently from the group.
Active Layer:
The blue highlight indicates that this is the layer being edited. Blending Mode, Opacity, Locks, and Fill (covered later) show and edit the active layer. Note: many commands need an active layer in order to be executed.
Layer Tools:
Link Layers allow for you to simultaneously Move and Transform two or more linked layers, Layer Style (fx) will be covered later, Masks may be covered later, Adjustment Layers probably won't be covered later, New Folder allows you to add and new group, New Layer does exactly that, Delete Layer lives up to its name too.
Every project must have at least one layer in it; you cannot delete the last layer. Because of this, every project you start also starts with a layer.

You do have a degree of control over this layer even before you actually open the canvas in the Background Contents drop-down.

A Transparent layer does not have any information on it, but it does exist and can be edited.

But, what does transparency look like? To differentiate between transparent areas and any other color you may be working with, a checkerboard pattern has been set to distinguish transparency.

Regardless of what the starting layer has on it, it is always called 'Layer 1'.

Photoshop is a slightly different creature when opening up a non-Photoshop file...

Your opened image still has that default layer, but it cannot be readily edited. I'm not entirely sure why that is, but I assume it is a sort of fail-safe to prevent you from accidentally editing and saving over a raw image you wanted to preserve.

The layer depicted to the right is one of these instances. The layer is called Background, is italicized, and is locked.

To unlock and edit this layer, double-click anywhere on the layer (but not on the Layer Visibility). You will be presented with this dialogue box. It will be renamed 'Layer 0' by default.

Hit OK, the lock will disappear and the image will become editable.

Now, how does one arrange their layers exactly?

If you look at the original example, you'll notice that the top layers are in the foreground and the last layer is in the background. In this way, the layer order in the Layer window resembles the layer order on the canvas.

To move one, click a layer and drag it where you want it. Photoshop will highlight valid locations as you move it. You can drag a layer into a group, or a group into another group in this way, except that Photoshop will highlight around the group instead of just between. When dropping a layer into a group icon, it will occupy the last position within that group unless specifically placed within the expanded group.

To select more than one layer/group, hold ctrl and left-click the layers you want to select. To select all layers/groups between two items, select the start of your selection, hold shift and click the end of your selection. You can move all selected items to a consolidated position using the previous method, Photoshop will maintain the layer hierarchy within that new location.

Names are names, and I've already mentioned that we'll be discussing Blending Modes later, and Opacity has already been discussed, but what is that Color option you see in the dialogue?

A layer's Color is an organizational helper that has no effect on the layer itself, only how it's displayed in the Layer Window. You have all of seven colors to choose from, or you could forgo the frivolousness. This is helpful when you have several (50+) layers and you want to more quickly navigate to the layer you need.

There are two other places that you can readily change the layer's color after it's been made:
You can right-click anywhere on the layer in the Layer Window and select Layer Properties at the top (left), or
right-click the layer's Visibility icon area to bring up a simplified menu (right).

Again, you don't get too many options as far as color, and they aren't exactly vivid, but they do help organize.

Opacity or layer transparency (if you want to call it that) can be changed in many different locations in Photoshop. The most readily accessible one is in the Layer Window.

If you click the corresponding arrow, a slider will appear immediately below it allowing you to change the percentile.

When using the slider, you don't actually need to click a second time. You can click and hold the arrow, move down to the slider, and move the bar to the left or right. Release the mouse button to set your value.

You can see the percentile change as you move the slider in the box right next to it. Alternatively you can use this field to directly enter a value in the 0-100% spectrum, including decimals if you're so inclined.

The quickest way is actually to use the number pad of your keyboard with the Move Tool selected. To enter a multiple of 10%, just press num1 through num9. To set to 100%, hit num0. To set a value between 1-9%, precede the key entry with num0. You have about 1 second to enter the value you want before it finalizes the input, but it will preview it immediately.

Just to give a few examples: num0 num5 = 5%; num1 num5 = 15%; num5 = 50%; num0 = 100%

I don't know if there's a way to set 0% Opacity using this last method, but it works flawlessly for anything else. Also, if you enter a value you didn't intend, or take too long, just reenter your intended value at no consequence, just know that your History will show multiple Opacity Changes.

What's this? History?

History is fairly straight forward in concept. Photoshop keeps different snapshots of your project in your computer's memory. These snapshots let you go back to a previous point in your projects' History.

To go back to a previous point in your History, click the row corresponding to the action you took to differentiate that state from the previous one.

You can also use ctrl + Z, but this will only switch back-and-forth between the previous state and your current one. If you select a state prior the previous one, ctrl + Z will switch between your most recent state and that one.

So, hitting ctrl + Z multiple times does not go back multiple times in your history, instead it strobes the previous state against the current one. If you need to go back multiple steps, you will need to access History directly.

Photoshop will only store a certain number of these states, though. Once you have made more edits than this number, Photoshop will delete them to make room for the most recent edits.

The original state will always be maintained in light of this: If you start a new project, it will keep the original blank document; if you open a previously saved file, it will maintain the original state; if you open a paralleled document, it will maintain the source state as the original.

OK, so that wasn't entirely the truth. The original state is actually the default snapshot when starting work on a project. It isn't always there, it can be deleted. But first, let me show you how to create one:

Go to the state you want to maintain, i.e. keep Photoshop from forgetting. Right-click and select New Snapshot. You'll be given an opportunity to name that Snapshot and weather to create it from the entire document, the merged layers, or a single layer. I only want to mention these options, I won't go into them here because by the time you'll ever use them they'll be self-explanatory.

You'll also notice that you can Delete a state/snapshot or Clear History from this right-click menu.

The final option is to create a New Document from a state/snapshot. This is like saving the file and opening it up right next to what you just saved from, only there isn't a save to begin with. Very useful when you want to experiment with a document, but don't want to risk losing your work, or bothering with saving. This is the paralleled document I spoke of earlier.

But what's with those boxes to the left of the states/snapshots? Those are used to designate the point in history which is to be used with the History Brushes. This will be discussed in more detail in the Tools section, which is right below this one.

I think that's all I really should tell you about History at the moment, so lets get back on topic now, shall we?

Now that we have some idea about what we're looking at, look back at the example I first showed you, the one of the BT Banner.

If you notice, I have a group of two layers called text. The group, is designated by the folder icon, and the text layers are designated by the capital 'T'. The other layers have similarly located identifications, but they are normal layers and take on a resemblance of the layer they represent. These various icons are called thumbnails.

In the image to the right, I've outlined every sub part of an individual layer. The Thumbnail is to the right of the Layer Visibility. To the right of that is the main part of the layer, which also includes the Layer Name.

You haven't seen anything having to do with Layer Effects yet, but I've included them for future reference.

It occurs to me that I've given you a lot of text will disturbingly few pretty purple pictures. This will now be remedied:
OK, now for the rundown; these are the major menus that are accessible through the layers menu. I won't go over everything listed here, so forget about masks, blending options, styles, or adjustments for the moment.

The one to the top-right is accessed when right-clicking on an area not corresponding to a layer, i.e. below them if there's room in the window.

The one below it, to the middle-right is accessed when right-clicking the Layer Thumbnail.

The one to the top-left is accessed when right-clicking the main body of the Layer or the Layer Name.

There's a fourth I'm not showing you, but it's accessed by right-clicking the Layer Effect area if the layer has any.

Double-clicking the Layer Name will allow you to change the layer's name, then and there, without any duologue. This is the way I prefer over all others. Also, text layers' names update to whatever text they contain unless changed by the user.

You can change the look and size of thumbnails from not displaying them at all to making them huge. Another option that I like, which is disabled by default, is the ability to clip thumbnails to layer bounds. This makes it so that the thumbnail only shows what it actually contains, not the entire canvas. This is nice when you're working on a large canvas with several layers with relatively little content.

You can also Select Pixels. This is useful for any number of reasons, for finding out where a layer is on the canvas, to using one layer's alpha to edit another layer. More on this in the later section on selections and transforms.

You can also Merge Layers. Merging will rasterize all fonts and effects within the merged layers. Merge Down makes the selected layer and the one below it into one. Merge Visible does just that, and is controlled by turning on and off layer visibility. Merge All is like the previous option, only that it discards all hidden layers so only one remains after the operation.

By now, you've inevitably wondered somewhat about the duologue I've pictured at the bottom, here. Let me just say, before I tell you anything more, this is the most misused part of Photoshop. Period. This, poor selections, and improper resizing constitute what makes the majority bad images that are made in Photoshop... bad. I'm showing this to you now so you're not afraid of it when you finally get to play with it later, but also to warn you in advance, before you even use it: When you do use this duologue, do so with caution, improper use of this will make your creation an eyesore to others and denote yourself as a novice. Neither of which are good things... That said, to get here, all you need to do is double-click anywhere on a layer that is not the Layer Name or selecting Layer Properties form one of the above menus. I fear, in typing those letters, I have helped let loose a terror upon the world, much like a teacher lecturing on HTML tables in a web programming class...

Never-minding any of that, the one thing you should remember if you forget everything else, is the Duplicate Layer option. It will give you a prompt asking for a name, which document you want to duplicate it to (current one by default) and what you want to call the new document if you decide to open it up by itself (all document properties will be set to best fit the duplicated layer). To quickly duplicate a layer within a document, without any prompt, hold alt and drag and drop the layer where you want it.
« Last Edit: December 20, 2010, 06:51:44 am by Pants »
When you spam, you go all out don't you? God bless the select all and delete selected button... ~Duki3003

Offline Pants

  • Member
  • Posts: 119
  • Pants are superior.
    • Tracker Profile
Tools - They're Aptly Named
« Reply #6 on: November 28, 2010, 08:31:26 am »
You may be tempted to go run off and play with these now, heck, go ahead. There's only so much that you can learn from the words I'm writing here. Check back here to a bearing, but this is where the hand-holding stops, my friend.

You'll notice in the image to the left, that most of the tool buttons have a little black arrow to their bottom-right (the move tool and zoom tool are the only ones which are exclusive). This indicates that multiple similar tools can be accessed from that button. To access other tools, click and hold (or right-click) the button to prompt a tool list. You can then select the tool from there.

If you switch to another tool, it becomes the new default for that group; for example: if you switch to the elliptical marquee tool from the rectangular marquee tool (default) and then switch to the move tool, the elliptical marquee tool will remain visible and the rectangular one will be hidden - then, when you click on the marquee tool button, you will select the elliptical variant. Confusing? It shouldn't be, it's so simple that it's silly to try to explain it, just try it out.

You'll also notice that most the tools have a letter associated with it. By pressing this letter on your keyboard, you select the corresponding tool which is in the default position (see above paragraph). To switch to a non-default tool, you can often hold shift and then the shortcut letter to cycle through your options. You should know, however, not all tools can be selected from the keyboard, but all the commonly used ones can be. You can tell the ones you select from the keyboard because they have a letter beside them when you bring up the tool list (see two paragraphs above). So, for example, while you can toggle between rectangular and elliptical marquees with shift + M, you'll need to go to the tool button to select the single row/column marquees associated with that tool.

Toward the bottom you'll see the rotate object and camera rotate tools. These are used when doing 3D works with CS5, and will not be discussed or mentioned again.

All the was to to the bottom is the... I'm not sure what it's called, I just think of it as the color pallet, but that's just one item within it. This is the first place where you control the colors you're working with. Like in MSPaint, you get two colors to play with at a time, a foreground color and a background color. The foreground color is what you actually work with, and the background color is just in reserve.

There's a button to the top right of the lower panel that will switch these colors (like a L-shaped double-sided arrow), or you could just hit X like all the cool kids 8).

The other thing to remember is that black and white are useful colors, and when you find need for them, you can change both colors on your color pallet to them by hitting D, for 'default'.

The last button on the tool bar is the quick mask toggle. This is immensely useful, but I'm not sure this is the place to be talking about it. Remind me to add it to the 'Advanced Selection' section when I'm done with everything else...

These, my friends, are the core of photoshop. Not the paint brush, not even the red eye tool – but the selection tools. Mastering everything else in this program is useless if you can’t make good selections (thus why selections has their own section later). These are your best friends, get to know them well.

The marquee tool is the standard method of selection. The keyboard shortcut is M for… muffins… As I’ve mentioned before, shift + M will toggle between rectangular and circular marquees. The single pixel column/row marquees have their uses too. The style option in the options bar lets you select between normal, which starts and ends where you tell it to – the default; fixed ratio, which can sometimes prove useful; and fixed size – which is crazy useful when you’re a pixel counter like me. In order to input the lengths or ratios of the sides, you need to change the style first, and remember that ratios don’t care about units.

The move tool (V for moVe) is your standard method for… wow, this will get redundant quick. Anyway, you can probably figure out how to click-and-drag, the one thing that I’d like to mention here is that you can align layers and groups with this tool too, just be sure to lock the base layer first if you’re not aligning to the canvas.

The lasso tool (L) is pretty much a free-hand marquee tool, not much more to it than that. The variants include a point-and-click option that makes perfectly straight lines until you close the path, and another that attempts to follow the outline of your image with varying results.

The magic wand tool (W) samples a color, like the eyedropper, and makes a selection of colors next to the clicked point within a specific range of tolerances. Its variant, the quick selection tool, is a quick and dirty in that you click-and-drag to expand the selection, and it makes a guess as to the boundaries of your selection.
Then, there’s the crop tool (C), this… crops the image. It has modifiers that allow you to independently control the width and height, and the resolution of the crop. The variants, the slice and slice select tools, are used for things like web publishing when you publish multiple images from a single photoshop canvas. Not going to be gone over here, but should be checked out elsewhere if you’re looking into this.
This group of tools right here are the image retouching tools, fairly useless for creating images and absolutely indispensable when editing them. By and large, this is the ‘shop’ of ‘photoshop’. All of these tools are accessable by hitting J or shift + J.

The spot healing brush is a magical little thing that will sample the entire image, grab a portion of it, and copy it over a blemish. It isn’t a straight copy-and-paste job though, there is some blending that photoshop does to the pasted pixels. Doesn’t work every time, so good’ol ctrl + Z is this guy’s best friend, but it works with some consistency.

If you find the spot healing brush isn’t exacting enough, there’s more a broken line than a spot you need to fix, or you’re the just obsessive compulsive type like me, the healing brush is the tool you’ll switch too after the previous tool doesn’t cut it. It works on the same principal, only you tell photoshop where to sample the image from. To indicate the base point alt + click. Each stroke you make will copy –and paste the referenced area over the painted area.

The patch tool is identical in concept to the healing brush, only instead of the brush, it’s a lasso. To use it, you make your selection, then click and drag from the selection to the area you want to replicate – a copy of the selection will follow your cursor and a real-time preview of the selected area will appear in the original selection area. After you release, photoshop will attempt to blend the selected area with the substituting area.

The red eye tool has you make a rectangular marquee around an eye, and it removes the red from it – yup, that’s all it does; photoshop’s one-hit-wonder.

These first two tools, the clone stamp and the pattern stamp tools (S) have never been particularly useful to me. The clone stamp tool is like the healing brush, except there's no blending algorithm - it has its moments of usefulness, but the pattern stamp tool is not something I use.

The eraser tool (E) is much like the brush tool, except that it subtracts content. You can still select different brush shapes, but the color modifications are useless to this. Pretty standard and doesn't need a whole lot of explanation. The magic eraser variant is probably the tool I misuse the most - I'm not sure exactly how it works, but it I think it samples the center of the brush, like the eyedropper, gets a color range based off that sampled point and the tolerance modifier (in the options bar) and deletes all contiguous or non-contiguous colors within that range withing that radius... I think... There is also a magic eraser tool (shown below for some reason) that takes the paint-bucket approach to erasing and only has a tolerance modifier.

The blur, sharpen, and smudge tools... blur, sharpen, and smudge. This tool family doesn't have a shortcut key in that they are used sparingly *cough* should be used sparingly. Excessive use of these tools is another common rookie mistake. They're situational tools, not production tools, but when you need to blur, sharpen, or smudge and image and don't need to apply a filter, these work just fine.

This next tool family (O for dOdge or spOnge) include the dodge, burn, and sponge tools. The dodge and burn tool are opposites, the dodge tool lightens an area and the burn tool darkens it - not something that is used outside the world of photo-retouch, but they're there. The sponge tool is similar, except that it either increases or decreases the saturation of the applied area - meaning the colors are more intense or lowers them so the image eventually becomes gray-scale. To change the direction of the color saturation control, there's a modifier in the options bar.

Yup, that's right, seven images and all the tools are pretty much useless for our purposes (except the magic eraser tool that should be in the above section...) but they're there and there's no harm in knowing about them.

There are four brush tools, all of which are accessed via the B key, that’s B for brains. The details of brush dynamics will be covered in their own section; I’ll keep this to a superficial introduction.

The brush tool is the standard painting instrument; it has all sorts of modifiers both within and outside the options bar. It only paints the foreground color, so to change to the background color, click the button in the tool bar or hit X.

The pencil is pretty much like the brush, only it fills all affected pixels completely, creating a very harsh edge – which has its uses. Do remember that you still have all the modifiers that the brush tool has, only many of them deal with subtlety of the filled pixels and there isn’t too much subtlety that is afforded to the pencil.

Then there’s the color replacement brush. Admittedly I haven’t mastered this tool, so I can’t give too many pointers, but in theory this will take one color, within a realm of tolerance and the limits of the brush, and change it into another.

Finally there’s the mixer brush, which is like the blur tool, only it throws some of the foreground color into the mix (ba-dum-chush!). There’s actually a lot that can be done with this brush, but it’s more an artsy thing meant for those who actually do DX and have a tablet.

Next come the history brushes (Y). These are what use that left column in the history window that I hinted to in the previous section. These paint over the layer with what was at that position at the selected point in the project’s history. By default, the opening state of the file is what is selected, so you actually need to use your history window to use this brush. The art history brush... I don’t know what to do with. I’ve had peers who’ve had classes where the assignment was to use the art history brush, and they didn’t know what to do with it. Go ahead and experiment with it – the results are kind of interesting, but I have no idea what an application with it would ever be... you tell me...

Next is the gradient and paint bucket tool family (G). The paint bucket floods the canvas with paint from the indicated point until it hits a limit set in the tolerance modifier. The gradient tool will fill the canvas, every time, unless you put it within a selection. You can actually get pretty complicated with the types of gradients you can input and it’s pretty great for making bases for background images.

Then there’s the pen tool (P). The pen tool makes paths. Paths represent vectors. Vectors are thresholds that have infinite resolution because they exist outside the constraints of the pixel grid. I’m going to explain this in much greater detail in a later section. They’re pretty fantastic. The selection tool selects these paths, but you don’t really need this tool if you know how to use the pen tool.

Text tools (T)... input text. I’m going to talk about this at length in the next section, but the basics are self-explanatory. You can also make masks of text with the type mask tool. This is useful because you don’t need to rasterize the type in order to make it a mask – if you didn’t understand that, don’t worry, it’s a little beyond what I’m going to share with you here.

The shape tools (U for... something) make shapes. (I’m detecting a trend with the naming scheme here, but not the shortcuts) They make the shape that they’re named for. You can control the number of sides in the polygonal tool, the radius of the fillets in the rounded rectangle tool, and the actual shape of the custom shape tool in the option bar’s modifiers after the tool has been selected. There’s also the line tool, guess what it does?
The eyedropper tool (I) (yes, back up toward the top) samples a point, or a range of pixels around a point (modified by a drop-down menu in the options bar) and places that color into your foreground color. Use with X for maximum efficiency. The variants of the eyedropper tool are seldom used by most people, but are crazy-useful when you need them – color sampler places multiple sample points that stay on the image and read back their values in the info window (useful when you’re attempting to color balance an image), ruler measures pixels so you don’t have too (what I use it for), note tool is like a notepad within the file that you use to communicate with others also working on the file or to leave yourself a todo list, and the count tool… counts… like sesame street.

Finally, there’s the hand (H), zoom (Z), and rotate view (R) tool set. These don’t change the project or modify your history, they just change how you see what you’re working on. The hand tool works with a click and drag function to move the canvas around the workspace. The zoom tool has you make a rectangular selection representing what you want to look closer at, and how close you want to look at it, or click once and it will focus in to that point at a set interval. And the rotate view tool rotates the canvas without changing the canvas – this is particularly useful if you have a tablet, if you don’t... you’ll likely never use it.
« Last Edit: January 30, 2011, 04:29:54 am by Pants »
When you spam, you go all out don't you? God bless the select all and delete selected button... ~Duki3003

Offline Pants

  • Member
  • Posts: 119
  • Pants are superior.
    • Tracker Profile
Text - In Detail
« Reply #7 on: November 28, 2010, 08:32:19 am »
There really is one thing you need to learn from this section: Anti-aliasing; what it is, and why it's your friend.

Let me give you an image before I say any more:
This is 12pt font shown at 5 times the normal display size. I've given you a sample of the two most common Windows fonts, Arial and Times, and the font used for the BT logo and such. Just to contrast, here's what that these fonts look like at their normal display size:

OK, now that we have some images to reference, lets talk a little bit. Aliasing is what you see in the first row of examples, that's what that type of pixelization is called. What anti-aliasing does is systematically blur the image to maintain information from a higher resolution when its down-sampled. Blurring isn't the right word, really, the right word is anti-alias, and this isn't really a complete explanation, but you get the idea. The reason that photoshop has four types of AA (for short) is because it uses four different algorithms in the down-sampling, the naming scheme is fairly arbitrary.

If you look at the smaller example, 'Sharp' looks 'stronger' than 'Strong' with Times and Joyful Juliana, but 'Strong' looks 'strongest' for Arial. What we can learn from this is that the names are misleading, and that there isn't a 'best' algorithm for all fonts, it all depends on the font and application.

Also, not all fonts are good at lower resolutions when not AA'd. Take a look at Joyful Juliana's aliased.
It... looks... horrible...
This is what we call a 'bad font' -- well, at least for the purpose of aliased font at lower resolutions. And, seeing as internet browsers don't consistently AA fonts, it would make a terrible web-font (there are other issues too, but I'll spare you them (I can't wait for CSS3)). Remember, not all fonts are created equally - some are good, some are bad, some are ugly, and a few are just evil... That, and, generally speaking, you need to AA your fonts unless you're really going for that retro look.

Thought I'd also mention that all the fonts are using the same color, the aliased fonts may seem darker because they're flat and lack complexity (insert middle-school joke here).

« Last Edit: January 31, 2011, 02:14:38 am by Pants »
When you spam, you go all out don't you? God bless the select all and delete selected button... ~Duki3003

Offline Pants

  • Member
  • Posts: 119
  • Pants are superior.
    • Tracker Profile
Brush Tool - Different Strokes
« Reply #8 on: November 28, 2010, 08:33:30 am »
« Last Edit: December 01, 2010, 08:51:03 pm by Pants »
When you spam, you go all out don't you? God bless the select all and delete selected button... ~Duki3003

Offline Pants

  • Member
  • Posts: 119
  • Pants are superior.
    • Tracker Profile
Pen Tool - Infinite Resolution
« Reply #9 on: November 28, 2010, 08:34:27 am »
« Last Edit: December 01, 2010, 09:13:30 pm by Pants »
When you spam, you go all out don't you? God bless the select all and delete selected button... ~Duki3003

Offline Pants

  • Member
  • Posts: 119
  • Pants are superior.
    • Tracker Profile
Move and Transform - Location, Location, Location
« Reply #10 on: November 28, 2010, 08:35:38 am »
« Last Edit: December 01, 2010, 09:30:19 pm by Pants »
When you spam, you go all out don't you? God bless the select all and delete selected button... ~Duki3003

Offline Pants

  • Member
  • Posts: 119
  • Pants are superior.
    • Tracker Profile
Layer Styles - Appearence Standards
« Reply #11 on: November 28, 2010, 08:36:58 am »
« Last Edit: December 01, 2010, 09:44:10 pm by Pants »
When you spam, you go all out don't you? God bless the select all and delete selected button... ~Duki3003

Offline Pants

  • Member
  • Posts: 119
  • Pants are superior.
    • Tracker Profile
Healing and Stamp tool - The Interments of Shopping Photos
« Reply #12 on: November 28, 2010, 08:38:23 am »
« Last Edit: December 01, 2010, 10:05:35 pm by Pants »
When you spam, you go all out don't you? God bless the select all and delete selected button... ~Duki3003

Offline Pants

  • Member
  • Posts: 119
  • Pants are superior.
    • Tracker Profile
Advanced Selection - Half the Battle
« Reply #13 on: November 28, 2010, 08:39:18 am »
« Last Edit: December 01, 2010, 10:19:51 pm by Pants »
When you spam, you go all out don't you? God bless the select all and delete selected button... ~Duki3003

Offline Pants

  • Member
  • Posts: 119
  • Pants are superior.
    • Tracker Profile
Shortcuts and Navigation - Efficiency is Everything
« Reply #14 on: November 28, 2010, 08:40:07 am »
« Last Edit: December 01, 2010, 10:30:28 pm by Pants »
When you spam, you go all out don't you? God bless the select all and delete selected button... ~Duki3003

Offline Pants

  • Member
  • Posts: 119
  • Pants are superior.
    • Tracker Profile
Removing Image Backgrounds - Several Methods and Refinements
« Reply #15 on: November 28, 2010, 08:40:41 am »
« Last Edit: December 01, 2010, 11:04:08 pm by Pants »
When you spam, you go all out don't you? God bless the select all and delete selected button... ~Duki3003

Offline Pants

  • Member
  • Posts: 119
  • Pants are superior.
    • Tracker Profile
Re: Photoshop Chalk Talk - A Comprehensive Introduction to Photoshop
« Reply #16 on: November 28, 2010, 08:41:22 am »
« Last Edit: December 01, 2010, 11:27:05 pm by Pants »
When you spam, you go all out don't you? God bless the select all and delete selected button... ~Duki3003

Offline Pants

  • Member
  • Posts: 119
  • Pants are superior.
    • Tracker Profile
Uploading Files - For Forum Posting
« Reply #17 on: November 28, 2010, 08:41:57 am »
« Last Edit: December 01, 2010, 11:35:03 pm by Pants »
When you spam, you go all out don't you? God bless the select all and delete selected button... ~Duki3003

Offline Pants

  • Member
  • Posts: 119
  • Pants are superior.
    • Tracker Profile
Make a Simple BT Banner - You Know You Want To
« Reply #18 on: November 28, 2010, 08:43:31 am »
« Last Edit: December 01, 2010, 11:40:29 pm by Pants »
When you spam, you go all out don't you? God bless the select all and delete selected button... ~Duki3003

Offline Pants

  • Member
  • Posts: 119
  • Pants are superior.
    • Tracker Profile
Doctor a Manga Image - Saving One Isn’t Always Enough
« Reply #19 on: November 28, 2010, 08:44:02 am »

« Last Edit: December 01, 2010, 11:47:23 pm by Pants »
When you spam, you go all out don't you? God bless the select all and delete selected button... ~Duki3003