Design and Layout:Layout:Windows

From KDE-HIG_Wiki


Window Layout

Single Document Interface, Multiple Document Interface, Tabs, Split Panes - The decision which window layout to use depends on the type of application and the context of usage.

Sidemark: The "Document Interfaces" described in this section may also be used for applications which are not document-based.



Tabbed Documents Interface

A tabbed documents interface (Web Browser).
Enlarge
A tabbed documents interface (Web Browser).
A tabbed documents interface (Text Editor).
Enlarge
A tabbed documents interface (Text Editor).

A Tabbed Document Interface (TDI) is one that relies on tabbed panes to hold child windows. In its original design, the Tabbed Document Interface worked as the Multi Document Interface (MDI). Compared to MDI it has the advantage that the list of documents is permanently visible, and the sequence when cycling through the documents is defined by the sequence of tabs. But regarding window arrangement, this original approach is even more limited than MDI: it is only possible to display one child window at a time in the parent window, they cannot be tiled or cascaded (typical MDI operations).

Today, when talking about Tabbed Documents Interfaces, a mixture of Multi Document Interface (MDI) and Single Document Interface (SDI) is meant: While documents may be held as tabs in a parent window, single documents can be detached, becoming a parent window themselves. When opening or creating a document, it can either be added to an existing parent window, or it represents a new one.

To organize multiple documents in a parent window, a tabbed layout, or a sidebar holding the list of document names or icons can be used.


Guidelines

  • When there are no compelling reasons to use either MDI , SDI or CSDI , use the Tabbed Documents Interface with detachable documents.
  • Provide multiple ways of creating new documents and windows, as well as detaching and docking them.
  • For example
    • New Tab and Remove Tab buttons on the tab bar,
    • New Tab ,Remove Tab and Detach Tab in a tab's context menu.
    • possibly drag and drop to move tabs within and between windows.
  • todo: Screenshots of menu order, items, etc.
  • Allow the user to modify the sequence of the tabs within a window using the context menu, and possibly drag and drop.
  • Especially when it is expected that the list of tabs in one window becomes very high, use a sidebar holding a document list rather than a tabbed pane.
  • When using a sidebar, make sure it cannot be hidden completely. Otherwise the user runs in danger not to find a specific document.
  • When cycling through a parent window's documents, Control-. activates the next document, Control-, the last one. The sequence is determined by the tab arrangement.


Rationale

The Tabbed Documents Interface as a mixture of MDI and SDI combines the advantages of both. The user is free to decide whether to arrange multiple documents in one window, or each document should reside in its own window. When there is a large number of documents, related documents can be grouped in one window to facilitate the navigation between windows.
Still, there are problems concerned with this approach. Users who do not know the concept of detaching and docking documents to windows may have problems arranging the windows in a way that best fits their needs. When it is not clearly visible which documents are held by a window, a user may have problems finding a specific one. Therefore it is very important to clearly indicate how to arrange, detach and dock documents, and to provide a permanent list of document names held by a parent window (e.g. tab titles, list in sidebar).



Single Documents Interface

 A single document interface (word processor).
Enlarge
A single document interface (word processor).

A Single Document Interface (SDI) is a way to organize graphical applications into individual windows that are handled separately by the operating system's window manager. That usually means that each window is displayed as an individual entry in the operating system's task bar or task manager. The window does not have a background or parent window that contains its menu or toolbar, but each window has its own menu and toolbar.


Guidelines

  • SDI should be applied if users are expected to open a small number of documents at a time (e.g. word processor).
  • If users are expected to open a large number of documents concurrently, Tabbed Document Interfaces (TDI) with detachable documents should be used as it allows the user to arrange similar documents in groups.


Rationale

For a long time, SDI has been considered as the ultimate solution of all Multi Document Interface-related usability problems.
But the usability of SDI encounters difficulties when more than five windows of the same application are open at the same time. This may rarely be the case for classical Office applications such as KOffice. But for file and internet browsers, spread sheets, or simple text editors this happens frequently.
An unarranged collection of windows makes it hard to understand contentual and logical relationships between windows. In the case of internet browsing, for example, it is difficult to group documents containing related topics.
Furthermore, many window managers group windows belonging to one application in the task bar. Active document titles are then not visible in the first run. Only when clicking the application's task bar entry the document titles become visible.
With an increasing number of windows on the same desktop, window-cycling becomes more difficult and less effective. A fast change between windows is almost impossible.



Controlled Single Document Interface

 A controlled single document interface (GUI Builder).
Enlarge
A controlled single document interface (GUI Builder).

In the Controlled Single Document Interface (CSDI), there is a parent window containing menus, toolbars, and sometimes a window list. In contrast to Multi Document Interface (MDI), the child windows are not resided in the parent window, but are implemented as individual windows. As in Single Document Interface (SDI), they are handled separately by the operating system's window manager. That usually means that each window is displayed as an individual entry in the operating system's task bar or task manager.


Guidelines

  • Use CSDI only if
    • it is expected that often, a high number of windows will be open at once (cases where SDI is hard to navigate),
    • a free arrangement of the windows is required (cases where a pure Tabbed Document Interface (TDI) is inappropriate),
    • a general management of the single windows is useful (e.g. Instant Messenger, graphics application),
    • and it is expected that users will frequently have to change between this and other applications (e.g. Instant messenger).
  • If you use CSDI avoid focus problems by making sure that
    • document-specific menus and options are provided in each document window,
    • while general menus and options which are not document-specific are provided in the parent and in the child windows.
    • Update document-specific control and properties windows to reflect the current document on focus changes.
  • If you use CSDI allow only one instance of the application.
  • If you use CSDI, consider offering a tabbed layout for the child windows as an alternative.


Rationale

The Controlled Single Document Interface holds a high danger of focus problems if document-specific menu items or options reside in the parent window: When the user moves the mouse away from the document window in order to perform an operation he has to activate in the parent window, the document window loses focus. As a consequence, the document in which the operation will be performed is not marked any longer.
If the user has activated Focus follows mouse , this problem the focus problem may have even worse results: While moving from the document window to the parent window, the user may pass other documents. As the focus follows the mouse, the operations will be performed in the last focused document window, which is not necessarily identical with what the user expected.
The only solution is to clearly separate between document-specific and general actions, options and settings. This applies to the menu, toolbars and other interaction elements. For example, is document-specific and must therefore not reside in the parent window. Instead, it has to be provided in the menu of each document window. is a general item and should be placed in both, parent and document windows.
An exception to this rule may be graphics applications which are making use of CSDI. By providing its own toolbox in each document window, the advantage of CSDI would vanish. However, by providing appropriate mechanisms, it must be made sure that the document windows are not confused while operating on them. For example, a small preview of the active document can be given in the parent window.



Multi Document Interface

 A multi document interface (GUI Builder).
Enlarge
A multi document interface (GUI Builder).

In a Multiple Document Interface (MDI) all windows reside under a single parent window (usually with the exception of modal windows). In contrast to the Tabbed Document Interface , the child windows can be arranged freely within the parent frame. Often, special View options are provided such as Tile or Cascade . In a classical MDI, only one instance of the application may be started.

The most important MDI is the Desktop itself: A parent window which holds all graphical applications.


Guidelines


Rationale

The disadvantage of MDI usually cited is the lack of information about the currently opened windows: In order to view a list of windows open in MDI applications, the user typically has to select a specific menu (Window List or something similar), if this option is available at all.
The other major disadvantage are the poor opportunities to arrange windows inside the parent window. The user's freedom to arrange documents of the same and other applications next to each other is restricted significantly.
Additionally, practical considerations argue against Multiple Document Interfaces: Why should every application implement its own window manager if the overall window manager can handle this? The overall window manager can have options like virtual desktops which will make an MDI application even harder to integrate as the user expects it to behave similarly to the native window manager.
In recent years, applications have increasingly added task bars and tabs to show the currently opened windows in an MDI application, which has made the first criticism somewhat obsolete. In this document, a different name is used for this interface, Tabbed Document Interface (TDI) . When tabs are used to manage windows, individual ones can not be resized.


Split-Paned Windows


Windows with Sidebars



See Also

Related To

Keywords