Tricks for SAS Visual Analytics Report Builders: Step 4- Consider the Layout
This is the fifth part of a six part series that describes tips and tricks for building impactful reports in SAS Visual Analytics.
- Draft a Plan
- Choose the Best Chart Bonus: Chart Best Practices
- Focus on What’s Important
- Consider the Layout (this article!)
- Test, Test, and Test Again
SAS Visual Analytics enables you to create compelling, interactive reports that can be viewed by anyone, anywhere. To create impactful reports that resonate with your audience you need to (1) draft a plan for the report, (2) choose the best chart type to display your data, (3) create your reports so viewers can focus on what’s important to them, (4) pick a layout that will best display your data and tell your data story, and (5) test the report to ensure it operates and looks the way you want. In this post, we will focus on the fourth step in the process: Consider the Layout.
You should try to arrange your reports in a way that makes sense for your data story. In general, follow these best practices:
- Limit the number of pages
- Limit the number of objects
- Make more important objects larger
- Consider the placement of objects
- Arrange objects with actions in a logical order
- Use negative space
- Use the default grid layout or containers
Limit the Number of Pages
If you need more than 6 or 7 pages to tell your data story, consider breaking the story into multiple reports. Fewer pages make the report seem less complex and makes it easier for viewers to remember the content presented on each page. Limiting the number of pages can also help improve the performance of the report (especially if the report is viewed on a mobile device).
Be sure to arrange the pages to advance your data story. Consider adding a table of contents page with links to each page for easy navigation or adding an introductory page with useful information (like the company logo if required, the data update schedule, contact information, or a summary of the report).
Select any image to see a larger version.
Mobile users: To view the images, select the "Full" version at the bottom of the page.
In this example, pages are arranged in a logical order that advances the data story. The order in which the pages are presented give the viewers a suggestion on how to access the pages: Table of Contents > Draft a Plan > Choose the Best Chart > Focus on What’s Important > Consider the Layout > Test, Test, and Test Again. In addition, each page has a descriptive name that describes one part of the data story.
In this example, a page is created to function like a Table of Contents for the report. It has the name of the report on the left. On the right, there are instructions for accessing each page, a list of pages with links to each page, details about the data source, and contact information for the report designer.
In this example, a page is created to function like an introductory page. The name of the report is presented along the top (along with an image relating to the company). On the left is an overview of the report and a link to a details page that describes the actions in the report and how to use them. On the right is the update schedule for the report and data, the date of the last update, and contact information for the report designer.
Page links can be used within the report to control navigation or to provide additional details (like with a pop-up page). Using page links for navigation as opposed to page tabs can reduce the chance of overwhelming users with too many details up front. In addition, using page links can also help with accessibility by providing alternative views of the data.
Limit the Number of Objects
Each page should contain a limited number of objects (between 2 and 6). This enables viewers to focus on the data and can improve comprehension of the page. In addition, limiting the number of objects can help improve the performance of the report as each page loads separately.
Make More Important Objects Larger
You should enhance visibility of your report and direct the viewer’s attention to the main point of the story by making more important objects larger on the page and less important objects smaller. The larger the graph or chart, the more time the audience will spend studying it.
In this example, the geo map is the largest object on the page as that is what the viewer should focus on first. The key value objects provide additional details about the selected area and are much smaller than the geo map and the same size as each other. This indicates that they are less important than the geo map, but equally important to the other key value objects. Lastly, the drop-down list control takes up minimal space and spans the top of the report indicating it has some relationship to the other objects. In this case, a viewer can choose a country to filter the geo map and the key value objects.
Pro Tip! Once you have created pages that meet your specifications, you can save them as a page template and reuse them in other reports, which will speed up development time in the future. To save a page as a page template, right-click the page tab and select Save as page template. You can save as many page templates as you want, publish them for other users (if you have the appropriate permissions) and create a thumbnail image of the page to easily identify it later. Be sure you give the page template a meaningful name.
Consider Placement of Objects
The placement of objects on the page is also important. Placing an object in the center of the page or in the top, left corner can create a focal point. This placement, however, can differ based on the location of the audience. In cultures that read from right to left, placing an object in the top, right corner will create a focal point.
In this example, for cultures that read left to right, the section on the left is noted first, then the needle plot in the center of the report, and lastly the list table at the bottom of the report. By placing objects in a specific order, you can direct your viewer’s progress through the page.
In this example, two columns of objects are displayed: the column on the left shows details about South America and the column on the right shows details about Europe. In addition, by placing the key value objects on one row and the bar charts on the next row, the viewer can intuit that those objects should be compared.
Arrange Objects with Actions in a Logical Order
If your page contains objects that use actions, arrange the objects on the page in a logical order. For localities that read left to right, the source object should be placed in the upper left corner and target objects should be arranged to the right of and below the source object. Be aware that this arrangement will be different for cultures that read from right to left.
In this example, the source object (the list control) is placed in the upper left corner. Selecting a country in this object will filter the information displayed in the other objects on the page. In the upper right corner is the geo map, which filters the objects in the lower half of the report. The objects on the bottom have a linked selection action defined, which enables viewers to click a bar or row and highlight the associated data in the other object.
Use Negative Space
Negative space can be used to increase comprehension of the report and enable easier navigation. It also makes for a more visually appealing and elegant report. To increase negative space, avoid adding borders and add margins and padding to objects. As you add margins and padding, remember to be consistent.
In this example, the report on the right contains no negative space. Objects are displayed side by side and on top of each other. This makes the report appear cluttered and can make it difficult for viewers to focus on the details. The report on the left, on the other hand, uses default padding around report objects to provide a buffer. This enables viewers to focus on one chart at a time to fully absorb the information.
Pro Tip! Use caution when modifying the padding for objects from the default. Larger amounts of padding can crowd report content when the report is viewed on small screens or when the zoom is set above 100%. If you modify the default padding, be sure to test the report thoroughly to ensure the content looks how you intended.
Use the Default Grid Layout or Containers
You can use the default grid layout or containers to organize the content on each page.
The default grid layout (4x8) enables you to place objects directly next to other objects with no overlap. All objects on the page are sized to fit on the user’s screen. When you adjust the size of one object, the other objects on the page automatically resize to fill the entire screen.
Alternatively, you can use containers to group objects and provide additional layout options. The prompt container can be used to organize multiple prompts in the report prompt area, the page prompt area, or on the canvas. Using this container saves space in the report and makes it easier for mobile device users to navigate the report. It enables viewers to expand the container to view and modify prompts and collapse the container to view the page content.
The (vertical) scrolling container enables you to create a report that functions like a web page. You can add more information to the page and the charts can be larger. This can improve the viewing experience on a mobile device and enables more clarification of objects because you have space to add text next to each object with a description or additional information.
The stacking container displays objects as if they are in a slide deck, one at a time. This can be used to group related objects. The stacking container can also provide an alternative way to view the same information in a different fashion, like by including a table that presents the information displayed or by including a more mainstream chart. Including alternative views of the same information helps improve the accessibility of the report, especially for users of screen reader technology.
In this example, the prompt container is used to group several control objects (a button bar, a drop-down list control, a list control, and a text input control). The vertical scrolling container displays the content like a web page. Using this container, you can scroll down to view more information and make graphs larger than the page. The stacking container offers an alternative way to display additional details or display the same data using another, more accessible chart type.
Pro Tip! Avoid precision containers as they can cause problems when reports are viewed on different screen sizes. If you do use precision containers, it’s recommended to set the report-level option Set fixed report size to specify a fixed size for the report. If you use this option, however, be sure to test your report on all screen sizes.
Summary
After you have drafted a plan for your report, selected the best charts to display your data, and enabled your viewers to focus on what’s important, you need to consider the layout of each page. As a best practice, you should limit the number of pages and objects and layout objects to direct the viewer’s focus to your data story.
In the last part of this series, we discuss testing the report.
References
Tips and Techniques for Designing the Perfect Layout with SAS Visual Analytics by Ryan Norris and Brian Young
Tips for Building Rich Interaction in Your SAS Visual Analytics Reports by Jeanne Marie Tan and Sierra Shell
Find more articles from SAS Global Enablement and Learning here.
