I'm working on an app and one flow will be showing a chart for a users mood. Two things the chart will include is the time and feeling of the user from 1-5. I was wondering if you think the way this image is displaying the mood feeling is too cluttered and could potentially confuse a user? I am trying to let the user know that 5 means the best feeling and 1 is the worst feeling. Should I even include the text or assume most people already know 1-5? Or maybe a small description just above instead? Also do you think the numbers on the time side is too close to each other?

enter image description here

2 Answers 2


What you have on the y-axis is clear.

The x-axis is not clear because there are no units. The dropdown at the top says 'Day, Month', yet it looks like x-axis is showing hours of the day.

A few suggestions:

  1. I would challenge you to consider the value of assigning specific numeric values to mood. Does each number have real meaning? Assuming the answer is no, I suggest you collect input in an open slider that has no numbers:

enter image description here

  1. Roll up the time values on the y-axis to unclutter it.

enter image description here

The underlying question is: Is there value in associating exact numeric values to exact times – or – is it more meaningful to collect and present the a relative picture of mood over time. If it's the latter, then your chart of results becomes much simpler.

  • The dropdown is actually meant to be it's own separate thing. It will be a calendar style picker to switch dates easily. The x axis is suppose to represent hours of the day. The ideas you gave are solid and I think this can work. Commented Jan 24, 2016 at 18:22
  • Interesting about the dropdown. I see it now. I think I was caught up on the mismatch between it and the chart. Good to hear some of the ideas above are helpful, @Ralphunreal. Will you accept and upvote it please? Just getting start here on ux.stackechange.com so I'm not ashamed to grovel a bit ;-D Commented Jan 26, 2016 at 4:18

Checkout the Rating Scales references at the Usability Body of Knowledge website. One of those, Tullis and Dumas (2009) offers some advice for situations like yours:

  • use word labels for at least the end points of your scale
  • avoid the trap of a bipolar scale (an example is given comparing a bipolar scale from easy to difficult to a scale from "very easy" to "not easy at all")

Based on the above heuristics, the word labels on the "mood" axis are important! Consider trying a design without the numeric labels, instead using unlabeled marks or a solid axis with an arrow pointing upward and a single label, "improving mood". It might also be possible to use an icon or emoji to represent the end points of the scale.

In addition to the "mood" scale, consider the UX of your time scale. What do the numbers on the time axis represent? If those are days, consider labeling the axis "Day" instead of "Time" and consider how to indicate the month. It may be appropriate to use a chart tile "Mood in January" for example. Or, maybe relabel the drop down menu that says "Day, Month" to "Mood in January".

Caution: my answer assumes that it is correct to show mood as a scalar value, ranging from bad to amazing. A quick look at the Wikipedia article for mood raises the possibility that a 5-point scale may not accurately represent psychological mood. For example, what number is "irritable" compared to "anxious"? It may be that mood is more effectively represented as positive or negative.

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.