R E P O R T
Quiz Functions & Graphs
It is a quiz about functions and graphs as the title says. The level is
college algebra. The idea is to test the learner's ability to "read" a graph
and study a function merely by looking it's graph.
Having a small experience in teaching college algebra, I have realized the
crucial role of graphs in teaching functions. A graph, by being a visual
representation of a function, help the student understand the meaning of
the abstract formulas as long as he knows how to read one.
That's the reason I decided to create a quiz on this domain. I chose
carefully the questions. Each one, is like a piece of a puzzle that coming
all together describe a function totally.
Before starting the realisation of this idea, I made a research on the web
to see others work with similar subject. Each one has contributed his own
"wisdom" in the area. I'd like to believe that my quiz has:
- creativity: most projects are dealing with the creation of
a graph of a given function (charting) while
my quiz has to do with extracting properties
for a function out of it's graph.
- usefulness: it might fit easily in a school test or serve
as a preparation test at home before a school
exam on functions.
- ergonomy: questions one by one with an immediate feedback
(it has become my moto but it works really good
in that kind of tests) and a hint that serves as
mini help that goes the learner one step closer
to the correct answer.
- a script that works: at least that's what I hope after all
the tests I have done :) but unfortunately
only for the priviliged with >Netscape 4.0!
(But I warn for this the interested users
from the very beginning.)
At first, the user sees a "welcome" page with a short description
for the quiz what it is about, let's say an introduction.
It is exactly there where I put a blinking warning for the version needed
to run the quiz to prevent the user from surprises. From this page with the
aid of a button called "start the quiz now" the user can enter to the quiz area...
Immediately after pressing this button the quiz is being loaded and an alert
message asks for the users name. This alert message insists (endless loop)
until it gets a kind of name. It doesn't accept also spaces as characters.
By the time the user gives a proper name he receives another alert message
that welcomes him by it's name to the quiz and gives some final details,
before starting, about the procedure.
At this exact point is where I have created a layer that includes all
the information for each question and the page footer.
The user can see now the first question. He can easily understand it by
a label (Question x out of total) that shows the number of current question
out of the total number of questions. This is updated in each question
In the same page, there is the quiz question, 3 answers of multiple choice
type (radio buttons), an image with the respective graph and a hint button.
The "hint" button came as an idea from a site on the web (completely
different presented though) but it fitted perfectly both educationally
and with source code. It is a simple alert message that the user is freely
to use it (but it's completely up to him).
Now, by choosing an answer, another window called "feedback window" opens and
gives the according feedback while the next question is being
loaded. According to his answer he gets a red "cross" gif for wrong answers
and a green "tick" gif for correct ones followed by a blinking "wrong or
"correct". That way, he distinguishes easier correct from wrong answers.
In both cases, it follows the same graph presented in the question but with
explaining details added on it and a brief theory of the domain.
And of course, there is a button that closes this window.
Like that, he can proceed to the next question that is already waiting
in the main window of the browser until the user reaches the last question.
He then receives comments about his performance, like score and how many times
he used hints during the quiz followed by several links with mathematical
sites with relevant theme.
The navigation bar that is present during the quiz makes it easy to quit or
start all over again whenever the user wants easily. Things that deserve to be
- noscript notification: I included noscript message to
- layers: as the region of the page where is being written
the current question or the results in the end.
- open new window: to present feedback, with a button to close it.
- verification of user's name: not accepting spaces or null.
- updating label: numbering each question.
Technical details - problems
HTML documents have been written on Emacs.
Graphs have been made using PAW and details have been added to them
to become feedback graphs using PaintShopPro.
Supporting my idea for showing one question at a time and an immediate
feedback I stuck again in technical details. As I was (and still are)
I came across with LAYERS that fitted perfectly with my idea.
Eventhough that ILAYER (inline layer) had a lot of problems. Of course,
it might well be another way or ways to implement the same scenario.
sometimes complicate things.
In fact, LAYERS are quite new and they made my life difficult in finding
Netscape there aren't a lot of details in using them.
But, I'm really happy -even proud- with the result, eventhough there are a
lot of things that could have been done differently (perhaps a better looking
References - Bibliography - Sites
- examples on TECFA server to get a first idea,
- Index of "JS Road Map and Compatibility Guide" by Danny Goodman,
Back to "Travaux" page
© Vivian Synteta (18/02/99)