私は現在、JsPsych を使用して行動実験、特にマトリックス推論を作成しているため、ユーザーはロジック パターンに基づいて一連のオプションから選択できます。
私の問題は、練習がブロックされた後にユーザーが最初の 2 つの試行に答えるときに失敗した場合、特定の試行を繰り返す必要があることです。たとえば、最初の 2 つの試行は練習用であり、次に反復規則が適用されます。
JsPsych の「タイムライン」は配列なので、実験全体が開始されるとその要素 (別名試行) が作成されるため、実験が開始された後に新しい試行を間に挿入することはできないようです。
ユーザー入力に基づいて特定の試行を強制的に実行する方法はありますか? つまり、ユーザーが正しいオプションを選択した場合は次の試行に進み、間違ったオプションを選択した場合は特定の前の試行に戻ります。
私がこれまでに試したこと：
(JsPsych のドキュメントと JsPsych Google グループの投稿に基づく)
A) call-function プラグインを使用して var を作成し、ブール値フラグを作成します。答えが正しい場合は True、そうでない場合は間違っています。次に、フラグが false (つまりexperiment.push(another_trial)) の場合は、別のトライアルをプッシュします。例：
var decide_next = {
type: 'call-function',
func: myfunction,
}
function myfunction(response_flag){
if (response_flag == False){
experiment.push(survey);
}else{
//just continue as normal
}
}
var survey={
//Here goes the specified trial if the user fails
}
前述のように、タイムラインの生成方法が原因で、このソリューションは完全に失敗します。
B) ネストされたタイムラインの使用。これは、メインのタイムラインに最初の質問とフラグが含まれているブルート フォース アプローチに似ているため、フラグが特定の値を取得すると、特定のタイムラインをプッシュします。これは本当に間違っていたので、無意味なコードで邪魔するつもりはありません。
C) 条件付きタイムラインの使用。かなり別の強引なアプローチですが、もう少し成功しています。この機能を使用して、それぞれ正しい回答と間違った回答に対して、さまざまなフィードバック画面を表示しました。例：
//Conditional rules
var condition1 = false;
var condition2 = false;
var m_conditional1_1 = {
timeline: [m_wrong1],
conditional_function: function(data){
if(condition1 === false){
return true;
} else {
return false;
}
}
};
var m_conditional1_2 = {
timeline: [m_right1],
conditional_function: function(data){
if(condition1 === true){
return true;
} else {
return false;
}
}
};
var m_conditional2_1 = {
timeline: [m_wrong2],
conditional_function: function(data){
if(condition2 === false){
return true;
} else {
return false;
}
}
};
var m_conditional2_2 = {
timeline: [m_right2],
conditional_function: function(data){
if(condition2 === true){
return true;
} else {
return false;
}
}
};
// Feedback trials to display upon conditional trails's result
var m_wrong1 = {
type: "text",
text: "<div class = matrizlimit><div class= centered><div class='centered'><img src ='img/1A.png' /></div><br /><br /><div class='centered'><img src ='img/1B.png' </img></div><br /><br /><div class='matrizfeedback'>Eso no es correcto. <br />Para responder correctamente debe mirar de izquierda a derecha en la fila de arriba.<br /><br />"+
"Cuando usted mira la fila de arriba la estrella azul cambia a un circulo amarillo. <br />"+
"Esto quiere decir que cuando usted va de izquierda a derecha en la fila de abajo la estrella azul también deberia cambiar a un circulo amarillo.<br /><br />"+
"Para obtener la respuesta correcta yendo de arriba hacia abajo, usted debe mirar los cuadros de la columna izquierda. "+
"Cuando usted va de arriba hacia abajo en la primera columna los cuadros tienen la misma forma y el mismo color: estrellas azules. <br /><br />"+
"Esto quiere decir que cuando usted va de arriba hacia abajo en la columna derecha los cuadros también deberian tener la misma forma y el mismo color: circulo amarillo. "+
"Usted obtiene la misma respuesta yendo de izquierda a derecha y yendo de arriba hacia abajo.<br /><br /><br /><br />Presione una tecla para continuar<br /><br /><br /><br /></div>"
};
var m_right1 = {
type: "text",
text: "<div class = matrizlimit><div class= centered><div class='centered'><img src ='img/1A.png' /></div><br /><br /><div class='centered'><img src ='img/1B.png' </img></div><br /><br /><div class='matrizfeedback'>Eso es correcto.<br />Cuando usted va e izquierda a derecha en la fila de arriba la estrella azul cambia a un circulo amarillo. <br /><br />"+
"Esto quiere decir que cuando usted va de izquierda a derecha en la de abajo la estrella azul también deberia cambiar a un circulo amarillo. "+
"Cuando usted va de arriba hacia abajo en la primera columna los cuadros tienen la misma forma y el mismo color: estrellas azules. <br /><br />"+
"Esto quiere decir que cuando usted va de arriba hacia abajo en la segunda columna los cuadros también deben tener la misma forma y el mismo color: circulos amarillos. "+
"Usted obtiene la misma respuesta yendo de izquierda a derecha y yendo de arriba hacia abajo.<br /><br /><br /><br />Presione una tecla para continuar<br /><br /><br /><br /></div>"
};
var m_wrong2 = {
type: "text",
text: "<div class = matrizlimit><div class= centered><div class='centered'><img src ='img/2A.png' /></div><br /><br /><div class='centered'><img src ='img/2B.png' </img></div><br /><br /><div class='matrizfeedback'>Eso no es correcto. <br />Cuando usted mira los cuadros de izquierda a derecha, usted puede ver que ellos<br />"+
"están en el siguiente orden: círculo grande, círculo pequeño, círculo grande, círculo pequeño, círculo grande.<br /><br />"+
"El círculo pequeño va en el cuadro con un signo de interrogación porque es la opción que mantiene el orden: un círculo pequeño va luego de un círculo grande.<br />"+
"<br /><br /><br /><br />Presione una tecla para continuar<br /><br /><br /><br /></div>"
};
var m_right2 = {
type: "text",
text: "<div class = matrizlimit><div class= centered><div class='centered'><img src ='img/2A.png' /></div><br /><br /><div class='centered'><img src ='img/2B.png' </img></div><br /><br /><div class='matrizfeedback'>Eso es correcto.<br />Cuando usted mira los cuadros de izquierda a derecha, puede ver que ellos siguen este orden: "+
"círculo grande, círculo pequeño, círculo grande, círculo pequeño, círculo grande. <br /><br />"+
"El círculo pequeño va en el cuadro con un signo de interrogación porque es lo que mantiene el mismo orden que los anteriores.<br /><br />"+
"<br /><br /><br /><br />Presione una tecla para continuar<br /><br /><br /><br /></div>"
};
// The two practice trials, here I capture the chosen answer and give it to the conditional rules variables. Matriz_practice_1 is associated to m_right_1 and
// m_wrong_1, which are its possible feedback screens.
// The same goes for Matriz_practice_2, with m_right_2 and m_wrong_2
var matriz_practice_1={
type: "survey-multi-choice1",
timeline:[
{
questions: ["<div class = centerbox>"+
"<p class = justified>"+
"Mire la siguiente figura. Usted debe escoger cual de las opciones que se encuentran abajo va en el"+
"cuadro con un signo de interrogación. La respuesta correcta es aquella que encaja yendo de "+
"izquierda a derecha y yendo de arriba hacia abajo. Usted sólo debe mirar de izquierda a derecha y "+
"de arriba hacia abajo. No mire diagonalmente. ¿Cuál de las opciones que se encuentran abajo va en"+
" el cuadro con un signo de interrogación?"+
"</p><br /><br /></div>"+
"<div class= centered><div class='centered'><img src ='img/1A.png' /></div><br /><br /><div class='centered'><img src ='img/1B.png' </img></div>"],
data: {trialid: "P_MP_01"},
horizontal: true
},
],
options: [["Opcion1","Opcion2","Opcion3","Opcion4","Opcion5"]],
horizontal: true,
required: 'true',
on_finish: function(data){
var test = data.responses;
if(test =='{"Q0":"Opcion5"}'){
condition1 = true;
} else {
condition1 = false;
}
}
};
var matriz_practice_2={
type: "survey-multi-choice1",
timeline:[
{
questions: ["<div class = centerbox>"+
"<p class = justified>"+
"Éste es otro tipo de problema. Los cuadros solo van de izquierda a derecha. La respuesta correcta "+
"seguirá el mismo orden que usted ve en los cuadros. ¿Cuál de las opciones que se encuentran abajo va "+
"en el cuadro con un signo de interrogación?"+
"</p><br /><br /></div>"+
"<div class= centered><div class='centered'><img src ='img/2A.png' /></div><br /><br /><div class='centered'><img src ='img/2B.png' </img></div>"],
data: {trialid: "P_MP_02"},
horizontal: true
},
],
options: [["Opcion1","Opcion2","Opcion3","Opcion4","Opcion5"]],
horizontal: true,
required: 'true',
on_finish: function(data){
var test = data.responses;
if(test =='{"Q0":"Opcion4"}'){
condition2 = true;
} else {
condition2 = false;
}
}
};
これは、短い線形構造で機能します。その場合、表示する画面を決定するだけで済みますが、必要に応じて前の試行に戻ろうとすると、このソリューションは失敗します。このソリューションから、ユーザーが失敗したときの試行の繰り返しを「シミュレート」するために、非常に長い一連のバイナリ条件を定義することができました。しかし、これを動的に生成することはできないため、基本的に、ユーザーが正しく答えられない回数を推測する必要があります。これは、実験が 200 人以上のボランティアで実行される場合にはオプションではありません。さらに、繰り返し条件が 2 回以上の試行に適用されると、このようなブルート フォース戦略は複雑になりますが、これは将来実際に発生する可能性があります。
JsPsych のコア javascript ファイルを深く改造することで解決につながるかもしれないと推測していますが、それは私の現在の JavaScript のスキルと知識を超えています。
この件に関するヘルプをいただければ幸いです。
このコードをテストするための追加のメモ:
実験コードの短い動作バージョンを以下に示します。今回は CSS が無視されているため、審美的な問題が発生する可能性があります。このコードでは、メインの HTML ファイルと同じディレクトリに jspsych フォルダーが必要です。
<!doctype html>
<html>
<head>
<title>Condition Tester</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="jspsych-5.0.3/jspsych.js"></script>
<script src="jspsych-5.0.3/plugins/jspsych-survey-multi-choice.js"></script>
<script src="jspsych-5.0.3/plugins/jspsych-text.js"></script>
<script src="jspsych-5.0.3/plugins/jspsych-instructions.js"></script>
</head>
<body>
<div class="centered">
<script>
var condition1 = false;
var condition2 = false;
/* Texto Inicial */
var matrizexplanation={
type: "instructions",
pages: ["<div class = centerbox>"+
"<p class = center-block-text>"+
"A continuación, le presentaremos una serie de figuras, donde cada una muestra un patrón lógico.<br />"+
"Tendrá que elegir entre 5 alternativas para completar ese cada patrón."+
"</p></div>"],
allow_keys: false,
show_clickable_nav: true,
timing_post_trial: 50,
data:{trialid: "Instructions_Matriz"}
};
var matriz_practice_1={
type: "survey-multi-choice1",
timeline:[
{
questions: ["<div class = centerbox>"+
"<p class = justified>"+
"Mire la siguiente figura. Usted debe escoger cual de las opciones que se encuentran abajo va en el"+
"cuadro con un signo de interrogación. La respuesta correcta es aquella que encaja yendo de "+
"izquierda a derecha y yendo de arriba hacia abajo. Usted sólo debe mirar de izquierda a derecha y "+
"de arriba hacia abajo. No mire diagonalmente. ¿Cuál de las opciones que se encuentran abajo va en"+
" el cuadro con un signo de interrogación?"+
"</p><br /><br /></div>"+
"<div class= centered><div class='centered'><img src ='img/1A.png' /></div><br /><br /><div class='centered'><img src ='img/1B.png' </img></div>"],
data: {trialid: "P_MP_01"},
horizontal: true
},
],
options: [["Opcion1","Opcion2","Opcion3","Opcion4","Opcion5"]],
horizontal: true,
required: 'true',
on_finish: function(data){
var test = data.responses;
if(test =='{"Q0":"Opcion5"}'){
condition1 = true;
} else {
condition1 = false;
}
}
};
var matriz_practice_2={
type: "survey-multi-choice1",
timeline:[
{
questions: ["<div class = centerbox>"+
"<p class = justified>"+
"Éste es otro tipo de problema. Los cuadros solo van de izquierda a derecha. La respuesta correcta "+
"seguirá el mismo orden que usted ve en los cuadros. ¿Cuál de las opciones que se encuentran abajo va "+
"en el cuadro con un signo de interrogación?"+
"</p><br /><br /></div>"+
"<div class= centered><div class='centered'><img src ='img/2A.png' /></div><br /><br /><div class='centered'><img src ='img/2B.png' </img></div>"],
data: {trialid: "P_MP_02"},
horizontal: true
},
],
options: [["Opcion1","Opcion2","Opcion3","Opcion4","Opcion5"]],
horizontal: true,
required: 'true',
on_finish: function(data){
var test = data.responses;
if(test =='{"Q0":"Opcion4"}'){
condition2 = true;
} else {
condition2 = false;
}
}
};
var m_wrong1 = {
type: "text",
text: "<div class = matrizlimit><div class= centered><div class='centered'><img src ='img/1A.png' /></div><br /><br /><div class='centered'><img src ='img/1B.png' </img></div><br /><br /><div class='matrizfeedback'>Eso no es correcto. <br />Para responder correctamente debe mirar de izquierda a derecha en la fila de arriba.<br /><br />"+
"Cuando usted mira la fila de arriba la estrella azul cambia a un circulo amarillo. <br />"+
"Esto quiere decir que cuando usted va de izquierda a derecha en la fila de abajo la estrella azul también deberia cambiar a un circulo amarillo.<br /><br />"+
"Para obtener la respuesta correcta yendo de arriba hacia abajo, usted debe mirar los cuadros de la columna izquierda. "+
"Cuando usted va de arriba hacia abajo en la primera columna los cuadros tienen la misma forma y el mismo color: estrellas azules. <br /><br />"+
"Esto quiere decir que cuando usted va de arriba hacia abajo en la columna derecha los cuadros también deberian tener la misma forma y el mismo color: circulo amarillo. "+
"Usted obtiene la misma respuesta yendo de izquierda a derecha y yendo de arriba hacia abajo.<br /><br /><br /><br />Presione una tecla para continuar<br /><br /><br /><br /></div>"
};
var m_right1 = {
type: "text",
text: "<div class = matrizlimit><div class= centered><div class='centered'><img src ='img/1A.png' /></div><br /><br /><div class='centered'><img src ='img/1B.png' </img></div><br /><br /><div class='matrizfeedback'>Eso es correcto.<br />Cuando usted va e izquierda a derecha en la fila de arriba la estrella azul cambia a un circulo amarillo. <br /><br />"+
"Esto quiere decir que cuando usted va de izquierda a derecha en la de abajo la estrella azul también deberia cambiar a un circulo amarillo. "+
"Cuando usted va de arriba hacia abajo en la primera columna los cuadros tienen la misma forma y el mismo color: estrellas azules. <br /><br />"+
"Esto quiere decir que cuando usted va de arriba hacia abajo en la segunda columna los cuadros también deben tener la misma forma y el mismo color: circulos amarillos. "+
"Usted obtiene la misma respuesta yendo de izquierda a derecha y yendo de arriba hacia abajo.<br /><br /><br /><br />Presione una tecla para continuar<br /><br /><br /><br /></div>"
};
var m_wrong2 = {
type: "text",
text: "<div class = matrizlimit><div class= centered><div class='centered'><img src ='img/2A.png' /></div><br /><br /><div class='centered'><img src ='img/2B.png' </img></div><br /><br /><div class='matrizfeedback'>Eso no es correcto. <br />Cuando usted mira los cuadros de izquierda a derecha, usted puede ver que ellos<br />"+
"están en el siguiente orden: círculo grande, círculo pequeño, círculo grande, círculo pequeño, círculo grande.<br /><br />"+
"El círculo pequeño va en el cuadro con un signo de interrogación porque es la opción que mantiene el orden: un círculo pequeño va luego de un círculo grande.<br />"+
"<br /><br /><br /><br />Presione una tecla para continuar<br /><br /><br /><br /></div>"
};
var m_right2 = {
type: "text",
text: "<div class = matrizlimit><div class= centered><div class='centered'><img src ='img/2A.png' /></div><br /><br /><div class='centered'><img src ='img/2B.png' </img></div><br /><br /><div class='matrizfeedback'>Eso es correcto.<br />Cuando usted mira los cuadros de izquierda a derecha, puede ver que ellos siguen este orden: "+
"círculo grande, círculo pequeño, círculo grande, círculo pequeño, círculo grande. <br /><br />"+
"El círculo pequeño va en el cuadro con un signo de interrogación porque es lo que mantiene el mismo orden que los anteriores.<br /><br />"+
"<br /><br /><br /><br />Presione una tecla para continuar<br /><br /><br /><br /></div>"
};
var m_conditional1_1 = {
timeline: [m_wrong1],
conditional_function: function(data){
if(condition1 === false){
return true;
} else {
return false;
}
}
};
var m_conditional1_2 = {
timeline: [m_right1],
conditional_function: function(data){
if(condition1 === true){
return true;
} else {
return false;
}
}
};
var m_conditional2_1 = {
timeline: [m_wrong2],
conditional_function: function(data){
if(condition2 === false){
return true;
} else {
return false;
}
}
};
var m_conditional2_2 = {
timeline: [m_right2],
conditional_function: function(data){
if(condition2 === true){
return true;
} else {
return false;
}
}
};
var matrizstarter={
type: "instructions",
pages: ["<div class = centerbox>"+
"<p class = center-block-text>"+
"Ahora deberá seguir respondiendo, pero no recibirá avisos indicando <br />si su respuesta es correcta o incorrecta.<br /><br />"+
"</p></div>"],
allow_keys: false,
show_clickable_nav: true,
timing_post_trial: 50,
data:{trialid: "Instructions_Matriz"}
};
var matrices = {
//type: "survey-multi-choice",
type: "survey-multi-choice1",
timeline:[
/*{
questions: ["<div class='centered'><img src ='img/1A.png' /></div><br /><br /><div class='centered'><img src ='img/1B.png' </img></div>"],
data: {trialid: "MP_01"},
horizontal: true
//options: ["Opcion1","Opcion2","Opcion3","Opcion4","Opcion5"]
},
{
questions: ["<div class='centered'><img src ='img/2A.png' /></div><br /><br /><div class='centered'><img src ='img/2B.png' </img></div>"],
data: {trialid: "MP_02"}
//options: ["Opcion1","Opcion2","Opcion3","Opcion4","Opcion5"]
},*/
{
questions: ["<div class='centered'><img src ='img/3A.png' /></div><br /><br /><div class='centered'><img src ='img/3B.png' </img></div>"],
data: {trialid: "MP_03"}
//options: ["Opcion1","Opcion2","Opcion3","Opcion4","Opcion5"]
},
],
options: [["Opcion1","Opcion2","Opcion3","Opcion4","Opcion5"]],
horizontal: true,
required: 'true',
};
var experimento_matrices = [];
experimento_matrices.push(matrizexplanation);
experimento_matrices.push(matriz_practice_1);
experimento_matrices.push(m_conditional1_1);
experimento_matrices.push(m_conditional1_2);
experimento_matrices.push(matriz_practice_2);
experimento_matrices.push(m_conditional2_1);
experimento_matrices.push(m_conditional2_2);
experimento_matrices.push(matrizstarter);
experimento_matrices.push(matrices);
jsPsych.init({
timeline: experimento_matrices,
on_finish: function(){
jsPsych.data.localSave('second_battery_results.csv', 'csv');
},
on_trial_start: function(){
console.log("***************************",test);
},
default_iti: 0
});
</script>
</div>
</body>
</html>