1

Requirement:

  • First Column should show a value for Total Space

  • Second Column should show a graph for Percentage Used

Example: Please find attached the example graph_question.png

Question: How to show a Graph for a value which falls in-between 2 ranges (e.g 40%-60%).

Graph Example

1
  • I think the label or some message to the user should make this clear then you won't have that problem anymore.
    – Michael Lai
    Jul 24, 2014 at 23:08

1 Answer 1

1

You could try using 5 steps rather than 100 then a phrase like 'at least' or 'minumum available'.

By only changing your graph when one of the main chunks is completely full the user will only be able to deduce that there is somewhere between (in the example) 2 and 3 chunks of space available.

Your graph for either 41% of 59% would look like this. They would know they had at least 40% but not as much as 60%:

mockup

download bmml source – Wireframes created with Balsamiq Mockups

Where as one for 61% would look like this:

mockup

download bmml source

By breaking the graph down to the level of granularity that the system is able to report and no further the user would be given exactly the amount of information available. They couldn't be misled as you wouldn't be assuming and displaying a value as you are strongly implying with your example.

You could also number them 1-5 and add 'currently filling chunk n'

2
  • Colin, thanks for sharing your thoughts. I agree that we can design 5 steps rather than keeping the percentage numbers, but on a first look when a user scans the graph (what you've designed) he/she might think the value is 40 on your 1st and 60 on your 2nd graph. So, we might need to show the visual difference between items: Example - 40% - 60% Visual States 1. At-least (first 2 blocks) 2. Approximate (3rd block) 3. Empty (4th and 5th block)
    – UxBaby
    Jul 24, 2014 at 22:58
  • @uxbaby Yes a third state could be used, maybe to represent the 'currently using' state
    – Toni Leigh
    Jul 27, 2014 at 16:40

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.