Tag Archives: usability

Positioning of radio buttons

Usability of 3rd party modules is often interesting and you can see evolution of the product through the interface. Breezing Forms is not exception to this, as it uses interesting formation of  radio buttons to indicate validation options.

Trick question: what is current setting?

Yep, it’s None. Not Library that it seems from the first glance. Readability of this form can be greatly improved by moving radio button field to the left of text:

The lesson here is that if you’re forms are making you hesitate before clicking, you probably have to rethink them.

Update: D. submitted further improvement in the comments (thanks!):

Find of the day: Quince: A UX Patterns Explorer

Being subscribed to a million of different obscure mailing lists and blogs has some advantages. Every once in a while you grab announcement of a rare gem early. Today I receivend an email about Quince – A UX Patterns Explorer by Infragistics.

It’s a visual representation of some of interface patterns used in interface design field. Idea behind these patterns is that if we manage to standardize on certain ways of doing things, then the overall usability and user experience of your interface will benefit from it.

So the big problem is – how do I learn patterns? The usual way in * design profession is that you observe the world around you, take note of remarkable work of others and observe the problems of your users to iterate to a solution.

The other approach is to dive into one of these pattern sites, see how others solved similar presentation/navigation/input/ .. problem and get inspiration from it. Quince is one of such solutions.

Quince browser
Quince browser

It has a wide collection of different patterns together with examples, rational and screen shots. All neatly organizable and browsable. It also allows community to add and vote for their own so it has potential to grow with time.

The bad? It’s done in Silverlight and has a bit confusing User Interface. But it seems to work nicely on my Mac for now and I plan to evaluate it in my future interface design.

Quince patterns
Quince patterns

And for the ones wondering – Quince is a very nice flower of Asian origin:

Quince flower on bush
Image by Martin LaBar via Flickr
Reblog this post [with Zemanta]

uCertify – Adobe Flash CS3 Ace Exam review

uCertify is an online companies that provides different course-ware for different vendor certifications, including Microsoft and Adobe. They’ve sent me a review copy of Adobe Flash CS3 Ace Exam as I wrote in my about box that I’ll gladly write my opinion of things :-)

The basic idea of the product is that if you take enough practice tests and the application takes score of the things you know and don’t know you can slowly learn everything you need to know for the actual test.

Everything happens from this dashboard:

uCertify
uCertify

Instead of describing whole application, I’ll try to make a more of a usability review of it.

  • Learning notes are well prepared but lack better navigation from within text. Having related articles or wiki like links would increase browsability of content in initial learning stages. Right now it feels more of a book experience that you have to read from beginning to the end in linear fashion.
  • Studying topics are nicely grouped but also give the sense of learning by heart feeling. It’s probably really easy to pass an exam with this tool without having real experience with Adobe Flash.
  • I’m not sure what their intention with tagging was. It’s useful to tag articles, but having to keep taxonomy in the head is a bad decision. Show me the tags I used on other articles so I can group them via tag!
  • Please use standard Windows dialogs. Having your own pop-up dialog is annoying as it doesn’t confirm to usual Windows shortcuts.
  • More keyboard shortcuts would be useful. Like using direction keys on the keyboard for moving left and right, instead of having to click buttons.

Overall it’s a nice and cheap way to study for exam and in the process also learn something. While it probably allows one to learn all the cue cards, ii also contains enough articles and explanation of questions and answer to be useful with real knowledge.

I would wish they would follow Microsoft Human Interface Guidelines as they have some interesting self made dialog boxes and interfaces.

I’m also a bit disappointing that it doesn’t work on OS X as Flash is not Windows only. I tried installing it using Crossover Office but it sadly failed at that.

Disclaimer: this review was not paid, but I did recieve full uCeritfy Adobe Flash CS3 Ace Exam to be able to take a look.

Reblog this post [with Zemanta]

3 must read documents for usability experts

Doing usability in startups is often very confusing as you don’t have time for proper process and you’re always wondering how good you could do it, if you had proper resources. With time, you wish you would just be able to read some of these resources in order to be in touch with your industry.

Luckily, there are two incredible startups that open-sourced their usability and redesign process – WordPress and Acquia’s Drupal.org redesign.

Lets start by two documents published by WordPress – wireframes for upcoming 2.7 release and results of their usability studies, that were used in order to actually produce wireframes and from there designs.

1. Usability Testing Report: 2.5 and Crazyhorse

This 25-page document describes what they’ve learned while observing bloggers while using WordPress 2.5, and also posts gaze trails from eye tracking, to get better idea how they used surroundin visual information while achieving their goal.

2. WordPress 2.7 Wireframes

The same team also produced these excellent wireframe documents, detailing changes and behavior, allowing programmers and product manager to use it as an initial input for more detailed specification, without having to go back and ask any bigger conceptual questions. Good example to learn from.

3. Drupal.org prototype

Drupal.org is taking an interesting approach towards redesign, where the usability experts and designers do everything out in open, getting community feedback and input into almost everything they do.

As such they’ve produced a wide range of interesting documents and videos. For now I would like to focus on their prototype, which is built in HTML, with no design, but includes something more important – notes. This is a great way to talk about information distribution, without the noise of actual design.

Modern civilization is built by standing on shoulders of giants. This is the reason why studying examples of other practitioners while doing your own work, will make you better UX expert.

Reblog this post [with Zemanta]