Adobe Photoshop Tutorials

I use Adobe Photoshop 6.0 & 7.0 for all my web design work.

If you have Adobe Photoshop, open it up and follow along with one of these tutorials.

If you're new to Adobe Photoshop, head to the basic tutorials at the bottom of the page.

Help me out, by putting a link to Pegaweb Web Design & Photoshop Tutorials on your site. This site relies on links, so if you can put up a link, please do. :)

 

Advanced Photoshop Tutorials

	Table Top Create a website that looks like a desk. Complete with stained wood, note paper, and some pencils strewn around.
	Foliage I've used leaves, flowers, vines, and other natural elements in my designs and templates for some time now. This tutorial goes through the steps of creating some basic natural elements as the basis for a web page layout.
	Atlantis By using the Ocean Ripple filter, and the Bevel option, this tutorial creates a website whose buttons are islands that sink beneath the waves.
	Creating a website with an Aurora effect This tutorial goes through the steps to creating a website featuring a beautiful skyline above a grassy field. (This tutorial requires Photoshop CS, 7.0 or 6.0.)
	Wedding Invitation This tutorial shows how to create a scorched parchment texture, for a website or wedding invitation. Topics included are: Using the Wave, Noise, Clouds, and Twirl filters, and changing Layer Modes.
	Roll Over Beethoven This tutorial demonstrates how to use Nudge and Inner Shadow to give a button that pressed-down look while the mouse cursor is over it.
	"Splat" Website Tutorial By using a few gradients, and applying the Wave filter, it's possible to make this simple website layout. (This tutorial requires Photoshop CS, 7.0 or 6.0.)
	Glitter Swirls Using a dotty brush, a rainbow gradient, and lots of distortion, this tutorial goes through the steps to creating a swirly, glittery website layout. Part 1 - Part 2
	Sunlight Web Design Tutorial By using some Clouds, Noise, a few adjustment layers, and some ornaments, this tutorial demonstrates how to create a website with a very nice, sparkling, sepia effect. (This tutorial requires Photoshop CS, 7.0 or 6.0.) Part 1 - Part 2
	The Slime Factory Website Tutorial Follow along with the steps I took to create the website for the "Slime Factory". This website mixes metallic textures with gelatinous substances, and explores lighting concepts not covered in any of my other Photoshop tutorials. (This tutorial requires Photoshop CS, 7.0 or 6.0.) Part 1 - Part 2
	Duotone Web Page Menu Tutorial This tutorial goes through the steps of making a simple, two-colour menu for a website in Photoshop, and shows how to turn it into a web page in your web editor.
	Tigerskin Web Design Tutorial This tutorial demonstrates goes through all the steps of how to make a website with a realistic tiger skin texture in Photoshop. The topics covered include how to make the black stripes, textured fur, and header text.
	"A Touch of Class" Complete Web Design Tutorial If you'd like to design a site that's a bit more elegant than the standard business web design style, follow along with this tutorial, and make a nice, rustic, gold-embossed website. Part 1 - Part 2
	Simple Web Design A lot of websites look unprofessional because the designer has tried too hard to make the graphics look good, without knowing what they're doing. If they just hadn't tried as hard, the site would have looked a whole lot better.
	How to make Metallic Buttons and Menus This tutorial shows how to use Gradient Overlays and the Gloss Contour option to change your buttons and menus from play-dough to realistic silver and gold. (This tutorial requires Photoshop CS, 7.0 or 6.0.)
	Modern Style Web Design Welcome to a world of sans-serif fonts, monocoloured areas, objects that don't cast shadows, colours that don't contrast, and text saved as picture files. This style of web design has become the standard these days. It presents web pages not as realistic images, but as neat diagrams.
	Create a graphical web page header in Adobe Photoshop The most important graphical element of any website is its header image. It's the image that will be seen more than any other on your web site, so it's important to get it looking good. Part 1 - Part 2 - Part 3
	Six font styles that make text stand out It's easy to choose a font style that stands out when your text is on a monotone background. However, when the background is multi-coloured, it becomes much harder to find a font style that will be easily readable.
	Design your own Company Logo Having your company logo design done by a professional can be an expensive process. Hopefully this tutorial will give you some ideas on creating your company logo yourself.
	Making a tiled web page background With many web page backgrounds, the tiling is very visible. This tutorial shows how to use the Shear tool to create a seamless web page background.
	How to make web buttons Most web buttons are flat and lifeless. This web button tutorial demonstrates how to make a nice rounded web button, and goes through the various layers of the web button, including the bevelling of the web button, and adding a light layer to the web button. Part 1 - Part 2
	Creating a Realistic Wood Texture Ever used the wood texture in Adobe Photoshop? Here's how to use the gradient tool to make a wood texture that looks a whole lot better than Photoshop's sawmill wood texture. (Wood texture requires Adobe Photoshop 6.0 or higher for Noise Gradient feature.)
	Creating a Random Lighting Layer In Adobe Photoshop, a layer of realistic lighting is all that separates realism from flat colour. This tutorial uses Adobe Photoshop's Noise Gradient feature to create a layer of "canopy lighting". (This tutorial requires Photoshop CS, 7.0 or 6.0.)
	How to separate an image from its background Put that Magic Wand Tool away! This tutorial shows how to separate an image from its background by using the Freeform Pen tool in Adobe Photoshop.
	Difference Nebulae Create a realistic-looking red and blue nebula, using the Clouds filter, and a Difference layer. These nebulae make great desktop backgrounds, so I've made one available for download (in case you stuff yours up, don't have Adobe Photoshop, or are just here to look at the pretty pictures) :)
	"The Piglet Factory" Website Tutorial This Adobe Photoshop tutorial goes through the steps to making a professional-looking website. This tutorial shows the steps I took to make a website for the fictitious (I hope) :) Piglet Factory.
	Displacement This Adobe Photoshop tutorial shows how to use a displacement map to warp an image, and to cast light on the image in the right places. This process can be used to create ribbons, curtains, banners, or anything else that bends or waves.
	Graphical Watermarks This Adobe Photoshop tutorial shows how to make a complex watermark (in this case a Sun), to help break up an area of monotone colour. Unless you plan to use nothing but photographs in your web pages and documents, the ability to create complex watermarks is essential.
	Five-Minute Website Tutorial This tutorial (the first of my Photoshop tutorials to be written) demonstrates how to make a basic left-oriented website. Includes information on watermarks, textures, gradients, backgrounds, and colour schemes for your website.

 

Beginner Photoshop Tutorials

	Beginners' Guide to Adobe Photoshop Ever wanted to learn how to use Adobe Photoshop, but had no idea where to start? This set of basic Photoshop tutorials gives you the most basic features you need to know to start using Adobe Photoshop. From there, you'll quickly discover most of Photoshop's other features. Part 1 - Part 2 - Part 3 - Part 4
	Watermarks Tutorial Watermarks are areas that are lighter or darker than the surrounding area. This tutorial demonstrates how to make a nice watermark in Adobe Photoshop, without having to construct the watermark shape yourself, by consorting with the Sacred Order of Wingdings.
	Basic Fonts & Text This Adobe Photoshop tutorial gives some demonstrations of what fonts and colours to use for the body text of your web pages. This tutorial also explains what Serif and Sans Serif fonts are, and how to use them in Photoshop to make clear text when it's part of an image.