Replace the student grades page.#2917
Conversation
|
Thanks @somiaj.
For me with #2912, this started because I wanted a quick way to be on the Grades page and jump directly to a particular exercise. So can you make it so that from each cell in a table for an assignment, there is a link to that problem? Based on what I read here, are you no longer reporting the number of attempts used on a problem? (Or the number of incorrect attempts, as it were?) I find that helpful for a student to see in one place where they struggled, even if they eventually have all answers correct. |
|
@Alex-Jordan Thanks for the suggestions, I too thought about adding a link directly to the problem attached to the problem number, then forgot I wanted to do that. I can make each problem number a link, though I'm a bit worried about accessibility here. Having multiple links called "1" that go to different locations isn't something that is considered accessible I thought. You are correct, I'm not currently showing attempts on this page as I couldn't think of a use case for that information for students. Your use case sounds reasonable though it would add another row to the problem table for each set will end up taking more space. Also should this only be done on assignments, what about tests? I know tests are used in different ways, but to me it won't be as useful there. My experience is students (unless prompted to do so) probably won't be concerned about how many attempts they take, also with scaffold and multi part problems that info seems to not be as useful. I'm just brain storming the benefit of adding another row vs the overall use of it. Maybe let me know what you think about the layout of adding such a row once you get a look at this. Would me adding some screenshots of the current layout help? |
|
Sure, maybe some screenshots will help discussion. I think there must be an accessible way to have the link look like "1" but still convey the information that it goes to "set X problem 1". Not off the top of my head, but I'll look into that. |
|
Here is an example of what it currently looks like. For tests, if there were more versions, they would all be listed under the test below the version that is shown. 
|
|
@Alex-Jordan correct, for assignments, I show the |
|
Here, I deleted some problems from one of my sets to show it in action. 
|
|
A good sort could be useful, though I was partly modeling this off the assignments page where I find grouping by category helps (at least me). I do want to sort by something other than alphabetically, I just haven't gotten around to that yet, and figured some discussion about this is good. My hope is the grouping helps students quickly identify where they should be working. Though for a class in which everything is open, ordering those by date is a change that will be made. |
|
Really I just wanted to think about the sorting a bit more. Should this be configurable? Having to deal with reduced dates, and non reduced scoring assignments due dates, also what about secondary, etc. sorting for things all due at the same time. Just not something I wanted to work out with my initial layout attempt. |
somiaj
force-pushed
the
new-grades-page
branch
from
6be9133 to
930e69f
Compare
|
For assignments (not tests), the problem ID is now a direct link to the problem. @Alex-Jordan let me know if you find a way to make this more accessible. |
|
Seems adding an I also just found an issue with adding links directly to the problem. If for any reason the set is not accessible to a student, such as LTI restrictions or other restrictions that would prevent the student from accessing the problems, the student gets an error when trying to access the problem via the direct link. This means that care needs to be taken in determining if a link should be shown or not to the individual problems. This isn't an issue for the set anymore. So saving a student one click to go directly to the problem is going to add a layer of complication. |
somiaj
force-pushed
the
new-grades-page
branch
from
930e69f to
a51c080
Compare
|
Okay, I now test for lti, conditional release, and ip restrictions, and only create a link to problems in which the set has none of those restrictions. |
somiaj
force-pushed
the
new-grades-page
branch
from
a51c080 to
56bff23
Compare
somiaj
force-pushed
the
new-grades-page
branch
4 times, most recently
from
d4bf011 to
2fe4de9
Compare
|
I was just looking at this to see where it stands. Here are the things that I observe at this point. Did you forget to add a Also, why is there a One thing I notice immediately when looking at the result is that there are structural problems. The total grade shown at the top of the page should not be a list with a single item in it, and that can never have more than one item. That is semantically incorrect. I also don't think it is visually appealing to use a The grade items need to be reworked. A screen reader goes to the percent grade for the set first before announcing the set. It is semantically out of order. |
somiaj
force-pushed
the
new-grades-page
branch
2 times, most recently
from
792a8c9 to
1b6ccbe
Compare
|
Fixed the last issues mentioned. I accidentally committed the wrong file, so fixed that and the I updated the structure to address @drgrice1 comments. The grade total is no longer a list. I also set up some custom flexbox css to make it so the items are listed as 'set name' -> 'grade %' -> 'problem table', but are still positioned in a similar fashion. I also updated it so only the best test version is shown. And if there is more than one test version, the grade table informs the user that they are seeing Probably still a bunch to do. If you notice any problems please submit a PR, as I am limited on time, but will work on this when I can. |
|
Thanks for those changes. About saving space, I have a few thoughts. I already mentioned saving horizontal space by moving the "%" signs to the row header. So this: 
would become this: 
Although it might look better to set a uniform width on those cells: 
For saving some vertical space, I am looking at the "Score: 5 out of 8" rows that don't really need to be part of the table. They give information about the set as a whole, not per problem which is what the table is for. They also probably make the table a challenge to navigate with a keyboard. And probably the problem number row should be full of So what do you think about moving the "5 out of 8" to somewhere else? In some respects, it's redundant, since we already see the 63% overall score. Do we need "5 out of 8" at all? Would it make sense in tiny font right under the "63%"? Or just some place that doesn't take up vertical space? Similarly with tests and the row that has "Version 1 of 3 versions taken". That could be a parenthetical adjacent to the title of the test. If you don't like these ideas, feel free to reject them. I'm going to mark approval now. (Bad Alex, I haven't scrutinized the actual code...) |
@Alex-Jordan What about those changes? |
|
Run |
|
I think it's good, and my previous approval tag stands. I only skimmed the code changes. But the behavior on the page seems good. I'm not seeing that issue with the test versions anymore, for instance. |
somiaj
force-pushed
the
new-grades-page
branch
2 times, most recently
from
9fbc791 to
8444325
Compare
This replaces the Grades page for students with a new layout designed for students. The old grades table is still available to instructors under "Student Progress". Being a grade page for students, instructors see the same info a student would (no hidden sets or grades are shown for instructors acting as a student). The only difference for an instructor is the student navigation menu is shown to switch which student to act as. The assignments are split into categories. Open assignments, reduced scoring assignments (if reduced scoring is enabled), and closed assignments. Assignments are ordered using the same `byUrgency` logic as the ProblemSets page. The total grade, if configured to be shown, is shown at the top of the page for all sets that are past the open date. Each assignment is a list item which shows the total score. For tests the best test version score is shown if the student can see the score. Then a table which includes the total score and status for each problem in the set. For just in time, only top level problems are shown. For tests, only the best test version is shown. The old Grades page code is moved into StudentProgress.pm where it is still used.
Suggested by @Alex-Jordan, add the weights to the grade page and then add buttons to hide/show the weights. The buttons use local storage to save the state. The default state is to have the weights and attempts hidden. Since the toggle happens at page load the change is noticed when the page loads if not using the defaults. Also put the version and score on a single row to save height and a little bit of refactoring of adding the problems for each set to save duplication of code.
drgrice1
left a comment
drgrice1
left a comment
There was a problem hiding this comment.
Generally this is looking nice. Just a few things I noticed.
The margins don't look good between the different assignment groups. Here is what I see:
The margin on top of the header doesn't match the margin on the bottom, and so it is to close to the group above.
|
Also, the wording for tests is a bit strange to me. "Score: 16 out of 16 for version 4 of 5 versions taken" seems off for some reason. Also, I think the link to the actual version should only be on "version 4", and not "for version 4 of 5 versions taken". |
|
Perhaps it would be better to make that two parts. Something like "Score: 16 out of 16 for version 4, 5 versions taken". The current wording seems to say the score of 16 out of 16 is for 4 of the 5 versions. It was just a bit confusing to me when I read it the first time. Maybe it is the repetition of the word version in the sentence? I am not sure, it just doesn't read well to me. |
|
You can blame me for the wording. Jaimos had the two pieces of information on separate lines, and I merged them to save vertical space. Any improvement welcome. |
|
Perhaps a parenthetical would work well here. Something like "Score: 16 out of 16 for version 4 (5 versions taken)" |
I originally thought it might be useful to have versions taken information on this page. Though this is not something I use and unsure how useful it is, we could remove it if we don't think it is that useful to know number of versions taken and only just show the best version score. |
|
I think that being able to see all versions taken could be useful to students. If a student has taken several attempts at a test, it could be useful for the student to identify problems that they are having trouble with for future attempts. This does seem to be a subtraction from the previous grades page that is not the best. |
|
I think the reason I put the number of versions taken so students know they can click on the test to see them. I originally was showing all versions, but that could take up a lot of space. We could also go with the hidden route and have a way to toggle seeing all versions but keep them hidden by default. |
|
I like it reporting the number of versions. Maybe that is enough for now, but later we could explore a way to cycle through all test versions. Like the page could load showing version 3 scores (for example, because that is the high score version) with clickable left/right arrows to carousel through other versions. So it would not take extra space. |
This was not addressed. The now parenthetical "(5 versions taken)" should not be part of the hyperlink. The link is to the version that was taken, not all versions taken. |
| % if ($item->{version_link}) { | ||
| <a class="fw-bold" href="<%= $item->{version_link} %>"> | ||
| % } | ||
| % if ($item->{version_count} > 1) { | ||
| <%= maketext('for version [_1] ([_2] versions taken)', | ||
| $item->{version_id}, $item->{version_count}) %> | ||
| % } else { | ||
| <%= maketext('for version [_1]', $item->{version_id}) %> | ||
| % } | ||
| % if ($item->{version_link}) { | ||
| </a> | ||
| % } |
There was a problem hiding this comment.
Here is one way to make the link only be on the version taken text:
| % if ($item->{version_link}) { | |
| <a class="fw-bold" href="<%= $item->{version_link} %>"> | |
| % } | |
| % if ($item->{version_count} > 1) { | |
| <%= maketext('for version [_1] ([_2] versions taken)', | |
| $item->{version_id}, $item->{version_count}) %> | |
| % } else { | |
| <%= maketext('for version [_1]', $item->{version_id}) %> | |
| % } | |
| % if ($item->{version_link}) { | |
| </a> | |
| % } | |
| % my $takenVersion = maketext('for version [_1]', $item->{version_id}); | |
| % $takenVersion = begin | |
| <a class="fw-bold" href="<%= $item->{version_link} %>"><%= $takenVersion %></a> | |
| % end->() if $item->{version_link}; | |
| <%== $takenVersion %> | |
| % if ($item->{version_count} > 1) { | |
| <%== maketext('([_1] versions taken)', $item->{version_count}) =%> | |
| % } |
It splits the parenthetical into a separate maketext call, but that is fine. It is actually probably worse for translation to split the [_1] out of [_2] from the for version [_1].
There was a problem hiding this comment.
I was just doing something similar. I also removed the 'for' from the version link.
There was a problem hiding this comment.
Updated to use your begin .. end approach, but still went with mine of keeping the two translations, I think it is okay to split just the version name from the full translation like I did, but I can update to your approach if preferred.
somiaj
force-pushed
the
new-grades-page
branch
2 times, most recently
from
0461515 to
efed702
Compare
* Add "mb-3" to give a bottom margin on the list group items+ * Indent code properly. * Make versions taken statement a parenthetical. * Remove version count and 'for' from link. * Remove use of DOM content loaded event.
drgrice1
left a comment
drgrice1
left a comment
There was a problem hiding this comment.
Looks good. You have addressed the primary issues.
It would be nice to make test problems links as well, but that can wait for now.
3 participants
This replaces the Grades page for students with a new layout designed for students. The old grades table is still available to instructors under "Student Progress". Being a grade page for students, instructors see the same info a student would (no hidden sets or grades are shown for instructors acting as a student). The only difference for an instructor is the student navigation menu is shown to switch which student to act as.
The assignments are split into categories. Open assignments, reduced scoring assignments (if reduced scoring is enabled), and closed assignments. Assignments are ordered using the same
byUrgencylogic as on theProblemSetspage.The total grade, if configured to be shown, is shown at the top of the page for all sets that are past the open date.
Each assignment is a list item which shows the total score. For tests the best test version score is shown if the student can see the score. Then a table which includes the total score and status for each problem in the set. For just in time, only top level problems are shown. For tests, only the best test version is shown.
The old Grades page code is moved into
StudentProgress.pmwhere it is still used.