10:32:00 PM
This is the beginning of a continuous series of website building tutorials. This particular tutorial is a great beginner tutorial of what you can start to build with little to no experience with Adobe Dreamweaver and a graphics editing program like Adobe Fireworks or Adobe Photoshop. With these two programs under your belt you can create a wide array of websites to suite your particular tastes. I hope to make this first level tutorial easy enough for beginners to experiment with the program and implement my design into something they would like to make. From there you can make little changes and the next thing you know you will have a totally different looking website made for you by you. So with no further interruptions, let’s begin the tutorial.
The first thing you should do is open up the Adobe Dreamweaver CS3 program. You will see a screen that is similar to the one below.
Now we will start with the development of a Cascading Style Sheet (CSS). CSS is a great language that helps you dynamically create the architecture of a website and integrate web programming like HTML, ASP, PHP, etc to make it complete. You will find that this language will make organization and changing the way your website looks much easier. I personally use it because I can go back into the code and easily see where I need to change things and where I made errors. Using tables and such made the webpage files cumbersome.
After you select the CSS template you will see the default CSS screen.
The first set of information within the CSS document is the configuration for the body of the webpage. The body is the same thing as the <> tag you see in all HTML web pages. In the following illustration, we will add the color, margin, padding, height, and background. The color reference actually refers to the color of the text. The margin is the distance of an area from the outside borders. The padding is the distance of content from the edge of the margin of an area. Padding is like the Styrofoam that is between the box and the package it holds. The background-image reference allows you to add a background of your choosing if you would like it. I choose to use just the default white background.
The next section goes over the header styles. The styles will control how your headers look and feel within your webpage. I have made my headers from H1 to H3. As you can see from the illustration below, I control the font, color, margin, and padding. Within the font you can control whether it is bold, italics, or underlined, the size by point or percentage and the type of font you want to use. The rest of it is just like any other reference for web programming.
If you look at the bottom of the illustration you will see that I added a reference for “p”. This is for the paragraph. I use this if I want to use a different text size than the body text is using. I wouldn’t suggest doing this but sometimes you will find it useful.
Now we will start the previously hard task of making the Layout of your website. Instead we are using CSS and things will be much easier and organized. We will be using things called divisions. Divisions are used to reference the data in the CSS file and correlate it to the html file. This way the HTML file knows what to make on the webpage without having to write all that code on the HTML file. The first we will make is the header division. This will hold the graphic that will display the name of the website for all to see. The position: absolute tag lets the HTML know that this area cannot be manipulated. Top and left show you where you want your content to start from the edge of the higher level division which will be the body tag. The width and height are pretty self-explanatory. We already discussed the background-image tag.
The next division is the body reference tag. This will cover the rest of the area of the webpage below the header. We will have to add the 2 link references and the middle body reference. Those will all reside within the body reference. It can basically be summed up as a pyramid structure of accessibility. This is not totally needed but it helps me organize things better. The position is set to “position: relative”. This makes it adhere to the proportions of content that is written within it. This will come into play once we have a large amount of content in the website that goes below the screen. This works fine in absolute mode as well, but the difference is if you have a division tag that you want to stay at the bottom of the page you will have to make this relative if your webpage is larger than the size of your screen. With a relatively small website, I would try to keep everything at one size and just make extra pages, but had to use these with my expansive tutorials. Nobody wants to click a million links.
This division section is the main body reference. This will be the middle of your content that will hold all the data that you want to add to the webpage. For instance, you could do it like my website and add tutorials and written content. This position tag must also be set to relative because it will be under the division tag that will have the content going past the traditional page size.
Now we can see our first division tag for links, which is the navigation reference. This position is absolute because it will be a predefined area that will not reach farther than the main body reference. Within this section you will be adding links that will enable it to navigate through your website.
The next division tag is the second links division tag, which is the advertisement reference. This section will hold all your ads just like mine holds stuff for Google and programs such as Adobe Dreamweaver, Flash, Fireworks, Illustrator, Indesign, and Photoshop. Maybe in this tutorial I should have added advertisements for build a website, create a website, make your own website, or internet website design. That would help you find this information easier. Oh look, I just did it!
The last division tag is the information reference. This is the one reason why we had to make the division tag for the body reference and make the position set to relative for the content sections. It is just a little strip that goes at the bottom of the screen that helps you know who owns the website and when it was developed. Also you can add links to the bottom so when you have a long webpage the user can easily navigate to another page without scrolling up.
Now we will go to the top of the screen and select (File/New).
Then will navigate and select HTML. On the right you will see that they have happily added layouts predefined for you in Adobe Dreamweaver CS3. These are the old ways of added layouts to your web pages that made them bulky and hard to navigate through. Our new way is clean and thorough. Plus you will learn what is really happening in a website!
Now you can see the new HTML webpage with the default tags already in place for you.
This page of Adobe Dreamweaver CS3 allows you to see a split between code and design. As you can see from the illustration below, I have used the title tag to make a name for my website. This name will be displayed on the top part of the web browser I am using. For this website, I have chosen the name “My Website” since this is a tutorial for my visitors.
Now we will input the code we will use to call the CSS document that controls the layout.
Now we will make our first division visible within the HTML. It is quite easy to do. In the illustration below you can see how easy it is to add them. The first one that is added is the header division.
Below, you can see how we originally made the CSS to display the format in the HTML. We will also use the “background-image” tag to select our header image.
When we go back to the HTML page we can see what the header image looks like when it is being structured by CSS credentials.
Now we can add the body division. You will remember that this division will have lower levels below it. So you will want to do it like you would other coding programs.
Now we will add the division tag for the navigation reference within the division tag for the body reference. This will make the credentials for the navigation reference only work within the boundaries of the body reference.
Now we will add the “background-image” to this portion of the webpage using the CSS document. This is done just like the header.
In the illustration below, you can see that Adobe Dreamweaver CS3 shows only the top part of the navigation image. This is because there is no data cover the other area image. When you put a background image in using CSS it will have the tendency to not show in the HTML if there is not some kind of data covering the amount of area the background uses.
If you put a few break tags <> within the division tag content area you will notice that more of the image becomes viewable.
Now we will add the division tag for the main body reference. This is also within the division tag for the body reference.
You can now proceed to put the background image in the main body reference tag.
You can see that the main body reference is the doing the same thing the navigation reference was doing before you added some content or paragraph structure within it.
When we add a few break tags <> within the content area of the main body reference, we can see that it become more visible as well. You can do your spacing for writing your content on the page by adjusting it like this as well.
You can add the division tag for the advertisements reference within division tag for the body reference now.
You can add the image for the advertisements reference just like the others now.
We have added a few <> tags just to even things off across the board. Of course we can’t just keep it looking like this though. We will have to make some adjustments later.
Now we will add the last division tag for the information reference. This tag can be a pain in the butt for Adobe Dreamweaver CS3 because there is not enough room in the screen to show all the data and that it can only go as far as the data within the body reference. That means it will be floating on the screen until you add some data that takes it below the bottom of your images in the body reference.
You will see that the information reference doesn’t have anything special too it. It is just a skinny division tag at the bottom of your website that will hold a variety of information for the user. The only bad part about using this kind of tag is that it must be at the bottom of the page at all times. This has caused me many headaches on web pages that don’t have much information. To remedy that I would move the division tag for information below the division tag for body reference. You can see how this looks if you go to one of my web pages called ( Contact Us.
Here you can see what the information reference will look like if you don’t move the division tag outside of the division tag for the body reference. Of course that is remedied if you add some content to your webpage that goes beyond the border. If you move the information division tag and then push your content beyond the border your information bar will remain in that spot till you move it back into the division tag for the body reference.
Here is a view of the website in a web browser.
Now we will add a nice paragraph of information with the division tag for the main body reference. Now you will how if an image is not big enough it will be repeated over and over again. Of course there is a remedy for this problem. You only write enough information to fill the image or you could change the image so below the actual image there is empty space.
Now we will add a bunch of links to the division tag for the navigation reference. Now isn’t this starting to look cool.
Now we will add some advertisements to the right side of the webpage within the division tag for the advertisements reference. I have used some captions of the Adobe Creative Suite products.
If you want to see what the rest of the screen looks like after you have made a large amount of empty space below your images that are within the division tag for the body reference, please look at the illustration below. You can see that it is nice and smooth and the text within the main body reference has been centered by using the <> tag, which is a very useful feature.
Here is a screenshot of the web browser showing the website with these changes. Now you can see unlike in the Adobe Dreamweaver CS3 program that the information reference image is now at the bottom of the webpage because of the amount of content that is in the main body reference. These additions were done by adding
tags but you can use any kind of content to accomplish this feat.
Now we will copy that one piece of text over and over again to show you just how that would look in real life. This is easily done in the HTML as you can see from the illustration below.
Now you can see that the webpage is now stretched outside of its boundaries and the information reference image is still at the bottom of the webpage.
Now we can go back into Adobe Dreamweaver CS3 and add some information to the information reference. I basically just did what was already on my website. It is always good to have the year that the company started and then make a text link to your homepage. The user will always be angry if they have to scroll all the way back up to the top of the page to reach the links. In thought of that, I have added the entire navigation link section to the information reference on my website. You can add things to the information bar however you wish.
Now you can see how the website is done after we have added some simple things to it. As for the link images on the left and right, you can show the rest of those by adding more information to them in the form of text or paragraph structure tags like
.
During this tutorial, you were shown how to use CSS to your advantage to decrease the amount of coding necessary within HTML. You were also shown how to implement some of the many features that CSS has available for web development. I hope that this has given you a brief review that will help you begin or continue to grow in your website development. I have kept this tutorial short to not make any of you fall asleep for too long. Adobe Dreamweaver CS3 is a very good application to use if you take the time to learn the ins and outs. All of the Adobe products have usefulness to them in some kind of situation.
I will be updating this tutorial to better suit my audience over time. Your replies are appreciated and will help me better implement my tutorials. In a short period of time I will begin working on an even more thorough explanation of using CSS and HTML. I will begin to add the uses of Javascript and Flash into the tutorial as well. This will be provided for free as always. Stay tuned for updates on the homepage. I will announce the completion of this project when it is complete.
Some of you may be looking for even further guidance or special programs that will help you through every step of the process. I would love to be there standing behind you pointing to everything you need to do, but that is just not feasible….. yet! Below, you can find a couple programs that I highly recommended. I believe even a couple of them may be using Adobe Indesign to supplement their training videos. I know your question already. If I had to pick one to teach me from step A to step Z, which one would I choose? That choice would be “Total Training”. They are the certified partner of Adobe and have solid training for Adobe. If you want to go from a beginner to an Adobe expert this would be the software. However, if you would just like to get a good hold on Adobe Software then the others would do just fine. Have fun learning as I always have!
Dreamweaver CS3 Online Training from Total TrainingTotal Training provides customers with a Video Training Series that is promoted by a Partnership with Adobe Systems (Worldwide). You can't go wrong with the incredible series of DVD software that this company provides. Total Training provides a one of a kind offer to let you try all of their online products for 2 days with a special guest pass. You will be on your way to being an Adobe expert in no time!
ReadMore...
10:23:00 PM
I thought I’d outline my process of creating ‘clay’ images for showing WIP (Work In Progress) in forums or blogs. Clays are used because they show the model in a basic form which tends to show lumps and bumps which could otherwise be covered up by texturing or shaders. It also allows your peers to criticise your work easily which will help you develop your models faster and to a better standard. Its really useful to post wire frames too but this is often where people become unstuck. This tutorial tackles clay & wireframe renders in Mental Ray & 3ds Max - I have used 3ds Max 2008 but it should be transferable to other versions. 2) Change your background colour to white in the Environment and Effects window. 3) To create the clay material for the car I use a composite material. The base material should have a white diffuse colour with no specular highlight. The 2nd material should be black diffuse colour but make sure ‘wire’ is ticked in the “shader basic parameters” section at the top. You can change the size of the wire to suit your renders by experimenting with different values in extender parameters section. Apply this material to your object - in my case a half modelled car. 4) Lighting: Insert a skylight anywhere you wish - a skylight is omni directional so it doesn’t matter where you place it in your scene. The skylight will give you soft lighting and a soft shadow underneath your object. 5) Now onto setting up Mental Ray. Firstly select Mental Ray as your chosen renderer. Secondly enable Final Gather and use the preset Draft. If you have a fast computer then select a higher option if you want but it will slow down your rendering times and after all this is for a Work In Progress image. 6) Choose how you want your image to look! For WIP images I personally believe its important to show your object unsmoothed, so people can critique your wireframe. Once you’ve done this you can then show a smooth version with or without a wireframe. Using this method you can easily render either of these with just a few tweaks to your settings. To render a smooth version with a smooth wireframe you need to tweak your turbo/mesh smooth settings so that isoline display is ticked and then change the amount of iterations to something suitable. Here’s my settings: Now after posting your wires, you might want to just show you car smoothed to show off your shapes, using this method all you need to do is turn off the wire frame layer in the composite material by unticking it. Each type of image has different uses but I normally only use a smooth clay render without a wireframe and a clay render with wireframe without smoothing. These 2 images will demonstrate my model to others fairly well so they can critique my work. As my work develops I will start to add car paint and a studio lighting but I try to refrain from doing this too early as it can be distracting. To get the mixed image at the top of this tutorial all you need to do is blend one smoothed image with a wire image in photoshop. I hope this tutorial was helpful!
1) Create a large plane in the top viewport and assign a standard white material to it. My plane was 100m by 100m large. I have also chosen to use an off white/grey colour instead of white but that is down to personal preference.
ReadMore...
10:11:00 PM
This tutorial will show what you can do to previous Cartoon Landscape tutorial. In this tutorial you will learn to add snow effect using material and also create falling snow using Particle Flow. Because this is cartoon style scene, I also create another type of falling snow. Instead of using ordinary snow shape, I will use snowflake image as particle. As you can see later, this scene will be very interesting to put in cartoon fantasy movie like.
Image below show what you can learn from this tutorial
1.First, you need to download scene used in this tutorial here. Use 3ds Max 8 or up to open. If you interested, you can read how to create this scene in Cartoon Landscape tutorial. Image below shows camera view from this scene.
2. First thing to do: Creating snow material. Open Material Editor. There's a Multi/Sub-Object material applied to the scene. Click 'leaves' material. Then click Standard button and change into Composite material. Click OK to keep 'leaves' material as sub-material. Composite is a type of 'layered' material. In case of snow, you can create snow material on top of base material ('leaves' material).
In Composite Basic Parameters, click None button right next to Mat 1. Choose Standard material. This will be our snow material.
In Blinn Basic Parameters, change Diffuse color to white.
3. Scroll down to Maps rollout. We need to specify how much snow covering the base material. Click None button right next to Opacity. In Material/Map Browser window choose Falloff.
4. In Falloff Parameters rollout, switch color between black and white. Use Falloff type=Towards/Away and Falloff Direction=World Z-Axis. In material preview, you should see white color only appear on top.
5. Scroll down and open Output rollout. Activate Clamp and Enable Color Map. Clamp will make material seems brighter. Meanwhile Color Map controls how much snow covering the base material. After you activate Color Map, move leftmost point in graph to -1. Notice the changes in material preview.
6. Click Go to Parent button to go back to Maps rollout. To make more realistic, click None button right next to Bump and choose Smoke. Use Smoke Size=30.
7. Image below shows rendered result so far
9:43:00 PM
Hi friends,
Today we are getting into animation. Actually if you have a little idea about coordinating different utilities available in 3ds Max, animation is very much easy.
We are going to animate a cute butterfly using wire parameters available in 3ds Max, But first we will model the Butterfly, its very easy let me show you how…
- Create a plane for the butterfly wing and adjust the Pivot point of the plane from Hierarchy> Affect pivot only like I shown below
- We will apply the texture using opacity mapping. I think you will be knowing that
- Mirror your Butterfly wing from Tools>Mirror and create a body for your Butterfly thing using Lathe or any other idea u like (I used lathing)
- Now comes the animation part, Enable the Auto key, change time slider to 10 frame and rotate the left wing slightly downwards
- Now we are going to loop the animation, see the picture below. Enable the Curve Editor from Graph editors> Curve Editor, select all the keys from the Graph, go to Parameter Curve Out-of-range type and enable the two buttons of Ping Pong
- Now you can see the Butterfly fluttering only one wing, we had to create the same animation for the second wing also. Let me show you how… Enable the Parameter Wire Dialogue from Animation>Wire Parameters.
- In the window select the ‘Y’ Rotation Parameter for each Wing you created, you can find it in the Object list available in the left and right panels. And then click the “Arrow” marks in the Middle of the panel and click “Connect”. Wow!!! Your Butterfly is Fluttering its wing… Is that EASY?
Note: if its not working try to use the other two Arrows available there
…HAVE A GREAT DAY…
ReadMore...
9:12:00 PM
Curved boxes are straight forward to do in CSS. Here's a quick tutorial of how to achieve curved boxes in CSS and what's to come in CSS 3.
What we want to achieve
Here's a graphic of the final product - a box with curved edges that will expand if the text is enlarged.
To start with we will make the graphics in Photoshop.
Curved Boxes - Making the Graphics
Open Photoshop and choose the rounded rectangle tool (shortcut of U on the keyboard). Decide on the size and colour of your rectangle and then draw a rectangle. You can make the curve bigger or smaller by changing the size of the radius.
Cut the curve out just below the last pixel of the curve. You can make the bottom curve quickly and easily by going to Image > Rotate Canvas > 180 ยบ CW
The Markup
In order to create a cross-browser friendly box we need to attach the image to HTML elements. This method requires at least two elements inside the div. In this case we use the h2 and p tags and apply a background image to each through the CSS.
<div class="curved-box">
<h2>This is a curved boxh2>
<p>This text will resize and not break the box.p>
div> Applying the CSS
We add the curves through the CSS by accessing the elements and applying a background image. The top one is applied to the h2 and the bottom to the p tag. Make sure the background to the div is the same colour too.
.curved-box
{
width: 298px;
margin: 10px;
background-color: #c3d0d4;
}
.curved-box h2
{
background: #c3d0d4 url(../images/curve_top.png) no-repeat left top;
color: #f4fbfd;
padding: 10px 15px 5px 15px;
}
.curved-box p
{
background: #c3d0d4 url(../images/curve_bottom.png) no-repeat left bottom;
margin: 0px;
padding: 5px 15px 10px 15px;
text-align: left;
} Using this code the text will resize without breaking the box. Have a look at the code in action in the example. Browser support: IE5+, Netscape 6+, Firefox 1+, Safari 1+, Opera 7+, Flock, Camino.
CSS3 will make it even easier
Once CSS3 is finally agreed it will be even easier to curve the edges of boxes. "Border-radius" will curve the corner of the box. For now browser support is not great and indeed browsers have their own proprietary properties:
-webkit-border-radius: 10px; /* Safari prototype */
-moz-border-radius: 10px; /* Gecko browsers */
border-radius: 10px; /* Everything else - limited support at the moment */ Currently supported in Camino 1+, Firefox 1+, NOT IE. The code degrades gracefully so if it is not supported there will be no curves but it will still render. Check out the example to see it in action.
Some of you may be looking for even further guidance or special programs that will help you through every step of the process. I would love to be there standing behind you pointing to everything you need to do, but that is just not feasible….. yet! Below, you can find a couple programs that I highly recommended. I believe even a couple of them may be using Adobe Indesign to supplement their training videos. I know your question already. If I had to pick one to teach me from step A to step Z, which one would I choose? That choice would be “Total Training”. They are the certified partner of Adobe and have solid training for Adobe. If you want to go from a beginner to an Adobe expert this would be the software. However, if you would just like to get a good hold on Adobe Software then the others would do just fine. Have fun learning as I always have!
Dreamweaver CS3 Online Training from Total TrainingTotal Training provides customers with a Video Training Series that is promoted by a Partnership with Adobe Systems (Worldwide). You can't go wrong with the incredible series of DVD software that this company provides. Total Training provides a one of a kind offer to let you try all of their online products for 2 days with a special guest pass. You will be on your way to being an Adobe expert in no time!
If you would like something that is a bit more contemporary, why not settle down and read a good book. This Adobe Dreamweaver CS3 is written by the Adobe Creative Team. It provides great information for learning the ins and outs of the program. If you have the mindset to read attentively, I personally recommend this book.
ReadMore...
9:04:00 PM
I have to admit it crossed my mind. The new Photoshop arrived and I found myself thinking: "Ah, come on, the old bird must be into her twelfth version by now. That's like 125 in dog years, isn't it? Surely after all this time the well has run dry and she has nought but gimmicks and parlor tricks to try to lure me in this time?"
While that may have been how I went in, I'm pleased to report she still has the ability to surprise and please.
Let's take a closer look.
Content Aware Image Resizing
This is a nice story for Adobe. In August, 2007 there was a ripple of excitement through the graphics community when Shai Avidan and Ariel Shamir demonstrated a new mathematical approach to image resizing—dubbed Content Aware Image Resizing (CAIR). Adobe were quick to recognize the opportunity and immediately added Shai to the Photoshop team. However, finding a good idea and integrating it into a Goliath-like Photoshop are quite different things, and many a "gee whiz, ain't that cool" idea has been warehoused when it all became too hard to make it work in the big wide world. Thankfully that hasn't happened with CAIR, and Adobe have shown some commendable adaptability in the smooth integration of CAIR technology into Photoshop CS4.
If you missed the initial talk on CAIR, it's a fascinating concept. Traditional image-scaling methods stretch and compress all parts of the image equally, with scant regard for the image content. As the example below shows, this gives you nasty and very noticeable image distortion in all but the smallest resizes.
CAIR takes a smarter approach. As the name suggests, Content Aware Image Resizing analyzes the content of your image and then limits all image adjustment to the areas of least visual importance.
For instance, in the example below you can see the application is making its biggest changes to the more nondescript parts of the wall and doors, leaving the important compositional elements (Obama, the switches and bins) virtually untouched.
Adobe's implementation of CAIR is very slick. While some early versions relied on the user cutting marks to protect detail, Photoshop CS4 generally gives you a great result by simply switching on the "Protect Skin Tones" option.
In short, this is one of those rare occasions where you have a new feature that has a serious wow factor and is seriously useful from day one. It's a while since I can remember generating a crowd at my desk while demo-ing a new Adobe feature, but CAIR was able to do that. While it's true that some images will lend themselves to CAIR more than others, I think this is genuinely a killer feature for almost any regular Photoshop user.
Adjustment Layers
Adjustments layers are nothing new, but they've become more powerful and easier to control in CS4.
The first thing you'll notice is that they've been given their own dedicated palette, giving you a fast, one-button click method to apply levels, curves, saturations, and color balances, amongst other adjustments. Clicking a button launches a hidden control subpanel for the adjustment, rather than the traditional popup dialog. This felt a bit weird to me. I suspect you adapt to it quickly, but I can't think of another place where they handle the UI this way (the graphic below illustrates this idea).
Now, obviously curves have been around forever, but the way they can be applied here is new and, I think, rather cool—the On-screen Adjustment tool. Let's look at a quick example of it in action.
3 Cool Tricks You Can Only Do In Photoshop CS4
To use the tool, you simply apply a curves adjustment layer and click the small hand button, top left of the Curves palette. As you hover over your image you'll see the eyedropper cursor, which shows you where that part of the image falls on the curve line.
Big deal, right? It's always done that. But try clicking on a specific part of the image you would like to brighten (in the example, the walls) and drag upwards. You'll see those tones immediately lighten and your curve line will reflect that adjustment in real time.
In our example, due to the previous action, the candles have lost some of their brightness. To bring those highlights back, we can target them by simply clicking directly on them and dragging down. Again, the curve reflects your adjustment.
Now, if you're already a whiz with curves, you might not see great appeal in this tool. After all, there are other ways to achieve the same result—as long as you know what you're doing. However, if you're a visual thinker who has perhaps found it difficult to equate what's happening in the graph to what's happening in your image, this is a great connector. Working directly on the image certainly feels more natural to me.
3D Painting
Okay, yes there was 3D in CS3 but let's be honest: it wasn't hugely useful, was it? You jumped out into a separate applet to use a limited set of tools. It was a passable imitation of 3D at best. The new 3D implementation definitely raises the bar significantly.
Firstly, there is no jumping out of the application—all 3D manipulations are performed in the main workspace, side-by-side with the 2D tools. You can open a 3D file directly in Photoshop (U3D, 3DS, OBJ, DAE, and KMZ) or add a 3D layer to an existing project.
Secondly, the new model controls are a big improvement. While the toolbar now contains 3D Rotate, 3D Move and 3D Scale Tools, Adobe have also added a nice 3D Axis tool that overlays your model, allowing you to orientate it without leaving the workspace.
But perhaps most impressive of all is the way Adobe have been able to make their 2D tools operate on 3D surfaces. Grab your Brush Tool, set a color, and start painting. Paint diffusion rates and angles are all controllable.
It doesn't end with flat color either. Switch the Paint Mode and you can paint with Bumps, Glossiness, Opacity, Shininess, Self-illumination, and Reflectivity.
You can even use the Merge Down option in the Layers palette to apply a 2D image (say, a logo) to your 3D object. That's pretty nifty in my book.
In reality, the new 3D tools in Photoshop probably deserve a dedicated article; however, I think it suffices to say that as of CS4, 3D is a fully-fledged Photoshop citizen, rather than a tacked-on afterthought.
Summary
It's always difficult making the call as to when to upgrade an expensive application like Photoshop—especially if you're shelling it out of your own pocket, rather than your boss's. No doubt your current version worked yesterday and will continue to do so tomorrow.
However, if the question of upgrading is on your mind, with the addition of features like CAIR, there are probably more compelling reasons to take the plunge this time than there's been for a any of the past two or three versions.
ReadMore...
8:41:00 PM
If you have limited access to an Internet connection or a computer, try a print-version of the PowerPoint in the Classroom tutorial. The PowerPoint in the Classroom tutorial is available, free of charge, for reprint purposes to nonprofit educational organizations under the following conditions: No fuss, no muss. Just make sure a printer is properly connected to your computer, then follow these four quick steps:
Conditions
Instructions
ReadMore...
