A Framework for Rich Interactive Questions for Quizzes ... - CETIS Wiki

A Framework for Rich Interactive
Questions for Quizzes in Mathematical
Sciences
DVLE showcase meeting
Adrian Bowman, Ewan Crawford, Ludger Evers, and John
McColl
January 25, 2011

In case you get bored . . .
. . . you can play with the interactive features (running outside
VLE) at
http://www.mathstore.ac.uk/jisc/
2/23

Key idea
Educational Background
Illustrating theoretical concepts graphically is an important part
of teaching quantitative concepts.
Example:
Consider the linear function f (x) = a + bx.
How to interpret a and b?
f (0) = a
∂
f (x) = b ∀x ∈ R
∂x
3/23

Key idea
Educational Background
Illustrating theoretical concepts graphically is an important part
of teaching quantitative concepts.
Example:
Consider the linear function f (x) = a + bx.
How to interpret a and b?
f (0) = a
∂
f (x) = b ∀x ∈ R
∂x
3/23

Key idea
Educational Background
Illustrating theoretical concepts graphically is an important part
of teaching quantitative concepts.
Example:
Consider the linear function f (x) = a + bx.
How to interpret a and b?
f (x)
f (0) = a
∂
f (x) = b ∀x ∈ R
∂x
a
1
b
x
3/23

Technological background
Modern browser technology allows learners to interact
with figures and illustrations.
VLEs quizzes are built around multiple-choice questions
and standard open questions.
Only static images can be used as illustrations.
IMS QTI only has limited support for graphical
interactions.
selecting “hotspots”,
filling “gaps” in an image, and
moving one image on
top of another.
4/23

Extend the functionality of the quiz facility of a VLE by
providing a framework for widgets displaying interactive
graphics.
Project aim
5/23

Technological choices: Display graphics
Interactive feature should run inside the browser.
Adobe Flash
- Requires proprietary plug-in (not available on all
platforms)
Java
- Requires plug-in / runtime (not available on all platforms)
Javascript and SVG/VML
+ Requires no plug-in.
- Differences between Internet Explorer (VML) and other
browsers (SVG)
Our approach: Use Javascript and SVG/VML using Raphaël
for browser abstraction.
6/23

Technological choices: Display graphics
Interactive feature should run inside the browser.
Adobe Flash
- Requires proprietary plug-in (not available on all
platforms)
Java
- Requires plug-in / runtime (not available on all platforms)
Javascript and SVG/VML
+ Requires no plug-in.
- Differences between Internet Explorer (VML) and other
browsers (SVG)
Our approach: Use Javascript and SVG/VML using Raphaël
for browser abstraction.
6/23

Technological choices: Integration into VLE
Apache Wookie or IMS Basic LTI
+ Technology already available (although still under
development).
- Tight integration into VLE’s quiz engine not possible.
(passing back of results, etc.)
IMS Simple Outcomes
+ Would do exactly what we want.
- Still work in progress.
Direct integration into VLE’s
- Not really interoperable.
Short term approach: Make all three above approaches
possible (at least in principle)
Long term approach: Use Simple Outcomes.
7/23

Technological choices: Integration into VLE
Apache Wookie or IMS Basic LTI
+ Technology already available (although still under
development).
- Tight integration into VLE’s quiz engine not possible.
(passing back of results, etc.)
IMS Simple Outcomes
+ Would do exactly what we want.
- Still work in progress.
Direct integration into VLE’s
- Not really interoperable.
Short term approach: Make all three above approaches
possible (at least in principle)
Long term approach: Use Simple Outcomes.
7/23

All functionality is present in Javascript.
In principle feature can run without a server.
Some server-side features helpful:
Checking of the student’s answer (otherwise risk of
manipulation).
Not sending model answers until student has finished
attempt.
Storing result in the gradebook of the VLE.
Solution: Modularised Javascript code, which allows
“moving” certain aspects onto a server.
Architecture
8/23

Handling of
variables and object
dependencies
2,442 lines of Javascript code
Drawing of objects
and interaction
7,053 lines of Javascript code
XML processing
Assessment
3,705 lines of Javascript code
1,891 lines of Javascript code
Javascript modules
Communication
with server (if any)
156 lines of Javascript code
9/23

Feature specification: XML
Specification of feature in XML (inspired by QTI)
...
...
...
10/23

Graphics objects
Basic shapes Ellipses (and circles), paths (lines, rectangles,
polygons, etc.), text, and bitmap images.
Special mathematical objects Linear functions and Hermite
splines
(can be queried for derivatives, integrals,
moments, intersections, etc.)
11/23

Interaction (1): Moving objects
12/23

Interaction (2): Selecting objects
13/23

Interaction (3): Drag and drop (matching)
14/23

Organisational problems
Secondment of programmer proved not as straightforward.
Some of the project goals turned out to be very ambitious.
Some aspects not yet finished.
Moodle: Delay of release 2.0. New quiz engine only in
Moodle 2.1
delayed Moodle integration to April 2011
15/23

Technological problems
MSIE: Although Rapahël library should provide browser
abstraction, making the features work on Internet Explorer
was not easy.
MSIE: Javascript engine of Internet Explorer is very slow.
changes to internal architecture (update dependencies
resolved ahead of time and cached).
Javascript is very weak as far as Mathematics is concerned.
Some Statistics-related functionality added.
User can also include Javascript code.
Added “special” objects and queries.
16/23

very easy
Feedback from students: overview
Student testing session with volunteers (18 students)
How easy to use
easy
Not too sure what to do next
Never
Once or twice
Very interesting
How interesting
Interesting
17/23

“Was great fun to use”.
“Makes theory easier to understand”.
Feedback from students: quotes
“Much better than standard-multiple choice. I think it
made me better understand the answers. Not just
guessing.”.
“Won’t get bored that easily, because I get to do things
with the graphs”.
18/23

Feedback from teachers: basic idea
+ “Playing with these graphs can be a powerful learning
tool”.
+ “Makes student experiment a bit with ’I wonder what
happens if . . . ’ kind of scenarios which lead to deep
learning”
- “This is really great, but I think it would take too much
time to set up”.
- Conflict between assessment (time limit, etc.) and
exploration.
19/23

Feedback from teachers: XML
The use of XML is a barrier. Some teachers find it very easy,
other struggle a lot more.
Typical first reaction: “Argh!!! Help!!!”
After having spent time looking at the XML
“With additional help I could modify existing questions,
but not more.”
“I would be happy to learn but probably would need a bit
of a tutorial and help on it.”
“Was easier than I thought it would be.”
20/23

Lessons learned
Organisational Don’t be too ambitious with IT projects.
Secondment arrangements can be tricky.
Educational Interactive graphics do improve learning
experience.
Assessment or quizzes might not always be
best framework for this.
Technological SVG/VML + Javascript works well for
interactive graphics.
Though IE has become more
standard-compliant, it requires additional
testing.
21/23

Where to go from here
Next months Integration into Moodle 2.1 as showcase
VLE
Provide a version with assessment stripped
(for demos, rather than quizzes)
Provide Wookie versions
Long term Use IMS Simple Outcomes for
VLE-integration
Provide a GUI-editor for features (not relying
on teacher writing XML, very ambitious)
22/23

Play with five questions at (running outside VLE):
http://www.mathstore.ac.uk/jisc/
23/23