Login: Graph Sketching
Credits Impressum Anleitung Feedback
Willkommen!
Graph Sketching ist ein Lernspiel, welches im Rahmen meiner Diplomarbeit in Fachdidaktik Physik entwickelt wurde - es befasst sich mit dem Anfertigen und Interpretieren von Bewegungsdiagrammen.
Gib bitte einen Usernamen ein und klicke anschließend auf "Ok".
Go!
Credits
X
Animation
The animation (player, coins, enemies, background-assets and the animation of the SVG path when you switch to drawing straight lines and back) is accomplished by using the GreenSock Animation Platform (GSAP) - specifically TweenMax Version 1.20.2 (last access at 2017.08.24). As neither end users nor any clients are charged anything the Standard "No Charge" GreenSock License applies.

Background-Silhouettes
For the design of the game-background svg vectors from All-Silhouettes (last access at 2017.08.24) were used - the specific packs from which some vectors were used are Vector castle, Islamic mosque, Vector christian church, Vector Witches, Vector Grass and Vector mushrooms.

Sprite Sheets & Background Graphics
The sprite sheets of the player characters and the butterflies, as well as some of the background graphics, are based on graphical assets of the game Glitch (last access at 2017.08.24). The game files of Glitch are provided by Tiny Speck under the Creative Commons CC0 1.0 Universal License on glitchthegame.com.

Google Fonts
The font Finger Paint (last access at 2017.08.24) from Google Fonts is used.

Drawing Functions
For the used drawing functions I followed the tutorial "A Simple Touchscreen Sketchpad using Javascript and HTML5" (last access at 2017.08.24) from Zipso - the code was expanded to include the features to set a maximum possible slope while drawing and to draw straight lines.

Animated SVG-Buttons
For the animated SVG-Buttons I built on the tutorial "Animated Checkboxes and Radio Buttons with SVG " (last access at 2017.08.24) from Mary Lou at Codrops - the SVG-path of the used Eraser- and Pen-Checkboxes is directly taken from there.

Range Inputs
To design the range inputs (the range slider) the CSS Style Generator for Range Inputs (last access at 2017.08.24) from Daniel Stern was used.

TimeMe.js
In order to track the time of the users interacting with the page and certain elements of it, the TimeMe.js library (last access at 2017.08.31) is used - the MIT License (which is also included in the used timeme.js file) applies.

Special Thanks
The following people contributed by offering various insights and help: LordZwiebus aka Zwiebfried, Pfannig aka ShmusMcMuffn, Lûc aka LûcVanDyk.
Impressum
X
Medieninhaber
Markus Rametsteiner

Wohnort
Niederösterreich, 3180 Lilienfeld

Bildernachweis
Siehe Credits
Feedback
X
Vielen Dank, dass Sie Graph Sketching gespielt haben! Ich würde Sie bitten, mir Ihre Meinung zu diesem Lernspiel mitzuteilen - die angegebenen Daten werden gemeinsam mit dem von Ihnen zu Beginn eingegebenen Usernamen

gespeichert und zur Verbesserung des Spiels sowie für meine Diplomarbeit herangezogen.

Bei den Fragen steht 1 für die beste Bewertung beziehungsweise die größte Zustimmung und 5 für die schlechteste Bewertung beziehungsweise die geringste Zustimmung.

1. Geschlecht:
2. Alter:
(Bitte in Form von Zahlen angeben!)
3. Physikalisches Vorwissen:
(Wie gut kennen Sie sich in Physik aus?)
4. Generelle Bewertung:
(Wie hat Ihnen das Spiel generell gefallen?)

5. Bewertung des Designs:
(Wie hat Ihnen das optische Design des Spiels gefallen?)

6. Bewertung des Inhalts:
(Wie hat Ihnen der Inhalt des Spiels gefallen?)

7. Haben Sie beim Spielen etwas Neues gelernt?
(Falls ja, was?)

8. Was würden Sie an dem Spiel verändern?
9. Waren die Instruktionen klar genug?
(Falls nein, was war unklar?)

10. Glauben Sie, dass Schülerinnen und Schüler von dem Spiel profitieren könnten?
11. Glauben Sie, dass dieses Lernspiel erfolgreich im Unterricht eingesetzt werden könnte?
12. Zusätzliches Feedback
(Was auch immer Sie mir noch mitteilen möchten)

Submit


Anleitung
X
Graph Sketching ist ein Lernspiel, welches im Rahmen meiner Diplomarbeit in Fachdidaktik Physik entwickelt wurde - es befasst sich mit dem Anfertigen und Interpretieren von Bewegungsdiagrammen.
Dazu werden die Spieler aufgefordert, Bewegungsdiagramme (je nach Spielmodus x(t), y(t), vx(t) oder vy(t) - bei 2D-Bewegungen müssen auch Diagramme für 2 Raumrichtungen angefertigt werden) zu zeichnen. Ziel des Spiels ist es entweder eine vorgegebene Bewegung nachzustellen (einer Figur folgen oder ein Bewegungsdiagramm "nachgehen") oder Gegnern auszuweichen und Münzen zu sammeln.
Durch Klicken auf "Check" können die gezeichneten Bewegungsdiagramme überprüft und anschließend noch verändert werden - klickt man auf "Ready", so werden die gezeichneten Bewegungsdiagramme endgültig abgegeben und die Punkte für das Level werden berechnet.
Nachfolgend ist die Nutzeroberfläche des Spiels dargestellt - klicken Sie auf einen Teil der UI um eine genauere Erklärung zu erhalten!

klicke auf einen Teil der UI!