Two image objects with different duration in a single display

Online experiments
, ,
1

Description of the problem:

I would like to design a picture matching task.
In the experiment two images are displayed side by side - one on the left (imgL) and one on the right (imgL). An image is presented on the left (i.e. a cat). Simultaneously, images should start appearing one by one on the right hand side, 0.4 sec in duration each (lets say of a dog, house, car, cat). When the image of a cat finally appears on the right hand side, it is seen as a match and once participants click on it it should prompt the image on the left to change to another random image from the stimuli list. And this routine should continue until all images have been drawn and matched.

I am not sure how to deal with different duration for each of the images. Images on the right change every 0.4secs but the one on the left should not change until participant has clicked on the correct image on the right.

If I set duration of imgL to blank it prevents the 2nd and every subsequent imgR from loading. I’ve tried ‘set every Frame’ and ‘set every Repeat’ but it did not work. I’d imagine I will likely need a code snippet… I have tried ‘pic_R.status == PsychoJS.Status.FINISHED’ in the ‘Stop’ box of the imgR component after changing it from duration to condition but this did not work.

I have specified what constitutes a correct answer in my stimuli sheet. But again I am not sure how to specify what the correct answer is in each trial in the builder/code component. (For now I’m not worried about feedback or anything like that).

Any ideas of how to go about putting a task like this together in the builder in a way that it can be transferred to Pavlovia would be appreciated.

2

Two methods I can think of

  1. Change the right hand image in code

  2. You could have the routine only last .4 seconds and then loop to repeat the left and change the right image

3

Hello,

Thank you for the two suggestions. Would you be able to expand a little on the second one, please? If I have a routine with 2x image components each lasting .4sec displayed in the same frame, how can I create a loop around one of these image components only while allowing the image component on the right to change?

Many thanks for any suggestions!

4

You can use concentric loops.

The outer loop could contain the left image and a list [‘a’,’b’,…] of the right images. You could then shuffle the right list and use something like rightImage=rightImages.pop() to select one for each repeat of the inner loop.