I am happy to announce that I will be speaking with Mico Yuk (of Everything Xcelsius) at the ASUG Annual Conference in Orlando this month. The details of our session are below. Hope to see you there!

Design a Successful User Experience with Xcelsius Dashboards

Wednesday, May 19, 11:15 a.m.
Location: 103A West

Creating a good user experience should be at the core of every dashboarding project. A good user experience means that the dashboard is useful, usable, and desirable. It means that it was designed with end users in mind in order to help them accomplish their tasks. In this session, you will learn how to engage with your end users to discover their goals and objectives, how to design a pleasing and usable dashboard, and how to validate your design through usability testing. Following a few simple guidelines will greatly improve the design of the dashboards you create.

More details at the conference website…

Although dashboards typically don’t contain a whole lot of text, the text they do have is very important and it must be readable. Some examples of text on a dashboard include:

• titles of charts and sections
• tab names
• choices in drop-down menus, check boxes, and radio buttons
• labels on buttons
• chart titles, values, axes, and legends
• tables
• instructional text

It’s important to carefully craft all these bits of text to convey only the information necessary to make the dashboard easy to understand and navigate. It is equally important to make this text easy to read. You want your users to spend more time understanding the text than trying to read it. There are many factors that affect readability, but I’ll highlight three of the most important ones below.

Maximize the contrast between text and background colors

One of the most important determining factors of readable text is how much contrast there is between text and background color. Often, you can instinctively tell when there is enough contrast, but you also have to keep in mind that not everyone sees color the same way you do. In some cases, color-blindness might be a factor, in other cases older eyes or other vision impairments may make it harder to distinguish one color from another. Many people require a higher level of contrast than you might be used to and you have to take this into consideration.

There is a formula you can use to calculate the contrast between any two colors (google “luminance contrast“), but it’s pretty complicated, so I created a tool that will do the calculation for you. Just select your background color and your text color and the tool will provide one of the following values:

• Not enough contrast – There is not enough contrast for the text to be readable.
• Low contrast – There is some some contrast, but not enough for regular-sized text to be readable.
• Good contrast – There is enough contrast for the text to be readable by most people.
• High contrast – There is enough contrast for the text to be readable by people who require higher contrast.

As a rule of thumb, I recommend aiming for “high contrast” to cover the biggest population of your users.

Avoid bright, highly saturated colors and busy backgrounds

Although there may be enough contrast between black text and a lime green background, that doesn’t mean this is a good design decision. Bright, highly saturated colors are more stressful on the eyes and demand too much attention because the eye is immediately drawn to them. Busy backgrounds have a similar effect. Your eyes insist on processing the background rather than focusing on what is really important (the text). Compare these three examples:

All three examples use black text and have enough contrast, but example 3 is clearly the easiest to read because the eye focuses on the text rather than the background.

If you find that you must use bright colors or a busy background in your design (maybe you have a style guide to follow), then you can apply a simple trick to reduce eye strain: add a light or dark layer on top of the bright color so that the bright color only appears as a border.

In Xcelsius, you can do this by utilizing a combination of Background components. Typically, Background 1 is intended to be used as a border and Background 2 is intended to be used for text. Some themes have more backgrounds to choose from, but you should always use Background 2 as the background for text.

Choose a font that is easy to read on the screen

Font choice is another important factor for a dashboard. You should avoid highly decorative fonts, such as ones mimicking handwriting, because these are much harder to read. In general, you can think of fonts as falling into 2 groups: serif and sans-serif.

Serif means the letters have little “feet” added to the tops and bottoms. An example is Times New Roman. Sans-serif, on the other hand, removes the “feet” so that the letters have more precise endings. An example of this is Tahoma. If you compare the T’s in Times New Roman and Tahoma, you will see the main difference between serif and sans-serif fonts.

The rule of thumb here is that sans-serif fonts are easier to read in small sizes on the screen than serif fonts. So, if your text needs to be really small (such as chart data values), sans-serif is a better choice.

Of course, you should also make sure the text is big enough to read. It’s tempting sometimes to make text as small as possible to fit into some pre-defined space, but you should always avoid this temptation. Rather than making the text small, you should reconsider your design so that it allows for bigger text. Even if it’s technically possible to read that text in 8pt size, it creates unnecessary strain for the eyes to process it. Ideal sizes for reading are between 10 and 12pts, but headings and titles can be larger.

Keeping in mind these three factors will help to greatly improve the readability of your dashboards. It will reduce eye strain and help your users focus on the important part – understanding the information being presented. It will also have the nice side-effect of making your dashboard just plain look better.

Stephen Few, perhaps the leading expert on all things dashboard design, defines dashboards as follows:

A dashboard is a visual display of the most important information needed to achieve one or more objectives; consolidated and arranged on a single screen so the information can be monitored at a glance.

I also posed the question of defining a dashboard to the Xcelsius developer community and here is what they had to say in addition to Stephen’s definition:

A dashboard…

“… must deliver a view on highly aggregated data in a fresh, clean & simple design where KPI behaviour can be determined in the wink of an eye.”
– Julien van Bekkum (Twitter)

“… tells a clear story through series of alerts, charts, gauges, etc.”
– Mico Yuk (LinkedIn)

“… is a monitoring system, not a diagnostics system.”
– Dan Everett (LinkedIn)

One interesting insight from these responses is that a good dashboard design is as much about what you show as what you leave out. There is a balance between showing enough information that it’s useful, but not so much that it becomes overwhelming or better suited for another medium, like a report.

Another aspect that many people pointed out is that a dashboard is all about its users – what you show, how you show it, and the types of interactions you enable depend entirely on who you’re designing for. Based on the responses to my question, it sounds like the end users of Xcelsius dashboards seem to be executives, VPs, and upper level managers. They are not business analysts, who would require a more sophisticated analytics tool.

I want to thank everyone that contributed to the discussion on LinkedIn and Twitter. It’s something we all should ask ourselves periodically before setting out on a dashboard design project. There is no definitive answer, but if you decide early on what it is that you are designing, it’ll help you focus on the important aspects and leave out extras that will move you away from dashboard design into another domain altogether. It’s often a fine line between a dashboard and something bigger, but if you keep focus, you’ll provide a much more effective tool that is appropriate for your audience. And if you need more inspiration, read through the full discussion on the Xcelsius Gurus discussion board.

Instructions for using sanitary toilet seat covers

When something about a design is not intuitive, it’s tempting to start adding instructional text. Can’t figure out a good label for a button? Just add a little instructional text next to it. Not sure how to let people know what to do next? Just add a sentence or two somewhere. All they have to do is read it, right?

Unfortunately, in reality, people do not like to read. They don’t like it so much that they simply don’t do it. Instead, they scan. They look for keywords, highlighted words, bullet points, and things they can interact with, like buttons. In the above photo, what people will see is this:

As a result, they’ll stand there waving their hand over the green rectangle that the arrow is pointing to, not realizing it’s actually a button they need to push.

There are some exceptions to this rule, such as when people read in order to learn something (books, blogs, tutorials), but even in those cases it is rare that every word will be carefully read and understood.

This is especially important to consider when designing dashboards, where every bit of space should be carefully accounted for. When you find yourself thinking of adding some instructional text to your dashboard, ask yourself what is the real problem you are trying to solve?

Often, the thinking goes like this: In order to proceed to the next step in their task, users have to click button X. But our users can’t figure this out, so we should add some text that says “In order to move on, please click button X.” The real problem here is not that the users aren’t smart enough to figure out what to do next. It’s a design problem. Instead of adding text, ask yourself these questions:

• Can you change the design to make the interface self-apparent?
• Why do your users not know what to do?
• Can you set up smart defaults so your users can complete their tasks without assistance?
• What do your users expect they should be able to do? Can you change the design to meet their expectations?
• Is there another type of chart or control that would be more familiar to your users?

This is not to say that all instructional text is bad. Sometimes a little explanation is necessary. It’s just important to keep in mind how people will actually read your design. Chances are, it will be nothing like the way that you intended. They will make lots of assumptions and will get frustrated when their assumptions are proven wrong even if you have text explaining why that is. The best thing is to understand the background of your users and provide an interface that makes sense to them. You can’t fix your users, but you can fix your design.

It’s been a couple of weeks since our round of usability tests at the SAP BusinessObjects User Conference (rolls right off the tongue, doesn’t it?) and I wanted to share a couple of thoughts about the experience. This was the first time we did usability tests since I joined the team back in March and it was also my first time meeting our community of users in person.

The first thing that struck me was the willingness of people who use Xcelsius to come and participate in the testing sessions. There were 13 sessions total, with room for one tester and one observer, and we had most of them filled before the conference even started. Our recruiters said they had people practically busting down the doors, trying to get into the sessions. This kind of support is exactly what we need in order to improve our product. For those who couldn’t make it, this is what it looked like:

The second thing that really impressed me was the quality of feedback we received. I have to admit, I was a little nervous going into these sessions because I know a lot of our users get frustrated with some of Xcelsius’ shortcomings. However, everyone that participated was very supportive and provided great constructive feedback. We learned a lot from watching people use the product – some of which we expected, and some that took us by surprise. Spending 13 hours looking at Xcelsius through the eyes of our customers was a very enlightening experience.

Finally, the thing I enjoyed most was meeting everyone in the Xcelsius user community in person. I follow many discussions online (including on LinkedIn, SDN, and Twitter) and it was very exciting to be able to put a face to the names of people I have come to respect through these discussions. I tried to meet as many people as I could, through lunches, networking events, the Xcelsius Community event, and the usability testing sessions. Through all of this I learned a lot about what people do with Xcelsius and their top concerns. There were two questions that I heard more than any others, though, and I’ll leave you with the answers here:

1. Q: When is the next version of Xcelsius coming out?

   A: Unfortunately, I can’t comment on that. All I can say is, “soon.”

2. Q: Are you related to Matt Lloyd?

   A: You know how some people are related by marriage? Well, Matt and I are related by product. Beyond that, there is no relation. It’s just an awesome last name.

Also, if you want to see photos from the Xcelsius Community event, you can find them on Flickr.