Panel Design for G Web Development Software Projects

Refer to the following table for best practices for designing panels in LabVIEW NXG

Guideline Required or Recommended? Details Example(s)

Avoid using all capital letters in labels or panel documentation.

Recommended

Capital letters can make text seem more important than necessary.

N/A

Position the panel in the top left, spatially even with the controls palette.

Recommended

If you position the panel in the top left, you can prevent the user from opening the panel to a position that is potentially off the screen or otherwise difficult to see and read.

N/A

Display the labels of all controls and indicators on the panel.

Recommended

Make sure the labels of all controls are meaningful to increase clarity and ease of use for users.

N/A

Set reasonable default values for controls.

Note Default values you set for controls automatically append to the terminal name. The Context Help displays the default value when you hover over the control.

Recommended

Make sure the default values you set do not generate errors when you run the top-level VI.

Note When possible, avoid setting default values for indicators such as graphs, arrays, and strings. Setting default values for those types of indicators wastes disk space when you save the VI.
N/A

Use default values strategically and logically.

Recommended

Planning the use of default values can save space and simplify code.

N/A

Avoid displaying labels on the panel for buttons that display Boolean text.

Recommended

Only display the Boolean text for these buttons.

Note If you click the boolean text of a checkbox, the value of that checkbox toggles. The value of that checkbox does not toggle if you click the label.
N/A

Format any text on your panel appropriately.

Recommended

  • Use default fonts when possible.
  • When the alignment of characters is critical, use monospace fonts for string controls and indicators, and space the characters equally.
  • For free labels, only use carriage returns to separate paragraphs.
  • Resize labels to enable word wrapping.
  • Include extra space in free labels to allow for longer or larger strings due to font differences in localized languages.
N/A

Group and arrange controls logically and aesthetically.

Recommended

  • Consider the arrangement of controls on panels, and keep panels simple to avoid confusing users.
  • For top-level VIs that users can see, place the most important controls in the most prominent positions.
  • For subVI panels, place controls and indicators of the subVI to correspond with the connector pane pattern.
Note Regardless of the location of the error cluster connector pane connection, place error cluster controls and indicators at the bottom of the panel.
N/A

Use the Align and Distribute options in the Layout pull-down menu to create a uniform layout.

Recommended

N/A N/A

Visually group objects with related functions.

Recommended

  • Use decorations from the Drawings palette.
  • Use clusters to group related data. Avoid using clusters for only aesthetic purposes.
N/A

Configure path inputs and outputs appropriately.

Recommended

  • Use path controls instead of string controls to specify the location of files or directories. Path controls and indicators work similarly to strings, but the software formats paths using the standard syntax for the platform you are using.
  • Avoid hiding the Browse button on path controls.
  • Set the browse action correctly for the Browse button on path controls in the Item tab.

If you set a browse action in which a user needs to select a directory, select Select Folder from the Action drop-down menu in the Item tab.

Determine whether an enum or ring is more effective than a Boolean.

Recommended

An enum may be more efficient in cases where two states may increase to more states.

N/A

Arrange items in a cluster vertically.

Recommended

To arrange items vertically, select Vertical from the Arrange drop-down menu in the Item tab.

N/A

Use imported graphics to enhance the panel.

Note This guideline is specific to user interfaces.

Recommended

Import graphics and text objects to use as panel backgrounds by dropping URL Image from the Decorations palette and navigating to the image on the Item tab.

N/A

Use color logically, sparingly, and consistently, if at all.

Note This guideline is specific to user interfaces.

Recommended

  • Never use color as the sole indicator of device state.
  • Use a minimal number of colors, emphasizing black, white, and gray. Color can be difficult to discern or distract the user from important information.
  • Use light gray, white, or pastel colors for backgrounds. Use bright, highlighting colors only when a term is important, such as an error notification.
  • Because multi-plot graphs and charts can lose meaning when displayed in black and white, use different plot styles, such as dots, and dashes, in addition to color to further differentiate multiple plots.
  • A yellow, green, or bright orange background makes it difficult to see a red danger light.
  • People with some degree of color-blindness can struggle to detect certain color changes. You can upload an image of your panel to an online color blindness simulator to test your panel under various degrees of color blindness.