Here are my suggestions for improving 1.9 gradebook interface. They are based on the whatever is current at http://test.moodle.org. I am going to break them in parts, so we can discuss in threads.
Tabs vs Dropdown menu
I think that all items at the dropdown menu used for gradebook navigation should be converted to the tab view (or just simple links on the top). Dropdown makes it hard to realize where you are exactly. Plus, it requires extra mouse click.
Hi Elena,
Thanks for your suggestion (which I've split from the new gradebook interface discussion, so it doesn't get too long).
I agree that tabs would be an improvement on the dropdown menu, and would make the gradebook more similar to other areas of Moodle.
Thanks for your suggestion (which I've split from the new gradebook interface discussion, so it doesn't get too long).
I agree that tabs would be an improvement on the dropdown menu, and would make the gradebook more similar to other areas of Moodle.
ah, I was getting confused why posts miraculously moved 
I think that we need a separate forum to talk about gradebook development. I guess every major module can have its own "development" forum, so we will not be using tracker for discussions (unless we want to use tracker for that)
Elena, thanks a lot for your tabs mock-up. 
I've created an improvement issue about it in the tracker - MDL-18004. Everyone, please comment and/or vote if you'd like it to be fixed.
I've created an improvement issue about it in the tracker - MDL-18004. Everyone, please comment and/or vote if you'd like it to be fixed.
Hi everyone!
I have updated the mock-up - please click on the url. Tried to organize it better, plus moved preferences around (after looking more at the LSU gradebook)
So, this last version is broken down by the report. Each report tab will have sub-tabs that are closely related to this report.
e.g. Grader has:
- View
- Edit Categories and items
- Reports settings (settings only for this report only in this gradebook)
- Modify My View Preferences (user viewing preferences that influence his view of this particular report in all courses)
This way Course Settings area is not really needed, since its parts will go under Report Settings sub-tab in each report type)
I have also inserted some crazy colors, just to show visually what is what..
I have updated the mock-up - please click on the url. Tried to organize it better, plus moved preferences around (after looking more at the LSU gradebook)
So, this last version is broken down by the report. Each report tab will have sub-tabs that are closely related to this report.
e.g. Grader has:
- View
- Edit Categories and items
- Reports settings (settings only for this report only in this gradebook)
- Modify My View Preferences (user viewing preferences that influence his view of this particular report in all courses)
This way Course Settings area is not really needed, since its parts will go under Report Settings sub-tab in each report type)
I have also inserted some crazy colors, just to show visually what is what..
I have just chatted with our programmer, and we can start working on this improvement after Feb 2nd.
The plan is to grab patched 1.9 and apply the changes there. LSU patches should be easy to add too, since they will be just added as additional tabs for new reports.
I would appreciate any feedback and suggestions to the mock up that I have posted.
The plan is to grab patched 1.9 and apply the changes there. LSU patches should be easy to add too, since they will be just added as additional tabs for new reports.
I would appreciate any feedback and suggestions to the mock up that I have posted.
I like the idea of having tabs on the gradebook, however I think it should be as simple as possible. Here is my mockup:
Hi Barry,
Like the idea (Elena's also). If we are trying to sell this to teachers then the simpler the better (or else they'll go back to other products). I rate gradebook useability/documentation as key. I'm just about to start a new academic year and know that if I want more people to use Moodle then I need to convince them it's cost-effective. This improvement will help I'm sure.
Paul
Like the idea (Elena's also). If we are trying to sell this to teachers then the simpler the better (or else they'll go back to other products). I rate gradebook useability/documentation as key. I'm just about to start a new academic year and know that if I want more people to use Moodle then I need to convince them it's cost-effective. This improvement will help I'm sure.
Paul
Hi Barry,
My link included page with 3 mockups. And the very first one had the same "regular" gradebook view,
but in tab/sub-tab format, rather than the dropdown menu.
I think we have to avoid use of drop-downs, since they increase the number of clicks needed for naviagation.
As for the actual content of sub-tabs, I am debating between including all related report info (settings, my preferences, calculations) on the corresponding report area right away, like here, or dropping everything under the Edit tab. Do you think that the last one is better?
My link included page with 3 mockups. And the very first one had the same "regular" gradebook view,
but in tab/sub-tab format, rather than the dropdown menu.I think we have to avoid use of drop-downs, since they increase the number of clicks needed for naviagation.
As for the actual content of sub-tabs, I am debating between including all related report info (settings, my preferences, calculations) on the corresponding report area right away, like here, or dropping everything under the Edit tab. Do you think that the last one is better?
Hi Elena,
It was page three that I found most confusing (too many horizontal options).
Check out my video of my mockup (sorry, don't know where to host the files)
It shows that you can accomplish the drop-downs in ajax without having to do lots of clicking. You could also add sideways (3rd level) options to dropdowns so you could navigate straight to 'Preferences' for example (sorry no time to add this to my mockup).
This method using AJAX would only require one click combined with mouse navigation to select an option.
Can someone comment on the viability of using an AJAX solution like this while still complying to accessibility guidelines?
It was page three that I found most confusing (too many horizontal options).
Check out my video of my mockup (sorry, don't know where to host the files)
It shows that you can accomplish the drop-downs in ajax without having to do lots of clicking. You could also add sideways (3rd level) options to dropdowns so you could navigate straight to 'Preferences' for example (sorry no time to add this to my mockup).
This method using AJAX would only require one click combined with mouse navigation to select an option.
Can someone comment on the viability of using an AJAX solution like this while still complying to accessibility guidelines?
Here is the video:
Barry, thanks for your screenshots, video and comments. If we use an AJAX solution then I think we would need to provide a non-AJAX alternative too.
Regarding the appearance of the gradebook tabs, how about making them look the same as elsewhere in Moodle, for example on a user profile page.
Regarding the appearance of the gradebook tabs, how about making them look the same as elsewhere in Moodle, for example on a user profile page.
I agree with this one. Tabs should look the same in any area, so they can be easily edited for themes.
Hi Helen,
Yes, I was just thinking about the other places tabs and sub-tabs are used as well (Like the database activity module for instance). I remember how I initially didn't notice the other horizontal non-drop-down options (or sub-tabs if you like) until I read the documentation on how to use the database module. Maybe it's just me and I need to keep a look out for things in the future.
I've also noticed how frustrating it is to have to wait for screen refreshes when clicking on each tab. I guess it doesn't use javascript? If we use tabs without Javascript that would mean potentially two clicks and two page refreshes before you reach the page you want to view. Can be even more frustrating for users with slow connections.
So if I were a user who was not allowed to have javascript enabled on my browser I'd prefer the old drop down list (or four of them) working only with HTML. Then I would only need one page refresh to reach my intended page.
I've noticed that Elena's mockup also uses javascript so we can't test non-javascript usability from playing around with that.
Try switching javascript off while browsing on Moodle.org or on the mockup demo. One long list (or messy list) with all the options appear instead of the javascript menus. I guess we need a less clutterred solution for the gradebook for when javascript is turned off.
I would like to hear from some users who don't have javascript enabled whether they would be happy with two page refreshes instead of just one as we currently have (except for preferences etc which also require two at the moment).
To summarise my thoughts:
Yes, I was just thinking about the other places tabs and sub-tabs are used as well (Like the database activity module for instance). I remember how I initially didn't notice the other horizontal non-drop-down options (or sub-tabs if you like) until I read the documentation on how to use the database module. Maybe it's just me and I need to keep a look out for things in the future.
I've also noticed how frustrating it is to have to wait for screen refreshes when clicking on each tab. I guess it doesn't use javascript? If we use tabs without Javascript that would mean potentially two clicks and two page refreshes before you reach the page you want to view. Can be even more frustrating for users with slow connections.
So if I were a user who was not allowed to have javascript enabled on my browser I'd prefer the old drop down list (or four of them) working only with HTML. Then I would only need one page refresh to reach my intended page.
I've noticed that Elena's mockup also uses javascript so we can't test non-javascript usability from playing around with that.
Try switching javascript off while browsing on Moodle.org or on the mockup demo. One long list (or messy list) with all the options appear instead of the javascript menus. I guess we need a less clutterred solution for the gradebook for when javascript is turned off.
I would like to hear from some users who don't have javascript enabled whether they would be happy with two page refreshes instead of just one as we currently have (except for preferences etc which also require two at the moment).
To summarise my thoughts:
- Tabs for the gradebook should have the least amount of clicks and page refreshes.
- If javascript is disabled in the browser: The HTML solution should still have the least amount of cliks and page refreshes. This is not achievable (or has not been implemented) with the currently used tabs in Moodle.
- The layout should be easy to navigate through.
(Just a small note, the current menu that is being replaced by tabs was a one-click menu with no accessibility issues 
)
Yep, I understand the mockup and that there are a lot of sub-tabs in my #3, thus we can stick to # 1, but I still think that drop-downs are bad.
My sub-tabs mockup is not pretty as yours, but it can be prettified for sure!
To comment on the AJAX issue - it can be very bad sometimes. We had to turn it off.
My sub-tabs mockup is not pretty as yours, but it can be prettified for sure!
To comment on the AJAX issue - it can be very bad sometimes. We had to turn it off.
Hi, Elena!
Loving the tabs idea ...
If you don't mind, I'd prefer Nicolas implemented the basic code to do the tabs since he knows all the code and conventions pretty well, but we will really need some help from you and everyone here to work out the best content and wording (before we get the translators onto them!)
We also need to think about the Moodle 1.9 books out there and people upgrading to the new interface. Will it be so obvious that people will just get it? Or will we need to have an option to switch between the popup menu and tabs? Should tabs be default for new installations but not for upgrades? etc
Finally, I'd recommend sticking to standard tab appearance for now ... we could upgrade ALL the tabs in Moodle to dynamic menus at some point in future since they are just lists. This is tricky to achieve for all browsers though, and accessibility is an issue.
Loving the tabs idea ...
If you don't mind, I'd prefer Nicolas implemented the basic code to do the tabs since he knows all the code and conventions pretty well, but we will really need some help from you and everyone here to work out the best content and wording (before we get the translators onto them!)
We also need to think about the Moodle 1.9 books out there and people upgrading to the new interface. Will it be so obvious that people will just get it? Or will we need to have an option to switch between the popup menu and tabs? Should tabs be default for new installations but not for upgrades? etc
Finally, I'd recommend sticking to standard tab appearance for now ... we could upgrade ALL the tabs in Moodle to dynamic menus at some point in future since they are just lists. This is tricky to achieve for all browsers though, and accessibility is an issue.
Hi Martin,
2 questions:
1) Tracker says that tabs will be fixed for 2.0 only. Is this correct?
We want to upgrade to 1.9 before Summer, thus we (here) need to have this functionality before that time.
2) Where gradebook development is going? Will current Categories and Items interface stay, or is it going to be replaced with LSU Quick items?
Thank you!
2 questions:
1) Tracker says that tabs will be fixed for 2.0 only. Is this correct?
We want to upgrade to 1.9 before Summer, thus we (here) need to have this functionality before that time.
2) Where gradebook development is going? Will current Categories and Items interface stay, or is it going to be replaced with LSU Quick items?
Thank you!
Hi Elena,
You can find our plans for improving the gradebook listed here: Development:Gradebook improvements.
You'll notice that tabs navigation is included in Stage 1 i.e. it will be done soon, certainly before the summer. Hopefully it will be possible to include it in Moodle 1.9.5 as well as in 2.0.
Regarding improving the interface for editing categories and items, the plan is to implement the improvements described in MDL-15680, though we'll look further at the LSU's 'Quick edit categories' and 'Quick edit items' to see if additional usability improvements can be made.
You can find our plans for improving the gradebook listed here: Development:Gradebook improvements.
You'll notice that tabs navigation is included in Stage 1 i.e. it will be done soon, certainly before the summer. Hopefully it will be possible to include it in Moodle 1.9.5 as well as in 2.0.
Regarding improving the interface for editing categories and items, the plan is to implement the improvements described in MDL-15680, though we'll look further at the LSU's 'Quick edit categories' and 'Quick edit items' to see if additional usability improvements can be made.
Elena, thanks for your suggestions regarding content and wording of tabs. 
Nicolas has kindly implemented my initial ideas for gradebook tabs here: http://test.moodle.org/1.9/grade/report/grader/index.php?id=2 (username teacher and password testm00dle).
From looking at other places in Moodle where tabs are used, such as profile pages and database activities, I found that 6 or 8 tabs seemed to work well, as opposed to less tabs with more links within them. I therefore decided that Categories and items, Scales and Letters would be better as tabs rather than as links within a tab.
You'll notice that there is no tab for the gradebook course settings, as I'd like to simplify the gradebook by moving these settings to the course settings page. Does this seem a good plan?
If outcomes are enabled for the site, there could be an outcomes tab too.
I've hidden the overview report link in the view tab by not setting the capability gradereport/overview:view for the role of teacher, as I can't see any point in teachers (or admins) viewing overview reports.
I'm just wondering whether the different gradebook reports would be better as tabs too, rather than links within the view tab, or would this result in too many tabs?
Nicolas has kindly implemented my initial ideas for gradebook tabs here: http://test.moodle.org/1.9/grade/report/grader/index.php?id=2 (username teacher and password testm00dle).
From looking at other places in Moodle where tabs are used, such as profile pages and database activities, I found that 6 or 8 tabs seemed to work well, as opposed to less tabs with more links within them. I therefore decided that Categories and items, Scales and Letters would be better as tabs rather than as links within a tab.
You'll notice that there is no tab for the gradebook course settings, as I'd like to simplify the gradebook by moving these settings to the course settings page. Does this seem a good plan?
If outcomes are enabled for the site, there could be an outcomes tab too.
I've hidden the overview report link in the view tab by not setting the capability gradereport/overview:view for the role of teacher, as I can't see any point in teachers (or admins) viewing overview reports.
I'm just wondering whether the different gradebook reports would be better as tabs too, rather than links within the view tab, or would this result in too many tabs?
Helen, I like your suggestions for the layout of tabs. It makes perfect sense. Have tabs for the things we would use a lot and have sub-tabs only when there are too many options but keep a good default option. This seems to be the rule followed for the database module and profile tabs.
Good idea about moving gradebook course settings and getting rid of the overview report for teachers.
If you gave the gradebook reports their own tabs:
Grader Report | User Report | Categories and items | Scales | Letters | Import | Export
How about:
Grader | Student | Categories and items | Scales | Letters | Import | Export
or
Grader | User| Categories and items | Scales | Letters | Import | Export
Then you save a bit of space
Good idea about moving gradebook course settings and getting rid of the overview report for teachers.
If you gave the gradebook reports their own tabs:
Grader Report | User Report | Categories and items | Scales | Letters | Import | Export
How about:
Grader | Student | Categories and items | Scales | Letters | Import | Export
or
Grader | User| Categories and items | Scales | Letters | Import | Export
Then you save a bit of space
Re Martins comments: "will we need to have an option to switch between the popup menu and tabs? Should tabs be default for new installations but not for upgrades? etc
I noticed on the 'User Report' view of the demo site that you could still see some remains of the drop-down menu. Maybe we could have both?
I noticed on the 'User Report' view of the demo site that you could still see some remains of the drop-down menu. Maybe we could have both?
Great suggestion, Barry. Keep the menu for legacy and compatibility reasons as well as to go to a random page quickly, but add the tabs for feature visibility and to switch between common pages.
Barry and Gary, I'm not so sure about keeping the dropdown menu as well as having tabs. Having two navigation methods may confuse some people. Also, the current dropdown menu is quite long, with the word Scales repeated and the two categories and items views.
I don't think two navigation methods will be too confusing, if it is, how about having an option to enable both/either?
On the other hand, I guess it's not really fitting it's purpose (preserve legacy, make sense for old books etc), since the structure has changed somewhat anyway.
On the other hand, I guess it's not really fitting it's purpose (preserve legacy, make sense for old books etc), since the structure has changed somewhat anyway.
I agree - I don't think the dropdown offers any real advantages over the tabs and could cause confusion for new users. It also can't be viewed without both click and scroll so it kind of hides the available options almost all of the time. Simpler is better
Barry, thanks for your suggestions regarding tab names.
I've been thinking about saving space by shortening the name 'Categories and items'. Perhaps it could become 'Edit gradebook'?
I've been thinking about saving space by shortening the name 'Categories and items'. Perhaps it could become 'Edit gradebook'?
I think people might confuse 'Edit gradebook' with 'Grader report' (with editing switched on). How about 'Edit Structure' or something similar?
View | Edit Structure | Scales | Letters | Import | Export
Simple view | Full view
View | Edit Structure | Scales | Letters | Import | Export
Simple view | Full view
I agree that Edit can be confused with Turn Editing on.
BUT, I would rather rename that Turn Editing On button, if possible.
Start Manual Grading or something similar will work.
BUT, I would rather rename that Turn Editing On button, if possible.
Start Manual Grading or something similar will work.
+1 for that. I was initially confused when I found that having the editing on in the gradebook did not mean it was on in the course and vice versa. Renaming the button in the course as well to distinguish further would be good too.
'Course editing' and 'grades editing'?
'Course editing' and 'grades editing'?
I need to test things more, but I wanted to say that I feel like it's Christmas time!
1) no tab for the gradebook course settings, as I'd like to simplify the gradebook by moving these settings to the course settings page
I believe that this would not be beneficial. I always wanted to move move "Show grades" Yes/No TO the gradebook, because such location makes more sense.
Gradebook settings should belong to the gradebook.
2) I'm just wondering whether the different gradebook reports would be better as tabs too, rather than links within the view tab, or would this result in too many tabs?
I was also struggling between those two ideas.
Every report can have its own tab, and then that tab will have settings specific for the report. This indeed can potentially create more 1st level tabs, like here.
However, since "Projected Final" is not in the core, plus since "Overview/My Grades" is now hidden by default, the interface will be much smaller. And I believe it is more intuitive. Here is yet another mockup, which does not look that scary.
On the other hand, if we will stick to what we have now, I suggest the following (5th mockup):
- rename Preferences to My Preferences and move it to the end of the row (put it after User Report). Use that area to set potential preferences not only for the Grader report, but for all other reports available now and in the future. This will adress Barry's concern, which I agree with.
- add Gradebook Settings as another sub-tab, right before/after Preferences. It should include "show gradebook: yes/no", plus the rest of the gradebook settings, specific to this course.
We can also have completely separate Settings tab, which will include both Preferences (aka My viewing preferences) and Course Gradebook Settings
(should I draw it?
)
I anticipate that some admins will disable teachers' ability to modify/view both of those settings to make the life more easier ;)
3) I've hidden the overview report link in the view tab by not setting the capability gradereport/overview:view for the role of teacher
Good!
I believe that this would not be beneficial. I always wanted to move move "Show grades" Yes/No TO the gradebook, because such location makes more sense.
Gradebook settings should belong to the gradebook.
2) I'm just wondering whether the different gradebook reports would be better as tabs too, rather than links within the view tab, or would this result in too many tabs?
I was also struggling between those two ideas.
Every report can have its own tab, and then that tab will have settings specific for the report. This indeed can potentially create more 1st level tabs, like here.
However, since "Projected Final" is not in the core, plus since "Overview/My Grades" is now hidden by default, the interface will be much smaller. And I believe it is more intuitive. Here is yet another mockup, which does not look that scary.
On the other hand, if we will stick to what we have now, I suggest the following (5th mockup):
- rename Preferences to My Preferences and move it to the end of the row (put it after User Report). Use that area to set potential preferences not only for the Grader report, but for all other reports available now and in the future. This will adress Barry's concern, which I agree with.
- add Gradebook Settings as another sub-tab, right before/after Preferences. It should include "show gradebook: yes/no", plus the rest of the gradebook settings, specific to this course.
We can also have completely separate Settings tab, which will include both Preferences (aka My viewing preferences) and Course Gradebook Settings
(should I draw it?
)I anticipate that some admins will disable teachers' ability to modify/view both of those settings to make the life more easier ;)
3) I've hidden the overview report link in the view tab by not setting the capability gradereport/overview:view for the role of teacher
Good!
Hi Elena and thanks for your participation!
1) I believe that this would not be beneficial. I always wanted to move move "Show grades" Yes/No TO the gradebook, because such location makes more sense.
Gradebook settings should belong to the gradebook.
This seems to me to be an issue of Point of View. We need to get votes on this one. Some prefer having all course-wide settings in the "Course settings" page, and others like you prefer to have all gradebook settings in the gradebook pages. The problem is that there is a large overlap between the two, and we can't duplicate these settings.
2) Re: tabs
I like your mockups, they're very useful. However please resist the temptation to shuffle them around as if the logic behind them was arbitrary: they must be built dynamically based on the plugins found on disk. I think we are getting close to an optimal solution, and your mock-ups have been very helpful
I like the idea of having a tab for settings preferences of ALL the reports combined. I will discuss that with Helen and seek additional feedback.
1) I believe that this would not be beneficial. I always wanted to move move "Show grades" Yes/No TO the gradebook, because such location makes more sense.
Gradebook settings should belong to the gradebook.
This seems to me to be an issue of Point of View. We need to get votes on this one. Some prefer having all course-wide settings in the "Course settings" page, and others like you prefer to have all gradebook settings in the gradebook pages. The problem is that there is a large overlap between the two, and we can't duplicate these settings.
2) Re: tabs
I like your mockups, they're very useful. However please resist the temptation to shuffle them around as if the logic behind them was arbitrary: they must be built dynamically based on the plugins found on disk. I think we are getting close to an optimal solution, and your mock-ups have been very helpful
I like the idea of having a tab for settings preferences of ALL the reports combined. I will discuss that with Helen and seek additional feedback.
In reply to Nicolas Connault
Re: New gradebook navigation - course settings and report preferences
by Helen Foster -
Regarding where to put course settings and report preferences, a suggestion that came up in our Moodle HQ meeting today was to have a settings tab just for course settings and a preference tab for grader report preferences and any other report preferences.
By having separate tabs for course settings and report preferences, this will hopefully make it clear that course settings apply to the course gradebook and report preferences apply to the user only. A reminder at the top of each page would probably help too.
Any comments on this suggestion?
By having separate tabs for course settings and report preferences, this will hopefully make it clear that course settings apply to the course gradebook and report preferences apply to the user only. A reminder at the top of each page would probably help too.
Any comments on this suggestion?
In reply to Helen Foster
Re: New gradebook navigation - course settings and report preferences
by Barry Oosthuizen -
For me that would clear up the confusion I had on the test site when everything was under the settings tab.
In reply to Helen Foster
Re: New gradebook navigation - course settings and report preferences
by Elena Ivanova -
I agree. 2 tabs will help a lot. Plus, we can name them accordingly, e.g. "My report preferences", which will make it even more clear.
In reply to Elena Ivanova
Re: New gradebook navigation - course settings and report preferences
by Nicolas Connault -
You can test the separate tabs on the 1.9 test server with the usual login details:
username: teacher
password: testm00dle
Or contact me for an account with more advanced permissions.
username: teacher
password: testm00dle
Or contact me for an account with more advanced permissions.
In reply to Nicolas Connault
Re: New gradebook navigation - course settings and report preferences
by Elena Ivanova -
Love it
It has regular intuitive moodle-like interface, and gives clear distinction between those two areas.
One thing that we can possibly discuss: making navigation methods the same.
Settings has 4 sections, but no sub-tabs: General settings, Grade item settings, Overview report, User report
(which I personally like more for this particular area because of less clicking)
My preferences has 2 sub-tabs and each sub-tab has sections:
Grader report with General, Show/hide toggles, Special rows
Visual Report with Calculations
I would probably make My preferences with no sub-tabs and just have 4 (or more as needed) sections there:
Grader report - General settings
Grader report - Show/hide toggles
Grader report - Special rows
Visual Report - Calculations
It has regular intuitive moodle-like interface, and gives clear distinction between those two areas.
One thing that we can possibly discuss: making navigation methods the same.
Settings has 4 sections, but no sub-tabs: General settings, Grade item settings, Overview report, User report
(which I personally like more for this particular area because of less clicking)
My preferences has 2 sub-tabs and each sub-tab has sections:
Grader report with General, Show/hide toggles, Special rows
Visual Report with Calculations
I would probably make My preferences with no sub-tabs and just have 4 (or more as needed) sections there:
Grader report - General settings
Grader report - Show/hide toggles
Grader report - Special rows
Visual Report - Calculations