Previews: Making Browsing Less Painful

So I've been doing a lot of work on previews. You know, when you are digging around for just the right image, search lisitng or in my case, a sound loop. Overall, I found quite a few different solutions people decided to show their libraries of music however some definitely worked better than others.

The task of browsing multiple results is a daunting task, anything we as designers can do to make it less painful. I don't say more enjoyable because frankly, unless you're window shopping, it's always going to be painful.

The images below contain my analysis. Click on them for a larger version.






So here are some of my thoughts:

1) Make it fast, time is precious.
a) Reduce bounce or pogo-sticking, the back and forth between pages
b) stream content rather than do a pre-load

2) Even work-a-holics don't like this kind of work. Make it so they have to do as little work as possible (making a user move a mouse a lot or click a lot over a long period of time induces suicidal thoughts.

3) Keep everything together. Don't make users have to look at multiple windows or away from where they are focusing on. It might confuse them or more importantly, annoy them. They have to save those looks for incoming IM chats.

4) Easy on the eyes OK? For gosh sakes, they are going to be staring at this page for a long time. Make it comfortable to look at. Soft colors, nothing too stark.

Cheers,
JT

Error Messaging & The Introduction of the Annoyance Rating

My first entry will be based off my studies into error messaging. Error messaging is one of the most aggravating things in a user experience and besides being undecipherable, they are also really poorly done for the most part. I guess most designers just think of a user experience when everything is working right. Not when things aren't.



For this first entry, I will be introducting the annoyance rating. 0 being not annoying at all to 10 being really freaking annoying. This is totally inspired by my UI colleague who used to scream "How obnoxious" when something was particularly poorly done.

So I'd like to begin the error messaging section with this qoute from an anonymous source.

Good usability error message should be expressed in plain language (no codes), precisely indicate the problem, and constructively suggest a solution.

Here is my analysis. Click on them for a larger version.





So here are some rules I came up with.

1) Make sure a user has something to help let them know they are at the right place.

2) Be human, say "Hi"

3) Don't use negative words like "crashed, failed, or problem"

4) Avoid graphics that represent issues like the exclamation point in the yellow warning triangle or the RED X.

5) Give a reason if you can.

6) Let people know you are working on it.

7) Give them a call to action such as, "visit our site blog to get up to the minute status of the site" or "come back in 20 minutes."

8) Make sure the page has some structure. Even tho everything is down, doesn't mean the error has to look that way.

9) Graphics are cool however just be aware that the graphics you use will be associated with this error.

10) And of course! the best kind of error is none at all. Strong design has things thought through to avoid the error message scenario.

Cheers,
JT

---

Other links (Thanks BIG John):
http://www.smashingmagazine.com/2007/07/25/wanted-your-404-error-pages/
http://www.smashingmagazine.com/2007/08/17/404-error-pages-reloaded/