4 things to know to create an intuitive drill-down interface

Drill-down charts are everywhere. They help maximize business information by presenting the data in digestible chunks. While implementing drill-down charts is no rocket science (shameless plug: especially with our first-of-its-type LinkedCharts concept), the interface for using them still has some way to go. Haven’t you ever come across a report where you had no idea that the charts could be drilled down into? Or you drilled down multiple levels into the chart only to lose track of where you are? In this post, I will be talking about how the interface for drill-down charts can be made intuitive so that using them is a breeze and your users don’t face the same problem you did.

Understand the data thoroughly

What data are you plotting using the drill-down charts? Sales figures? Production figures? Will you allow drill-down from annual figures to quarterly figures, and finally to monthly figures? Or directly from annual to monthly? Or will you be having category-based drill-down like continents to countries? Having answers to all these questions is essential to create an intuitive drill-down interface and plan the overall layout. It helps understand what chart type is needed at each level and know how many data sets will be displayed at each level.

Understand what chart type is needed at each level

Typically, the chart type remains the same at all levels but there are a number of cases where the type of data analysis needed changes from one level to another. For example, you are displaying sales comparison starting with a column chart for comparing the annual sales over 3 years and these columns can be drilled down into for showing the monthly comparison for that year. Now for the monthly comparison, if you want to highlight the overall trend of sales rather than individual figures, you would need a line chart instead of the column chart. Once you know the chart type required at each level, you can plan the layout and the space required accordingly.

Know how many data sets will be displayed at each level

With time-based drill-down, you know the exact number of data sets that will be displayed at each level. With category-based drill-down, you need to have a rough idea of the number of data sets. This helps ensure that the space you have allotted for the chart will not be overshot or get cluttered with too many data sets being displayed at the same level.

Clearly indicate the chart has drill-down

While this may sound obvious, it is pretty apalling to see charts where the user has no idea that he can drill down into them. Even we have been guilty of this in some of our demos but over time, we have learnt this important lesson. Have a message at the top clearly indicating that you can drill down into the chart – the sub-caption typically works well for this. This could be something as simple as “Click on a column to drill-down” to something more descriptive like “Click on a column to drill-down to monthly sales in the chart below.” When you have the drill-down charts replacing the parent chart, the message is pretty simple as discussed above. However, if the child chart does not replace the parent chart and is displayed either below the parent chart or on the side, then the message has be to more descriptive to ensure everyone understands it. For example, in a retail dashboard, if you have product categories and their sales shown on a chart and the user can click on them to see the break-up of the category right under the parent chart, then the chart below would need to have a message like: “Please select a product category in the above chart to see product-wise sales.”

Use breadcrumb-style captions

Breadcrumbs are a navigation aid used in websites, applications and documents. It helps users keep track of where they are within the website with the ability to jump to any of these locations. When there is just one drill-down level, it is pretty easy for the user to keep track of where he is but more than that becomes a cause of concern for the user, especially when he is deep in his data analysis. That’s where breadcrumb style captions come in. Of course, it is not essential to use a breadcrumb style caption in its entirety, especially for time-based drill-down. For example if you have a drill-down from 2010 > Q1 > January showing sales figures, then the caption could just say: Sales Figures for January 2010. However, in category-based drill-down, a complete breadcrumb-style caption is the best way to go.

Use the same chart style for all levels

Depending on the kind of data analysis that you need to facilitate at different levels, the chart types could be same or different. If the data analysis that is to be done is the same at all levels, it makes no sense to introduce a new chart type. In either case, it is essential to use the same chart style at all levels – in terms of looks, placement of labels, the number scale used etc. The idea behind using the same chart style is to build the sense of familiarity with the chart so that there is no discovery phase at every level. The user’s eyes get used to the chart style and he can focus all his energy on interpreting the data itself. Do you agree with all these points? What else do you do to make your drill-down interface more intuitive? Let us continue the discussion in the comments.