Tuesday, December 29, 2009

The latest bright idea

Today I was leafing through Alan Cooper's "About Face - the essentials of user interface design". I bought this book years ago - the cover bears the proud sticker "Covers Windows 95" - and I try to read it every few years. I see that the book is now in its third edition, but the ideas presented in the original edition are just as valid now as they were 14 years ago.

Cooper pours much criticism on the overuse of modal dialog boxes, especially those which report on some error. What really annoys him is when a dialog box pops up to inform the user, and the user has to press OK! Here is the paragraph (page 131 in my edition, from chapter 11) which caught my imagination today:

When the program has information or feedback for the user, it has several ways to present it. The most common method is to pop up a dialog box on the screen. This technique is modal: it puts the program into a mode that must be dealt with before it can return to its normal state, and before the user can continue with his task. A better way to inform the user is with modeless feedback.

In the management program which I have just completed (for the time being), there are several dialog boxes which the user fills in. This is a justifiable use of the modal dialog box. When the user presses the 'ok' button, telling the dialog that the data can be entered into the database, a few checks are made, ensuring that key fields have values in them (for instance, a field holding a therapist's name should not be left blank). The check itself is very easy, but should the field be empty, a modal dialog box pops up, telling the user that the field is indeed empty. This is exactly what Cooper was writing about.

How can the program provide modeless feedback? The solution is actually very simple: add a statusbar to the dialog; the statusbar will normally not contain any text and its colour will be neutral.  When the 'ok' button is pressed and an empty text field is found, the error message is displayed on the statusbar, whose colour has now been changed to red. At the same time, the focus returns to the empty edit box. As soon as the user presses a key while the focus in on the edit box, the statusbar reverts to its original state. This solution requires a variable declared global to the form, which I've called 'errflag'; initially its value is false. Here is the specific code:

procedure TEditTherapist.OKBtnClick(Sender: TObject);
begin
 if dbedit1.Text = '' then
  begin
   with sb do
    begin
     simpletext:= 'You must enter a value for this field';
     color:= clRed;
     errflag:= true;
    end;
   dbedit1.setfocus;
   modalresult:= 0;
   exit
  end;
end;

procedure TEditTherapist.DBEdit1KeyPress(Sender: TObject; var Key: Char);
begin
 if errflag then
  with sb do
   begin
    simpletext:= '';
    color:= clSkyBlue;
    errflag:= false
   end
end;

No comments: