Test and Assessment: Drawing / Handwriting Question Type

If you need any help in filling out this wiki page, please visit our ILIAS Community FAQ. And please complete the metadata information in the right column after having created the page.

1 Initial Problem

ILIAS is increasingly being used for online exams, typically involving the Test and Assessment object.
A common request from lecturers is to incoprorate a "drawing", "painting" or "hand writing" question type.

Purpose: The introduction of a "drawing" question type in ILIAS would address the current lack of support for various types of exam questions, particularly those relevant to Mathematics and the Sciences. Here are a few examples:

1. Mathematical Formulas and Calculations Even if the ILIAS Essay Question type ("Freitext") supported the inclusion of formulas via LaTeX code (which it currently doesn't seem to), not every student is proficient in LaTeX. Additionally, the ability to simply "scribble" would makes it easier for students to take notes and to show how they arrived at their result.
2. Flowchart Diagrams and Similar
3. Diagrams of Chemical Structures
4. Venn Diagrams
5. Truth Tables

What do we need? The proposed question type should support both drawing and handwriting functionalities utilizing a stylus as well as drawing diagrams using a mouse or trackpad.

1. Drawing and writing using a stylus: Since students cannot be expected to have a device with a high-quality stylus, this is less useful for tests students write at home. However, this feature becomes immensely valuable in supervised exams conducted on university-provided restricted devices with stylus support, such as Chromebooks or tablets. Ideally, the question type should take advantage of the pressure sensor on high-quality styluses.
2. Drawing using the mouse: This functionality is more useful for creating flowcharts, venn diagrams, chemical structure diagrams, etc. Ideally, the question type should provide reasonably advanced vector drawing features that make using the mouse to draw diagrams feasible.

Current state: There are currently two plugins available, developed by the same author, which partially address this functionality. However, they fall short of being a full-fledged solution meeting all the requirements.

1. assJSMEQuestion: This plug-in integrates the JSME Editor, specifically designed for creating molecule diagrams. This works quite well and covers this specific use case better than a more universal question type likely could. It has recently been updated to be compatible with ILIAS 8.
2. assPaintQuestion: This plug-in offers basic drawing functionalities. It utilizes the "Literally Canvas" widget for this, which works but has not been actively developed since 2017 and clearly shows its age. While it supports both stylus-based handwriting / hand-drawing and mouse-based "vector-editor-like" drawing, its feature set is limited, and the user interface is suboptimal. As of February 5th, it has yet to be migrated to ILIAS 8.

2 Conceptual Summary

A new "drawing / handwriting" question type should be created. The drawing features of this question type should be based on a modern open-source library that provides the features needed and has a pleasant and user-friendly interface. Two such libraries come to mind, there are very likely others (feel free to add any that you think might work well here!):

1. 1. Excalidraw is an open-source web application designed for drawing diagrams with a hand-drawn aesthetic using a mouse, but also offers advanced support for actual hand-drawing. The hand-drawn aesthetic enhances the appearance of diagrams drawn quickly with a mouse, making them appear less "awkward" and imprecise, although this effect can be mostly disabled. Excalidraw focuses on being a collaborative whiteboard, but also works as a single-user webapp, which should make it easier to integrate. Its compatibility with Obsidian, supported through a plugin, means that some users may already be acquainted with it. For stylus support, Excalidraw utilizes the perfect-freehand library (which has been developed by the main author of tldraw). This library provides excellent stylus support, resulting in hand-written text that is comparatively legible and neat in appearance.
   2. tldraw is a web application that provides comparatively basic diagram drawing features, prioritizing simplicity and advanced hand-writing support. Surlabs is currently (early 2024) working on an ILIAS plug-in that aims to provide collaborative whiteboard functionality based on tldraw, but no test and assessment integration. Perhaps, the work done by surlabs could be used to make creating a new test and assessment question type easier.
      Tldraw also serves as the whiteboard used by BigBlueButton, meaning that many users may already be familiar with its interface. For stylus support, tldraw utilizes the perfect-freehand library, authored by the same developer.
      This library provides excellent stylus support, resulting in hand-written text that is comparatively legible and neat in appearance.
      However, tldraw is provided under an unusual which prohibits commercial use. What kind of commercial use it prohibits and whether this is a problem for ILIAS would need to be looked at in more detail before tldraw can be used as a foundation.

Regardless of the chosen library, several important features should be implemented:

• Persistence of Drawing Sessions: Enable the continuation of a previously started painting session during an ongoing test, even if the original browser window has been closed or if the user logs in from a different computer due to technical issues. This functionality necessitates regularly saving progress to the server, just as the other test and assessment question types do.
• Good stylus support, ideally including pressure sensitivity
• Vector-like Drawing Options: Provide comprehensive support for "vector-like" / "diagram-editor-like" drawing options when using a mouse. This entails implementing features that allow users to create and edit drawings at a fairly high level, not drawing individual lines and curves (as one often would with a stylus) but drawing boxes with labels inside them etc.

3 User Interface Modifications

Since this is simply yet another question type, there should not be any user interface modifications aside from the question type itself and its options. The options would depend on the exact features offered, which depend on the library used (see above).

3.1 List of Affected Views

3.2 User Interface Details

{ For each of these views please list all user interface elements that should be modified, added or removed. Please provide the textual appearance of the UI elements and their interactive behaviour. }

3.3 New User Interface Concepts

{ If the proposal introduces any completely new user interface elements, you might consult UI Kitchen Sink in order to find the necessary information to propose new UI-Concepts. Note that any maintainer might gladly assist you with this. }

3.4 Accessibility Implications

{ If the proposal contains potential accessibility issues that are neither covered by existing UI components nor clarified by guidelines, please list them here. For every potential issue please either propose a solution or write down a short risk assessment about potential fallout if there would be no solution for the issue. }

4 Technical Information

{ The maintainer has to provide necessary technical information, e.g. dependencies on other ILIAS components, necessary modifications in general services/architecture, potential security or performance issues. }

5 Privacy

No additional privacy concerns.

6 Security

{ Does the feature include any special security relevant changes, e.g. the introducion of new endpoints or other new possible attack vectors. If yes, please explain these implications and include a commitment to deliver a written security concept as part of the feature development. This concept will need an additional approvement by the JourFixe. }

7 Contact

• Author of the Request: Fabian Stöhr (digitale-lehre@uni-konstanz.de)
  

8 Funding

If you are interest in funding this feature, please add your name and institution to this list.

• …

9 Discussion

10 Implementation

{ The maintainer has to give a description of the final implementation and add screenshots if possible. }

Test Cases

Test cases completed at {date} by {user}

• {Test case number linked to Testrail} : {test case title}

Privacy

Information in privacy.md of component: updated on {date} by {user} | no change required

Approval

Approved at {date} by {user}.