In this tutorial, you are going to discover how to use the "Number" variable.
This type of variable allows you to quantify the user's actions and, depending on the scenario, create one or more consequences. This variable can be a positive or negative number, with or without comma.
To see how to use the numeric variable, we will perform the scenario below:
"In the experiment, we have a gauge and two buttons. When we click one of them, the gauge moves up one notch. Conversely, when clicking the other button, the gauge moves back one notch."
Before you begin, click here to view and test the final result.
Note that the image element of the gauge has 4 aspects.
Once the elements are in place, here are the steps to follow:
· Create a number variable
· Create the necessary interactions to change the value of the variable
· Define the consequence(s) of changing the variable
Step 1: Add a number variable
In the left column of the screen, click the variables icon .
Add and set the variables of your project in this window.
In this window:
Add a numerical variable: "Create a variable"
Name the variable
Choose the type of variable: "Number"
Define the default value of your variable. In our example, the default value is "0"
Step 2: Create interactions to change the value of the variable
In this step we will create interactions that allow the value of our variable to change.
Remember that in our example we have two buttons that change the value of the variable on click.
Interaction with the plus "+" button
On click on the "+" button, the value of the variable will be incremented by 1. Also, the value should stop at 3 (maximum value) after consecutive clicks.
In the conditionals window, add a new conditional for the + button, then define the interaction below:
Trigger : If click
Condition : And if the value of the variable "Gauge" is "less than" (type of comparison) than "3".
Consequence : Then the variable "Var-gauge" adds (action to be performed on the variable) "1"
Interaction with the plus "-" button
On click on the "-" button, the value of the variable will be decremented by 1. After several clicks, the value should stop at "0" (the minimum value).
In the conditionals window of the "minus button", add a new conditional and define the interaction below:
Trigger : If click
Condition : And if the value of the variable "Gauge" is "greater than" (comparison type) than "0"
Consequence : Then the variable "Var-gauge" subtracts (action to be performed on the variable) "1"
As you can see, Speedernet Sphere offers you different types of comparisons as well as different actions to perform with the numerical variable level. You can use and combine them according to your scenario.
Step 3: Define the consequence(s) of changing the variable
In this last step, you need to define the expected consequence(s) of changing the variable.
Add a conditional for each expected consequence depending on the value of the variable:
If the variable "Gauge" is equal to "1"
Then the aspect of the element "gauge" is aspect 1 (image with a lighted star)
Proceed in the same way for the following cases: if the variable is equal to 2 then to 3.
This tutorial presents one of the use cases of the numeric variable. You can use this variable for other types of scenarios.
Don’t hesitate to share with us the scenarios in which you would use this type of variable and give us your feedback!
See you soon for the next tutorial!
We also invite you to consult the following tutorials: