I'm making a webapp meant to be used by schools, in which teachers can create quizzes and assess students' answers. I'm finding myself struggling to get across the domain logic on grading, which is somewhat complex. I need some advice as to how to display the relevant information concisely in the form on UI text.

These are the facts I need to get across:

  • each answer has a score. Some types of exercises allow for the score to be automatically computed (e.g. multiple choice questions), whereas others require the teacher to manually enter a grade (e.g. open answer questions).
  • by default, the overall grade is computed as the sum of the scores obtained in each exercise. Updating an exercise's score also updates the overall grade (i.e. it's kept in sync with the exercises' scores).
  • the displayed grade could temporarily be "incomplete" or "partial", if one or more exercises that require manual assessment don't have a score assigned yet
  • the teacher can, at any time, override the overall grade, and enter either a number or an arbitrary string (e.g. "A+"). If this happens, then the grade won't be kept in sync with the exercises' scores anymore.
  • any overriding of the grades and score can be undone at any time. For example, undoing the override of the overall grade puts it back in sync with the sum of the scores of the exercises.

This is that the UI looks like:

enter image description here enter image description here

enter image description here

This short clip shows usage of the application. https://youtu.be/T-6jTaN0Ppk (watching is strongly recommended to get a feeling of what goes on during usage of the application)

My question is: is the information being communicated properly to the user? Is there anything that could be done to get the point(s) across more easily, such as different placement of the text/different usage of icons, and so on?

  • Hi Samuele, this is a question/answer site, anything that falls outside of this premise is likely to be closed as a question. In your case, there are several elements that promote the closure: any kind of feedback is off-topic, icon suggestions are off-topic, questions such as how do you like? are not allowed, more than one question at a time is not allowed. You should edit the content of the question and focus it on a specific and determined topic to get an answer.
    – Danielillo
    Apr 9, 2022 at 11:08
  • Thank you for the advice. I edited my question to make it more concise
    – Samuele B.
    Apr 9, 2022 at 11:14

1 Answer 1


Without analyzing in-depth the classification procedure, something that only the person in charge of the project can understand 100%, a couple of suggestions come to mind after seeing the interface.


First, I would try to organize all the content by defining well-differentiated areas between action and information. After watching the video, knowing the user must go from top to bottom to insert data, I would avoid them doing it from left to right. I think there is enough space to set the action and info columns. This helps to:

  • Clearly see the data and the interrelationship between them
  • Perception: it's about teachers, and all teachers use the outer left margin of the page for side notes.


Apparently, it's a somewhat tedious task: reading all the content is already a bit tiring, interpreting it, classifying it, etc. Consequently, I would try in the data to insert, if these respond to a clear pattern, for example numbers from 0 to 9, avoid forcing to incorporate it manually, and look for click-type options. There are several ways to achieve this, perhaps online sales platforms serve as an example to get ideas.

enter image description here

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.