I'm working on a mobile app that helps users track the tasks they have planned for each project. The states (status) of the tasks are: Not Started, In Progress, Completed, and Overdue.

I thought I could display them like this, where each colored segment correspond to the number of tasks in each state, so that the users would have a quicker way of understanding and comparing which project requires more attention.

enter image description here

However, the problem I'm having is that a task could be in more than one state (ie., a task is Not Started and also Overdue, or In Progress but also Overdue). Hence, the total task count on the colored bar would be inaccurate (double-counting).

Is there a better way of presenting the overdue count? Although there are so many task management apps out there, I couldn't seem to find any similar examples to see how they handled this.

Thanks for the feedback!!

  • 1
    You are trying to put two different types of states on a single axis. (1) Due Date, and (2) "Working Status" (whatever you want to call that category. Pick 1 per axis to show! I'm pondering a better answer, but am about to start my commute - time to think about this! :) Commented Mar 4, 2014 at 2:15

1 Answer 1


You have two different data groups that you are wanting to show, that have different units of measure.

  1. Progress Status (3 states: Not Started, In Progress, Completed)
  2. Due Date Status (1 state: Overdue)

When you put two different data groups on a single axis you will very likely create confusion at best, and will present mis-information at worst. You want to look at the user cases of you application pick the data group that makes the most sense to be primary, and the other secondary.

This example shows similar information to what you have above:

enter image description here

You can see how many tasks each person has in what state. The number of overdue tasks are also shown, but separated from the graph since an overdue task can be in any one of the progress states. The critical count does not tell you where the overdue tasks are (not started, in progress, or complete), and imply that they can be in any one of those states.

Can a "Completed" task be marked Overdue? Depending on how you track things it could make sense, but perhaps not.

Placing the overdue count along with the progress state will show their direct relation.

enter image description here

(My examples are certainly sketches to express the concept and not a direct suggestion on how to represent an overdue count. A much nicer there certainly is.)

Depending on your space constraints you might also consider other types of graphs. Donut charts are good for showing multiple statistics. A question was asked about them here recently, which included a nice example image: What are these "dial gauges" called?

enter image description here

In these cases you could consider the overdue task count in the middle, with the progress states in the outer circle. You could also include two graphs per user - 1 showing the progress states with a total count in the middle; 1 showing the overdue tasks, split by progress state, with the total count of overdue tasks in the middle. Having these two tasks allows you to quickly see the relationship between the two different types of data.

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.