Archive for the ‘Design’ Category

Recently dilbert.com has updated their site introducing a new design, structure and functionality.  The site makes use of some very innovative user generated content, such as mash ups an area where users can suggest new punchlines and vote for the best ones.

User generated content can have several advantages, it involves users in the site, means content is frequently changing and can encourage users to promote the site to others.  However, it also has a down side in that it can provide the opportunity for those dissatisfied with your brand, site or actions to speak out.

Chevy discovered the negatives of user generated content when they tried to get people to create their own adverts for the Tahoe using video clips and music they had created. People used the clips to bash Chevy and the fuel economy of there vehicles. Although not as extreme, users could be seen using the mash up functionality to criticize the site this week.

A user has used the cartoon above to post the message “Who cares about mash ups? All we want is a simple fast web site to read Dilbert! This new site sucks. Bring back the old web site!!”.

It isn’t uncommon for site redesigns to have some negative responses even if improvements are for the better. Regular users get use to where content is and the design and are put off by change. This is one of the reasons why it is important to manage change, informing users what’s happening, introducing ways to feedback and when possible making incremental changes.

This comment also highlights an important point, just because there is extra web 2.0 features does not mean users are willing to put up with poor performance on key functionality. Why it was decided to display the cartoons on the home page within a flash area is incomprehencible when an image would do much the same job more efficiently. The use of the ‘beta’ will also do little to appease users when they had a perfectly good site before.

Adobe has recently launched an online version of their photoshop tool. Initially when I heard this I was quite surprised. My experience of photoshop is that it is a tool used to mock up web pages costing hundreds of pounds. It turns out it is not really a version of the massive feature heavy programme used by web designers, but rather a photo manipulation tool combined with online photo storage and sharing functionality. As such, it provides much the same functionality as flickr but puts the emphasis on image manipulation rather than community. It is interesting how different this makes it and even though Flickr provides much the same image manipulation functionality I would use it in preference to these. However, its main competitors must be desktop applications which often come free with digital cameras and don’t rely an internet connection.

Photoshop express

Earlier this week I read an article about issues with a couple of common page layouts by Andy Rutledge. In the article he looks at one of the most common layouts, three columns with large central area for content and navigation in the two side columns, and highlights a number of short comings.

Although I don’t agree with all he says, as the layout is often used when a persistent left navigation is used and the role of each column is much better define, he makes some good points. Coincidently, I was asked to review a site using a similar structure, without persistent left navigation, the next day.

The full article is here: Killing Some Bad Layout Conventions

While browsing the archives at thinkvitamin.com I came across an article by Robert Hoekman Jr called Deliverables That Work: Design Description Documents.  In it he suggests combining use cases and wireframes or screenshot to make single design document.  I generally provided detailed notes about the behaviour of the interface as part of my wireframes, however I like his suggest of using usecases.

One of the advantages of usecases is that they detail the exceptions to the normal flow.  this is something that sometimes is missed when creating wireframes and results in the developer having to decide what to do as they come across issues.

The only issue I can see with this suggestion is that some times use cases can use multiple screens.  In these instances I would suggest integrating the use case with a flow diagram and linking from the diagram to the appropriate pages.

CSS gallery 2.0, which can be found at www.css20.com, is a great resourse for anyone wanting design inspiration or examples of CSS techniques in practice.  It allows users to submit their sites and rate and comment on those submitted by others.  A nice concept and also provides users  with design and CSS news.  Unfortunately there is not an easy way to search for sites of a particular type at the moment, although perhaps they will add the ability to tag sites in future.