adobe photoshop: overview

27
Adobe Photoshop: Adobe Photoshop: Overview Overview Author: Andrew Conard Author: Andrew Conard

Upload: kendra

Post on 23-Feb-2016

25 views

Category:

Documents


0 download

DESCRIPTION

Adobe Photoshop: Overview. Author: Andrew Conard. Common Uses of Photoshop. Creating graphics for the web. Modifying photos. Creating textures and other 2-D backgrounds for games. Note: No 3-D modeling features supported. Resizing/Formats/Cropping. Resize Images - PowerPoint PPT Presentation

TRANSCRIPT

Page 1: Adobe Photoshop: Overview

Adobe Photoshop: Adobe Photoshop: OverviewOverview

Author: Andrew ConardAuthor: Andrew Conard

Page 2: Adobe Photoshop: Overview

Common Uses of PhotoshopCommon Uses of Photoshop

Creating graphics for the web.Creating graphics for the web.Modifying photos.Modifying photos.Creating textures and other 2-D Creating textures and other 2-D backgrounds for games.backgrounds for games.

Note: No 3-D modeling features Note: No 3-D modeling features supported.supported.

Page 3: Adobe Photoshop: Overview

Resizing/Formats/CroppingResizing/Formats/Cropping

Resize ImagesResize Images Reduce or expand size of picture.Reduce or expand size of picture.

Resolution can not be added to an image.Resolution can not be added to an image.

File Formats AllowedFile Formats Allowed PSD, GIF, JPGPSD, GIF, JPG

CroppingCropping Removing parts of an image off of the canvas.Removing parts of an image off of the canvas.

Page 4: Adobe Photoshop: Overview

Gradients/PatternsGradients/Patterns

Useful for textures or backgrounds.Useful for textures or backgrounds.

Page 5: Adobe Photoshop: Overview

FiltersFilters

About FiltersAbout Filters Filters are plug-ins in Photoshop. This means Filters are plug-ins in Photoshop. This means

that you can download new plug-ins online for that you can download new plug-ins online for specific filtering effects.specific filtering effects.

Artistic Filters (Examples: Colored Pencil, Artistic Filters (Examples: Colored Pencil, Plastic Wrap, Watercolor)Plastic Wrap, Watercolor)

Blur Filters (Examples: Gaussian Blur, Radial Blur Filters (Examples: Gaussian Blur, Radial Blur)Blur)

Page 6: Adobe Photoshop: Overview

Filters (Continued)Filters (Continued)

Page 7: Adobe Photoshop: Overview

Filters (Continued)Filters (Continued)

Brush Strokes (Examples: Angled Strokes, Brush Strokes (Examples: Angled Strokes, Ink Outlines)Ink Outlines)Distort (Examples: Glass, Ripple, Wave)Distort (Examples: Glass, Ripple, Wave)

Page 8: Adobe Photoshop: Overview

Filters (Continued)Filters (Continued)

NoiseNoisePixelatePixelateRender (Examples: Lens Flare, Lighting Render (Examples: Lens Flare, Lighting Effects)Effects)Sharpen ImageSharpen Image

Page 9: Adobe Photoshop: Overview

Filters (Continued)Filters (Continued)

Sketch (Examples: Chalk, Chrome, Sketch (Examples: Chalk, Chrome, Plaster)Plaster)Stylize (Examples: Glowing Edges, Tiles)Stylize (Examples: Glowing Edges, Tiles)And much more…And much more…

Page 10: Adobe Photoshop: Overview

Type ToolType Tool

Placing text in images.Placing text in images.Anti-aliasing makes the edges of your type Anti-aliasing makes the edges of your type look nice and smooth instead of all jagged.look nice and smooth instead of all jagged.Font size and type can be changed.Font size and type can be changed. Crisp/Strong/Smooth TypesCrisp/Strong/Smooth Types

Page 11: Adobe Photoshop: Overview

LayersLayers

All images in Photoshop are produced in All images in Photoshop are produced in layers.layers.Starting with the background layer, you Starting with the background layer, you can add or delete as many layers as you can add or delete as many layers as you need to.need to.Layers can be combined.Layers can be combined.

Page 12: Adobe Photoshop: Overview

Layers (Continued)Layers (Continued)

All layers contain:All layers contain: Opacity (Transparency) ValueOpacity (Transparency) Value Layer Mode (Examples: Normal, Overlay, Layer Mode (Examples: Normal, Overlay,

Color Burn, Color Dodge)Color Burn, Color Dodge)

Page 13: Adobe Photoshop: Overview

Selection ToolsSelection Tools

Used to select certain parts of a layer Used to select certain parts of a layer (Example: Someone’s head or a particular (Example: Someone’s head or a particular building in a photo) and modify it.building in a photo) and modify it.Marquee ToolMarquee Tool RectangleRectangle OvalOval Row of PixelsRow of Pixels Column of PixelsColumn of Pixels

Page 14: Adobe Photoshop: Overview

Selection Tools (Continued)Selection Tools (Continued)

You usually want to select a more You usually want to select a more complicated shape than that, so…complicated shape than that, so… You can add or subtract from certain areas of You can add or subtract from certain areas of

the selection.the selection. For example, to add, simply hold down shift For example, to add, simply hold down shift

and make another selection.and make another selection. To subtract, simply hold down ALT and make To subtract, simply hold down ALT and make

another selection.another selection.

Page 15: Adobe Photoshop: Overview

Selection Tools (Continued)Selection Tools (Continued)

LassoLasso Allows you to make the selection by manually Allows you to make the selection by manually

drawing it out with a pencil tool.drawing it out with a pencil tool.

Page 16: Adobe Photoshop: Overview

Selection Tools (Continued)Selection Tools (Continued)

Magic WandMagic Wand Select all of the same-color or similarly-Select all of the same-color or similarly-

colored adjacent pixels.colored adjacent pixels. Tolerance LevelTolerance Level

Page 17: Adobe Photoshop: Overview

Example TexturesExample Textures

Page 18: Adobe Photoshop: Overview

Example Tutorial: ChromeExample Tutorial: Chrome

From: From: http://www.nk-graphix.com/index.php?paghttp://www.nk-graphix.com/index.php?page=chrome=chrom

Step 1: Start with a blank white canvas.Step 1: Start with a blank white canvas.Step 2: Select the ellipse tool. Turn on the Step 2: Select the ellipse tool. Turn on the Draw Circle option under the ellipse Draw Circle option under the ellipse options.options.

Page 19: Adobe Photoshop: Overview

Chrome TutorialChrome Tutorial

Apply a gradient overlay by going to layer Apply a gradient overlay by going to layer styles and then “Gradient Overlay”. Apply styles and then “Gradient Overlay”. Apply the following settings:the following settings: Fill Method: NormalFill Method: Normal

OpacityOpacity:: 100% 100%Gradient ColorsGradient Colors:: 1. #999999 | 2. #424242 | 3. 1. #999999 | 2. #424242 | 3. #999999#999999StyleStyle:: Linear LinearAngleAngle:: 90° 90°

Page 20: Adobe Photoshop: Overview

Chrome TutorialChrome Tutorial

Should look like this:Should look like this:

Step 3: Apply a smooth, black outer glow (also Step 3: Apply a smooth, black outer glow (also under Layer Options). Then apply the following under Layer Options). Then apply the following settings for an inner glow:settings for an inner glow:

Page 21: Adobe Photoshop: Overview

Chrome TutorialChrome Tutorial

Settings:Settings: Fill Method: NormalFill Method: Normal Opacity: 30%Opacity: 30% Noise: 0%Noise: 0% Color: BlackColor: Black Technique: SofterTechnique: Softer Source: EdgeSource: Edge Choke: 0%Choke: 0% Size: 10pxSize: 10px

Page 22: Adobe Photoshop: Overview

Chrome TutorialChrome Tutorial

Should look like this at this point:Should look like this at this point:

Step 4: Now apply the following Bevel & Step 4: Now apply the following Bevel & Emboss settings (also under Layer Options):Emboss settings (also under Layer Options):

Page 23: Adobe Photoshop: Overview

Chrome TutorialChrome Tutorial

Settings:Settings: Style: Inner Bevel, Technique: Smooth, Style: Inner Bevel, Technique: Smooth,

Depth: 461, Direction: Down, Size: 13, Depth: 461, Direction: Down, Size: 13, Smooth: 0, Angle: 90°, Altitude: 55, Global Smooth: 0, Angle: 90°, Altitude: 55, Global Light: Off, Highlight Mode: Color Dodge, Light: Off, Highlight Mode: Color Dodge, Color: White, Opacity: 0%, Shadow Mode: Color: White, Opacity: 0%, Shadow Mode: Color Dodge, Color: #696969, Opacity: 56% Color Dodge, Color: #696969, Opacity: 56%

Page 24: Adobe Photoshop: Overview

Chrome TutorialChrome Tutorial

Should look like:Should look like:

Step 5: Use the following “Satan” settings (also Step 5: Use the following “Satan” settings (also under Layer Options):under Layer Options):

Page 25: Adobe Photoshop: Overview

Chrome TutorialChrome Tutorial

Settings:Settings: Fill Method: Color DodgeFill Method: Color Dodge Color: WhiteColor: White Opacity: 35%Opacity: 35% Angle: 144°Angle: 144° Distance: 44pxDistance: 44px Size: 40pxSize: 40px Smooth: OffSmooth: Off Invert: OnInvert: On

Page 26: Adobe Photoshop: Overview

Chrome TutorialChrome Tutorial

Will eventually look like this after finishing Will eventually look like this after finishing touches:touches:

Page 27: Adobe Photoshop: Overview

Sources/Other TutorialsSources/Other Tutorials

http://www.good-tutorials.com/http://www.good-tutorials.com/http://www.absolutecross.com/tutorials/phhttp://www.absolutecross.com/tutorials/photoshop/otoshop/http://www.phong.com/tutorials/http://www.phong.com/tutorials/http://www.photoshopcafe.com/tutorials.hthttp://www.photoshopcafe.com/tutorials.htmmhttp://www.nk-graphix.com/index.php?paghttp://www.nk-graphix.com/index.php?pagee==chromchrom