Interaction Design - HSBC.CO.IN's poor button design
HSBC.CO.IN's poor button design
Today I happened to watch one of my friend accessing HSBC's web site. He was checking his credit application's status online. The User Interface looked similar like the image below.
My friend selected the DoB and promptly filled in the Telephone number. The next thing he did was.. clicked the RESET button. And whoops.. everything got reset. He got frustrated and repeated the process once again. Once finished he carefully clicked the small GO button to complete the verification.
He was apparently not happy because he ran into such incidents a few time two days ago. On that day, he accidentally clicked on the RESET button and had to repeat the process once again. Also he wasn't sure if he should click the GO button. He said that he was expecting the phrase "Submit".
Conclusions:
1. The first priority or positive action buttons should be clearly visible (probably color coded or little wider and bigger). So that Users need not keep on thinking which button should they click.
2. Reset buttons should be positioned properly. If the flow is a single-form flow then the reset could be placed to the extreme right. Instead of the word RESET, opt for "Cancel" or "Close" (in case of window).
3. If the app is a Web 2.0 app, then use the Button+Text Link pattern. Example is "Save" as button + "Cancel" as text link next to it.
- Rajesh Sundaram
Today I happened to watch one of my friend accessing HSBC's web site. He was checking his credit application's status online. The User Interface looked similar like the image below.
My friend selected the DoB and promptly filled in the Telephone number. The next thing he did was.. clicked the RESET button. And whoops.. everything got reset. He got frustrated and repeated the process once again. Once finished he carefully clicked the small GO button to complete the verification.
He was apparently not happy because he ran into such incidents a few time two days ago. On that day, he accidentally clicked on the RESET button and had to repeat the process once again. Also he wasn't sure if he should click the GO button. He said that he was expecting the phrase "Submit".
Conclusions:
1. The first priority or positive action buttons should be clearly visible (probably color coded or little wider and bigger). So that Users need not keep on thinking which button should they click.
2. Reset buttons should be positioned properly. If the flow is a single-form flow then the reset could be placed to the extreme right. Instead of the word RESET, opt for "Cancel" or "Close" (in case of window).
3. If the app is a Web 2.0 app, then use the Button+Text Link pattern. Example is "Save" as button + "Cancel" as text link next to it.
- Rajesh Sundaram
Comments