Typepad has introduced a new approach to selecting a blog template.
It was a fine piece of user interface design work that I had to share it!
1. The clean introduction page of the TypePad Design Assistant. Notice the image helps you understand exactly what to expect.
2. The 5 steps is clearly outlined in a task-oriented wizard navigation and the goal of "Apply to Your Blog" is obvious
3. There is a standard theme thumbnail page before this screen, but once you click on a thumbnail it narrows it down to a row of 5 thumbnails as you see above. The left and right navigation buttons still allow you to browse other themes at this preview level. The beauty of this design is that it avoids "pogosticking" from the thumbnail page to the preview page.
4. And to get a true assessment of the theme for your blog all that you would have to do is simply scroll down so that the top
navigation pane is no longer visible. The simplicity is brilliant!
5. Allows 5 choices for layout. Again, choose your prefence and then scroll to preview. Really helps you to make the decision, a fine way to try before you buy (except in this case, the templates themselves are free)
6. I thought the Customize Theme process was slick enough in that it allows you to modify the css right then and there - which is relatively common on code learning tutorial sites like w3schools.com. But it was nice that ideas like this have been carried over to the common blogger audience
7. Another feature we've seen in many development based tools such as the firefox firebug extension or the IE developer toolbar is that upon rollover it indicates helpful code information. On rollover this tool does the same and shows the associative piece of code, or in css the "class" inforation at the top right.
8. This additional featurette definitely sold me. By double clicking on an item on the preview area, it updated the top right CSS edit box so that you can immediately jump in and edit the look of the page with almost too little effort!
9. Hit "Apply CSS" and voila! Changes made right before your eyes
10. Since this modification tool is so simple and useful I would have recommended a learn more link for people who don't already know css but want to learn a few simple easy tricks such as changing the font size, bolding, color, etc. It could be an external link to an existing tutorial.
In summary, I recommend you
check it out for yourself. The TypePad design assistant has raised the bar in terms of browsing, previewing, customizing and most importantly guiding the decision-making process of selecting and modifying a blog theme quickly. Simple, elegant, and most importantly effective.