side menu and accordions

[Gyukat]

It is very difficult to visually separate out the main menu items and the submenu items...can we use either colour or indents to help clearly separate these?

[JoshBone]

Is it any better? :) Refresh might be needed.

[Gyukat]

yes, better!!! Sorry for the delay...you got buried in my box.

[Gyukat]

So, I am testing the system right now, and I still find this hard to navigate. Essentially, the accordion stays open for different top items at the same time...this is fine. BUT this means it can get really visually confusing as the list seems really long.

UPSHOT! You would need to distinguish further these things:

• top level items from second level items
• selected items from the rest
• location of current record in hierarchy

SUGGESTIONS!

• Top level items background dark or black
• Second level items background grey (even lighter than now so it is immediately apparent!)
• Highlight items that we have selected in blue (like current mouseover) or other colour.
• Mouseover colour change may not be needed unless you have ideas.
• Breadcrumb needed at the top of records, so Report should read: Reference Data / Reports...and cascading down could read: Reference Data / Reports / View or View Report ; Reference Data / Reports / Edit or Edit Report << I see this conflicts with other advice, so better put Reference Data / Reports / View & Edit Report or simply View & Edit for both pages.

[Gyukat]

Based on yesterday's conversation, I will update the above:

• We agree that only one accordion should be opened at one time.
• Still need to distinguish these things:
  • top level items from second level items >> suggestion is to make more contrast in the background colour of second level; so the main colour can remain, but the second level background colour should be some shades lighter.
  • selected items from the rest >> we suggest blue for the selected item, the mouseover can be whatever colour...lighter grey?...or none.
  • location of current record in hierarchy >> suggestion is to make breadcrumb at the top of records, so Report should read: Reference Data / Reports...and cascading down could read: Reference Data / Reports / View & Edit for both the view and edit pages.
• We need to adjust the menu options and order...so:
  • Order "Submit Reports", "MyData", "ReferenceData", "Statistics", "Documentation"
  • MyData should only have "MyReports", "MyAgencies"
  • ReferenceData should have "Reports", "Agencies", "Activities", "Institutions", "Countries"

(Views will change slightly based on user type...in case of administrator you can deactivate MyData menu links or disappear them.)

p.s. Also work on decreasing the padding around each record.

[JoshBone]

Besides the first one it's done. Please check! For the first one all the other accordions getting closed, when you're selecting an item. This is now the shortest solution that I can come up with (it's a framework issue).

Otherwise I think it looks more neat. :)

[Gyukat]

We checked it, and are very happy...

• order of menu options is good and the parallel of the names and order under My Data and Reference Data
• colours are good, including especially the blue highlight and subtle mouseover
• breadcrumbs are good...only time it is a bit wonky is in the CSV part because the padding is still there...not sure if there is another solution for now
• padding decrease is good

THANKS!