Review: Artisteer – CSS templates made easy


Every once is a blue moon, I find an offer to try a product that I am really interested in. The other day, I was examining offers for Microsoft MVPs and I came across Artisteer, a product that creates website templates, for lack of a better short description.

I contacted Artisteer and got a license key within the hour. I then got a chance last night to sit down and play with the product. I am going to go through the good and bad of the product.

When you first stoke up Artisteer, you are greeted with a menu that gives you choices for what kinds of templates you would like to work with. These choices are not binding, as you have complete flexibility over your final design, but choose wisely, as you can paint yourself into a bit of a corner. The opening screen looks like this:

I tried a couple of the templates, and there are a few restrictions on building for things like WordPress, but that is simply because you to fit within the WordPress model.

Templates:

There is a bit of good and bad with templates. I like the fact that I can keep mashing the Suggest button to roll through the templates, but it would be nice to see some of these starting designs in a chooser, like the other elements. I realize things might be created "on the fly", but I eventually get tired of mashing suggest to change the look and feel. On the other hand, I like a great deal of the design decisions. Below is a template I created:

Customization

While I am not completely sold on the starting point mechanism, you have complete control over the templates you design. For example, the following screenshot is the template above after only 3 mouse clicks on different menus, starting with the Suggest Design button. If I liked the original fonts and colors, I could have hit it with 1 click.

 What can you customize?

  • Layout
  • Color Scheme, including color brightness
  • Header (graphics, fonts, font placement, graphic effects)
  • Background (graphics, color, etc.)
  • Button shape, actions
  • Menu style, including menu item gradients, shape
  • Bounding boxes for sections (block style)
  • Placement of different elements
  • Footer style

There are some other customizations, as well.

Saving Your Work

When you are done, you can export your project. One of the options is a .NET project. The resulting project contains the following tree structure.

 

Notice that everything is very modular, which is nice. I am not sure I like the placement of the CSS files, personally, but this can be adjusted. I do like the use of a master page. One update I would like to see is an ASP.NET MVC output, but it is not too difficult to output to HTML and create my own MVC site from the template.

Rendering in Browsers

I have not tested every browser yet, but the first site I created seems to work fine in IE (v 7), safari, opera and firefox. I have not tested IE 8 yet, which may be interesting.

One nice thing is the entire site is rendered using CSS. I like this standards based approach to creating sites. There is a separate style sheet for IE6 (which I did not test), so they have thought about the disparity of IE pre 7 days (when standards meant "Microsoft standards"?).

Thoughts

Overall the product is rather intuitive and easy to play with. You will find that is mostly what you are doing is playing. There is an undo button, so you can go back if a change munges up something you like. And, it produces a nice site. I will get time for more full featured investigation as I create an actual site with the product.

I only have two "negative" comments, neither of which is extremely negative.

  1. I am not fond of the lack of an easy way to get to different template styles. Once I have a basic design, it is fully customizable, but getting there is a bit of a pain if the first "suggested" site does not match what I would like. From the downloadable help file, suggest design is the proper way to do this.
  2. There is no help file included in the product (menu). This is minor, overall, as you can easily navigate, but documentation would be nice without having to download a PDF.

Suggestions for future enhancements:

  • ASP.NET MVC style template output
  • Ability to get to a few design ideas other than suggest
  • Help file included in the product
  • Ability to choose from fixed width and liquid layout

There is one other thing that nags at me a bit and it is my questioning whether or not the sites, as varied as they are, are a bit too similar to every other site created by this tool. The lack of a liquid layout option (mentioned in my list) may also limit its usefulness for some readers. I will play around for awhile and see if I change my mind on this.

Side note: Every software product paints you into some type of box, especially products designed to do boilerplate work for you. One question you have to ask is whether or not the box is too tight for your needs.

Should You Buy This?

This is the big question for many people when they see a review. Here is my feelings on this.

The price is not bad for what the product does. The standard version is only $129, so it is not a budget breaker. if you are only designing a single site, it is probably overkill and not worth the price, but if you design for clients, it is a good starting point and I would say worth the price. It sure beats running out the one of the free CSS sites and searching, as my time is worth something (at least in my opinion Wink).

You can download a trial if you wish to play with the product before buying. It will stamp all the graphics with trial, so it is literally a trial only version. It will allow you to determine if the product is right for you, however. If you are a student or home user, you can buy a $49 version, but I see enough limitations in the student/home version to plunk down the extra money for the full version. Your mileage may vary.

Peace and Grace,
Greg

Twitter: @gbworld

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: