I have a sidebar navigation where I need to seperate orders into two types - maintenance orders and service orders. Each order type has 4 statuses by which it should be separated - it has different data in table and actions are different.

I have a problem with showing these two groups because names of the statuses are the same.

What can I do to better emphasize groups and these statuses?

enter image description here

1 Answer 1


You will need to distinguish it by use of UI elements.

  1. Add the letters "M" and "S" in two contrasting colors (red & green) besides the word draft in a small box, respectively. That way, users will easily distinguish both and remember which color represents what element.

  2. You can choose to highlight the headings "maintenance orders" and "service orders" using two different colors, which again allows users to easily distinguish between the two.

  3. You could hide the options and add a dropdown arrow to reveal the sub-menus.

  • I like the 3rd option with dropdowns. I can indent the sub-menu and show them on the click.
    – Marko Kos
    Nov 16, 2023 at 7:49

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.