プログラミング lab.js で画像を事前に読み込ませる
はじめに
画像の読み込みには時間がかかります。これは実験の際にトラブルを引き起こすことがあります。
たとえば、実験で画像を2秒間だけ表示させたいのに、最初の1秒間は画像が読み込み中のため画像が表示されず（あるいは...
tsuda
プログラミング 未分類 lab.js の Likert scale で選択肢の数を偶数にする方法
問題
lab.js の Page で使える Likert scale では、なぜか奇数の選択肢数（5, 7, 9, 11）しか選べない。偶数の選択肢数（6件法とか）のリッカート尺度が作りたい！
解決例
...
improc 画像のカラーパレットの分析
画像内の色情報を分析（クラスタリング）して、カラーパレット（カテゴリ化された色リスト）を計算します。
いくつかの画像についてカラーパレットを計算した例を以下に示します。画像の下にある帯がカラーパレットで、そ...
論文紹介 美と芸術の進化について
なぜ人は風景を見て感情が動かされるのか？ なぜ人は芸術活動を行うのか？ これらは難問に違いないが、進化という観点から考えてみることで、答えのヒントが得られるかもしれない。
芸術や感性の進化についての論文（Nadal & Gómez-Pue...
プログラミング lab.js Tips集
この記事では lab.js を使う際の様々な tips（コツや工夫）を紹介します。
異なるコンポーネントから共通のファイルを参照する
複数のコンポーネントから同じファイル（画像とか）を利用したい場合は、コンポ...
プログラミング lab.js の出力データについて
はじめに
この記事では lab.js での実験終了時に得られるデータの内容についてまとめます。
公式サイトの Data format のページを訳したものです（全訳はしてません）。
データの...
プログラミング lab.js のデフォルトの CSS を書き換えて見た目をいい感じに調整する
はじめに
この記事では lab.js のデフォルトの CSS 設定を上書きし、レイアウト、余白、フォントなどの見た目を調整するためのアイデアをまとめます。
補足1：CSS の記入方法
この記事で紹介して...
プログラミング lab.js で画像の評定実験を作る方法（および回答入力方法の工夫）
はじめに
この記事では、表示された画像に対して美しさの評定値を回答する実験課題を、lab.js Builder を使って（Scripts は使わずに）作成する方法を解説します。lab.js のデフォルトの機能をそのまま使う...
プログラミング lab.js でインフォームドコンセントとデモグラフィックスの画面を作る
はじめに
実験や調査を lab.js で行う際には最初にインフォームドコンセントとデモグラフィックスの回答画面を用意する必要があるでしょう。この記事では lab.js Builder を使ってこれらの画面を作る方法を解説し...
プログラミング HTML と CSS の基本
はじめに
この記事では HTML や CSS の基本的な情報を説明します。
なぜHTLM/CSSを知っておくべきなのか
lab.js では、プログラミング的なことを全くせずに Builder 上での...
Tips 無意識を実験する方法：連続フラッシュ抑制（CFS）研究のレビュー
はじめに
この記事では連続フラッシュ抑制（CFS; Continuous Flash Suppression）という手法を用いた研究のレビューを行います。CFSは、「画像が目に入っているにもかかわらず意識には上らない」という不思議な状況を...
Tips 心理統計学の授業で教材に使えるオープンデータ集
はじめに
統計学の講義や実習の際に使える心理系のデータセットをまとめました。アヤメの分類や経済統計もいいですが、やはり心理学に関連したデータを使う方が心理系の学生には興味をもって統計を学べると思います。ここには私が授業でよく使ってい...
プログラミング 曲線のフィッティング
データがある曲線 y = a * ( 1 - exp( -b * t ) ) に従っているとします。
a と b は関数のパラメータです。
例えば a = 2, b = 0.7 の場合には、この曲線は次のようになります。
...
Tips 学会などに出張する時の持ち物チェックリスト
以前に書いたやつを整理しつつ、新しい情報を追加しました。
--
学会用
ポスター
配布用資料（ポスターのA4印刷版など）
学会参加証・名札
大会プログラム
名刺
電子機器
ノートパソコン・タブレット
...
プログラミング データフレームにfor文でデータを追加する際の処理速度
データフレームに対してfor文を使って一行ごとに新規のデータをrbindで追加するという書き方は、処理に時間がかかるのであまり良い書き方ではありません（そもそもRではfor文を使うべきでない、みたいな話は今は気にしないことにします）。例...
未分類 hiroyukitsuda.com から htsuda.net にドメインを変更した際の作業の流れ。
さくらのコントロールパネルで新しいドメインを追加する。
お名前.com で htsuda.net にさくらのネームサーバーの値を設定する(ns1.dns.ne.jpみたいなやつ)。
さくらのコントロールパネルでhtsuda.net ...
improc ヒストグラムマッチングによる画像の平均輝度とコントラストの調整
作成した関数
hist.match = function( cimg, target.hist = NULL, return.image = T, save.dir = "NULL" ){
if( !is.null( ...
improc 自然画像中の方位の分布の解析
人間は水平・垂直な方向の線分に対して感度が高いことが知られており、これは Oblique effect と呼ばれます。人間が生活する視環境の中に水平・垂直の成分が多く含まれることがこのような視覚特性をもたらしているという可能性が...
improc 画像の背景色の除去
問題
物体画像のデータベースなどから得た画像は、多くの場合に物体の周囲に白い背景が付いています。実験では黒や灰色の画面に画像を提示することが多いので、画像をそのまま提示すると物体の周囲に余分な白色が出てしまいます（図の上段）。...
improc 2値化画像とムーニー顔
二値化
これが何の画像か分かりますか？ 正解はこちら。
心理学をやっている人ならこのダルメシアンの画像は何度も目にしていたことがあると思いますが、画像処理を使えばこの種の画像をいろいろと作ることができます。
...
improc 周波数フィルタリング
フーリエ変換
ローパスフィルタ・ハイパスフィルタ・バンドパスフィルタ
library( imager )
clamp = function( array, min, max ){
...
improc 空間フィルタリングによる平滑化とエッジ検出
畳み込み処理
画素値を操作する際に、当該画素の周辺に存在する画素も用いて計算を行うことができます。例えば当該画素を含む周囲9ピクセルの画素値の平均を計算し、その値を当該画素の新しい画素値とする操作を行えば、画像をぼかす効果が得...
improc 画像の輝度を調整する
画像の輝度を任意の値に合わせる方法を考えます。例えばある画像の平均輝度が 0.5 だとして、これを 0.3 など別の値になるように調整したい、ということです。
一見すると、この例の場合だと画像の全ピクセルの画素値を -0....
improc Rによる画像処理：imagerパッケージの使い方
Rで画像処理をするにあたって imager というパッケージを用います。このページでは imager の基本的な使い方について扱います。まず始めにデジタル画像について説明します。
デジタル画像について
私たちが普段パ...
improc 画像処理と心理学
画像処理 (Image processing) とは、画像に対して何らかの処理を施すことです。
処理の結果（出力）として画像を得る場合もあれば、何らかの記述を得る場合もあります。前者の例としては写真の明るさやコントラストを調整して見栄...
プログラミング UE4で鏡を作る
やりたいこと
周囲の風景を反射する鏡を作りたい。
結果的には下記の画像のような平面的な鏡を作ります（風景に溶け込んで分かりにくいですが、四角い鏡が設置され周りの風景を映しています。
使用した...
プログラミング UE4でIBLのHDR天球画像を動的に変更する方法
やりたいこと
UE4 で HDR 画像を使った IBL (Image-Based Lighting) において、天球画像をアプリ実行中に変更したい。
下の画像はスターターコンテンツの Advanced_Lighting ...
プログラミング UE4で変数の値をテキストファイルとして保存する方法
やりたいこと
UE4 でブループリント変数の値をテキストファイルとして保存したい。
私の目的で言えば、アプリ実行中に得られたユーザーの行動データをテキストファイルとして保存したい、ということです（Unreal Engin...
Tips Savitzky–Golay filter を Processing on Eclipse で使う
やりたいこと
ある時系列データ（下図のグレー）が与えられた時、それにフィルターをかけることで青線のようなスムージングされたデータにしたい。
やりかた
Savitzky-Golay...
プログラミング Processingの自作ライブラリの作り方
Eclipse を使って Processing のユーザーライブラリを作成する方法を紹介します。
1. プロジェクトの新規作成
前回の記事のやり方に沿って既に Eclipse に Processing 本体のライブラ...
プログラミング Processing 3 を Eclipse で使う方法
Processing 3.0 を Eclipse で使えるようにする手順を説明します。
環境
- Mac OSX 10.10.1
- Eclipse Version: Luna Service Re...
プログラミング Unityで他のスクリプトの変数や関数を利用する
スクリプトから、他のスクリプトの変数や関数を利用したい場合があります。そのやり方について。
他のスクリプトが、同じゲームオブジェクトのコンポーネントである場合とそうでない（他のオブジェクトのコンポーネントである）場合とがあ...
プログラミング Unityでの空間移動用のスクリプト
Unityでプレイヤーが空間内を自由に移動や回転できるようにするスクリプトを紹介します。
(前置きですが)そもそも、三次元空間内における移動と回転は、3つの軸それぞれについて可能です。
図で説明すると以下のようです。
...
プログラミング Rの変数をローカル環境からグローバル環境に割り当てる
Rでローカル変数をグローバル環境の変数にする方法について。
関数内で宣言された変数はその関数内でしか使えず、関数の実行が終わると利用できなくなります。
例えば以下のようなスクリプトを考えます。
# Main...
プログラミング Rでメイン関数を書く
Rでスクリプトを書く際に、CやJavaでのようにメイン関数を書きたいとします。
即ち、スクリプトの冒頭にメイン関数を配置し、その下にサブ関数を並べるというお馴染みの書き方をしたい。
結論から言えば、下記のように書けばOKです。
...
プログラミング RStudio起動時に自動でスクリプトを実行
RStudioを起動した際に自動でスクリプトを実行させる方法について。
よく使う関数は自作関数としてまとめておきこれを読み込ませて使用するのが便利だと前回書きました。
毎回のスクリプトでこのような読み込みのための手続きを...
プログラミング Rの自作関数の読み込みと、RStudioのグローバル環境をクリアに保つ方法
Rの自作関数の読み込みと、読み込んだ関数をRStudioのグローバル環境に表示させない方法について。
前回紹介したような自作関数はスクリプト内に毎回記述するのではなく、自作関数をまとめておくための専用のRファイルを別に用意...
プログラミング RStudioのクリア関数
R を RStudio で使ってる際によく利用する各種のクリア関数についてまとめました。
1. コンソールの表示内容をクリアしたい時。
# Clear console messages
cat( "\014...
プログラミング 実行中のスクリプトファイルの所属ディレクトリの取得方法
実行中のスクリプトファイルがどのディレクトリに位置するかを取得する方法について。
スクリプトファイル中に以下のように書けば、そのスクリプトファイルが所属するディレクトリが取得できます。
# Get the d...
P5 更新履歴
履歴
2014年11月27日
サーバーへのデータの保存 のページを作成。
2014年10月29日
ブラウザ上で動かす、作者／サイトの制作動機 のページを作成。
2014年9月23日
2AFC課題(...
P5 サーバーへのデータの保存
jQuery/AjaxとPHPを用いてデータをサーバーに送信する。
var myp5 = new p5( function( sketch ) {
var counter = 0;
var response =...
P5 作者／サイトの制作動機
このサイトの作者
津田裕之
詳しくは をご覧下さい。
このサイトを作った動機
素直な本心として。以下殴り書きの雑文で失礼します。
動機系列１
世の中に心理実験プログラミングについてきっちり書かれたウ...
P5 このサイトの構成
このサイトの方針について
Processing は(特にメディアアートや工学系において)最近人気の言語であるため、情報は比較的得やすいです。書籍は多く出ていますし、web上にも解説ページは多いです。勉強するための素材は十分あり、図形や...
P5 このサイトの動作環境
閲覧環境
このサイトは Firefox と Chrome を用いて動作確認をしています。それ以外のブラウザ、例えば IE (Internet Explorer) などでは表示崩れなどが生じている可能性があります。また、モバイル端末...
P5 ブラウザ上で動かす
Processing のコードをブラウザ上で動かす方法について。
Processing の js ライブラリを使う
このサイト内では、プログラムコードの実行例を動画や画像ではなくブラウザ上で実際に動作させて表示してい...
P5 Processingの利点と欠点
Processingを心理実験用の言語として使うことの利点と欠点について。
利点
インストール・文法・開発環境が平易である
導入コストが低い
簡潔な文法と描画APIを持つ
ラピッドプロトタイピン...
P5 Processingとは
そもそも Processing って？
Processing は Java をベースにしたプログラミング言語です。プログラミング初心者でも容易に習得可能な言語となるよう開発され、グラフィックや音を使ったプログラミングが手軽に作成できま...
P5 2AFC課題(画像版)
課題内容
左右に提示される画像のうち、好きな方の画像をキーボードの矢印キー(左キー or 右キー)で回答する課題です。回答には制限時間があり、4秒以内に回答しないと次の試行に進みます。回答をするとその時点ですぐ次の試行が始まります...
P5 text, PFont
文字を描画する
text( 文字列, x, y ); 文字列を描画する
例：text( "Hello", 100, 100 ); // Helloという文字を座標(100, 100)に描画する
textSize(...
P5 透過色
色の不透明度を指定する
fill 関数や stroke 関数で図形や線の色を指定する際に、引数を１つ付け足すと、その値は不透明度の値として使われます。不透明度を指定することで、透明な色を使うことができます。
fill...