% vim:set tw=68:
% $Source: /home/bricks/source/greater/cvs/greaterrepository/GREAT-ER/doc/gui_styleguide.tex,v $
% $Id: gui_styleguide.tex,v 1.6 2003-07-17 16:04:18 tkoester Exp $

\documentclass[10pt,a4paper]{article}
%\usepackage{german}
\usepackage[latin1]{inputenc}
\usepackage{parskip}
\usepackage{times}

\usepackage{fancyhdr}
\pagestyle{fancy}
%\fancyhf{}
\lhead{GREAT-ER 3.0}
\rhead{GUI Styleguide}

\newcommand{\SPACE}{\emph{SPACE}}
\newcommand{\SMALLSPACE}{\emph{SMALLSPACE}}
\newcommand{\BIGSPACE}{\emph{BIGSPACE}}

\begin{document}

\title{{\large GREAT-ER 3.0}\\
GUI Styleguide}
\author{Thomas Arendsen Hein}
\date{\today}
\maketitle
\vfill
\tableofcontents
\vfill
\newpage


\section{Introduction}

This styleguide does not aim to be a complete GUI guideline, but
should only list special cases where common sense does not result in
a consistent user interface. If in doubt, apply common sense or
consult general user interface guidelines.


\section{Alignment and Placement}

Grouped controls should be aligned horizontally or vertically.


\subsection{Buttons}

Dialog box buttons should be grouped horizontally and placed at the
bottom of the dialog box with no other controls to the left or right
of them.

If the dialog box is small, they should be centered horizontally. If
it is big enough to add at least one more button, the button group
should be in the lower right corner.

A group of dialog box buttons must be one of the following
combinations in the given order:

\begin{itemize}
\item OK
\item OK, Cancel
\item OK, Apply, Cancel
\item OK, Apply, Revert, Cancel
\item Yes, No
\item Yes, No, Cancel
\end{itemize}

Other buttons must not follow these restrictions. They should be
aligned and placed like other controls and can contain any text.
They should not be placed at the end of a dialog box.

\subsection{Static Text}

If static text is used as a label for a control, it may be placed
above or to the left of the control.

Static text above controls should be left justified with it.

Static text to the left of a control must be right justified with
other static text of the same group of controls. It should be right
justified with static text of other controls if possible.
Additionally it should be centered vertically with the first line
(or item) of a control.


\section{Dimensions}

Dimensions of controls should generally not be set explicitly, but
should be calculated dynamically by the used GUI toolkit from a
default value which will be modified by alignment constraints.

Grouped controls of the same type should have the same dimensions.

Grouped controls of different types should share at least one
dimension, if possible.


\subsection{Text Entry}

The minimum dimensions of multiline text entry controls should
explicitly be set to an appropriate size.

\subsection{Icons}

The dimensions of icons can be of any size. Icons of the same type
(e.g. toolbox icons, status icons) should share the same dimensions
through an application. Where appropriate, e.g. in error message
dialogs, predefined system icons should be used.


\section{Spacing}

Generally two distances are used:

\begin{description}
\item[\SMALLSPACE] is 4 screen pixels wide or high.
\item[\SPACE] is 10 screen pixels wide or high.
\item[\BIGSPACE] is two \SPACE s wide or high.
\end{description}


\subsection{Frames}

\subsubsection{Windows and Dialogs}

There should be at least a \SPACE\ between any item in a window or
dialog box and the edge of the drawable area, i.e. inside the window
or dialog border.

There must be a consistent spacing between the border of the window
or dialog box and its elements.

\subsubsection{Notebooks}

There should be a \SPACE\ around a notebook. There should be at
least a \SPACE\ between any item in a notebook and the edge of the
notebook.

\subsubsection{Group box}

There should be a \SPACE\ around a group box (wxStaticBox in
wxPython; GtkFrame in GTK+). There is one exception: The distance to
another group box may be reduced to \SMALLSPACE\ if appropriate.

There should be at least a \SMALLSPACE\ between any item in a group
box and the inner edge of the drawable area of this group box.


\subsection{Controls}

Controls should have a \SPACE\ between them. If a group of controls
should be seperated from another group of controls, a \BIGSPACE\
should be used.

\subsubsection{Buttons}

If buttons are grouped horizontally, there should be a \BIGSPACE\
between each button. If they are grouped vertically, there should
only be a \SPACE\ between them.

\subsubsection{Text Entry}

If text entry controls are grouped, there should be a \SPACE\
between each of them. Labels for them should be placed at least
\SMALLSPACE\ away.

\subsubsection{Radio Buttons and Check Boxes}

If radio buttons or check boxes with their label are grouped
horizontally, there should be two \SMALLSPACE\ between them.
If they are grouped vertically, there should only be a \SMALLSPACE\
between them.


\end{document}

