Frog Addition Facts

Prompt

Code a game in html, css, and javascript for a complete, self-contained, and embeddable file. This is a math game for primary grade students who are practicing their addition facts up to 30. The object of the game is to collect the correct answers to addition facts up to 20 including facts like 8 + 7, 9 + 11, and 3 + 7. Gameplay will include a frog who sticks out his tongue to catch the correct answer to the fact presented. Show the correct answer along with 2 distractors. Make the answers float like flies. Players navigate by using the A and D keys on their keyboard and shoot the frog's tongue by pressing the spacebar. Include a scoreboard. The player wins when their score reaches 30. Provide a celebration when the player reaches 30 at level one. Provide another level in which the facts reach up to 30 following the same rules of play. Use a navy blue, white, black, and gray theme surrounding the playing area which includes a pond and the frog hops from one lily pad to the next using the A and D keys.

Iteration

Make the frog green. Make the numbers on the flies black and easy to read. Include a croaking sound if the player captures the correct answer on the fly. 

Iteration 2

I can't read the numbers on the flies. The players will not know which flies to collect. Make the frog green and the lily pads have a flower on them. Make the lily pads dark green in contrast to the lighter colored frog.

Iteration 3

Make each lily pad a different color. The answers to the math facts are not appearing on the flies. Double check that the flies have numbers on them or above them. Make the font legible for early grade students.

Iteration 4

Change the frog’s croak to a more frog-sounding “ribbit” that happens only when the user reaches a streak of 5 and at every streak of 5 thereafter.