Define user interface requirements

  • 6 minutes

UI requirements relate to how reports are consumed and to the appearance and behavior of reports. Aspects to consider include form factor, input method, style and theme, and accessibility.

Form factor

In the context of report design, form factor describes the size of the hardware that's used to open reports, and to page orientation (portrait or landscape).

Image shows an example of a report displayed on a large screen compared with the same report refactored to display in a mobile phone.

Generally, today's computers are accompanied by large-sized monitors and multiple monitors. Large monitor screen sizes are ideal for viewing reports in web browsers, especially when they include several visuals or complex visuals by using landscape orientation.

Mobile devices, which are typically used when the report consumer is away from their desk, have a smaller form factor. Phones and tablets display content in portrait orientation by default. Smaller form factors demand a different design approach compared to reports that are designed for larger form factors. Accordingly, when you design for a smaller form factor, strive for fewer and less complex visuals. Also, visuals should be large to help ease viewing and interactivity.

Some mobile devices can encompass augmented or mixed reality technologies, allowing head-mounted devices to display reports that are superimposed over the reality of the surroundings.

Image shows an example of stock on hand report viewed by a warehouse worker wearing an augmented reality device.

Occasionally, the design of a report that's intended for a large form factor can be refactored to create a mobile view. In this case, the mobile view might contain a subset of visuals from the full-sized report.

Input method

When you define UI requirements, also consider input methods that are supported by devices or applications.

While a computer has a keyboard and pointing device (mouse), mobile devices rely on common gestures, such as tap, double-tap, drag, pinch, spread, or press. Report consumers who use mobile devices can also use on-screen keyboards, voice control, or barcode and QR code readers. Augmented or mixed reality devices rely heavily on hand gestures or body movement.

Knowing how your report consumers interact with reports should influence your report designs. Consider the number of visuals that display together on the page, the complexity of visuals, spacing between visuals, and the use of interactive design elements such as tooltips, slicers, buttons, and filters.

When a report is embedded in an application, input can be received programmatically from the application. For example, when the application user opens a page to view history for a specific customer, a filter automatically passes to an embedded report to filter and display sales history for that customer.

Style and theme

UI requirements should also consider style and theme. Strive to design reports with a consistent and distinctive appearance that's determined by a deliberate theme.

The report theme should express your organizational branding or aim to complement it. At a minimum, the theme should include:

  • A brand mark or logo symbol.
  • A palette of colors that align to, or complement, organizational branding. The colors should also be sufficiently different so that, when applied to visuals, they provide appropriate contrast when they appear side by side.
  • Text settings, including font selection, sizes, and color.

To manage style and theme changes effectively and efficiently, design reports that use images and themes that are stored in a central repository. This approach improves change management: Changes that are applied to the repository will automatically cascade through to reports.

Accessibility

UI requirements should also factor in accessibility. Reports need to communicate to the broadest audience possible. So you should consider how report consumers with no-to-low vision or other physical disabilities can fully experience the reports.

While you might not be aware of report users with accessibility issues today, it's a good idea to design for accessibility from the outset. Accessibility requirements can influence your report designs in terms of form factor, input method, and style and theme.

To support people with low or no vision, consider using:

  • Clear and large-sized fonts.
  • Well-spaced and large visuals.
  • Clear and distinctive contrasting colors.
  • Intuitive report navigation that can be understood by keyboard and screen readers.

Some physical disabilities can inhibit or prevent report consumers from fully interacting with reports in the way that you intend. When possible, ensure that you offer alternative paths for consumers to follow so they can achieve the interactive design outcomes. For example, add alt text to visuals for screen reader support, and set tab order of report elements for keyboard navigation.