Sunday, November 2, 2014

Statement User Interface (SUI)

While working on the "Extract Molecules" feature for ThumbFish Beta.3, I experimented with a new kind of dialog based user interface. I named it "Statement User Interface" because it displays a statement to the user that describes the current operation. The statement is displayed in a dialog responsible for carrying out the operation. Certain parts of the statement are modifiable i.e. can be changed by the user. These modifiable parts decide how the operation is carried out. The benefits of using statement UI are:
  • It eliminates the use of having separate preferences for operations. 
  • Eliminates the use of popping validation messages because the statement describes what the operation is going or not going to do. 
  • Provides a single place to fine tune and execute an operation. 
For e.g. the following statement can describe an import operation (highlighted part is configurable):

Import {N|ALL} records from {C:\Documents\Somefile.mdb}. Duplicate records will be SKIPPED. Execution will STOP|CONTINUE if an invalid record is found. Records will be imported as TEXT|HTML.

The following screenshot is taken from ThumbFish "Extract Molecules" command and shows how the statement UI is implemented. There are five configurable parts in the statement.
  • extract-count and extract-filename-format expands the dialog and displays controls for additional input (as shown in the dialog).
  • extract-format and overwrite-skip option display a menu with available options because the choices are limited.
  • output-folder option opens a "folder select" dialog allowing the user to select the output directory where the extracted files will be placed.


The above dialog clearly states what the extract operation is going to do and what will happen in case the files already exist. More options can be added to the dialog based on the operation. The default and user selected values for these options can be saved and loaded from storage so that the dialog remembers the last selected values. A default button can also be provided to automatically the values to their default value.

No comments:

Post a Comment