Using JMP 12 Interactive HTML reports on mobile devices
Apr 22, 2015 12:39 PM
In a previous blog post, I described our goals for JMP 12 Interactive HTML reports, to support:
In this blog post, I'll describe in detail our user interface for Interactive HTML reports on mobile devices.
Many customers want to share JMP reports with colleagues on iPad or Android tablets. However, these devices have different requirements than the desktops.
For example, on a desktop, clicking with a mouse selects an object, and pressing the Ctrl or Shift key selects multiple objects. On mobile devices, there is no mouse, and no Ctrl or Shift keys.
We don't know whether our customers intend to display their Interactive HTML reports on desktops or mobile devices. They may want to use both. So, we produce HTML reports that play well on any device.
To achieve this, we employ a Mobile First user interface design. That is, we ensure that our reports run well on mobile devices, and then add features as needed to improve performance on desktops.
Single and Multiple Selection
To control selection, there is a pair of toggle buttons at the top of the report. When toggled down, the left button provides single selection. In this mode, clicking or tapping on an object selects that object, and deselects all others.
When toggled down, the right button provides multiple selection. In this mode, clicking or tapping on an object selects that object, and does not deselect others. To deselect objects, click or tap in an empty area of the report.
On a desktop, you can still use your Ctrl or Shift key to temporarily initiate multiple selection.
Identification and Brushing
Identification and brushing are important techniques in exploratory data analysis. We provide another pair of toggle buttons to switch between these techniques.
When the identification button is toggled down, on a desktop, you can hover with your mouse over any object, and display a description of that object.
On mobile devices, you have no mouse, so you can't hover. But you can tap on any object, to select the object and display the same description.
In graphs, identification is typically used to identify points. In tables, this feature displays useful descriptions of the statistics.
When the rectangle button is toggled down, you can drag a rectangle, or brush, in any graph to select rows of data.
The selected rows are highlighted in all graphs.
The brush is persistent. It remains displayed until you click or tap in an empty area of the report. Because it persists, you can change the size and shape of the brush by simply dragging its corners.
When both the brushing and multiple selection buttons are toggled down, you can do additive or subtractive brushing. This exploratory technique can be very efficient, to "paint" the graphs with selected or deselected data.
Outlines and Menus
An excellent example of a "Mobile First" design is Forecast, the weather forecasting website. You can use this web application on your phone, your tablet or your desktop; it works well on any device.
We've used a similar approach in the organization of JMP reports. Our outline buttons are large simple targets, which you can easily hit with either your mouse or your finger.
Our menu system is full-featured, including sub-menus, check box and radio states, enabling and disabling.
This menu system gives customers more power to interact with our new HTML Bubble Plots and Profilers. It also gives us a growth path to support even more interactivity in future releases.
Try It Yourself!
We hope that you find our new mobile-friendly user interface fun and efficient to use. To explore some Interactive HTML reports, please try our Examples, which we built with the new Auto Publish addin.