jQuery Change Blindness Task


Click here for a Qualtrics and jQuery based implementation of the flicker paradigm, often used to detect “change blindness“. It was inspired by an Adobe Flash version, originally developed by Steffen Werner at GoCognitive.net. The images presented here are a small subset of images which were largely created by his students in the course “Cognitive Psychology”, taught in the Fall of 2009 at the University of Idaho. We would like express our gratitude to Steffen for making his implementation available online – and for allowing us to use his images.

Change blindness is a surprising perceptual phenomenon that occurs when a change in a visual stimulus is introduced and the observer does not notice it. For example, observers often fail to notice major differences introduced into an image while it flickers off and on again. People’s poor ability to detect changes has been argued to reflect fundamental limitations of human attention.

To check for correct/incorrect mouse clicks and trial length, we added a Qualtrics timer to each of the pages containing a Change Blindness scene – meaning we now just needed to add some code to alternate between the two versions of the images and some code to check for correct an incorrect clicks. For the latter part, it proved easiest to convert images and masks (two images an one mask per scene) to HTML5 canvas elements and inspect if the clicked coordinates of the image would correspond to either black or white (i.e. to changing or unchanging areas) on the hidden “mask” canvas.

Libraries used:

Javascript source code:

HTML source code:

Leave a Reply