Tag Info

Hot answers tagged

43

I have seen the following visualization used to represent down time and it has been effective: The illustration in the question requires too much thinking. The linear time line works well for a 24 hour timespan.


9

An aside: COTS stands for Commercial Off The Shelf. Per the chart - it tells me nothing. Both the X and Y axis are so deep I have to following an enormous gulf in order to guess that the server was down roughly in the timeframe of 20:24-20:28. Why are there 4 lines in-between the hour lines when they only jump by 2 hours? My eye also has to wander a great ...


9

This is the way Pingdom chose to visualize it in their Public Status Pages: (Disclosure: I was the front-end web developer who implemented this graph back in 2010, but not the designer or originator of the concept.)


8

UptimeRobot is a tool for monitoring server downtimes (I'm just a user, no other connection whatsoever). They're showing a small graph on the left side for the up-/downtimes for every watched server in the last 24 hours (I edited the image because none of my watched servers had a downtime in this period). If you click on one of the bars, you see details on ...


6

The table is not organized in proper way, so you are trying to overcome this issue with your options. The problems are: Established reading pattern (by rows) makes it hard to distinguish the number (83%) as subtotal. It is perceived as normal row rather than subtotal one. Placing missed items info within the table is a logic error. The format of this row ...


5

I'd recommend: to have limited number of complexity levels. Because having a lot of those create cognitive barrier. As complexity is not absolute category, people will interpret it subjectively and think a lot before making decision. It's better to use 3 or 4 levels to name levels in appropriate way. Labels allow to refer to levels in clear way and to ...


5

Here is a good example - even though you stated that "Pay What You Want" will not fit. There are several good aspects of this that you may apply to your UI. (from losttype.com) They equate Pay-What-You-Want with a Personal License in the description. This may or may not apply to your situation, but it allows you to describe it in one place, and keep the ...


4

The best chart type depends on what is the metric you are trying to show or compare. Pie chart is good only to show the relation of a couple of values. It works best if you have two or at maximum three segments. It also might get too cluttered if one or two segments are really small (as in your example). Usually the basic bar chart or even a dot-plot is a ...


4

It depends how much results there is to compare but I'd suggest to display them on a bar. Even if we're talking about ms you could "enlarge" it. This way it's easy to compare them and see which one is the fastest. NOTE : this is a quick mockup, I didn't measured anything. EDIT : if you want the slowest to be the smallest too, you could try to make a ...


4

I agree with Charles; the same chart but with the axes reversed makes more sense to me. I tend to think of time in terms of timelines, which your chart just isn't doing for me right now. I also think you want some way to indicate continuities within broken time chunks, so it's clear that the kid didn't wake up briefly at midnight. download bmml source ...


3

Since you have two lists and there is no information on which one is primary, I think that diff like this will work good: Pros: It shows both lists unmodified It shows resulting list It highlights items which are added It shows common part of the lists Cons: Three lists instead of one Colors could be tuned up to your needs (for example, you may ...


3

Another alternative - one that gets rid of the discontinuity at midnight (or 10am) - would be a spiral visualization, with one day per circuit. Here's a picture of a spiral visualisation from an earlier UX answer of mine: You could use 24 hours per circuit, and show history over 7 or 10 days easily. The same time of day always shows at the same angle, ...


3

"Set price" or "Price" should work. More importantly, I think you can convey the fact that pay what you want by showing an input field instead of a price. That way, users wouldn't even have to read the tag to understand that it's up to them to determine the price. This would work especially well in places where users have already been "trained" to expect a ...


3

You can use a thick line for each element. Have a tooltip for each line, to show what each line represents. download bmml source – Wireframes created with Balsamiq Mockups


3

Original Candlesticks are black and white. Black for down days (Bears are in control) and White or hollow for up days (Bulls are in control). These days people use colours to make them easier to read. The colours can be based on "open vs close" or "net change". Open vs Close is original candlesticks with color (usually red and green). The chart can also be ...


3

A recent (2013) paper from the information visualization community looked at a related problem, namely: "What makes a visualization memorable?" They reasoned that: "knowing what makes a visualization memorable is a step towards answering higher level questions like "What makes a visualization engaging?" or "What makes a visualization effective?" ...


2

Display fewer data series would be my first impulse (say top five only), but that doesn't address the primary question that should be addressed: What data insights are you trying to extract? Sales patterns throughout the year? In that case you can probably merge several/all Manufacturers Proportion of market share between manufacturers? Then perhaps you ...


2

Your graph is not scaled properly due to the presence of outlying data (Maruti). I would advise omitting or putting that data into a separate graph so that you can fit the rest of the data to fill up the graph. At least 80% of the area should be occupied by data. Also, either omitting the data points or making the data lines thinner would make the graph ...


2

If a particular set of numbers is interesting to the user on a qualitative level, duplicate that set with bars or columns that answers a few questions. E.g: Biggest questions: How many Items are being used over capacity? And, what are our most used items? Solution: Bar/column chart with a threshold drawn, ordered Descending by the In Use column. ...


2

This table is not at all suited to judging numbers at a glance. You need a chart representation, and for chart numbers where several categories add up to a total, a stacked bar is a very good solution. It also gives you a low rowheight. This is a quick and dirty implementation of how a stacked bar for the first row can look like. Style the text too, and ...


2

For general advice on how not to design misleading graphs, have a look at this Wikipedia page that covers a broad spectrum of scenarios. You may also be interested in the book "How to lie with statistics" -- originally published in 1954, it is very popular and still in print. Because I don't know what your exact use-case is, I'll rely on a contrived example ...


2

Google deprecated the whole Image Charts API, which allowed for the rendering of sparklines and many other visualizations. It was not specifically aimed at removing sparklines alone. The API was part of a larger group of "old" APIs that were deprecated at the same time. Based on this context, it seems to be an engineering decision.


2

This one tested well with both the technical and non-technical users and can generate pretty much any possible database query... The benefits are that it's very clear and a user can drag and drop (or delete) any expression or group of expressions in the tree. The down side is how much space it consumes.


2

Flip the data point that you are presenting. Rather present the number of times the job (calculation) got done in the 'current' duration. Idea should be clear from the mockup below, but queries welcome. download bmml source – Wireframes created with Balsamiq Mockups


2

Your third option demonstrates the difference very clear. Being ordered, the difference is grasped in a moment, see the image. So the form supports the content. I also doubt in usefulness of endless measurement process. Having enough data to make reliable results from statistical point of view, the further process doesn't improve the results in ...


2

Why not try visually showing their progress? Also, the color of the bars can change as the progress changes, RED= 10-35% Orange=36-70% Green=70%-100%.


2

You're focusing heavily on the word "accuracy", but you're discussing the topic of skills. In an educational setting, the word "proficiency" better represents the goals of teaching, and teachers often measure proficiency by reporting the students' accuracy on tests. I would try to use the more appropriate word, as it will help reduce confusion. Also, ...


2

What you describe seems a diff-like application. You could use a similar view, two columns and the matching items hightlighted. As for the similarity algorithm, if ListA is {A} and ListB is {A,B} lists would be 50% similar, then it could be: coincidences / (ListA length + ListB length + conincidences) * 100


2

You should just use some descriptive words like "Simple," "Intermediate," and "Complex." A number of stars is just that: A number. And if you use a number, than you have to explain the unit of measurement. Why do that when natural language offers words specifically meant for this situation? For the best implementation, I would give each word a tooltip that ...


2

This is a basic layout where you can have bidirectional exploration of a one-to-many relationship. When you select an item in one of the lists, the top list of the other side displays the relevant items. This could be solved with just the two lists if you highlighted the relevant items on the other list, instead of grouping them together, but with a ...



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