| Reference | Downloads | Github

Changing image on keypress during a trial

Hi everybody,

I am designing an experiment where a selection of 10 different images are displayed on the screen for a small amount of time (presentation routine). The participant then has to make a decision about which image represented the most common image that they saw (decision routine).

I have the presentation routine working fine.

During the decision routine though, I would like it so that the participant can actively change the image that is displayed on the screen using a keypress. So, an image would appear after the presentation routine (randomly selected from the 10 images), then when they press e.g. the left key, a different image is presented. Once they have the desired image on the screen, they press the return key and the image choice is logged and the next trial begins in the loop.

I have been working with the BART example script but continually get stuck with my modifications.

Is this possible to do? Any guidance would be much appreciated.



If I’m understanding your design, then this should be quite simple to implement using a code element. You’d want to specify your image names through a variable name: so put $imageVariable or some such name in the “Image” field of the relevant image component in your routine. You also need to set this field to “set every frame”.

Now you just need to update the image name via code. So create a code component and in the “Each frame” tab (so the code runs every frame) then just check whether a key has been pressed and update the variable holding your image name appropriately and the image will change:

Here’s an example of something similar I did recently that updates the image every frame (to create a running clock). I increment the counter elsewhere in the script (via another code element) and included a keyboard element in the Routine called “buttonPressButton” and then inserted the following code in the “Each Frame” tab of the Routine’s code element:

startName = "IMG_"

if buttonPressButton.keys == 'space':
    imageVariable = startName + str(counter) + ".png"

This will update the variable “imageVariable” (so you get filenames like IMG_1.png, IMG_2.png, IMG_3.png…) This is picked up by the image routine which displays the relevant image file.

Hope that helps.

1 Like

Thanks for your quick response! Happy to say the code is working nicely and I would be happy to share if anybody reading this would like it.


Hi J,
thanks for your post about your willingness to share. This is very close to what I am attempting to do at the moment and I would appreciate seeing the code if you are still happy to share.
Warm regards,


Very happy to share!

I have just cleaned up the code, so it should be commented and hopefully understandable, let me know if anything doesn’t make sense through.

Repository here -

Just click the ‘clone or download’ button and ‘download ZIP’


1 Like

Dear James,
I cannot thank you enough for sharing this! You are a lifesaver. In particular because you even have the ‘limits’ of the image in there too. My experiment only varies on one dimension (pictures of food at various depth disparities). So I am now going through and simplifying your example. (I too will share with anyone interested).

I am only struggling with saving the data.
In your code snippet in setImage_2/endRoutine you have the trials.addData commands (see below). When I uncomment them I get:
NameError: name ‘trials’ is not defined.

However, when I green the addData commands out then tick the “is trials” box in the Practice properties loop I get data in the csv filew_2018_Jun_08_2008.csv (1.5 KB)
Is this giving me the same as what the addData lines would have given me?

Do you think there is any problem with using the ‘is trials’ checkbox? Is your setup this way because it was practice trials?

All I really want is the name or index of the image file they choose before pressing enter.

Again, I am very thankful for you sharing this. A huge help.

Kind regards,

#trials.addData(‘imgChoice1’, imgChoice1)
#trials.addData(‘choice_trial’, choice_trial)
#trials.addData(‘choice_trial_size’, choice_trial_size)
#trials.addData(‘choice_trial_view’, choice_trial_view)

You are most welcome, happy to be of help!

Yes, if you would like to save the image choice information (i.e. which image file is being shown before the participant presses ‘enter’), uncomment the lines in endRoutine and tick the ‘is trials’ box in the ‘Practice’ properties loop.

Yes again, I originally had a few practice trials in my full experiment and based the example on those trials.

In the code component setImage_2/Each frame:
choice_trial creates a variable with all the information about the selected image i.e. size and orientation
choice_trial_size just the ‘size’ part of the image
choice_trial_view just the ‘orientation’ part

When these are saved as data, they will simply be numeric variables, e.g. choice_trial would be 15, if the participant chose a body size = 1 and orientation = 5, as the image file would be 1_5.png

Hope this helps, but feel free to ask if anything is unclear :slight_smile:



Thank you for further describing those variable definitions. Makes sense.
I have uncommented the addData lines, ticked the Is trials box, but unfortunately I am still getting this error
File “…”, line 350, in
trials.addData(‘imgChoice1’, imgChoice1)
NameError: name ‘trials’ is not defined

How can that be?

Ah, just got why this is coming up with an error, when you uncomment in the ‘End Routine’ part, the trials.addData is referring to a loop called ‘trials’ but as the loop is called ‘practice’ in the experiment, this causes the error.

Solution - change the name of the ‘practice’ loop to ‘trials’, making sure the ‘is trials’ box is still ticked.

I’ll update the linked example, to avoid future issues.

Thanks for spotting it!


1 Like

Ah Ha! Sorted. I had to change the name of the loop to ‘trials’ in addition to uncommenting and ticking the ‘is trials’ box. So the loop is no longer ‘Practice’, but ‘trials’ instead. Now I have an a beautiful csv file including those important choice variables.

So for other people reading this, to make the save variables work-

  • I downloaded the linked files
  • uncommented the green addData lines in setImage_2/endRoutine
    #trials.addData(‘imgChoice1’, imgChoice1)
    #trials.addData(‘choice_trial’, choice_trial)
    #trials.addData(‘choice_trial_size’, choice_trial_size)
    #trials.addData(‘choice_trial_view’, choice_trial_view)
  • re-named the practice loop ‘trials’
  • ticked ‘Is trials’ in the loop properties.

Excellent. Thanks James.

hahaa! We both realised at the same time!

1 Like

All these changes have been made in the original repository (see link above or visit

Well done Kirsten!

1 Like