103
votes
Accepted
Why show the user 'There are n updates since page load, refresh to see them' rather than adding new data
Sudden rearrangement of content is disturbing
Dynamically updating data while user is looking at it may (depending on type of data) be disturbing to the user workflow - for example, if you're reading ...
- 1,163
73
votes
Cumulative percentage between 4 controls
You could use a single bar, partitioned into four sections, labelled (or possibly coloured, as I've used in my example image) accordingly. The area where each partition meets would be resize handles, ...
- 689
55
votes
What kind of chart is this?
This is an absolute 'No no' in creating charts. This is a very bad way of representing data, to make it look like Donut chart but non-functional. It doesn't matter if the thickness is proportional to ...
- 3,186
51
votes
Accepted
For death year, should I use N/A or --- if person still alive?
Well, you can write the predicted year of death based on user research, or you can say "TBD" :).
And more seriously - it would be a good idea to develop two templates for this item, one for dead ...
- 30.5k
50
votes
When is an exception message too big?
tl;dr:
Some of the invoices are not eligible for payment. They were excluded from payment processing. [details]
Error messages should separate two things:
Information for the end user (What they ...
- 7,578
34
votes
Cumulative percentage between 4 controls
Is it necessary to use sliders? Note that a slider is a good choice when you know that users think of the value as a relative quantity, not a numeric value. For example, volume or brightness control. ...
- 3,420
34
votes
What kind of chart is this?
The most approximate chart to the provided images is a Donut Chart. Refer to this link about how to use donut charts.
- 5,136
33
votes
How To Display Too Much Data
what data does the user actually need to see?
If only we could get a straight answer to that. Instead of "it depends".
I keep on running into this problem, and every time I Google I end up back here ...
- 670
33
votes
How should I visualize the average of two bars in a bar chart?
You could show the average in a large bar, and put the separate categories inside in smaller bars.
If you use Excel and use two axes, make sure they both have the same scale.
- 439
22
votes
Cumulative percentage between 4 controls
There is also possibility using four sliders to normalize the results, that is, if they sum up to x%, multiply each value with 100/x. Then you wouldn't have to worry the user with constraints while ...
- 321
21
votes
What kind of chart is this?
Topologically, it looks the same as a Spider chart with 4 variables, but each variable is displayed as a quarter-circle instead of a point.
- 1,826
19
votes
Accepted
Cumulative percentage between 4 controls
Make the user's job easy
Ask yourself if it's the system or the user that's concerned with 1% accuracy. Does the user really want to think about the distributed percentages, or just the priority of ...
- 21.2k
18
votes
What kind of chart is this?
That looks like a form of polar area diagram.
Also known as a ‘rose diagram’, this is almost 200 years old, and was popularised by Florence Nightingale to highlight death rates in different months:
...
- 311
17
votes
Why show the user 'There are n updates since page load, refresh to see them' rather than adding new data
Additionally, it's less data intensive, and if you're designing with a mobile first philosophy, that's got to be a consideration.
You're going to need to consider that the screen size is constrained
...
- 545
15
votes
How should I visualize the average of two bars in a bar chart?
If you really just mean the average of the two numbers, why not just leave the gray bars out, with nothing in their place? It's pretty easy to estimate visually. I think that's why there are few ...
- 301
14
votes
How should I visualize the average of two bars in a bar chart?
A simple idea would be to show the average as a line graph, like this:
- 3,269
14
votes
How should I visualize the average of two bars in a bar chart?
Your second one seems fine to me to be honest. It's the least extra 'ink', and it's how single series bar charts show averages, you're just doing it for the items at each x value. You can see an ...
- 1,773
13
votes
How To Display Too Much Data
I'm a bit surprised, that none has suggested the Master-Detail pattern yet.
We have exactly the same problem in several of our own products: Too many columns to fit on a screen, however, every piece ...
- 397
12
votes
Accepted
What is the best way to show the user large amounts of data?
Exporting data can be more time consuming
Ultimately it depends on how your users feel about it but exporting data requires users to think more and can add friction to their work flow. If I could ...
- 15.8k
11
votes
Cumulative percentage between 4 controls
When one slider is adjusted, auto-adjust the remaining unlocked sliders to keep their total at 100%
- 1,615
10
votes
Would having a generic waveform be too confusing for users?
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 ...
- 11.5k
10
votes
Accepted
What kind of chart is this?
Since the attributes are not distribution, you could show the initial score, and place a severity breakdown below. Allow hovertips and details for drilldown.
Instead of focusing on the current chart (...
- 24.4k
9
votes
Cumulative percentage between 4 controls
You can present a simple UI that allows all four values to be set at once. I created a mockup that illustrates this principle. Note that I haven't particularly focused on making sure that the UI doesn'...
- 1,137
9
votes
What data visualization fit my Air pollution app
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:
...
- 22.6k
9
votes
How to encourage the use of actual content (instead of lorem ipsum) in design?
Lorem ipsum does have its uses. It is used to keep readers focused on layout instead of content.
This is needed when reviewing the design and layout of a project.
It is a long established fact ...
- 7,875
8
votes
Accepted
Most readable way to display key value pairs
Option A (right aligned keys and left aligned values) makes the most sense in most situations (as always there may be some cases eg RTL languages where you need to adjust)
Depending on the data you ...
- 3,692
8
votes
Accepted
User needs to paste clipboard data into website with CTRL+V, but the data they paste will not be shown to them. How can I make this intuitive?
Consider sticking with a regular text input when there is no data present, then showing a preview of the data after pasting.
Doing this will prompt the user to paste data the same way as they would ...
- 19.3k
8
votes
What is the name of this dashboard UI element?
EDIT: For completeness and with Andrews comment
I don't think there is "one name" for that section of the Dashboard apart from "Overview"
I you are asking about the content of that element these are ...
- 221
7
votes
Is showing a blank page preferable to showing an empty one?
One of the key usability heuristics is: Visibility of system status - The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.
And ...
- 966
7
votes
Would having a generic waveform be too confusing for users?
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 ...
- 352
Only top scored, non community-wiki answers of a minimum length are eligible
Related Tags
data × 294info-visualisation × 65
tables × 52
data-tables × 33
charts × 24
usability × 17
gui-design × 16
dashboard × 16
forms × 14
grid × 14
web-app × 13
lists × 12
layout × 11
filter × 11
website-design × 10
mobile × 10
interaction-design × 9
user-behavior × 9
data-analysis × 9
design-patterns × 8
design × 8
input × 8
graphs × 7
user-expectation × 6
search × 6