Hot answers tagged

82

Show the numbers. If the user selected three fruits to be shown, Apples, Oranges, and Melons, and only sees Apples and Melons in the pie and in the legend, they will wonder where the Oranges went. If the Oranges are shown in the legend but not in the pie, again they will look for the tiny slice of Orange with a magnifying glass. Therefore, show the numbers,...


49

How about his. show the percentage in the legend: Apples (20%) Melons (80%) Oranges (0%)


28

Yes, show it. The data IS important. Others gave given good reasons (the inclusion of Oranges clarifies they HAD been taken into account) and suggestions (show percentages or numbers, show a thin line if >0 but v. low). Here is a clearer example of why it would be a bad idea to not include zero-sized elements in the legend: Assume we have 0 apples, as ...


19

Don't use a pie chart Your problem stems from the fact you're using a pie chart. Pie charts are simply not a very good way of representing data (see here, here, here or here for some discussions of why) and you've stumbled on one of the reasons why: they can't represent data with a value of 0. They're also almost impossible to accurately read the values off ...


14

Definitely keep it in the legend. If you only have the two items in the legend it looks like you created a chart to show the comparison of Apples and Melons. For all the user knows there could be twice as many Oranges and you simply didn't include them in this data. Since Oranges are included you need to show that. A second reason would be if the user ...


10

I think a problem with a generic waveform is that it will be "moving" and indicating sound when there is none (the audio is playing a silent section) and this disconnect would be bothersome (to me, at least). Something like a spinning record would be better. I actually faced this problem a few years ago, I wanted a clear and moving indicator that audio was ...


9

My suggestion is about UX, rather than on UI and visualization. Your job is to solve a problem, not make a picture. This is from the Three charts are all I need, as well as the following quote: You can spend days, weeks, or even months working on visualizations of data, but does that benefit the business most? In most cases, a simple visualization will ...


8

Something I do which I believe is more relevant, is instead of using ambiguous percentages I use years, relative to my career. I still use a sort of 'bar graph', but the numbers have context in relation to the length of time I've been working: The numbers across the top are the years of my career (2000 - 2015) and each skill is represented as a '...


8

As others have suggested, I'd suggest using logarithmic scales. I recreated your chart as close as possible with logarithmic scales using ZingChart, a JavaScript charting library. There are no unevenly split grid lines and there are value boxes over each of the bars to show their value, making it easier to read. You can see and interact with it here. ...


7

You have more or less answered the first question. Don't confuse users is a pretty good rule. You might find that there is stylised diagram that shows streaming quality and state but avoid making it look like some it isn't. What do the users actually want? I suspect that a cool looking waveform is delightful for the first few moments; but soon fades from ...


7

color brewer is designed for maps but it will give you colours that are optimised to be as differentiable as possible. It has a maximum of 12 colour classes


7

Since the issue is the relative position of the bar, you could try fixing the bar by keeping it in the middle. Something like this : It also has the advantage of representing the fact that the goal is fixed and not moving, while your performance is.


6

I would go ahead and assume this donut chart wouldn't be the only one displayed, but will be part of a row(s) full of charts and visual graphs. In this case, I would absolutely organize the text in a readable data structure - Label top, Data bottom. When visualizing data as such, it is better practice to first give them the key for the data(which normally ...


6

Your question is about information design. First, if this topic interests you greatly, I recommend you find The visual display of quantitative information by Tufte. His books are beautifully illustrated but expensive—so check your local library first or get your employer to buy you this book. Tufte will get you thinking about the design of charts and graphs ...


6

Examples 1-3 could be individually plotted using a heat map. Yes, it may be reasonable if you have high resolution data. In this representation heat map is an invaluable tool (besides opinable choice of color pair): However if you do not have high resolution data then an heat map is not the only available solution. Take for example this low-res map: ...


6

How about discontinuing the y-axis, don't remember what the technique is called so couldn't find any image. It involves using the saw line cutting the y-axis so that below the saw line, in your case, could be values from 0 to 100 and above from 500 upwards. Grid lines should be differenty spaced above and below the saw line. edit: Here is an example of ...


6

Oooh, pretty. Yeah, well, hairballs (this kind of huge graphs you have shown) are pretty much useless because unreadable. Genomicists and bioinformaticians have discovered this early in the days because their datasets are big enough to demonstrate the issue. And no, adding 3D will not help the cause. The solution for hairballs are hive plots. Also ...


6

First picky point: Infographics aren't the same as visualisations. https://eagereyes.org/blog/2010/the-difference-between-infographics-and-visualization The point of visualisation is to shift processing from the cognitive to the perceptual - i.e. don't think about it, just see it. There's hundreds of papers that compare different visualisations in user ...


5

What I feel is that you are trying to design an KPI (Key Performance Indicators) dashboard. Each element regarding the positive and negative results can be communicated with the colors like green, orange and red. However,these color codes are already embedded to UI elements of famous solutions 2. Your solution for dashboard needs; Clear verbal ...


4

There is a jquery plugin to do this, called QueryBuilder, which do this in an interesting way : http://mistic100.github.io/jQuery-QueryBuilder/


4

Displaying no logo for a cinema breaks consistency of the UI. Not necessarily, it's not so uncommon unless image is also used to keep layout in-place (it's, for example, why we have fake avatars in GMail for Android). In your case it's not an issue but... Displaying a logo only for certain cinemas can put other cinemas at an disadvantage. It's true. ...


4

Displaying a logo only for certain cinemas can put other cinemas at an disadvantage Well, they don't have a logo. They're already at a disadvantage doing business in general. (This would be a great point to upsell your firm's services and bring in some branding folks. :) Displaying a generic logo can misidentify/misrepresent a cinema I'd agree. The ...


4

I think this would be perfectly possible with a stylized waveform that is carefully designed to not look real. If the shape is a bit cartoonlike and simplified, and the movement is pretty regular, I don't think it will confuse anyone. Also, the consequences of being confused are not that significant in this case. If the user looks at a waveform and at ...


4

Thing is there is no type of data vis that works well for data that is dispersed too much. Hence the solution will depend not on the type of graph but on the application of the logarithmic scale to the data (not the original data you display, but the data you feed to the datavis component). Log scale will eliminate the dispersion. Here is my detailed answer ...


4

I am agreeing mostly to what others said before. Being responsible for team growth myself, I tend to not look at the "how good is she/he with Photoshop?" part. I am ASSUMING that if you apply to a graphics/UI/UX job, that you know how that tool works. If somebody puts a lot of focus on the day-to-day-tools she can use, I assume that she probably just ...


4

First of all, are all the fields provided in the tool-tip necessary? Is there any chance that the number of fields be reduced? If yes, keep them concise. On the other hand, if all the fields are necessary. Let's see it like this: For link1, the user sees all the fields in the tool-tip. For link 2, there is some information missing (which means that the ...


4

Instead of cluttering your map by trying to layer your data sets directly on the map, why not try the reverse approach and abstract your data/images from your map, and give user the option to compare on the map directly. As a really rough example, something like this?


4

An inner ring showing liabilities and an outer one showing assets with the ratio of their thickness's set by the ratio of the total liabilities to assets. (Don't comment on the ugly colours, just a picture to help explain what is in my head) But I think in general that a pie chart is probably not the best choice for representing such data.


4

Use the right visualization Pie charts represent constituents of a whole. As you've discovered, this doesn't work when numbers can go into the red. Use bar or line charts for more flexible (and arguably more informative) visualization.


4

It sounds like your question is two-fold. Here's my refinement: "What are best practices for data visualization to optimize for memorability and comprehension?" In short, the two are at odds. Complexity and visual noise typically make data visualizations more memorable but less comprehensible. I've included a more thorough breakdown below. Memorability ...



Only top voted, non community-wiki answers of a minimum length are eligible