Spotfire 10 design rationale

The goal of the Spotfire 10 redesign was to improve ease of use, give the product family a modern visual expression, and unify the experience between the web and desktop clients. To achieve this, we established UX patterns that allow Spotfire to scale, re-designed the workflow for adding data, and surfaced the Spotfire magic to a larger extent by making concepts like Recommendations, the Data canvas, and Finding more prominent in the user experience. The Spotfire experience should be easy for new users and effective for experienced users.

With Spotfire 10, we took a big step in this direction. At the same time, it is a starting point on a journey where we will address more workflows over time, and ensure that the needs of both new users and experienced ones are met.

Adding data & content browser

Every analytical journey starts with getting data into Spotfire. In versions, pre-Spotfire 10, access points for adding data were scattered, and users first needed to specify the data source type. A big goal with Spotfire was to simplify and unify data access. Spotfire 10 offers one access point for adding data via the content browser. The experience is more consistent and less dependent on the type of data source. Looking forward, we?d like to re-design the remaining UIs involved in the add data workflow to make the whole flow coherent. The theme of consistency is also applied to editing and replacing data where the same UIs as for adding data are used.

The content browser lets users seamlessly switch between searching and browsing for data and other library content. It promotes the reuse of existing data sources and will allow data access options to scale moving forward.

Data Canvas

The Data canvas was made more accessible in Spotfire 10 compared to previous versions, available directly from the authoring bar. A long-term design goal with the Data canvas is to create one home for all data management tasks. By giving an overview of the data table flow, the context for an edit operation is clear, and the effects of, for example, the removal of a node can be previewed. 

Many data operations can be done in-line, directly in the visualizations, and in the data flyout. The Data canvas records every data manipulation done in the application, so you can inspect, add, edit, and delete the data, and also determine what it should look like.

Looking forward, we think the Data canvas will be the home for managing all data-related tasks in Spotfire.

Authoring bar

We want both Spotfire authors and consumers to get a great experience. Gathering the capabilities that only authors can use in a separate UI component, gives Spotfire a cleaner impression. The authoring bar is the natural home for adding data and visualizations, as well as working with the data in the analysis.

Data flyout with inline recommendations

The data flyout is a key component in Spotfire. It?s designed to support several different use cases. It can act as a palette for dragging columns to visualizations, getting inline recommendations, filtering data, and performing specific operations on the selected columns.

Visual expression

Our customers have high expectations of ease of use and visual appeal. Ease of use is completely intermingled with visual design; the visual design can make or break the design. A common customer request on versions pre-Spotfire 10 was a more modern and consistent visual expression. In Spotfire 10 our goal was to address this by introducing a new, modern visual expression in both the installed and web client:

• Prominent UIs in the Spotfire 10 chrome, such as the menu bar and the authoring bar with the content browser, is designed to give quick access to key workflows and give Spotfire a clean appearance.
• We made a big effort to reach UI consistency for elements such as buttons, selected states, and icons.
• New default font. Spotfire now uses Roboto as the default font, a font that displays well on different devices and languages. Roboto also has a high readability in small sizes, which makes it suitable for data-intense visualizations.
• New color schemes for the UI chrome and visualizations. The color schemes are designed to be accessible and top-notch for data visualization.
• New default theme. Larger visualization titles and overall a better-balanced visualization area.
• We added illustrations and skeleton views for empty states to help the user move forward, and also to make in-between states more attractive.

Looking ahead, Spotfire will continue to evolve, and more concepts and workflows will be included in the new visual expression. The goal is to offer a beautiful out-of-the-box experience and ensure that customers can make the Spotfire look and feel reflect their own brand.

Page navigation

In Spotfire 10, page navigation was moved from the top of the screen to the bottom, following the same pattern as Excel and many other BI tools. Here are the key reasons why:

• We have the main menu and icons at the top of the application. When using Spotfire in a web browser, the browser tabs and toolbar add to the density at the top. To avoid overloading the user with several layers of controls in the top section of the screen, and thus drawing too much attention from the visualizations, we decided to use the space at the bottom for the tabs. It gives a more balanced visual appearance and puts focus on the data rather than the chrome.
• Having page tabs at the bottom, and letting them share space with the status information, saves screen real estate.

During the development of the Spotfire 10 UX, we ran lots of usability tests on the new placement, and it performed well. We acknowledge the need for customization and the possibility to design Spotfire applications where page navigation could be placed either in the top or bottom section.

Toolbar & main menu

In numerous usability studies of pre-Spotfire 10 versions, we found that users got overwhelmed by a large number of toolbar shortcuts. We simply got to a point where the pattern didn't scale, and it stole focus from the data being visualized. The first impression was complex rather than inviting. In Spotfire 10 the toolbar only holds a few shortcuts. The use of shortcuts differs widely between our users, and we are focusing on making sure experienced users can quickly get to things they use often, through a personalized experience.

The main menu and its menu items were also re-designed. The categories Data and Visualizations were introduced to enable a more logical and less deep menu structure. To unify the experience between the web client and the installed client, and also enable a richer web experience, the main menu was introduced in the web client as well. 

Two design goals with Spotfire 10 were to unify the experience for adding data and continuing the journey to make the data canvas the natural home for all data management tasks. In previous versions, access points for specific add data and data management workflows could be found in the main menu even though they required a specific context. For example, the user had to start by specifying what data table to make an operation on. To unify and simplify, these menu items were removed in Spotfire 10. Instead, we now have one way to add data, and the data canvas is the home for operations on the data in the analysis. Benefits of this change include a more contextual experience, where the context of the operation is given, as well as a more consistent experience when adding data, regardless of where the data resides.