Well, then geocities came up with a web design editor. My curiosity was peaked and so I used it to do all kinds of other crazy text effects and things that would now look rather gaudy to someone with a trained eye in design. Of course, I didn’t realize I was sacrificing my hand coding to an evil editor. It chewed my code up and spit it out in mangled form. I was depressed and vowed to avoid using a web design editor, no matter the cost.

Fast forward several years and I’m running multiple businesses. Some of them call for repetitious coding. Hand coding takes forever. It’s slow, but its accurate. Still, if only there was a way I could have saved time, I would have taken it. Around this time, the big two web design editors were by Macromedia and Microsoft. I could only stomach two minutes in the Microsoft program, also known as FrontPage. It added in all this unnecessary Microsoft coding and messed up my pages. I was told by a designer friend to try Dreamweaver, the other editor option. This was in the program’s early days. Still, my code was much cleaner in Dreamweaver than it was in other editors. Dreamweaver showed remarkable promise.

That brings us to today. I am now a loyal user of Dreamweaver. Now an Adobe product, I’m currently using Dreamweaver CS 4. As the program continues to grow and develop, I’ve realized how much time I can save using Dreamweaver. I still do part of my coding by hand, but Dreamweaver cuts the work out on things like making tables and setting up my CSS documents.

Dreamweaver has the potential to be incredibly newbie friendly due to it’s array of easy to use, easily labeled panels and tabs. I know that if I’d have had Dreamweaver around when I was learning to code, I wouldn’t have made nearly as many mistakes, coding wise. This program would have saved me an incredible amount of time!

When you look at something like Dreamweaver and compare it to a program like Photoshop, you aren’t going to be as likely to see the benefits of the changes in the upgrade quite as much in Dreamweaver. The program works so well now, on its own, that upgrades often include what I like to call “tweaks” as opposed to actual feature changes and inclusions. The next step Adobe is going to have to make is to have Dreamweaver construct vast layouts in one click, for a variety of webpage styles. Of course, that takes most of the fun out of designing.

What I’d like to see, in the next version, is more support for the coding that is done by programs like WordPress. For example, it’d be nice to be able to preview a WordPress theme in Dreamweaver’s visual/design panel before the theme goes up on the webpage or to have coding assistance for WordPress built into Dreamweaver. I’m not sure if this would be possible, but I could imagine how many bloggers would start using Dreamweaver (if they aren’t already) due to it’s support of WordPress. It’s one of the most popular, well used, pieces of open software, so while this would be an awesome edition to Dreamweaver, it’d be more like the icing on the cake than something that I require in order to use WordPress. It’d make my own life much easier, and it’d open up use of Dreamweaver to a larger audience, in my opinion.

Without the inclusion of extension features, like the one I just listed above, Dreamweaver CS4 is still rocking. It doesn’t eat my code. I love that about the software. I don’t have to go in and fix my code, because everything looks as clean as it would had I hand typed it. Dreamweaver also has helpful coding suggestions/hints for those who do hand coding. If I open a tag, Dreamweaver will close it for me wherever I want it closed. It’s just that easy and helpful. If you design websites and don’t use Dreamweaver then shame on you!

Release Information:
Dreamweaver CS 4 was released with other software in the Creative Suites 4 set on September 23, 2008. The CS4 software products can be downloaded individually, in upgrades (if you own past versions) or in sets with other CS4 products, on the Adobe website.

The following collections feature Adobe Dreamweaver CS4:

Adobe CS4 Design Premium – $1,799 – Upgrade – $599
Adobe CS4 Web Premium – $1,699 – Upgrade – $599
Adobe CS4 Master Collection – $2,499 Upgrade – $899

You can purchase Dreamweaver CS 4 on it’s own for $399 or upgrade to this version for $199. For all that Dreamweaver offers, and the upgrades to this version, I believe this price is fairly reasonable.

Price: 4 out of 5 stars

About the Developer:
Adobe is the name I trust above all others when it comes to software that is used for web site design, graphic design, animation and other forms of visual media. I have been using Adobe since the 90s. I remember the early days of Adobe. What is now obsolete in the world of design was revolutionary and Adobe was in the thick of it all. Having acquired products from Macromedia, such as Flash and Dreamweaver, Adobe has opened themselves up to become the definitive source for multimedia and design software.

Product Features:
For those who design webpages, but have never used Dreamweaver, you should. Dreamweaver is friendly to all coders regardless of experience level. The top panel of Dreamweaver features the option to click Design Mode, Split Mode, or Code Mode. Design Mode is the quintessential WYSIWYG editor. You can copy and click buttons in the other panels to do everything from insert images, to make intricate tables and website layouts. The Code Mode is for coders who prefer to do most of their coding by hand. Switching back to design mode allows for visual views of whatever is being written into the code. This mainly supports HTML, unless you have an extension that allows you to view coding such as PHP code.

Split view obviously combines both code and design modes. This is great if you’re trying to troubleshoot a coding problem. As you fix the problem the design reflects the changes. When you are in coding view, as you type, helpful codes pop up to allow you to save time and not have to type every single part of the code out. Dreamweaver’s visual view also supports calls to other created documents by Dreamweaver or hand coding.

For example, as you make changes to a CSS document that an HTML file you are working on in Dreamweaver is calling, you can actually see the CSS changes in the visual view for the HTML file. You have to save the CSS file for the changes to take effect though. Still, I don’t remember this working quite so well in past versions of Dreamweaver.

Dreamweaver supports a wide variety of file types. Nearly any file type you could want to create for your website is supported. Supported types include HTML, PSP, JSP, CSS, XML, Javascript, Cold Fusion, Actionscript, ASP.Net (VB & #C), ASP VBscript, and I’ve even edited PERL code in Dreamweaver. Many of these types of code have syntax highlighting available. Of course, most of the things I’ve mentioned so far about Dreamweaver have been available in past versions. I should definitely spend some time on what’s new for Dreamweaver CS 4.

A lot of pretty cool changes have been made to Dreamweaver CS 4.

The change I like the most is to the Live View Feature. This allows for a live preview of web content that loads in half the time. You can preview and test web content easily and quickly with little to no wait time. It also loads directly through Dreamweaver CS 4. Before, you had to open these files up in an external browser such as Firefox or IE.

One new feature that I don’t use too much, but that I can see the advantage in using is the new Related Files Bar. You can use that to see the source code for your related CSS files, in a code based view, while looking at the main file the CSS file correlates with, in the design view of Dreamweaver CS4. As I mentioned before, you can update your CSS by hand or in Dreamweaver, save the file, and have the changes show up in the Design View for the file with which the CSS is connected. Additionally, Dreamweaver CS 4 allows for use of Code Navigator. This makes it easy to find the CSS source code that relates to the file on which you are currently working.

I also spoke about code hinting. That’s when you start to type in a part of a code, and then the rest of the code pops up, allowing you to select what code you want to type rather than having to type it all out, by hand. This feature has been enhanced even more than what is available in Dreamweaver CS 3. It’s the most useful tool, in my opinion. I use this more than any other in Dreamweaver CS 4. The support in this version has been increased specifically so you can write Javascript and Ajax coding with ease. I’ve also found that it is easier to write PHP and HTML coding from scratch, so some improvement seems to be available for all of the coding languages that are available.

You can now add dynamic data to your webpage without struggling to work with a database (which can be a major hassle) or fighting with XML. This is capable through Spry Data Sets, which recognize interactive data in simple HTML tables. I haven’t found much use for this feature, but if I’m adding dynamic content, I’m using something like Flash rather than coding it into my webpage in another way. That’s just my personal preference, though.

One of the coolest updates I’ve found is the integration of PSD file Smart Objects. I work a lot in Photoshop, especially since I like Photoshop CS 4 a lot more than past releases. Before, I’d have to save my PSD files into JPG or some other extension before loading into Dreamweaver. Well, not anymore. It’s now possible to upload the PSD file into any website that is being designed or tweaked in Dreamweaver CS 4. Then, if I update the image in Photoshop, it updates the changes in Dreamweaver. This also optimizes the images into a web-compatible format. Tres convenient!

CSS coding is enhanced. It’s so easy to put in CSS thanks to extended code hinting. You can also apply specific CSS rules to your files through the properties panel. This is a great function if you’re new to CSS, as each panel offers a helpful explanation of the CSS style.

Finally, Dreamweaver CS 4 offers support for Adobe AIR. This seems to be universal for most of the software packages in CS4.

Product: 4.5 out of 5 stars

Using the Product:
As I’ve mentioned throughout this entire review, this is pretty easy to use. You can hand code, if you want, though you certainly don’t have to. The easily labeled panels and tabbed bar at the top make for easy to use and follow directions when making everything from layouts to tables. Dreamweaver CS 4 even features a variety of pre-made templates that offer a specific layout for your website. Making a website is as easy as a few clicks and some cutting and pasting if you already have the text of the site written.

Functionality: 5 out of 5 stars
Ease of Use: 5 out of 5 stars
Newbie Friendly: 5 out of 5 stars

Bottom Line:
Dreamweaver CS 4 is the right step forward, by Adobe, from past versions of this software. With a variety of upgrades and software tweaks, you’d be crazy not to upgrade to this version. If you don’t own Dreamweaver already yet you design websites on a regular basis, then you need to purchase this invaluable, time saving tool. Newbies who wish to learn how to design websites can benefit greatly from using Dreamweaver CS 4. This version of the software is also much more compatible with the W3C’s Markup Validation Policies, making for the cleanest, most web friendly code by a web design editor available.

Reuseability: 5 out of 5 stars
Visually Pleasing: 5 out of 5 stars
Overall Rating: 4.79 out of 5 stars

Technorati Tags: Adobe, Dreamweaver, CS 4, Software Review, website, design, coding, HTML, PHP, syntax, Adobe Air, PSD, Photoshop, compatible

In the past few years I’ve become a competent designer. Well…at least in my own mind. I’m a self-taught web designer. I started out in PSP (of all programs) though I hate to admit I ever used such a substandard program. It wasn’t long before I started using Photoshop. This was way back in 2002. I was new to Photoshop and while I was told that all of the “pros” were using the program, I found it to be much harder to learn than the previous programs I’d used.

Still, I was persistent. I wanted to use what the pros were using. In time and with a lot of help from tutorials (as well as other designers) I became quite proficient in Photoshop. From there, the next logical step was to learn Flash. I was absolutely fascinated with Flash. I started trying to learn Flash back in late 2002. I was obviously quite dependent on tutorials and assistance from other designers in these early days. Flash was in one of its earliest editions, but it was offering a revolutionary new approach to design and illustration. I definitely wanted in on the Flash bandwagon.

Sometime in 2003, I found an excellent Flash tutorial website, Cartoon Smart. The site was (and still is) run by a man named Justin Dike. For a fair price, I was able to receive easy to follow and in depth lessons in how to do many of the things I wanted to learn to do in Flash. Since 2003, I’ve been a loyal fan and customer of Justin’s. I highly recommend all of his tutorials, no matter your level of proficiency in Flash. While I know quite a bit more, and have become quite competent with Flash on my own, I still find Justin’s lessons invaluable. I often buy new lessons and modify what he teaches to suit my own designs and illustrations. Without him, I don’t feel I’d know Flash nearly as well as I do today.

When Flash CS4 Professional was being announced and I found out about all of the new features, I knew I had to have this program. I now use Flash, nearly exclusively as my primary program for website design, development and illustration. The ability to animate, draw, design and develop a wide variety of web friendly applications makes Flash CS4 the flexible, reliable and obvious solution for any web designer. I just happen to be one of the many Flash loyal people on this planet and with all of the really cool features that Adobe Flash CS4 is now offering I don’t see that changing anytime soon!

New Features:
There were several new features I was quite excited about after the release of Flash CS 4 Professional had been announced. The most exciting new features, for me, are object oriented animation, the Bones Tool (which allows for inverse kinematics), and the Deco and Spray Brush. The latter (Deco & Spray Brush) would either be really amazing to use, or a bit corny and not at all helpful. Unfortunately, as of now, I haven’t found much use for it, so I can’t exactly say whether it was worth being added to this upgrade, or not. I will say that it does have the potential to be worthwhile, in the right circumstances. I just haven’t found them.

I was putting my money on the entire Flash CS4 Professional edition being pretty amazing based on the videos of the new features I saw on the Adobe website. I can’t tell you how right I am. You’re just going to have to use this program to see just how amazing it truly is. While Flash (and all of the Adobe software packages) is expensive, I do believe this invaluable tool for designers will pay you back tenfold.

Let’s start by discussing Object Oriented Animation. Back in the good ol’ days, Flash required a series of steps to animate objects. If you didn’t follow the steps just so, your animation might appear bumpy, unrealistic and not at all like animation should look. Now, your object is set as a symbol, you right click, select Motion Tween, go to the ending keyframe, move the object from the start position to where you want it to stop and then the timeline is set for you. Adobe Flash determines the path the motion should take for the movement, ideally, and you just have to sit back and let the program do all the work for you. Pretty cool, eh?

To make things easier, you can adjust your animation without having to reanimate the layers and reset the motion tween. The object in motion features something called Bezier handles. Adjust those and you can adjust your animation. It’s pretty simple, and easy to use. It makes animating nearly any object a hundred times easier and then some! Of course, the addition of motion presets, which allows you to pop in presets for nearly any type of object saves designers even more time! To add to the motion features is a motion editor, which allows for more control over every aspect of individual tweens including, but not limited to rotation, scaling, easing control, transformation controls and color effects.

If this is still a bit confusing then you are going to want to check out Justin’s (Cartoon Smart) free lessons. This shows an example of how to use motion tweening on any object of your choosing. He also has a lesson on 3D object animation in Flash CS4. You can download both of these lessons for free at the Cartoon Smart Blog. Also, check out my own motion tween video below! This looks pretty nifty doesn’t it?

As if Flash animation couldn’t get any easier or more high tech, the addition of inverse kinematics has to be about the coolest feature of this new upgrade. You can take any chain like object and make it swing around. In the example I’ve included, I quickly drew a funky little cartoon guy. To show off what the Bones Tool can do, which controls inverse kinematics motion. In this case, I moved the funky man’s legs and arms.

Then I made him jump up and down using the object oriented animation motion tween method I mentioned above. I wanted to make him do the air splits and show off how his legs and arms can swing around individually. I should note that I only drew his arms with the intent to move them. After seeing how funny he looked, I decided to move his legs, too. So from the straight drawn legs, I was able to give them dynamic, realistic joints. This is DEFINITELY my favorite new feature of Flash CS4!

To see my animation, go to the next page.

Like many other, struggling, self-taught designers, I scoured the web for tutorials, affordable courses, and anything else I could find. This brought me to the Cartoon Smart website. I’ve had a personal work relationship with Justin, the founder of Cartoon Smart for years, only he didn’t know about it until recently. You see, it’s Justin who has taught me everything I’ve needed to know about using Flash. Justin has taught me everything from animation techniques to Actionscript. Every step of the way, as I’ve learned Flash, Justin has been there.

Justin has been creating Flash Tutorial/Training lessons since before 2003. I know this because I have payments for lessons dating as far back as that year. I took some of his earliest courses and feel I’m all the better for it. Justin’s courses are unique because they make it easy for people of nearly any learning style to learn how to use Flash.

Those who are visual learners can watch the video and then copy what Justin does in their own projects. Auditory learners can listen to the instructions Justin gives on his videos. They are casual, informal and downright entertaining. Hands on learners have the opportunity to jump right in and get to using Flash as Justin is explaining how to do it. These tutorials are just so comprehensive, nearly anyone can and will be able to learn how to use Flash, thanks to Justin.

On the Left: Dominick - mid-tutorial on Part One On the Right: Justin's Completed Part One Tutorial Images

*Click on the Image above to see it in a bigger, easy to view form.

In this review, I had the chance to go through and complete a Five-Part Interface Design Mega Course. After completing this course, I’ve used some of the techniques Justin taught me on at least four or five different website designs and graphics. There are so many practical purposes for this course. I’ve used many of the elements that Justin explains in website design. From image reflection to giving images a glossy appearance, I’ve found this interface design course amongst the most useful tutorial courses that Justin has developed, to date.

The Mega Course is divided up into five parts. In part one, Justin goes through some common illustration techniques he uses. He discusses how he has a big file filled with examples of design elements that he’s used in past designs. This not only gives him ideas for future designs, but he also is able to save time by cutting and pasting parts of past designs, if he can use them, in new designs. I think that’s a smart idea. I know that I’ll sometimes cut and paste Actionscript commands, as opposed to having to rewrite them, over and over within the same project. It’s just another way to be more efficient when designing in Flash.

You can see  a screenshot of what I learned in Part One, midway through the tutorial up above. For reference, I included a screenshot of Justin’s completed Part One tutorial SWF file. As you can see, I follow most of Justin’s tutorial closely, but I also add my own flair to the design. For example, you can see he’s used a basic font for the clock face, while I’ve used a font designed after a clock, to give it a more realistic look. These little things allow me to explore my creative impulses yet teach me the right structure for how to start designing and how to develop interface designs that Justin’s tutorial provides.

Moving on to Part Two, Justin goes into specific interface designs. I’ve actually modified one of the main illustrations he designs in Part Two for the new logo of LI Kids. You can check out my design below and then look at what Justin originally did in his tutorial, which gave me the idea for the LI Kids logo.

This Tutorial from Cartoon Smart Inspired the LI Kids Logo

And here is what Justin teaches in Part Two of his Interface Design Mega Course.

Justin's Interface Design that Inspired the LI Kids Logo

As you can see, with Justin’s designs, there is quite a lot of room for interpretation and the ability to take what he teaches while applying it to your own designs and illustrations. You can go to the LI Kids website to see other elements of design taught by Justin, in this course, too. For example, just by looking down the sidebar, you can see how the element of “reflection” has been used on the LI Kids RSS button. This has become one of my favorite element design tricks, actually. I’d seen it done before, but didn’t really put much stock into it until Justin discussed the appeal of reflective images in the Interface Design Mega Course.

In all, this course is six hours Long. The first five hours teach about a variety of design drawing and illustration techniques. You’ll get to design LED style screen images. Based off of Part Three and Part Five, I’m actually working on an illustration I’m planning to use right here on LI Reviews, but I don’t want to give too much away about that until it is designed. That’s what I like about Justin’s courses. You get what you pay for and it comes back tenfold with each new design you create, using the various techniques he teaches.

In Part Four, Justin goes through an actual design technique that could be used on a high tech, Flash website. I’ve always been more creative and artistic with my designs, but I do enjoy knowing that I could go for the Flashy, more high tech designs if I wanted to. Finally, in Part Five, the designs are given some actionscript and they actually come to life. This is the icing on the cake for this course. I can’t stress how important this course is, to designers of all levels. I’ve been using Flash for a while now, but I’m constantly learning new techniques from Justin. I’ve been a loyal customer of his for years and I intend to keep it that way.

CLICK HERE to see the Effect Above in Full Size. Click on a Link/Button to see what happens!

One more thing about the Cartoon Smart courses is how well laid out they are. Justin takes you from start to finish through Quicktime videos. He shows you every thing he does. He explains every step he takes. Example files are included, with the finished files that he completes in each tutorial. He’s thorough, engaging, easy to listen to and an all around nice guy. In the event you have a question about the tutorial or Flash in general, I’ve found Justin to be a nice, well-mannered, informative penpal. He will get back to you promptly and try to explain what you need to do in Flash, to accomplish the effect or design you want.

If I had to recommend any course to both beginners and established designers, it would be, hands down, the Interface Design Mega Course. You will find a practical and useful purpose for everything Justin teaches you. I’ve completed this course recently and I design in Flash every single day. This course is exactly what I needed to up the ante on my designs. In the few days since I’ve finished this course, I’ve found myself using the same techniques that are taught in this course innumerable times. There just isn’t anything else to say other than…YOU NEED TO BUY THIS COURSE!

You can purchase the Interface Design Mega Course through the Cartoon Smart Website. This course only costs $20. Seriously! For over six hours worth of training you’ll use for a lifetime of using Flash, this course pays for itself within the first hour of this tutorial.

You can check out all of the other great courses Justin has developed at Cartoon Smart. Justin is a talented Flash designer and he’s the reason I’m still using Flash today. Without him, I’d truly be lost with nary a clue on how to do half the things I know how to do in this wonderful program.

Stay tuned for more reviews for Justin’s courses. With the release of Adobe CS 4, Justin has new courses coming out and I’m planning to share all of the details on the free and paid courses he’s developed for this new, innovative Flash software. Until then, check out the rest of his courses on his website, which include learning how to Illustrate, Design Websites, Make Flash Games and Learn Actionscript.

Technorati Tags: Cartoon Smart, Justin, Interface Design Mega Course, Tutorial, Adobe, Flash, CS 4, Website Design, Flash Tutorial