Chapter 01

はじめに

snishiyama
snishiyama
2022.07.29に更新

本書の目的

簡単な心理実験・調査の作成を通して,jsPsych で心理学実験を行うために最低限必要なスキルを身につけることを目標としています。

2022 年 7 月現在,本書で取り扱っている心理課題・調査は以下の通りです。

  • フランカー課題
  • サイモン課題
  • 質問紙調査

本書ではまずフランカー課題の作成に多くの章を費やして,jsPsych を用いた実験作成・実施を一通り体験します。残りの課題作成については,フランカー課題では使わなかったが,有用である内容(プラグインの使い方など)を各論的に取り扱っていきます。少しずつ心理課題のラインナップを増やしていければと思っています。

プログラミング経験が全くない人でも理解できるように作成したつもりです。この本を読み始める段階で JavaScript(や,HTML, css)の基本を知っている必要はありません。本書では,JavaScript の基本的な構文も織り交ぜながら jsPsych で心理学実験の作成方法を順番に説明していきます。もちろん,JavaScript は知っているが jsPsych はこれからという方にも有用な資料になっているはずです。

なお,本書記載のコード例の動作確認を行った jsPsych のバージョンはv6.3.1です(2021 年 9 月現在)。今後バージョンアップがあった際には,コード例の動作は極力確認するつもりです。1つ2つ異なるバージョンで作成されたコードが動かなくなるような大幅なアップデートはめったにないと思います[1]。しかしながら,大幅なアップデートがあって本書の内容も変更が必要にもなった場合でも,編集時間を確保できず放置されるという可能性もあるかもしれません。悪しからずご了承ください。

jsPsych とは

jsPsych は,心理学実験作成・実施のための JavaScript ライブラリです[2]。刺激の提示・データ収集の機能がまとめられています。例えば,以下のような機能が用意されています。

  • 単語提示
  • 画像提示
  • 音声提示
  • 選択ボタン提示
  • 回答用テキストボックスの表示

JavaScript とは

JavaScript は ウェブページ(html)を動的に制御するためのプログラミング言語です。ウェブページの動的制御とは,ユーザーの操作に応じて画面表示を変えたりすることを指します。例えば,大手検索サイトやショッピングサイトの検索バーに文字を入力すると検索候補が表示される,というのは JavaScript による動的な制御です。

jsPsych を用いた心理学実験・調査とは

jsPsych で作成された心理学実験・調査は,jsPsych(を含む JavaScript)が埋め込まれたウェブページです。検索サイトでは検索窓に文字を入力すると検索候補が表示されるように,jsPsych が埋め込まれたページでは,時間経過やキー入力に応じてページの表示内容が動的に制御(変更)され,心理学実験・調査が実現されます。

ウェブページなので Chrome や Firefox,Safari といったウェブブラウザで表示されます。また,ページをネット上に公開することができます。すると,その URL を知っている人は誰でも手元の PC からその実験に参加することができます。これが,jsPsych を用いてオンライン実験を実施できる仕組みです。一方で,ページを公開せず実験室でだけ利用して,jsPsych で作成した実験を実験室実験として実施することも可能です。PC とメジャーなウェブブラウザがあれば,それら以外 PC の実行環境を整備しなくてもいいので,複数地点での対面実験を実施する(共同)研究を行う際にも便利です。

オンライン実験作成が jsPsych の主な特徴になると思うのですが,他にも同様のツールは結構あります(Anwyl-Irvine ら(2021)[3]の Table 1)。その中でも私が jsPsych を使おうと思った理由は以下の3つです。

  1. 無料で使える[4]
  2. 日本語の資料がある
  3. スクリプトを書いて作成する

最後の点が個人的には結構大事でした。無料で使えて,日本語の資料があるツールとしては,PsychoPy Builder や lab.js が挙げられます。これらは jsPsych と違って,基本的に GUI でマウスでポチポチ実験を作成するツールです。GUI ベースのツールは、最初の垣根は低いのですが、工夫し始めると一気に手順がややこしくなったり、コードを書く必要が出てきたりするという印象があります。コードを書くとなった場合にはツールのベースにあるプログラミング言語(PsychoPy であれば Python, lab.js であれば JavaScript)について勉強する必要があります。

だったら,初めからコードでの実験の作り方を覚えたほうが長期的にはいいんじゃないかと思っています。コーディングは最初の垣根が GUI より高いかもしれませんが、慣れてしまえば、GUI よりも楽に自由に実験を組めるようになります。その知識は他のプログラミング場面にも応用できます。私の場合は,コーディングベースで PsychoPy を使って心理学実験を作ってきた[5]ので,jsPsych にはすぐに慣れることができました。

とはいえ,この辺は作成する予定の実験の複雑さに左右されます。GUI ツールでも全然事足りる場合はあるので,全く心理実験を作ったことがないという方は,まずは GUI ツールでの作成から始めてみるのもいいと思います。

参考資料

本チュートリアルの作成に際し,以下の資料を参考にいたしました。作成者のみなさまには感謝申し上げます。

高橋先生のキソジオンラインは,jsPsych の解説資料ではありませんが,jsPsych で作成された心理学実験のコードがたくさんアップされています。jsPsych がある程度読み書きできるようになったら,とても参考になると思います。国里先生のページでは RStudio という開発環境上で jsPsych ベースの心理実験を作成する方法が紹介されています。RStudio に馴染みのある方はここから始めてみてもいいかもしれません。小林先生のページにはこれら 3 つのサイトとは少し種類の違う実験課題のコードが掲載・解説されています。

おわりに

本章は,この本の概要を説明しました。正直,チュートリアルで扱う課題は GUI ツールで簡単に作成できる課題です(PsychoPy Builder での作成例lab.js での作成例)。

それでも,この本が,なにかのきっかけに jsPsych で心理実験を作りたい・作らないといけないという方のお役に立てれば大変幸いです。

脚注
  1. 実は,v6.2系からv6.3系にアップデートされたときに,大幅なアップデートがあり,本書作成時点でコード例の一部はv.6.2.xを含めたそれよりも前のバージョンでは適切に動作しません。チュートリアルに取り組む際には最新バージョンの jsPsych をダウンロードしてください。 ↩︎

  2. de Leeuw, J.R. (2015). jsPsych: A JavaScript library for creating behavioral experiments in a Web browser. Behavior Research Methods, 47(1), 1-12. doi:10.3758/s13428-014-0458-y ↩︎

  3. Anwyl-Irvine, A., Dalmaijer, E. S., Hodges, N., & Evershed, J. K. (2021). Realistic precision and accuracy of online experiment platforms, web browsers, and devices. Behavior Research Methods, 53(4), 1407–1425. https://doi.org/10.3758/s13428-020-01501-5 ↩︎

  4. ただし,オンライン実験を実施するためにはアップロードしておくサーバーが必要で,多くの場合,レンタルサーバーを借りることになるので,その実施には謝礼とは別にお金がかかります。 ↩︎

  5. 卒論で初めて心理学実験を作ったときは PsychoPy Builder を使ってマウスをぽちぽちしていました。その時にもカスタマイズのためにコードを少し書いたのですが,だったら全部コーディングにしようと思い今に至ります。 ↩︎

  6. 黒木先生のサイトについては掲載のコードを見る限り,現在のバージョンと互換性がなさそうなので,注意が必要かもしれません。 ↩︎