Feeds:
Posts
Comments

Posts Tagged ‘interaction’

Why is it so easy to find web forms that just don’t work well? Particularly when it comes to what should be simple workflows users are used completing over and over again. There really is no excuse. Here is another example of a simple form gone wrong…

I am submitting a request so the first thing I am being asked for is my contact information:

Contact Form

Scanning the form quickly I see date is already filled in and I am asked to leave it in the field. The rest of the fields are expected information to be asked, and I know this stuff like the back of my hand, so fine with me. Following the instructions, I skip over the date field; enter the rest of the required fields, then hit Submit:

Form with Error Popup

Okie dokie… Why the heck am I getting an error on the one field I was explicitly asked not to edit? Of course, I can no longer see that field since the pop is hiding it, so I am unable to immediately figure why. I decide to move the pop-up window out of the way so I can see what went wrong here:

Error in pre-filled field

Nice! The one field I was not responsible for entering already has an error! The year says 110! So, even though I completed all my data entry correctly, I hit a roadblock. If they wanted me to leave the field untouched, the least they could have done was make sure the pre-entered data was correct!

My Recommendation:

Since they obviously do not want the date changed from today’s date, there is no reason to have the date be a data entry field at all. When a user accesses this screen, the date of request could simply appear (correctly) as uneditable data on the screen. Or better yet, why show it all? Do I need to be reminded that the date of my request is today? I think I know that. If the underlying workflow needs this information it can be added outside of the user’s interaction.

A simple step that could have been removed is instead going to lead to an error for each and every user who doesn’t realize they need to correct the field they were asked to leave alone.

Read Full Post »

I happened to be checking out a listing of healthcare application vendors and found the use of tooltips to be kind of backwards – Here’s what I mean:

Table with tooltips for each cell

Each and every cell in the table shows me a tooltip that is an exact copy of the data in the cell itself.

I then started checking out the rest of the table and I discovered a place where tooltips probably would have been helpful:

Table with sort function within column header but no tooltip

Table with sorted column after clicking header

I am given absolutely no indication that an action can be done by clicking the column headers. Turns out the columns are sortable if I click on the headers.

I looked at the page a little closer and at the top of the screen I found this:

“You can view the interactive list presented at the top in which you can click the column headings to sort by column”

They did try to let users know that the sorting capability is included in the table structure (although the wording also has me bewildered). Unfortunately for them, it has been shown that folks often do not take the time to read the extraneous content when the key information is directly in front of them…

My Recommendation:

Tooltips should provide additional, useful context around the item being hovered over (i.e. displaying print when hovering over a printer icon or spelling out a term when an acronym is used within content) rather than just repeating the same information already being displayed to the user.

It would be more appropriate to refrain from using the tooltips for each individual cell in the table and rather put it to use when a user hovers over the column headers to let them know there is functionality built within them (i.e. Sort by Location).

Read Full Post »

One of the questions I ask myself over and over again when I am surfing the web and I come across a UI design or interaction that seems out of whack is “Did they bother to test this with any users?” – My gut tells me no. And quite often in my day job, when I approach teams about the possibility of doing some usability testing on a proposed design, I get pushback like ‘we can’t add more time to our already tight schedule’ or ‘we don’t have resources to build a prototype to do that.” Considering the value that can come from usability testing, I am amazed at how bad a wrap it has gotten, so I’d like to share a couple of quick, easy and cheap ways I have done usability testing with great results – who knows, maybe some sites I’ve highlighted on this blog will take note and try a few of them out! 🙂

Quick and cheap method #1 – Survey

When working on a UI redesign some time ago, we had a couple different directions we could go in and what we thought were good reasons for picking either one over the other. Rather than relying on an arm wrestling match to decide the winner (and always wondering if the other might really have been better), I decided to take some quick screen shots illustrating the various components of each design and created a survey.

I used Survey Monkey (http://www.surveymonkey.com/) which offers a free version as well as more robust paid offerings. I simply uploaded the screen shots and created simple A/B comparison questions. This took me a couple of hours to complete. Once it was done I sent the survey link out, via email, to both some internal folks and some of our target users. Authoring the email and sending it off once again took me a couple of hours. I left the survey active for about 3 days and got participation from approximately 22 people.

During the hour it took for me to analyze the results, it was obvious they were overwhelmingly for one design over the other. Within 4 days, precious little of my own time and almost no money, I was given the unwavering confidence to move forward with a design that I knew would more likely meet my users’ needs.

Quick and cheap method #2 – Office Proxy

I love this method because it offers immediate gratification! Yes, my company is a software development organization with a lot of technologically superior folks 🙂 but that doesn’t mean that everyone who works there is a techie or even necessarily web savvy. I have a few folks whom I greatly admire because they pretty accurately reflect our user demographic and mental models. These are folks I can go to with what I think seems like a pretty simple interaction, but as soon as I see the look on their face, I know I might have gotten something wrong. Or even better, I jump for joy when I confirm that I got it right!

I’ve shown these folks hand drawn task flows and paper prototypes as well as having invited them over to my desk for a preview of a high fidelity simulation or a walkthrough in a test environment (it’s never too early or too late to usability test). And for a few minutes (and maybe the price of a coffee from Starbucks) I can gain some insight in whether things are on the right track or we might want to consider other possibilities. The same idea could be put in place with friends and family.

Quick and cheap method #3 – Web Conferencing

Online meetings have made a big difference in the corporate world – no more plane trips to cram everyone in a conference room for an hour meeting before they have to head off to the airport again. The same could also hold true for Usability Testing – take away the time and expense of travelling to your users, but still be able to talk with and have them complete a workflow within their natural environment via web conferencing.

There are a bunch of free online conferencing products out there and several others that offer free 30 trial periods. You want to look for one that will allow you to give control of your computer to someone else attending the meeting.

With the web conferencing set up, it’s quite simple – Send out an invite to a user to attend your web conference. I usually do this by email, introducing them to what we are hoping to test and giving them a choice of times to participate (I’ll send out a bunch of emails scheduling times over a 2 or 3 day period). Once the time comes for a session with a user I typically remind them of the concepts I am hoping to test, then I quickly and easily give them access to my computer so that they can work their way through the scenarios I am interested in. I have done this type of testing with both prototypes and applications that are in the testing phase within a test environment. Once the testing is complete, I simply take control back and thank them for their time. You can even set up a video camera aimed on your computer to record the entire session allowing for additional review later on (or even better to share with your stakeholders).

This method does require more time to schedule, create your testing scenarios and actually perform the test, but it benefits are worthwhile, as you are able to directly converse with your users working through the application in their own environments without having to leave your office. And you can gather some great data to share with your team in a typically shorter time frame than it would have taken to travel to your users for the same information.

I hope you find something worth considering in the above options for usability testing on the cheap. There is a goldmine of insight you can gather from your users and it is there for the taking…And believe it or not, it doesn’t take a fortune – or a month – to enable them to share it with you! Now go out there and do some testing!

Read Full Post »

Entry hints in web forms and text entry fields are handy little things. They give a user more context about what they might want to enter in a text field. For example, if I was filling out a registration form where I need to enter my date of birth, an entry hint of mm/dd/yyyy gives me the valid format I should enter it in. In giving me this simple hint, I have been saved from wasting my valuable time trying to guess what the appropriate format might be. I like not having my time wasted. 🙂

So how could one go wrong using entry hints? Let’s take look…
Search field and button with search for blog entry hint

I am browsing a particular site’s blog directory and notice the Search capability. It’s even telling me (with an entry hint) that this search is specifically for finding registered blogs. Great! I want to know if my blog is registered, so I’ll simply type in ‘LiveUX’, hit search, and see if my blog shows up in the search results…
No results found message

Huh? All I typed in was LiveUX! How did I get this mishmash of words in my search? Well, it turns out that maybe this entry hint wasn’t as helpful as it could have been. When I retrace my steps, here is what I discover:
Entry hint remains in field on focus


When I put focus on the field (by clicking within it) to begin typing my search criteria, the entry hint does not disappear.
It is up to me as the user to clear out all of the entry hint text before I am able to enter my search criteria. So much for not having my time wasted…

My Recommendation:

Entry hints area great tool that can make a site more user friendly when it comes to completing forms. However, when incorporating an entry hint, it needs to be done correctly. When a user puts focus on the field, the entry hint should disappear, making way for the true data to be entered.

Read Full Post »

Older Posts »