There is No Spoon
August 18th, 2009 by dstewartThere are three things you will see very little of when using the new Insight interface. Navigation, color, and data visualization. In fact, their absence or minimal use is integral to the Insight design. The key was to stay focused on our goal of providing an innovative new view to powerful data.
A phrase from Garth Stein’s The Art of Racing in the Rain captures the heart of this methodology:
“That which you manifest is before you.”
That is, if you see a spoon, there is a spoon. If you focus on the left navigation, your design will center around the left nav. If you start with color, your design will hinge on color. If you see flash as the solution, your design will rely heavily on it.
Realizing this we set about designing the Insight user experience deliberately leaving out large pieces of the puzzle.
Color
The absence or presence of color can drastically effect the feel of a design. In general, the world of infographics and analytics is filled with color. By deliberately leaving out color we were able to ensure that what color we did have made an impact. In the Insight interface color has very specific meaning
Even in this very small image of the Account Dashboard you can see areas that need attention because of their red color. The red stands out because there are no other colors to compete with it. We also use blue through out the interface to indicate interactivity. Of course, this doesn’t mean the Insight interface will always remain devoid of color. It just means we will be judicious about when and where we add it.
Left Navigation
Now, the left navigation or “left-nav” as we call it in the biz, has been around since the inception of the internet. Early web sites were almost uniformly L-shaped and it became somewhat of a standard. I can remember regarding the L-shape as a usability enhancement because people knew how to use it and would easily recognize it as the place they needed to go for navigation. After all, inertia is a powerful thing and there is tremendous advantage in using standards and patterns that are widely adopted. You don’t want to reinvent the wheel.
However, in our case we wanted the data to be navigation. We knew that we would probably have to include some sort of global navigation at some point but we knew that leaving it out would force us to find other ways to guide the user through the interface. The very interesting thing is that in the end we discovered we didn’t need navigation at all, at least in the form of a left navigation element.
Instead, elements like the breadcrumb style navigation allow users to quickly pivot between profiles and reports. It also acts as a title for each report. The report list at the bottom of the Profile Dashboard allows the user to see all their reports easily. The search field allows them to filter the list in order to find a report by name.
Data Visualization
There are many great examples of great visualizations that can really wow your users. 3D Spinning Scatterplots, gauges, and pie charts can be really impressive. Historically, dashboards are littered with a myriad of data visualizations, but if you really understand the data you realize that many of the visualizations actually obscure the insight. Inspired by Steven Krug’s Don’t Make Me Think we sought to minimize any need to interpret data.
Technology can also heavily influence the design. With Flash, Canvas, Processing, and even Corda the possibilities are endless. Because we remained agnostic to the technology we were able to focus on the RIGHT visualizations for the data. In the end, we chose Canvas because it allowed us to use web standards and did not limit the devices we could work on.
In the future, we may use Processing or Flash or whatever new data visualization technology is available. The important thing is that we will use them to create visualizations that provide instant insight in to the meaning of the data.
By approaching design in this way you get a clear focus on the core concept of your design. If you can remain committed and brave the slings and arrows of those who insist on navigation or poke fun at your monochromatic color palette, the end result is a much more compelling user experience that is focused on what your audience needs. It may even have a strong navigational element and every color in the rainbow but instead of dominating the user interface they will exist only to support the key focus of the design.
Follow us on Twitter
August 24th, 2009 at 4:27 pm
Innovation is fine, but I have to wonder if some of this is innovation just for innovation’s sake, and that maybe you got a little carried away. It’s great to do away with decorative color and concentrate on meaningful uses of color. But saying “the data is the navigation” seems a little glib. By relying on an alphabetized list of reports, for example, you’ve eliminated one entire way of keeping reports organized – the spatial hierarchy (the old “table of contents”). Although you’ve added other ways of navigating (”the data”) you’ve tossed one away too, and I really don’t see how less is more. I’m not wedded to the left side of the screen. But that hierarchy was useful, and replacing it with alphabetizing is not a good move, even with search available. It requires us to remember which words we used, and it eliminates the conceptual organization of the hierarchy.
I wonder if you ran this by any cognitive psychologists to be sure you’re serving all of the cognitive styles out there, or rather serving as many of them as you could be. By eliminating some of the visio/spatial aspects of the presentation, I think you may be giving short shrift to many users. Even Krug (Don’t Make Me Think) would probably agree, since he stresses things like visual hierarchies, taking advantage of conventions, breaking things up, and minimizing noise. The templates in the old left nav had all those things.
August 25th, 2009 at 10:51 pm
Chris,
Those are valid concerns. Designing Insight was not easy and we didn’t take any of the decisions we made lightly. Our goal with this report viewing product was to simplify the experience to make it the most accessible to as many users as possible.
To do this, we needed to keep the application as lean as possible. We started our design with no menu or “left nav”. Our intention was to put it in place when we needed it. The funny thing is, we never found it necessary with the design. When users started using Insight, they were surprisingly successful without the traditional navigation.
Our goal is not to narrow the experience to a limited set of cognitive styles, but to liberate the interface by reducing complexity. As we move forward and continue to evolve the design, we may need to put a more traditional navigation in place. Or, we may find an opportunity to design something different. We are open.
Currently, we are gathering ideas for how to rethink navigation across reports that are linked by measures and dimensions. If you have ideas or have seen intriguing solutions to these challenges, please send them along.
Thank you for the challenging feedback.
August 27th, 2009 at 7:54 am
Thanks for the reply, Justin.
I have to admit I’m surprised that your user testers didn’t balk at the lack of traditional navigation, but then your term “surprisingly successful” covers a lot of ground. I’ve been doing a fair amount of WebTrends hands-on training lately and that’s not what I would expect from the people I’ve been working with. But, I didn’t have the new interface to show them; they are software users.
Hmmm. Maybe there’s a metric here somewhere. I think that, without an organized hierarchy of reports, users will see fewer reports overall. For example, I think seeing a bunch of on-site search report titles in a sublist is invaluable, because the user may not realize that there also exist reports on things like searches-that-resulted-in-a-site-exit. And seeing the on-site search reports chapter juxtaposed with the off-site search reports chapter is a great reminder to users that they can learn similar things from both. And so on.
The hierarchy is a form of insight (or education) as well as a navigation method.
August 28th, 2009 at 11:47 am
Hey Chris,
Love the feedback. Keep it coming. I see your point but…
A hierarchical menu does a great job of organizing things. If you know exactly what you are looking for, and understand exactly where it belongs in the taxonomy of the interface, you will find it. Unfortunately, sometimes it feels like going to a friend’s house for dinner and trying to find the salad tongs. They may have a well organized kitchen but it does you no good because everything is hidden in drawers.
The way we have addressed this in Insight is with “Dimension and Measure Auto Suggest and Search” (see Justin’s blog about the design: http://bit.ly/Dkghs). This simple search feature helps users find the reports they need by typing in a keyword just like you would in a search engine. If the user wants to find a report having anything to do with searches they can enter in the term “search” and reports with measures and/or dimensions that will come up. The result is a subset of the reports that only includes reports about “search”.
To me, and so far many of our customers, this is a much easier way to find the reports they need. Now, it’s not perfect by any means but we’re working on enhancements and new features already. Stay tuned. I look forward to your insightful feedback on future releases.
August 28th, 2009 at 11:59 am
Yes, and I really like the Dimension and Measure Auto Suggest and Search. It is one of those “wow, why isn’t everybody doing this” kinds of additions to the interface. I just wish it was in fact just an addition, and that the UI hadn’t taken something away at the same time.
It’s all about choices, eh?