A picture of a laptop with mathematic equations and graphs

Adding interactivity in mathematics online workbooks using JSXGraph in STACK

A picture of a laptop with mathematic equations and graphs
Image by Oberholster Venita↗️ from Pixabay↗️

In this extra post, Konstantina shares an inspiring journey of transforming traditional mathematics workbooks into dynamic, interactive resources and explore the broader potential of JSXGraph. Konstantina Zerva is a Facilitator in Technology Enhanced Mathematical Education at the School of Mathematics↗️.


Since the onset of the COVID-19 pandemic, the University of Edinburgh and Loughborough University collaborated to develop online workbooks for the Mathematics education in STEM fields. Our approach to the online workbooks was to use the STACK online assessment system↗️ and combine our experience gained with running the fully online course “Fundamentals of Algebra and Calculus↗️” (FAC) with materials from the HELM (Helping Engineers Learn Mathematics)↗️ project workbooks. Each interactive workbook is a Moodle quiz with textbook-style written content, worked examples, simple tasks and practice questions.

The HELM project

HELM (Helping Engineers Learn Mathematics) is a collection of 50 workbooks developed by five English universities – Loughborough, Hull, Reading, Sunderland and Manchester – between 2002 and 2005. HELM resources cover the curriculum of first and second year mathematics courses for engineering undergraduates [1]↗️. Originally HELM had online support, but all that remained in 2020 were the PDF files of 50 Workbooks↗️ which are available publicly.

These Workbooks are subdivided into smaller manageable Sections. Each Section is available as a single PDF and was designed to be a self–contained topic, containing the background theory, worked examples, tasks for students to undertake with space for students to attempt the questions and exercises where normally only the answer is given.

During the summers of 2020 and 2021, as more and more teaching moved to online spaces, the universities of Edinburgh and Loughborough undertook an effort of translating the HELM materials into Moodle quizzes. This effort was supported with funding from the U21 Global Educational Enhancement Fund [2]↗️, which mainly enabled interns to be employed on the project.

Assessment combined with resources

At the school of mathematics, we were already familiar with creating high quality and engaging online resources for our teaching. Since 2018, we had developed and taught the fully online course “Fundamentals of Algebra and Calculus” (FAC), in which all materials form part of coherently organised digital exercises and expositions [3]↗️.

The central idea behind the implementation of FAC is to take the book and put the academic content inside a sequence of interactive online quizzes. That is, there are short blocks of text, worked examples, interactive diagrams, and short focused video clips embedded within the sequence of exercises and questions. Students work through the quizzes, and success on the course is judged by their success on the quizzes. The metaphor we followed is to put the book inside the quiz”.

HELM workbooks to STACK workbooks

Based on our positive experience of running and evaluating FAC, we decided to rejuvenate the HELM materials in the style of FAC to better support engineering students. The result was a collection of Moodle quizzes, each serving as an interactive workbook complete with textbook-style content, detailed worked examples, tasks of varying complexity, and practice questions. Most of the questions were created using the STACK software↗️, which allows us to have randomization, ensuring that students encounter questions with different values, thereby promoting a deeper understanding of the underlying principles.

On the first round of this project, whenever we needed to incorporate graphs, we decided to just covert the existing images into SVG images and not have any randomisation in the graphs or images. The reason for it is that it was already challenging for the interns to learn how to use STACK so we put our effort into creating more content with less interactivity. At the summer of 2021 we refined the materials and added some interactive elements using the JSXGraph.

Using JSXGraph

JSXGraph is a versatile and cross-browser library designed for displaying interactive geometry, function plotting, graphs, and data visualization within a web browser [4]. This powerful tool allows educators and content creators to seamlessly integrate interactivity into their digital resources.

In the HELM workbooks we used the JSXGraph in the following ways:

  1. Static images following randomisation: we created images in which the side of each side follows the randomisation we have in the question. In the following image the, angle and side of the triangle take random values that we define in the question, and the triangle we generate follows this randomisation.
An example worksheet with a picture problem
Image credit: Konstantina Zerva
  1. Static graphs following randomisation: we used JSXGraph as part of the solution of some questions. In the following example each student will get a different curve and different points The graph is not necessary in the solution of the problem but we add it to provide an different approach to the problem
Image credit: Konstantina Zerva
  1. Interactive graphs: We created interactive graphs in which students can dynamically change the graph by moving points of the graph or move a slider. This setup allows students to interact with mathematical concepts visually, making it easier to grasp and experiment with different scenarios by adjusting the sliders.
Image credit: Konstantina Zerva

Student Engagement

These resources have been used in our Engineering Mathematics and Mathematics for the Natural sciences courses, and students have engaged significantly better with the interactive online workbooks than in the other elements of the courses over this time. Here are some quotes from the students’ feedback:

“…… the most valuable thing about this course are the workbooks in STACK. I have learnt a lot from the workbooks”.

“Working with STACK and being assessed regularly keeps me engaged even having to study remotely.”

“The workbooks were a really good and clear way of laying out the maths with immediate questions to help develop understanding through examples.”

It is clear that the combination of well-crafted content and the technology-driven interactivity has created a conducive environment for effective learning.

Open Educational Resource

Recognizing the transformative potential of these materials, the collaborative effort has resulted in the release of the online workbooks as an Open Educational Resource (OER) under a Creative Commons license (CC-BY). By sharing these resources with the global educational community, the initiative aims to empower educators and learners alike to embrace innovative approaches to mathematics education.

The first version↗️  and the second version↗️ of the STACK/HELM workbooks are publicly available on github.

Beyond Mathematics: Interdisciplinary Possibilities

The JSXGraph’s potential extends far beyond mathematics. Its interactive capabilities can be harnessed in various disciplines, enhancing students’ learning experiences across the board.

      • Chemistry: In chemistry, JSXGraph can be employed to visualize molecular structures, chemical reactions, and dynamic processes. This visual approach can help students grasp complex chemical concepts more effectively.
      • Biology: JSXGraph’s interactive graphs and charts can aid in visualizing biological processes, genetic data, and ecological patterns. This tool can make biology lessons more engaging and comprehensible.
      • Architecture: Architecture students can benefit from JSXGraph by using it to create and manipulate architectural models in 2D and 3D. This allows them to experiment with design concepts and understand spatial relationships.
      • Arts: Even in creative fields like art, JSXGraph can be a valuable asset. Artists and art students can use it to explore geometric patterns, symmetry, and perspective, enriching their artistic endeavours.

    This was presented at the Learning and Teaching Conference 2023.

References

[1] https://www.lboro.ac.uk/departments/mlsc/student-resources/helm-workbooks/past-present-future/↗️

[2] https://universitas21.com/news-and-events/news/u21s-new-global-education-enhancement-fund-winners-announced↗️

[3] George Kinnear, Anna K. Wood & Richard Gratwick (2022) Designing and evaluating an online course to support transition to university mathematics↗️, International Journal of Mathematical Education in Science and Technology, 53:1, 11-34, DOI: 10.1080/0020739X.2021.1962554

[4] https://jsxgraph.uni-bayreuth.de/wp/index.htmlImage credit: Konstantina Zerva


Photograph of the authorKonstantina Zerva

Konstantina Zerva studied Physics at University of Ioannina, Greece and I received her PhD in Experimental Nuclear Physics in 2013 from the same University. After that, she worked as a Teaching Assistant at the School of Physics and Astronomy and at the School of Mathematics at the University of Edinburgh. Since 2017 she has been working as Facilitator in Technology Enhanced Mathematical Education at the School of Mathematics at the University of Edinburgh. Her main role is to design and develop online assessments for the undergraduate Mathematics courses using the STACK assessment system and also to give practical support to colleagues about the best use of e-assessment. She has a growing interest in scholarship of learning and teaching and how technology and e-learning can be used to support learners and educators. In 2019 she was awarded a fellowship in the Higher Education Academy.

Leave a Reply

Your email address will not be published. Required fields are marked *