Code.org Link

Intial Thoughts

At first when I heard about this assignment I wanted to start with the code right away, although, I soon realized that I would have to make my design first to define all my needed variables

Design

I choose the preset theme, glow in the dark, because I wanted to make my quiz unique.

Although when I started dragging buttons and text-boxes i ran into issues defining buttons because I would define the same button to do two different things at different places in the code. I had to rethink my design and how I would generally go about the creation of the quiz.

Before, whether the user would see another screen when clicking the right or wrong answer, then switch to the next question. But, there would be the same button would be defined multiple times.

To fix this problem, instead of making the code switch to another screen to indicate whether the right or wrong answer was given, I added a label and made the label display correct or incorrect.

Code

For the code of this website was originally on block code, but I changed mine to regular javascript, because it is easier to work with and define variables and run code. In addition, I added a percentage checker so that after you take the test, it will show how many u got right. Everything the user picks the correct answer, the a variable is had one added onto it.

1) First I defined the variables a and q to define the # of answers correct and # of questions in total.

var q = 3;
var a = 0;

2) Second I added a function that asks the user if they are ready to take the quiz or not. If they clicked yes, the screen would change to the first questions. But if the user clicked no, then they would be taken to separate screen just to say, "Seems like you aren't ready for the python quiz".

onEvent("button1", "click", function( ) {
   setScreen("screen2");
 });
 onEvent("button2", "click", function( ) {
   setScreen("screen7");
 });

3) After these two steps, the rest of the code is mostly the same due to repetitive button clicking and screen switching. Whenever the user would click the wrong answer, a textbox would display words saying, "Incorrect", but when they clicked the right one, it would display, "Correct". THe user has the choice to skip and go to the next question at anytime via radio button.

onEvent("button16", "click", function( ) {
   setText("label3", "INCORRECT");
 });
 
 onEvent("button14", "click", function( ) {
   setText("label3", "INCORRECT");
 });
 onEvent("button15", "click", function( ) {
   a = a+1 ;
   setText("label3", "CORRECT!");
 });
 onEvent("button17", "click", function( ) {
   setText("label3", "INCORRECT");
 });
 
 onEvent("radio_button3", "click", function( ) {
   setScreen("screen4");
 });

4) After the end of the quiz, I switched the screen to the final screen and calculated the percentage just by dividing the a and q variables defined in the first steps.

onEvent("radio_button4", "click", function( ) {
   setScreen("screen8");
 });
 
 var x = a/q ;
 
 setText("label5", "Good job you scored a"+ x +"3!");

Extra Python quiz

To show my interest and expertise in this topic, I creates another quiz off python in my notebook.

Here is the link