Gallery2:Usability Issues:Guidelines

Photo-Page

On a photo page a single item is displayed in detail. Typically this page focuses on only one image. Every theme provides the possibility to move forward to the next Photo-Page in this album, or back to the previous one.

Guideline: Arrange buttons or links to the next or previous Photo-Page on a fixed place on the page, they should not move dependent of item-size.

Rationale: Users who move from one Photo-Page to the next or backwards could find it bothering to have to move the mouse, even if it is only a small movement.

Visual Distinction between albums and items

The delete- or move-item dialog contains a step where several items are displayed in a list. There are albums as well as other items like photos or other files.

Guideline: Differences between items in lists should be obvious. Visual distinctions like background-color or borders around items should reveal the difference. Information like item type, filename, file size, creation time, upload time, and last modification time should be displayed for each item, when an action can be performed.

Rationale: Users need the mentioned information to make a decision like deleting or moving an item. Fast visual feedback makes it easier for them to get an overview about the presented items.

Visual Distinction between view-modes

- Do not take this guideline for granted. It should first be verified by tests or a survey! -

toggle-links

Gallery admins have the possibility to change their view on albums or items to the view of a guest. So they can test how it looks like to be a guest. When changing view mode from admin to guest, mostly fewer options/actions for items/albums are possible.

Guideline: Make the difference between the two view-modes visible. The user should know in which mode he is. The visual hint to the mode should be bound to the changing-mode-buttons.

Rationale: When working with or in different modes it is much easier to recognize the present mode, when it is indicated with more than "toggle-links" somewhere on the page. A simple border or special background can make the present mode obvious to the user. So he doesn't need to search for the toggle-links.

Design of dialog pages

Many pages in Gallery include configuration dialogs. Often, the dialogs are designed in very different ways. Some of them are put into tables, while others are just a list of check boxes. Page size, arrangement of interface elements, separation and grouping of sections, use of colors, use of input methods (AJAX or static) can differ from page to page. To decrease usability problems, all dialogs should be designed in a consistent manner.

Guideline: Design dialogs in a consistent manner.

• Don't use tables for grouping dialog sections, except if it is always the same interface element. (e.g. if all your configuration can be made with check-boxes)
• Group related input elements into sections
• Provide visual separation between the sections
• Provide section headings and make them obvious to the user
• Insert "info" links to explain options that are not easy to understand