Editor for teachers to create exam, exercises, and questions

Question

I'm making a webapp for my local university, which allows teachers to create exams made up of open-ended/multiple-choice questions and JavaScript programming exercises, as well as group them by topic and a whole host of options to randomize the items in the exam, plus other settings.

I am not particularly experienced at making user interfaces,and my main concern is the interface could get cluttered up and become hard to navigate as more and more exercises are added to an exam.

Here are some screenshots of the app, followed by a brief video showing how it's navigated in a browser. I apologize for some parts in which language gets mixed up, that's for unrelated reasons.

Here's the part where you add topics:

---

Here's a couple collapsed question editors:

---

Here's one of the most important parts: the fully expanded question editor

---

Here's the coding exercise editor:

---

Here's a view of a list of a few topics, some of them with their optional text editor opened: as you can see, it can get cluttered:

---

Video

A few issues I've identified with this interface:

1. As more and more exercises/questions are added to an exam, the size of the content on the screen grows very quickly, making it harder to navigate from one item to the next one.

2. Questions are displayed inside the editor in the order they were added, and there is no way to move them around. The reason being, if you turn off the "randomization", the questions will be displayed to students during the exam(s) in the order they were added, so the order they are displayed in the editor is not just cosmetic but also has a function.

3. To manage topics, you have to jump back to the list of topics, and I don't know if this can be a problem as far as user experience.

A solution I've thought about is to add an index that shows questions/exercises grouped by topic. That would give the teacher a logical view of the items. The index would have links to jump to the specific editor for the clicked item, and it would be always accessible -- think an icon at the bottom right that expands into this menu-like index upon clicking.

Another solution would be to actually allow teachers to move items up/down the list, but that would also cause an effect on functionality, i.e. the order they appear in the exam would change; at that point, I could add an explicit "ordering" number in the editors that would decouple the position they appear inside the editor from the order they are presented in exams. I'm afraid this would have the opposite effect and make the interface more complex and hard to use, though.

I'm looking for feedback regarding the three points I raised, as well as any input for solution I might adopt.

Answer 1

The complexity of the interface is really determined by how sophisticated the question content is as well as the format of the exam. To your issues/concerns:

As more and more exercises/questions are added to an exam, the size of the content on the screen grows very quickly, making it harder to navigate from one item to the next one.

The purpose of a Learning Management System (LMS) is to provide ways to help make the process of creating, updating and managing the learning content more efficient. You have to review the content in its entirety and use metadata to improve this process in some way, but it will enhance the information architecture of your design in the long run. Keep in mind that the challenge will only scale in complexity as you add more users and more topics to the system.

Questions are displayed inside the editor in the order they were added, and there is no way to move them around. The reason being, if you turn off the "randomization", the questions will be displayed to students during the exam(s) in the order they were added, so the order they are displayed in the editor is not just cosmetic but also has a function.

I think the concept of a question bank, and an exam template will help you separate the management of the questions with the creation of an exam paper. Right now it seems like these two are linked too closely so you have some limitations here.

To manage topics, you have to jump back to the list of topics, and I don't know if this can be a problem as far as user experience.

It depends on how the topics are defined and if the distribution of questions amongst topics are relatively spread out. I assume that a question can also cover multiple topics, and if so then you do have to create more metadata structure to help the user navigate or find questions more easily.