Web Techniques

Simulate professional studio backdrops for your products with ease by following these few steps. To begin, lets use an product image sample (captured below) of a leather chair courtesy of AbsolutVision Photo Gallery. Click image to download starter file. AbsolutVision photos come complete with path outlines, so

Here is a simple way to create small flash ticker animation. Download the base (zipped) .psd file to get started with this tutorial. Once downloaded and unzipped, open the ticker.psd file in Photoshop and observe the contents as I have captured in the layers palette screen shot

Picking up from the previous lesson (II), I’ll show you how to tie in this nifty flash animation with multiple links without having to resort to slices. The key to adding multiple links without slices to a flash animation is to use Image Maps. Note: Output to

Picking up from the previous lesson, I added more vector components and more transition tween’s to beef up this animation. As noted in the previous lesson, the premise of creating these animations as compact as possible relies solely on Vector shapes within Photoshop or ImageReady. These include

Here are a few ways to create rounded/cornered graphic panels in Photoshop. Rounded Rectangle Tool (U)The easiest method is found in the ‘Rounded Rectangle Tool (U)’ on the Toolbar. Set your desired Foreground Color. Option One Activate the Rounded Rectangle Tool (U) Go to the Options Bar

Here is a great way to create compact animations exported as Flash files via ImageReady CS. The premise of creating these animations as compact as possible relies solely on Vector shapes within Photoshop or ImageReady. These include Text Layers and Shape Layers (with Vector Mask). Ultimately, the

Here’s how to do image rollovers as quite common with menu items created in Photoshop and then completed in ImageReady for final output. I’ll begin with four simple Rectangular shapes as the buttons background layer, and four Text items as the buttons caption. Start by choosing a

Here’s a useful web design element tutorial on how to create and reuse the ‘Info Panels’ you see throughout my site. (ie, as in the below example) The great thing about this is, when sliced properly and with the right html code manipulation, I can reuse them

Here is a few simple things to watch out for when using ‘Slices’ for your web designs/layouts. Click here to Preview the Mock Layout. Organization and Naming Conventions The above is an example of a single page layout. Iv’e got all my layers organized into Folders for