Difference between revisions of "User:Andrew/HIG/ViewAndNavigation"

Jump to: navigation, search
(Actions)
(Viewing and Navigation)
Line 3: Line 3:
 
Viewing and Navigation encompasses the wide variety of behaviors and operations that allow users to navigate the interface and affect the presentation of application content.
 
Viewing and Navigation encompasses the wide variety of behaviors and operations that allow users to navigate the interface and affect the presentation of application content.
  
==Patterns==
+
==Navigation==
 
* [https://techbase.kde.org/Projects/Usability/HIG/Layout/NavigationPatterns Navigation Patterns] - Select navigation patterns appropriate for the application content.
 
* [https://techbase.kde.org/Projects/Usability/HIG/Layout/NavigationPatterns Navigation Patterns] - Select navigation patterns appropriate for the application content.
* Content Patterns - A collection of consistent ways to view application content
+
 
** [https://techbase.kde.org/Projects/Usability/HIG/Layout/Image Images] - Guidelines and patterns for displaying images
+
==Viewing Content==
** [https://techbase.kde.org/Projects/Usability/HIG/IconsAndText Icons and text] - Patterns for consistently showing icons with text
+
* [https://techbase.kde.org/Projects/Usability/HIG/Layout/Image Images] - Guidelines and patterns for displaying images
** [https://techbase.kde.org/Projects/Usability/HIG/Layout/ViewingVsEditing Viewing vs Editing] - Patterns and guidelines for laying out content that is primarily viewed.
+
* [https://techbase.kde.org/Projects/Usability/HIG/IconsAndText Icons and text] - Patterns for consistently showing icons with text
** [https://techbase.kde.org/Projects/Usability/HIG/SearchPattern Search and Filter]- Patterns for exposing search and filter functions
+
* [https://techbase.kde.org/Projects/Usability/HIG/Layout/ViewingVsEditing Viewing vs Editing] - Patterns and guidelines for laying out content that is primarily viewed.
** [https://techbase.kde.orgProjects/Usability/HIG/Layout/Wizard Wizard] - Patterns for guiding the user through a series of step to accomplish a task
+
* [https://techbase.kde.org/Projects/Usability/HIG/SearchPattern Search and Filter]- Patterns for exposing search and filter functions
** [https://techbase.kde.orgProjects/Usability/HIG/Tooltip Tooltips] - Patterns for consistent presentation of information in tooltips.
+
* [https://techbase.kde.orgProjects/Usability/HIG/Layout/Wizard Wizard] - Patterns for guiding the user through a series of step to accomplish a task
 +
* [https://techbase.kde.orgProjects/Usability/HIG/Tooltip Tooltips] - Patterns for consistent presentation of information in tooltips.
 +
 
 +
=== Grouping ===
 +
* [https://techbase.kde.org/Projects/Usability/HIG/GroupBox Groupbox] - Arrange associated controls by using a labeled group box or an unlabeled frame.
 +
* [https://techbase.kde.org/Projects/Usability/HIG/Splitter Splitter] - Allow users to resize aligned groups by placing a splitter between the groups.
 +
* [https://techbase.kde.org/Projects/Usability/HIG/TabControl Tabs] - Use tabs to show related information on separate pages.
 +
 
 +
=== Complex views ===
 +
* [https://techbase.kde.org/Projects/Usability/HIG/ListView List view] - Use a list view to show some items out of one category.
 +
* [https://techbase.kde.org/Projects/Usability/HIG/TreeView Tree view] Use a tree view to show items with a single, natural, hierarchical categorization.
 +
* [https://techbase.kde.org/Projects/Usability/HIG/CustomControls Custom controls] - Always attempt to use the available Qt/KDE controls whenever possible. However follow these guidelines if you really need to create your own widget .
  
 
== Actions ==
 
== Actions ==
 +
* [https://techbase.kde.org/Projects/Usability/HIG/Layout/CommandPatterns Command Patterns] - Select command patterns appropriate for the application command structure.
 
* [https://techbase.kde.org/Projects/Usability/HIG/Buttons Push Button] - Use a push button to initiate an action when the user clicks it.  
 
* [https://techbase.kde.org/Projects/Usability/HIG/Buttons Push Button] - Use a push button to initiate an action when the user clicks it.  
 
* [https://techbase.kde.org/Projects/Usability/HIG/Toggle_Buttons Toggle button] - Use a toggle button to indicate a state, preferably in toolbars only.
 
* [https://techbase.kde.org/Projects/Usability/HIG/Toggle_Buttons Toggle button] - Use a toggle button to indicate a state, preferably in toolbars only.
Line 23: Line 35:
 
* [https://techbase.kde.org/Projects/Usability/HIG/Command_Link Command Link] - Use a command link to navigate between pages.  
 
* [https://techbase.kde.org/Projects/Usability/HIG/Command_Link Command Link] - Use a command link to navigate between pages.  
 
* [https://techbase.kde.org/Projects/Usability/HIG/StatusBar Status Bar] - Try to omit the status bar from your application.
 
* [https://techbase.kde.org/Projects/Usability/HIG/StatusBar Status Bar] - Try to omit the status bar from your application.
 
== Grouping ==
 
* [https://techbase.kde.org/Projects/Usability/HIG/GroupBox Groupbox] - Arrange associated controls by using a labeled group box or an unlabeled frame.
 
* [https://techbase.kde.org/Projects/Usability/HIG/Splitter Splitter] - Allow users to resize aligned groups by placing a splitter between the groups.
 
* [https://techbase.kde.org/Projects/Usability/HIG/TabControl Tabs] - Use tabs to show related information on separate pages.
 
 
== Complex views ==
 
* [https://techbase.kde.org/Projects/Usability/HIG/ListView List view] - Use a list view to show some items out of one category.
 
* [https://techbase.kde.org/Projects/Usability/HIG/TreeView Tree view] Use a tree view to show items with a single, natural, hierarchical categorization.
 
* [https://techbase.kde.org/Projects/Usability/HIG/CustomControls Custom controls] - Always attempt to use the available Qt/KDE controls whenever possible. However follow these guidelines if you really need to create your own widget .
 

Revision as of 14:18, 28 September 2014

Viewing and Navigation

Viewing and Navigation encompasses the wide variety of behaviors and operations that allow users to navigate the interface and affect the presentation of application content.

Navigation

Viewing Content

  • Images - Guidelines and patterns for displaying images
  • Icons and text - Patterns for consistently showing icons with text
  • Viewing vs Editing - Patterns and guidelines for laying out content that is primarily viewed.
  • Search and Filter- Patterns for exposing search and filter functions
  • Wizard - Patterns for guiding the user through a series of step to accomplish a task
  • Tooltips - Patterns for consistent presentation of information in tooltips.

Grouping

  • Groupbox - Arrange associated controls by using a labeled group box or an unlabeled frame.
  • Splitter - Allow users to resize aligned groups by placing a splitter between the groups.
  • Tabs - Use tabs to show related information on separate pages.

Complex views

  • List view - Use a list view to show some items out of one category.
  • Tree view Use a tree view to show items with a single, natural, hierarchical categorization.
  • Custom controls - Always attempt to use the available Qt/KDE controls whenever possible. However follow these guidelines if you really need to create your own widget .

Actions

  • Command Patterns - Select command patterns appropriate for the application command structure.
  • Push Button - Use a push button to initiate an action when the user clicks it.
  • Toggle button - Use a toggle button to indicate a state, preferably in toolbars only.
  • Toolbar - Provide a toolbar for frequently used functions.
  • Context menu - Use a context menu to provide a list of functions or options available to users for the selected item.
  • Menu Bar - Use a menu bar only for applications with a very complex command structure.
  • Accelerators and shortcuts - Support keyboard access by accelerators and shortcuts.
  • Dialogs - Use dialogs carefully and sparingly to clearly communicate the actions to be performed and to avoid unnecessary interruption.
  • Command Link - Use a command link to navigate between pages.
  • Status Bar - Try to omit the status bar from your application.

Content is available under Creative Commons License SA 4.0 unless otherwise noted.