Implementing Math Equation Editor, Drawing & Accessibility Tools in LearnDash Quiz

We customized LearnDash Quiz for an education company based in New York, US that allowed their instructors to input complex mathematical equations using a Math Equation Editor (MEE) in LearnDash Quiz and also allow students to answer such questions using the same math editor. Besides, we also developed a drawing tool that allows students to answer a question by drawing objects on a canvas.

Client Background & Requirements

Our client is an education company based out  of New York city that specializes in developing state-specific diagnostic assessments and digital courses developed specifically for each state’s educational standards. They came to us with a requirement to develop a Math Equation Editor (MEE), a drawing tool and accessibility tools  that can be embedded in the LearnDash Quiz.

How did we provide solution?

We proposed a solution using the MathType library for the Math equation editor and developed custom solutions for drawing and accessibility tools.

1. Math Equation Editor

There are multiple libraries available that we can use to input Math equations. Out of these, we decided to go with the Mathtype Library. The Mathtype library supported all of the equations and formulas that were required by the students  for Grade 1 to Grade 8. We successfully implemented the editor in the embedded form in a way that it simulates the look, feel and the functionality of the Math Equation Editor in the current version of NY State Testing Program.

Screenshot – Math Equation Editor

2. Drawing Tool

We developed  a custom drawing tool that allows students to switch to canvas mode for a question on click of button and would allow the student to draw, erase and clear the drawings. Once a student draws something,  we save the drawing as an image on the  quiz completion and is later available to the instructor or the teacher reviewing the answers of the students in the backend.

Screenshot – Drawing Tool

3. Calculators

We implemented Texas instruments  TI-108 and scientific calculators in the LearDash course. We created a custom field at course level that allows the teacher to choose the calculator that students will have access to during the quiz.

4. Accessibility Tools

For the accessibility tools, we had to develop a few functionalities that would allow students with special needs  to customize the learning environment to suit their needs. So, we worked on 4 of them as follows –

  1. Answer Masking -When we are answering multiple choice questions, all the answers options are revealed to us by default. However, this could be quite overwhelming for children with special needs and so in this module, we customized the LearnDash Quiz in a way that all the possible answer options are hidden  by default. The answer options are visible to students only when they click on a visibility icon next to the option. 
  2. Text to Speech – For text to speech functionality, we used Google API which would read out loud the text selected by the student.
  3. Dark Contrast – This setting would allow students to access the LearnDash course in ‘Dark Mode’. We customized the quiz in a way that all the default bright colors of LearnDash transition to just black and white where black is the background and the text is white.
  4. Background Colors – This setting would allow students to simply change the default white background color with black text  of LearnDash to other color schemes like yellow background with black text, pink background with black text or blue background with black text.

Screenshot – Dark Contrast

Need LearnDash Customizations for your LMS Site?

Tell us your requirements