Improving Drakxtools usability

From Mandriva Community Wiki

Introduction

This document shows some points that could be improved in the user interface of the Mandriva Linux configuration tools, also called "drakxtools". The main problem seems to be the general lack of policy in the way the tools are designed. As the drakxtools use the GTK+ toolkit, the comments you'll found here are mostly based on the GNOME Human Interface Guidelines. However, they're just good practice, and are relevant whatever desktop environment you're using. Some remarks are common to all the tools, others are specific to a subset of tools. All the screenshots were taken on the minimum accepted window size of the tool, because low resolution devices are an important target (think netbooks), and also because the tools can be run graphically from a command line environment.

General observations

The main criticism is that the drakxtools user interfaces are completely unconsistent. The whole thing screams for policy, because there's several ways to present things to the user, and they don't cohabit well together. The drakxtools are the biggest strength and weakness of the Mandriva Linux distribution.

Strength, because the tools are quite easy to use, desktop-environment agnostic, and quite efficient compared to other Linux distros. They can also be run graphically in a command line environment (use of xdialog ?).

Weakness, because they basically all lack some polish, and bad user interface design prevents from taking habits. Some of them are also barely usable, and can do more harm than good (yes, draknetprofile, I'm talking about you). Here's a list of cures for problems that affect most of the tools.

Action verbs should be used when possible in buttons
Relevant icons, when they exist, should be used in buttons to illustrate the behaviour of the button
When different actions can be performed, a single policy should be used to present the available choices. At the moment, userdrake will show a toolbar, while drakbackup will show a menu made with buttons.
Buttons that will open another dialog should use the elipsis marks (...) at the end of their text
Useless visual separators should be eliminated. For exemple, all these lines that are above the "OK" and "Cancel" buttons at the bottom of the dialogs.
Only some tools have a "help" button.
Each tool should have a consistent naming for the button which exits the tool. Currently we have exit, quit, close. We need a clear naming policy here.
Some tools do have a banner just below the menu bar, others don't. Policy is required here.

Current state and proposed improvements

When possible, I tried to make some mockups of what an impoved version could look like. However, I'm no glade expert, so there still are some visual glitches that I couldn't correct.

Draksnapshot-config

Draksnapshot requires to have several things right :

What needs to be backuped
Where it needs to be backuped
When it should backup
How long it should keep the backups around

Main dialog

Current state:

Proposed design:

(Yeah, at the moment, what needs to be backuped is not shown).

Proposed design (alternative):

This is an alternative mockup, that should be easier for most users. The trade off is that we lose a bit of control on backups frequency and backups dropping policy. However, not much is lost since, for exemple, the time-to-live of each backup should only depend on the space available on the backup media.

"Add path" dialog

Current state:

Proposed design:

The whole dialog should disappear. The main dialog should use the GTK+ file chooser instead, allowing to pick up a directory.

This is done as of draksnapshot-0.16.

Drakauth

Current state:

There's 6 choices using radio buttons. Only 4.5 of them are visible at the smallest size. They should be merged in a combo box. More space could be won by removing the big fat text entry
There's too many useless frame lines. This adds unneeded complexity and distracts from the main controls. There's one above, and one below the Ok/Cancel buttons.
Buttons should use stock icons.

Proposed design:

Replace the radio buttons by a combo-box.
Remove the useless frame lines.
Use a contextual text view to present only the meaning of the currently selected authentication method.
Use stock icons in buttons.

Here's a mockup of what it could approximately look like.

Diskdrake

Warning dialog about possible data loss

Current state:

Note: This is the first dialog presented to the user.

This warning appears in a new dialog, at the top left corner of the screen.
It doesn't use icons in buttons.
The cancellation button is on the right, while on other dialogs, it's on the left.
The labels are "Exit" and "Continue".
The dialog title is "read carefully!". It's highly uninformative.
The dialog text is "Please make a backup of your data first". It gives no useful information: the user doesn't know why he must backup it's data first.
There a useless frame line above the buttons.

Proposed design:

The dialog should pop up above the current dialog, or in the same frame (needs to be defined by policy).
Use stock icons in buttons.
Invert the position of the cancellation and action buttons.
Rename the "Exit" button label into "Cancel".
Use a more informative dialog title, for example "Backup your data".
Use a more informative dialog text. Example: "Wrong actions on partitions can lead to data loss. Make sure to backup your personal data before proceeding."
Remove the useless frame line.

Main dialog in expert mode

Current state:

The "choose action" label is inapropriate. The choices below it should be actions (verbs). "Label" and "Options" are not actions.
In the "Details" frame, information is hard to distinguish from its label.
Main dialog buttons are expanded to their maximum size. While deleting all the partitions should be an infrequent action, the button to perform this action has the biggest surface.
"Clear all" button meaning is unclear. What does the "all" refer to ? All the partitions from the current disk ? Or all the partitions from all the disks ?
"Clear all" and "Use for loopback" have bad capitalization.
It's unclear to what refers the "Details" label. The hda device ? The selected partition ? TODO: use "Partition Details" and "Partition actions".

Proposed design:

File:Diskdrake-expert-mode-after.png

Use verbs for the actions: "Options" becomes "Set options", "Label" becomes "Set label".
Remove unneeded frames around the partition action buttons.
Use a bold font for labels of the "Details" frame, so the user can find faster the information he's looking for. This may be improved by some field alignment rules (to be determined). See the example of gparted.
Resize dialog buttons to fit their content.
Rename the "Clear all" button to specify it's real scope (sorry, but I won't test what it really does, as it's a bit dangerous :-) )