今回の目的

前回で作成した単純再認1(刺激のcsvインポート)に計算段階の追加を行います。以下のうちの太字部分を作っていきます。では,前回(単純再認1(刺激のcsvインポート))で作成した課題を開いてください。そこに追加していきます。

計算段階の作成

計算課題の作成

まず,計算課題を作成します。ここでは1桁の足し算を計算課題として作ってみます(例. 2+1+1)。計算の答えを参加者に入力してもらうのも大変なので,画面に「正しい計算式」か「誤った計算式」を呈示し,その正誤判断をしてもらうことにします。例えば「1 + 1 + 1 = 4?」と画面に表示され,その式が合っているかどうかをボタンで押すということです。今回は単語の学習から再認テストまでの遅延時間を置くために計算段階を挿入したいと思います。そこで,一定の時間(例えば10秒)が経過するまでこの計算課題を繰り返すように構成します。

では,まず,「+」からScreen(canvas)を追加してください。名前は「math」に変更しておいてください。ここに計算問題と表示させます。計算課題は,毎回,ランダムな足し算を生成したいので,画面中央にテキストを追加し,内容を${ this.parameters.mathText}としてください。さらに画面真ん中のやや上側にテキストを追加し,「計算結果が正しいかを判断してください」という教示文も追加しましょう。続いて,正誤を判断するボタンを追加します。ここは前回(単純再認1(刺激のcsvインポート))の再認テストと同じようにボタンを2つ作成します。それぞれ,「誤り」ボタンと「正しい」ボタンとします。以下のように設定も行って下さい。

ここまでで以下のような画面が作成できました(ボタンの色は好きなものにしてください)。同じものができたかを確認しておいてください。

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/32800e93-958d-47d0-a4f9-bc335df7f4e3/_2020-04-20_21.29.48.png

さて,続いて計算問題のランダム生成を行います。これまで扱ってこなかった「Scripts」を初めて利用します。では,Builderの右上の「Scripts」を選んでください。「Scripts」は,実験の様々なタイミング(試行前,試行後など)において任意のコードを実行するための機能です。計算課題の実施前というタイミングで(before: prepare),計算問題をランダムに生成するというコードをここに記載します。コードはこちらで作成しました。「before: prepre」のタイミングを選び,ウィンドウにコピー&ペーストしてください。

let mathArray = [];
let mathAnswer = 0;

//1〜9の範囲からランダムに3つの数字を生成
//合計をmathAnswerに入れておく
for (i = 0; i < 3; i++)
{
  mathArray[i] = Math.floor(Math.random()*10) + 1
  mathAnswer += mathArray[i]
}

//誤った回答を出す場合は乱数を答えに加える
if(this.parameters.correctResponse == false)
{ 
  mathAnswer += this.random.choice([-2,-1,1,2])
}

//数式をテキストとしてまとめる
this.parameters.mathText = String(mathArray[0]) + ' + ' + String(mathArray[1]) + ' + ' + String(mathArray[2]) + ' = ' + String(mathAnswer) + ' ?';

以下の画像のようになります。「右上」のタイミングを示す設定が「before: prepare」になっているかを確認しておきましょう。

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/11e8b2ce-b74c-49d8-afe0-4d8bc86b912b/_2020-04-20_21.34.15.png

このコードは,ランダムに1〜9までの数字を3つ生成し,contentで表示するmathTextに,3つの数字の足し算とその答えの文字列を格納するというものです。さらに,計算式が「正しい」場合と「誤っている」場合を設定するため,ランダムに計算式を誤った結果になるようにしています。その場合は,正しい答えから-2〜2ずれた誤った答えを表示しています。計算式が「正しい」か「誤っているか」を決める変数(this.parameters.correctResponse)は後ほど作成するループで設定します。

では、続いて「正しい」ボタンと「誤り」ボタンへの反応を定義します。「Behavior」を選んでください。そして,以下のように設定してください。