Inexpensive Usability – Part 1
A lot has been written and discussed about Usability. And often usable solutions or screens with usable features are considered to be an expensive ones. When we say expensive, we think that it is going to consume lots of effort thus increase in overall cost.
Initially we also thought the same, as we started thinking more as a user, it became easier for us and gradually our thinking changed. May be it was a result of our own mistakes and the design thinking that we applied in our everyday life. Now with simple approach and user centric thinking we increase users experience without incurring additional cost of development.
Some examples of our approach are as follow:
Scenario 1 – Confusing Form Fields: Often users are not aware of what should be entered in a form field, the order and sequence of the field could also confuses the user. Often the user is not aware about what should be entered in some fields e.g. whether a date should be in mm/dd/yy format or dd/mm/yy format.
Our inexpensive approach
- Order & Grouping – Set Order of the fields in a sequence and group the related fields together e.g. Address fields.
- Mandatory Fields – Inform users about mandatory fields with asterisk icon *. And add a note in the beginning of the form that field marked with the asterisk symbol * are mandatory.
- For Form Objects – Add a water mark text to let users know about a field. E.g. In the address fields, one can have landmark with water mark text as “Optional” would let user know that it can be left blank.
- Few examples
- A text field to enter a landmark in the address could have a water mark text as “Optional”
- A birth date selector should not have a text field to show selected date. Instead it should have a label field showing a date so that user will not attempt to type date manually. Using a date format as dd-mmm-yyyy (“1-Jun-2015”) would also reduce the confusion of whether the date is dd/mm/yy or mm/dd/yy.
- A phone field could have separate text boxes for country code, state code, phone number with water mark text “###” in the country field where 3 hash characters represents maximum 3 digits.
Scenarios 2 – Confusion through Validation: Data entry screen show a validation message for one field at a time on click of Save button – this results in user correcting one mistake at a time. On subsequent click another validation message appears. And this goes on till all the fields are not corrected (if user is courageous enough to continue).
Our Simple Approach
- Inform user about the error as soon as user move out from that field.
- Show near respective fields.
- Instead of showing a message in an alert box with Ok button, print the error message near the field to make it easy to know the field are you referring.
- During this operation do not reload the whole page.
Scenario 3 – Multiple Submit/Save Attempts: When a Save button is clicked, system processes to save the data. If this operation take time or if user is not aware that is already completed then user could click on save again and again. Which could result in another process to start saving the data, further it could result in more delays due to more processing. And if there are no data level constraints then it could also lead to duplicate data in the database. Delay due to so much unnecessary operations and processing could lead to operation avoidance. As a result a user simple may not wish to attempt again.
Our Simple Approach
- Let user know – On click of button “Save”, change the label to “Saving” or “Processing”.
- Avoid re-processing or duplicity – Disable the button to avoid subsequent click.
- Confirm Action Performed – Let user know that the data is saved or show appropriate message.
Note: Above steps may not take extra effort because the developer would receive a response back whether the data is saved in the database or not. So re-using that response to show a message “Data Saved Successfully” is not going to be effort intensive.
We have applied our learning and added in our standard user interface checklist that we refer during the development of every screen as a part of our development process. Overall not only did it help to increase the users experience but it saved development efforts, it resulted in the reduction of support calls. Most importantly, such simple know-how and process increased users experience without impacting the development cost thus making usability inexpensive.
You may share your experience and feedback. If you would like to know our usable approach for problems faced by you or want to suggest about what should we cover in the next post then please write to us at email@example.com
More to come… in next part.