Projects/Usability/HIG/SOU Workspace/Administer Objects Final Pattern: Difference between revisions

    From KDE TechBase
    No edit summary
    No edit summary
    (5 intermediate revisions by 2 users not shown)
    Line 3: Line 3:
    The user has a set of objects each with the same user-definable attributes available to them. Objects can be added to or deleted from the list.
    The user has a set of objects each with the same user-definable attributes available to them. Objects can be added to or deleted from the list.


    === Examples ===
    === Guidelines ===


    [[Image:AdminObjectExp1.png]]
    * Use a [[../Rich Lists|rich list]] if the set of objects require more detail than the name of the item.
     
    * If the list is editable, place controls at the bottom of the the list. Controls may include new, save, copy, delete, remove, rename, default, import, export.
     
    * If the sequence can be re-ordered, use up/down icons placed with any other edit controls centered and to the right of the list. Drag and drop may also be utilized in addition.
    [[Image:AdminObjectExp4.png]]
     
    * Use a [[rich list]] if the set of objects require more detail than the name of the item.
    * If the list is editable, place controls at the bottom of the the list. Controls may include new, save, copy, delete, remove, rename, default, import, export, move up/down.
    * If the sequence can be re-ordered, use up/down icons placed with any other edit controls at the bottom of the list. Drag and drop may also be utilized in addition.


    === Solution ===
    === Solution ===
    Line 21: Line 16:


    * If there are three or less configuration options for each object, use a [[rich list]] with a drop down (a single click anywhere along the item should expand it).
    * If there are three or less configuration options for each object, use a [[rich list]] with a drop down (a single click anywhere along the item should expand it).
    * For administering themes, see the [[../Administer Themes|Administer Themes Pattern]]


    Example:
    Example:


    [[Image:AdminObjectExp2.png]]
    [[Image:AdminObject1.png]]


    * If there are four or more configuration options, place them in a configuration zone to the right of the list of objects in the dialog.  
    * If there are four or more configuration options, place them in a configuration zone to the right of the list of objects in the dialog.  
    ** Make sure the list and configuration zone are visually related by keeping the space between them to a minimum and aligning them vertically.


    Example:
    Example:


    [[Image:AdminObjectExp3.png]]
    [[Image:AdminObject2.png]]
     
     
     
    Related patterns
     
    [[../Rich Lists|Rich Lists]]; [[../Administer Themes|Administer Themes]]

    Revision as of 17:51, 22 September 2008

    Summary

    The user has a set of objects each with the same user-definable attributes available to them. Objects can be added to or deleted from the list.

    Guidelines

    • Use a rich list if the set of objects require more detail than the name of the item.
    • If the list is editable, place controls at the bottom of the the list. Controls may include new, save, copy, delete, remove, rename, default, import, export.
    • If the sequence can be re-ordered, use up/down icons placed with any other edit controls centered and to the right of the list. Drag and drop may also be utilized in addition.

    Solution

    Factors that influence the pattern:

    • Use the Administer Objects pattern if there are potentially three or more objects in the list. If there are only two or less ever available, expose both the objects and their attributes in the dialog.
    • If there are three or less configuration options for each object, use a rich list with a drop down (a single click anywhere along the item should expand it).

    Example:

    • If there are four or more configuration options, place them in a configuration zone to the right of the list of objects in the dialog.
      • Make sure the list and configuration zone are visually related by keeping the space between them to a minimum and aligning them vertically.

    Example:


    Related patterns

    Rich Lists; Administer Themes