On campus we have some large electronic boards (see the image below) displaying 6 rooms. Each color represents a seperate room, and shows when that room is booked.


Does there exists a more user friendly (and presumably less cluttered) way to display this information?

  • Do you have any ideas?
    – msanford
    Commented Nov 18, 2015 at 23:33
  • are students looking for a specific room? If they don't care which room, then this view can be greatly simplified.
    – Jung Lee
    Commented Nov 19, 2015 at 4:42

3 Answers 3


Find below some suggestions you may try :

  • Use horizontal axis for time, much easier to read.
  • Use grey font for hours. They are the less important information on the screen.
  • Use less saturated colors for rooms. Saturated colors create more clutter.
  • Do not repeat the hours in the room bars. They are not necessary.
  • Display continuous bars. If two sessions in the same room are one after the other, do not show them as two bars, but as one. This information is unnecessary.
  • Repeat hours for each day, this will minimize eye movements from users.
  • Remove grey background from day labels.
  • Add a grey line grid, this will help users more easily to identify empty rooms.
  • Make day label font bold and large, the most mistakes people make with bookings is the day

The result may look something like this:

enter image description here

  • @N3buchadnezzar I'd also add the numbers (labels) of rooms on the left side. Color coding as the single mean doesn't work perfect: both for color-blinded, or new users. Also there is no sense to display non-actual info: on Friday, what's the reason to show the previous days? Commented Nov 19, 2015 at 9:51

Instead of viewing the week in the columns, you could show the conference rooms in the columns. Then you can move the day of the week as a dropdown. I would think that most people are trying to schedule a meeting for a particular day and they can select the day, then see which times have room openings. That would de-clutter your chart.

  • edit: my room booker app pretty much had a day selector at the top, not a drop down but something similar. most important thing is to show what rooms at any time
    – colmcq
    Commented Nov 19, 2015 at 9:39

If it was a smaller page designed for the booking process rather than a big electronic board I'd recommend just displaying one day at a time, with a dropdown to swap between them. But since this is designed to give an overview, my recommendation would be something like this:


download bmml source – Wireframes created with Balsamiq Mockups

The colour gradients represent how many rooms are free: dark colours mean few rooms, lighter colours mean more rooms. Some sacrifices must be made to reduce the clutter and I think the least important fact is which room is available. A different colour scheme may work to, from red to green for instance (but it could be unclear to colourblind users - not that the current system is super friendly to them!).

I may have it wrong, but I gather that the students look at the board to check if a room is available at their chosen time, and then book it on their separate device. They can see if a room is free at a glance - they don't know which room but it's not relevant until they log on, at which point a more detailed list is displayed.

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.