New Relic Labels & Rollups—Now Available on Mobile Devices

When our mobile team was tasked with implementing the labels and rollups feature from the New Relic APM and New Relic Servers products, we were excited to be able to take this great feature and optimize it for use on mobile devices.

Labels and rollups are designed to let users filter down a list of hundreds or thousands of servers and apps to a smaller and more easily digestible subset, and to be able to quickly drill down to the server or app that they care about.

A secondary goal is to let users group—or “roll up”—a specific set of applications and servers to be able to see the health of the entire group at a glance.

Moving to mobile

One of the first things to tackle in moving this functionality to a mobile device is where and how to display these filters and rollups. On the Web implementation, labels and rollups are accessible by tapping in the search bar, and the pop down from that action displays a subset of the available labels and rollups.

labels and rollups screenshot

We explored adding them below the existing search bar, above the table view on the list views, similar to the way they’re implemented on the Web. We also looked at adding them as a full-screen modal type popover. But neither of these approaches seemed as usable as the solution we choose: a slide-from-the-right popover list that is accessible by tapping on a button. This implementation lets you tap on a filter or roll up and see the number of rows change as you filter the items:

labels and rollups screenshot

Another hurdle was deciding where these selected filters/rollups should live. On the Web, these filter boxes live below the search bar, and above the list of filtered applications and servers:

labels and rollups screenshot

Given the limited real estate of mobile device screens, however, we determined that putting them in this spot would take up too much space, and ultimately make this feature unusable. Instead we put them above the labels and rollups list in the slide-from-the-right popover, and added a small indicator icon to the button that opens the popover list. This allows a good trade-off between displaying the selected rollups and/or labels while also preserving the screen real estate of the app/server list:

labels and rollups screenshot

The last item we wanted to tackle was a reworking of the Web version of labels and rollups. Selecting the filters and rollups that a user wants can take time. We decided it would be neat to let users save this filtered view into the menu list, similar to how we show individual plugins, and allow users to quickly navigate back to a saved view:

labels and rollups screenshot

labels and rollups screenshot

Since it might not be immediately obvious where the saved view would live, we added in a little animation of the saved view name traveling to the menu, so that a user would see where to access this labels and rollups filtered view.

Finally, we felt that it would be nice if users had the ability to reopen the app and have it navigate back to the last saved labels and rollups view so that they could quickly get back to seeing the applications and servers that they are interested in.

James Van Metre is a senior software engineer at New Relic. James has been developing professionally since 2004. After receiving his degree from Cal Poly Pomona, he started with writing Java and C/C++ applications before moving to the iOS platform. He has developed apps for the Food Network, Daimler, and the healthcare sector. View posts by .

Interested in writing for New Relic Blog? Send us a pitch!