I was able to use Photoshop to create the basic images (in chalk) and found out that I could save them with a completely transparent background. This means that I won't have to add fake "black" background behind the chalk brush marks... which also means I won't have to spend a bunch of extra time "cutting" around them either. This was a nice surprise.
I made my first image with text to set up the first interactive problem for the student to tackle. The bowling ball, bowling pin, and bowling lane are all separate images.
Now I will need to work on a bunch of timing elements. Also, I will need to work in the "play" button somehow. For example: I want the screen you see to show up with the drawing itself fairly transparent (alpha = 0.2) at first while the text is fully opaque (alpha = 1). Then I want to set a timer for about five seconds where the game is "locked" and the "play" button is transparent/inactive. After five seconds the play button will become fully active/visible. (This forces the student to take the time to read the prompt). The student then presses "play" and another timer does a transition (about 3 seconds?) where the drawing's alpha slowly changes to 1 and the text's alpha changes to 0.2 so that the text fades into the background and the drawing is standing out. Then about 10 yellow "force vectors" (which I have already drawn, see yellow arrow diagram below) will also appear similarly in the same time.
After that the student will click/drag those ten force vectors to the appropriate locations on the diagram. When they are done they will hit "play" to check their work.... (more to come later)
For now.... I need to work on the timers and transitions.... Then, maybe this weekend, I'll tackle the code for the mouse click/drag and sequence for checking if the student's work is correct...
Time: 2 hours
No comments:
Post a Comment