Designing a User Interface? Take the Hint!

When we create a custom window in JMP we basically design a layout for a variety of user interface building blocks referred to as display boxes.  Most of these are quite logical – a button box displays a button, a radio box displays a radio button, a list box displays a list, and a text box displays some text.

Sometimes when we display text, we want the text to be entered by the user, so we use a text edit box.  Below is an example of a text box acting as a label to a text edit box:

displaybox

I recently discovered the hint property associated with a text edit box.  Has it always been there as as undocumented feature, or is it quite new?  I’m not sure, but it’s a terrific example of a small and subtle feature of a user interface element that can dramatically enhance the user experience.  I was producing a form that included an option for specifying a search string.  This is what the top of the form looked like:

filter

It’s very similar to the previous example, but includes a button to the right which allows the contents of the field to be cleared.  Below this filter is a list (not shown) and the purpose of the text is to provide a search string which will act to reduce the size of the list so that it only includes list items matching the search string.

The hint property of the text edit box has a dual role.  In my opinion it really improves the aesthetics of the user interface, and secondly, as implied by its name, it is an opportunity to provide additional guidance to the user:

hint

The hint is ghostly in nature.  As soon as the user moves the mouse to the text field, the hint disappears so that is doesn’t interfere with the user’s typing.

One thought on “Designing a User Interface? Take the Hint!”

Leave a Reply

Your email address will not be published. Required fields are marked *