Photoshop & Illustrator

19 Sources for Free Photoshop Tutorials

By Ecommerce Developer (Sig Ueland) on Tuesday, August 2, 2011

Thumbnail_thumb

If you're a designer, or if you have anything to do with websites, at some point you'll likely need to use Abode Photoshop. Using the professional standard can be intimidating. Fortunately, if you're looking for help, there's plenty of it.

Here is a list of free Photoshop tutorial sites, for beginners and advanced users. Some of these sites provide episodic tutorials to teach a progression of skills.

Read More (external site)

Design By Grid in Photoshop or Illustrator

By Ecommerce Developer (Drew Coffin) on Monday, April 11, 2011

Grid-no-word_thumb

Having some sort of order or grid when designing can make design elements easier to work with and improve your design flow. A great way to add order to your design process is with grids.

In this video tutorial, I will walk you through the basics of using grid lines in both Adobe Photoshop and Illustrator CS4.

To begin, I’ll show you how to use grids in Adobe Illustrator.

Read More (external site)

Saving Multiple Images from a Single Photoshop Document

By Ecommerce Developer (Drew Coffin) on Tuesday, April 5, 2011

Picture_9_thumb

Saving multiple images can be a hassle, especially if each image needs to be a separate file type and all the images are nested inside a single document.

In this video tutorial, I will show you how to use the slice tool to save multiple images from a single Photoshop CS4 document.

For this video, I will be using scanned doodles drawn on lined paper as my sample image.

Read More (external site)

Manipulate and Recreate Colors in Adobe Photoshop

By Ecommerce Developer (Drew Coffin) on Tuesday, February 22, 2011

Ecd-drew-137_thumb

Color plays a critical role in design, and good designers should know how to manipulate or even recreate color.

In this video tutorial, I will show you how to recolor a black and white image in Adobe Photoshop CS4.

I will be using a stock image of a jungle waterfall for this tutorial.

Read More (external site)

Halftone Illustrations Add Drama, Simplicity

By Ecommerce Developer (Drew Coffin) on Thursday, February 17, 2011

Ecd-drew-136_thumb

Halftone images are a great way to add flare to an illustration without using gradients and can lead to a simpler design.

In this video tutorial, I will show you how to create a one-color halftone effect using Adobe Illustrator CS4.

To begin, I will show you the halftone effect you will be creating and explain how this halftone effect, while simple to create, doesn’t produce perfect circles.

Read More (external site)

Isolate Specific Color Ranges in Photoshop

By Ecommerce Developer (Drew Coffin) on Wednesday, February 9, 2011

Ecd-drew-135_thumb

Breaking an image down to just a few colors can be a nice stylistic effect or a great first step for vector conversion.

In this video tutorial, I will show you some unique selection techniques that will allow you to isolate specific colors in an image using Adobe Photoshop CS4.

I will be using a stock photograph of a mountain to demonstrate the techniques.

Read More (external site)

Making Simple Designs Seem Complex: Concentric Circles

By Ecommerce Developer (Drew Coffin) on Friday, February 4, 2011

Ecd-drew-134_thumb

Designs are often much simpler than they appear and it only takes a little effort to recreate seemingly complex designs.

In this video tutorial, I will show you how to create several concentric circles that can be used to develop design elements in Adobe Illustrator CS4.

To begin, I will show you some examples of what can be created simply using a series of concentric circles.

Read More (external site)

Use Texture to Transform Vector Design

By Ecommerce Developer (Drew Coffin) on Thursday, January 27, 2011

Ecd-drew-132_thumb

Simple vector designs often appear flat and boring. By simply adding a texture, these designs can quickly go from boring to beautiful.

In this video tutorial, I will show you how to spice up your vector designs using textures in Adobe Illustrator CS4.

To begin, I will give you an overview of the effect and how it can be easily used to add depth to otherwise bland vector shapes.

Read More (external site)

How to Add Depth to Your Site Design

By Ecommerce Developer (Drew Coffin) on Tuesday, January 25, 2011

Ecd-drew-131_thumb

Adding depth to an image or design can be a great way to transform your site into a three-dimensional landscape.

In this video tutorial, I will show you how to create a paper-style header or menu that will add depth to your site.

To begin, I will show you how to set up a background color that will be used to create the paper slit effect.

With the background set up, I will show you how to create a

Read More (external site)

Develop Custom Icon Sets

By Ecommerce Developer (Drew Coffin) on Friday, January 21, 2011

Ecd-drew-130_thumb

Consistent and well-designed icons can run like a connecting thread through a site design.

Read More (external site)

Learn By Imitating the McDonald's Navigation Menu

By Ecommerce Developer (Drew Coffin) on Tuesday, January 18, 2011

Ecd-drew-129_thumb

Sometimes the best way to learn how to do something — like a particular technique — is to imitate an existing design pixel by pixel.

In this video tutorial, I will teach you pixel perfect design by recreating the McDonalds.com navigation menu.

To begin, I will show you how to set up a rounded rectangle with a red gradient to act as the body of the navigation menu.

Read More (external site)

Create Detailed 'Wavy' Elements in Photoshop and Illustrator

By Ecommerce Developer (Drew Coffin) on Thursday, January 13, 2011

Ecd-drew-128_thumb

It’s always the little element details that make a design great as a whole, and being able to create a variety of these elements will lead to greater overall design.

In this video tutorial, I will show you how to work in both Adobe Photoshop and Adobe Illustrator to create wavy design elements.

To begin, I will show you how to blend paths together in Illustrator.

Read More (external site)

Quick Tips & Shortcuts: Text Wraps and Masks in Adobe Illustrator

By Ecommerce Developer (Drew Coffin) on Tuesday, January 11, 2011

Ecd-illustrator-logo_thumb

Text is and always has been an important aspect of design.

In this quick tips and shortcuts video tutorial, I will show you some handy ways to wrap and mask with text in Adobe Illustrator CS4.

To begin, I will show you how to create a simple text wrap. Text wraps are useful for including images in bodies of text or for positioning text around complex designs.

Read More (external site)

How to Use Clipping Masks in Adobe Photoshop

By Ecommerce Developer (Drew Coffin) on Friday, January 7, 2011

Ecd-drew-126_thumb

Sometimes we discover nifty features in programs that make designing simpler and much more efficient. Adobe Photoshop’s clipping mask is one such feature.

In this video tutorial, I will show you how to use clipping masks in Adobe Photoshop CS4.

To begin, I’ll show you the most basic way to use a clipping mask and demonstrate it on both a raster layer and a vector Photoshop shape.

Read More (external site)

Working Across Adobe Photoshop and Illustrator

By Ecommerce Developer (Drew Coffin) on Tuesday, January 4, 2011

Ecd-adobe-logo_thumb

Design projects often require the use of more than one image-editing program, whether you’re working with raster or vector images or dealing with a simple mockup versus advanced effects.

Read More (external site)

Mimic Dripping in Fat's Awesome T-Shirt Effect

By Ecommerce Developer (Drew Coffin) on Thursday, December 30, 2010

Ecd-drew-123_thumb

The ability to see and recreate a design is a good skill for any designer to have and practicing this skill will help you grow as a designer.

In this video tutorial, I will be recreating the dripping shirt effect seen in the content slider for Dripping In Fat, using Adobe Photoshop CS4.

Read More (external site)

Spice Up Logos with Unique Embossing Effects

By Ecommerce Developer (Drew Coffin) on Tuesday, December 28, 2010

Ecd-drew-121_thumb

Embossing effects can spice up typography or give your logo a fresh look.

In this video tutorial, I will show you an embossing technique that creates the appearance of a glowing canyon.

To begin, I will show you how to set up a dark background with a simple radial gradient to help offset your final design.

Read More (external site)

Create Silhouettes from Photos in Adobe Illustrator

By Ecommerce Developer (Drew Coffin) on Thursday, December 23, 2010

Ecd-drew-120_thumb

Silhouetting is a popular design technique that allows you to render a complex image in a minimalist fashion.

In this video tutorial, I will show you how to create a silhouette from a photograph in Adobe Illustrator CS4.

For this tutorial, I will be using a stock image of a shoe.

Read More (external site)

'Burn,' 'Dodge,' and 'Sponge' Tools in Photoshop

By Ecommerce Developer (Drew Coffin) on Tuesday, December 21, 2010

Ecd-drew-119_thumb

Good photography is important when it comes to ecommerce design and sometimes the simplest tools to manipulate those photos can make all the difference.

In this video tutorial I will show you how to use the "Burn," "Dodge," and "Sponge" tools in Adobe Photoshop CS4.

Controlling the size and hardness of these tools should be very familiar, as it is the same for the Brush, Eraser, and Clone Stamp tools

Read More (external site)

Simulate High Dynamic Range Photography

By Ecommerce Developer (Drew Coffin) on Thursday, December 16, 2010

Ecd-drew-118_thumb

With the growth of web photography also comes a growth of photo effects.

Read More (external site)

Make a Seamless, Repeating Background Image

By Ecommerce Developer (Drew Coffin) on Tuesday, December 14, 2010

Ecd-drew-117_thumb

Web designers increasingly use large photographs as parts of their sites.

Read More (external site)

Create a 'Storage Jar' Illustration, Part Two

By Ecommerce Developer (Drew Coffin) on Wednesday, December 8, 2010

Ecd-drew-114_thumb

Last week, we published "Create a ‘Storage Jar’ Illustration, Part 1," our Adobe Illustrator tutorial that dealt with some transparency techniques for advanced illustration.

Read More (external site)

Create a CD Icon in Illustrator

By Ecommerce Developer (Drew Coffin) on Tuesday, December 7, 2010

Ecd-drew-115_thumb

Visual communication can be the difference between conveying a message or getting lost in the crowd. One effective way to communicate visually is through icons.

In this video tutorial, I will show you how to create a compact disc icon in Adobe Illustrator CS4.

To begin, I will show you how to set up the base for the CD icon using two ellipse shapes.

Read More (external site)

Create a ‘Storage Jar’ Illustration, Part One

By Ecommerce Developer (Drew Coffin) on Friday, December 3, 2010

Ecd-drew-114_thumb

New illustration techniques will teach you new ways to look at design problems and help you improve as an artist.

In this video tutorial, I will show you how to create a glass jar in Adobe Illustrator CS4 that can be used to “store” other graphics.

This tutorial requires either Adobe Illustrator CS4 or CS5, as older versions do not have transparency controls, which are crucial to this design, built

Read More (external site)

Manipulate Light in Photoshop

By Ecommerce Developer (Drew Coffin) on Wednesday, December 1, 2010

Ecd-drew-113_thumb

Photoshop has many powerful effects that can be used to turn bland design elements into eye-popping works of art.

In this video tutorial, I will demonstrate a simple lighting effect that yields powerful results in Adobe Photoshop CS4.

To begin, I will show you how to set up a background for the document. This particular lighting effect works best on colorful backgrounds.

Read More (external site)