25
Aug
09

A-B Testing

A-B split testing is a comparison study of designs. Main purpose is to compare designs to conclude which is more usable. It can be used to compare new design with old one or two completely different design options. Sometimes new features can also be tested with this test by making it available to limited number of Users. Design option “A” can be the existing design which is presented to most of the users and option “B” can be existing design with some new experimental features which is served to small number of users..

A-B testing is done on live site, thus it gives you the live impact of the new design or new features. Two options are compared with the help of statistical data (e.g. no. of clicks).

Benefits:

  1. It measures the actual behavior of your customer under the real world. Based on the test results, you can determine option A works better than option B.
  2. It can measure very small performance differences between design options.
  3. Its cheap.

Limitations:

  1. It works for fully implemented designs.
  2. Can only test one page element or design at a time

A-B test can be conducted in many ways. Different web scripts can be written to present different designs to different User groups. Some third party tools and scripts are also available.

16
Jun
09

Heuristic evaluation

Heuristic evaluation is a quick, cheap and easy method to examine usability of Use interface design. Concept was initially proposed by Jakob Nielsen and Rolf Molich to find usability problems. In simple words, in this method we test design according to a list of design principles.

Nielson listed ten general principles for usable user interface, which are called as “Heuristics”. Following are those Heuristics:-

1.   Visibility of system status 
      The system should always keep users informed about what is going on, through appropriate feedback withinreasonable time.

A good example of this is Adobe Photoshop startup screen in which you can see a list of creators, copyright note and on top it gives you the status like “Initializing”, “Reading brushes”, “Reading Preferences”, etc. So while starting, it informs user what the application is doing.

ps3_startup_screen

 

 

 

 

 

 

 
 


2. Match between system and the real world 
     The system should speak the users’ language, with words, phrases and concepts familiar to the user, rather than system-oriented terms. Follow real-world conventions, making information appear in a natural and logical order. reasonable time.

Avoid using system, developer jargon, understand users language and present information in a way which user understands. This is particularly while displaying the error messages. Present information on system/website in appropriate order, most important information of top, then less and then least important at bottom. Use colors, different font size and some graphics to show the importance to the information.

 
3.User control and freedom
    Users often choose system functions by mistake and will need a clearly marked “emergency exit” to leave the unwanted state without having to go through an extended dialogue. Support undo and redo

Provide option to escape from unwanted state.  Simple and effective solution is by providing “Undo” / “Redo” options

Gmail_Undo
 

 

 

 

 

 

 

 

 

 4. Consistency and standards
     Users should not have to wonder whether different words, situations, or actions mean the same thing. Follow platform conventions.

Keep consistent experience throughout the system. Use industry standards, patterns for UI components, form controls, labels, etc.

 

5. Error prevention 
     Even better than good error messages is a careful design which prevents a problem from occurring in the first place. Either eliminate error-prone conditions or check for them and present users with a confirmation option before they commit to the action.

Provide confirmation option before performing critical actions.

  

6. Recognition rather than recall  
     Minimize the user’s memory load by making objects, actions, and options visible.  The user should not have to remember information from one part of the dialogue to another. Instructions for use of the system should be visible or easily retrievable whenever appropriate.

Keep important information, actions obvious to users. User appropriate UI component to present hierarchical data. Provide icons which will help user to recognize the term/object.

MS_ribbon












7. Flexibility and efficiency of use  
     Accelerators unseen by the novice user may often speed up the interaction for the expert user such that the system can cater to both inexperienced and experienced users. Allow users to tailor frequent actions.

Provide frequently accessed/used information, actions first when user access system next time which speed up user interaction.

freq_used

 

 

 

 

 

 

 



8. Aesthetic and minimalist design  
     Dialogues should not contain information which is irrelevant or rarely needed. Every extra unit of information in a dialogue competes with the relevant units of information and diminishes their relative visibility.

Avoid cluttered page design. Provide only what user wants. Add other information only if it adds value.

9. Help users recognize, diagnose, and recover from errors  
     Error messages should be expressed in plain language (no codes), precisely indicate the problem, and constructively suggest a solution.

Provide usable error message. A good, usable error message should tell user about what has happened, error cause (why) and how to recover from error (where to go).

 

10. Help and documentation  
     Even though it is better if the system can be used without documentation, it may be necessary to provide help and documentation.  Any such information should be easy to search, focused on the user’s task, list concrete steps to be carried out, and not be too large.

Provide quick and accurate help. Generally user come up with questions like “Where is”, “What is”, “How do I”, etc. giving help in Q&A form is very effective. A good example is help in eBay.com. Also providing context-level help in forms helps user.

ebay_help

 

 

 

 

 

 

 

 



In above principles, there could be category specific principles also.

Heuristic evaluation is conducted by a “Evaluator”. Evaluation can be done by individuals or by group of evaluators. Evaluator typically does not perform any task, so it is more suited at the early phase of usability engineering.  After conducting Heuristic, evaluator generally has a list of usability problems with reference of usability principles.

Apart from above list, there are many resources for the usability principles.Usability.gov has a good list of usability principles. You can find it here: http://www.usability.gov/pdfs/guidelines.html . ISO also has a Heuristics called as ISO 9241.

31
May
09

Certified Usability Analyst!

Its celebration time for me! I cleared HFI-CUA exam last Saturday with 83%.

It was open book, multiple choice exam having both straight forward and scenario based questions.

To crack exam, one needs to have good understanding of the concepts and should have well organized study material. Time management is also very important. You get 180 minutes and 100 questions on four sections. Prior to exam if you distribute time properly, then it helps a lot.

Its good now to see Certified Usability Analyst added to my profile!

06
May
09

webpicks – regular reads

Following are some nice links that you should visit regularly – 

www.adaptivepath.com/blog  – Very informative, lot of topics, news, presentations – a must read!

www.boxesandarrows.com – Design process, idea, news, articles, interviews

www.infodesign.com.au/usabilityresources – Nice usability resources

www.uselog.com – usability of applications, products, websites, mobiles, etc, a good reading

www.usabilitypost.com – regular read

24
Apr
09

Password strength check in Skype

Password checker is really good and useful, it checks your password complexity.

But I found it frustrating with Skype while providing new password. Skype has very clean, simple design for changing your password. It ask you for new password and re-enter new password for confirmation, that’s it.

It has password checker facility. Once you enter password, it checks password complexity and ask you to provide new password if your password is simple. There is a clear instruction saying “Passwords should be at least 6 characters long, including 1 number and 1 letter.”

 

Skype_changepassword_01

I entered a complex password (more than 6 characters including 1 number and 1 letter) but Skype didn’t accept it. I tried more complex for 8-10 times, I tried my best to create more complex passwords with all possible combinations, but still Skype asked me to provide more complex password. Finally I gave up, and close my browser.

 

Skype_PasswordChange_02

 

 

In such situations solution could be, Skype should allow me to proceed with my password and just warn me about low complexity or give me some tips or sample passwords that

I can modify and use/ refer to create new or generate some passwords which will be complex enough according to Skype password checker, but at the same time should be easy to remember for me.

 

A simple solution could be –

 

 

 

 

changepass01

 

changepass02 

21
Apr
09

filter your results by color in Google image search

A very nice and useful (in most of the cases) feature is added in Google image search – Color Filter. Now you can filter search results by color.

For example, I’m looking for a BMW 5 series, I type keyword and search. Now I can filter results by color I want. 

 

 

googlecolorsearch1

17
Apr
09

Creating Page as a Template in MS-Visio 2003

Hi all,

I use Microsoft Visio 2003 for creating wireframes. While working on a complete task flow I create multiple wireframes covering every screen in flow. Most of the time it happens to me that there is some textual change or placement of some component has to be changed at the global level (Navigation/Header/Search, etc), at this point I need to update every page/screen. I either copy-paste or manually change it. Problem is with alignment and its time consuming. I always thought of some kind of “template” feature in Visio for this.
But now I got one way to do this.
It’s pretty simple.

1. You create on screen/template (like we create template in Dreamweaver) in one tab.
2. Go to “Page Setup” from File menu
3. In “Page Property” tab, set the type of page as “Background”
4. Complete you design, copy it create new tab and paste it as a “Background”
5. That’s it, if you want to change something across the pages/screens, make changes in the first screen (template) and it’ll be reflected in all the pages.

However there is one negative side, you cannot select the template page in any other page. i.e. If you select all the screen, template content won’t be selected.




Follow

Get every new post delivered to your Inbox.