Chapter 1. The User Interface: Elements of Style

The user interface is the area where the user and an application interact. Any tool or machine has a user interface that is designed according to the user's needs.

A user interface can be as simple as a set of buttons, like those on a telephone or video recorder. In the computer world, a user interface can include a keyboard, a pointing device, and the items that appear on a display screen. The user interface, then, is the ensemble of hardware and software that lets a user and a computer communicate.

The Motif User Interface

The Motif user interface is a graphical user interface for the X Window system. By providing a consistent interface for the UNIX environment, Motif enables users to work with multiple applications that have consistent and similar characteristics.

Motif and the Common Desktop Environment

The Common Desktop Environment (CDE) is a specification and reference implementation of a common UNIX desktop user environment and has many cross-process relationships. By comparison, the process relationship between an application, a window manager, and the X Window System server is much simpler than in CDE.

The area covered by CDE is broad, and although the layering in the system is not as rigorous as that of Motif, the relationship between high-level system components is more diverse. This is primarily due to the ToolTalk extensions that have been built into CDE. (For more information on ToolTalk, see the ToolTalk User's Guide and CDE ToolTalk Messaging Overview .)

CDE, however, uses Motif as its underlying toolkit. Applications developed for CDE must adhere to the same style guidelines as Motif applications running under another window manager as well as to CDE-specific style guidelines (see Chapter 13, “Common Desktop Environment Guidelines” for more information). Figure 1-1 shows the relationship of applications with and without CDE.

Figure 1-1. Relationship of Applications With and Without CDE


History of Motif

Motif was developed to fill a growing need for a consistent graphical user interface for the X Window system. To develop such an interface, the Open Software Foundation (OSF) solicited technical input from the computer industry in 1989. Table 1-1 outlines the history of Motif and the Motif Style Guide.

Table 1-1. History of Motif and the Motif Style Guide

VersionDescription
Motif 1.0 and 1.1Early releases of Motif. OSF published a style guide.
Motif 1.2 – 1.2.3Many technical and behavioral upgrades. Technical upgrades included toolkit enhancement, support for X11R5, additional internationalization functions, and performance improvements. Behavioral upgrades included drag-and-drop capability, tear-off menus, and window manager implementation. OSF also improved the style guide.
Motif 1.2.5Based on Motif 1.2.3. This version was developed exclusively for the Common Desktop Environment (CDE) Version 1.0. A style guide was released with CDE.
Motif 2.0Based on Motif 1.2.3. This version included additional controls, C++ support, international language improvements, and text input modifications. A preliminary style guide, based on IBM's Common User Access, was developed but never released.
Motif 2.1The current version of Motif. Now administered by the X Consortium, this release of Motif combines all the features of Motif 1.2.5 and Motif 2.0. Developers can build their own desktop environment and applications or build CDE 2.1 applications with the same set of libraries. This style guide includes both Motif 2.1 and CDE 2.1 style guidelines. Since CDE 2.1 was built with Motif 2.1, the Motif 2.1 guidelines also apply to CDE 2.1 unless stated otherwise.

Elements of the User Interface

An element is a distinguishable part of the user interface that may or may not contain subelements. The elements in a user interface are:

  • Data

  • Graphic

  • Object

  • Icon

  • Control

  • Choice

  • Composite

  • Workspace

  • Window

The following sections describe each of these elements.

Data

Data is an element whose visual representation denotes its value. For example, text is data that is denoted by readable numbers and letters; a binary file is denoted by 0s and 1s.

Graphic

A graphic is an element that appears as an image. Graphic elements use a unique format that an application recognizes. XBM, GIF, and JPEG are common graphic formats.

Object

An object is an element that visually represents items that have behavior and contents not revealed solely by their visual representation. Objects are often represented as icons, but could be list elements as well. An object generally has a pop-up menu associated with it through which its contents or behavior are accessed.

Icon

An icon is an object represented as a graphic, often with an associated label.

Control

A control is an element whose behavior is predefined and that is generally supported directly by the Motif toolkit implementation. Types of controls include spring-loaded and tear-off controls.

Choice

A choice is a control that is selected by using the SELECT button (or keyboard) to initiate a user action or to toggle a value. There are three kinds of choices: action choices, modal choices, and toggle choices.

Composite Element

A composite element includes one or more of the following:

  • Elements for packaging and tying together behavior

  • Elements for controlling a view

  • Elements for implementing selection scopes

Workspace

A workspace is a container where all elements reside. Workspaces generally contain the following elements:

  • Windows (both primary and secondary)

  • Window icons represented by graphic elements with associated labels

  • Optional window icon boxes

  • Other controls and objects defined by the workspace model, such as objects represented by icons

Window

A window is an element on the workspace that presents a view of an object or conducts a dialog with the user. Windows are used to present objects, messages, or menus, or to prompt for information. The two types of windows are primary windows and secondary windows.

Element Behavior

Users can perform unique actions with elements. That is, elements have behaviors associated with them. Table 1-2 lists some common element behaviors.

Table 1-2. Elements and Their Behaviors

Element BehaviorDescription
SelectedAn element that can be added or removed from the selection scope that encloses it
EditedAn element whose displayed value or contents can be changed through user interaction
StaticA data element whose value cannot be changed by the user
Visual A static element that cannot be selected or activated