Millisecond Forums

How to add an interactive animation?

https://forums.millisecond.com/Topic27884.aspx

By Amarins - 10/15/2019

Hi all,

For a simple choice task, I want to add an animation of an iceberg that changes (either grows or melts) when a participant chooses one of two options. The animation attribute doesn't seem suitable, because it only changes the position of a stimulus and I want the animation itself to change as a reaction to the choices of participants. Could anyone help me with this?

Thanks in advance!
By Dave - 10/16/2019

Amarins - 10/16/2019
Hi all,

For a simple choice task, I want to add an animation of an iceberg that changes (either grows or melts) when a participant chooses one of two options. The animation attribute doesn't seem suitable, because it only changes the position of a stimulus and I want the animation itself to change as a reaction to the choices of participants. Could anyone help me with this?

Thanks in advance!

You could use a picture element and change its size depending on the response, essentially like the BART does https://www.millisecond.com/download/library/bart/ or select still images of the iceberg in varying stages of growth or melting and circle through those.
By Amarins - 10/20/2019

Dave - 10/16/2019
Amarins - 10/16/2019
Hi all,

For a simple choice task, I want to add an animation of an iceberg that changes (either grows or melts) when a participant chooses one of two options. The animation attribute doesn't seem suitable, because it only changes the position of a stimulus and I want the animation itself to change as a reaction to the choices of participants. Could anyone help me with this?

Thanks in advance!

You could use a picture element and change its size depending on the response, essentially like the BART does https://www.millisecond.com/download/library/bart/ or select still images of the iceberg in varying stages of growth or melting and circle through those.

Thanks a lot! I will try to select images of the iceberg in varying stages first!
By Amarins - 10/28/2019

Hi all,

I have tried to select different images of an iceberg using the ontrialend-option. 
However, it seems like something's going wrong with linking the images: they don't change according to the choices.

Can anyone find the problem in my code?
Participants start trial the first trial with a medium-sized iceberg (picture ib.5/ item 6).


<block B1_products_fb1>
/ trials = [1-5 = noreplace(sus_left_fb1, sus_right_fb1)]
</block>

<trial sus_left_fb1>
/ stimulustimes = [1 = iceberg_animation]
/ correctresponse = ("a")
/ validresponse = ("a", "l")
/ ontrialend = [
IF (trial.sus_left_fb1 == "a") values.iceberg +1;
IF (trial.sus_left_fb1 == "l") values.iceberg -1
]
</trial>

<trial sus_right_fb1>
/ stimulustimes = [1 = iceberg_animation]
/ correctresponse = ("a")
/ validresponse = ("a", "l")
/ ontrialend = [
IF (trial.sus_right_fb1 == "l") values.iceberg +1;
IF (trial.sus_right_fb1 == "a") values.iceberg -1
]
</trial>

<values>
/ iceberg = 6
</values>

<picture iceberg_animation>
/ items = iceberg_picture
/ position = (50, 50)
/ size = (25%, 25%)
/ select = values.iceberg
</picture>

<list iceberg>
/ items = (1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11)
/ replace = false
</list>

<item iceberg_picture>
/1 = "ib0.png"
/2 = "ib1.png"
/3 = "ib2.png"
/4 = "ib3.png"
/5 = "ib4.png"
/6 = "ib5.png"
/7 = "ib6.png"
/8 = "ib7.png"
/9 = "ib8.png"
/10 = "ib9.png"
/11 = "ib10.png"
</item>

Thanks in advance!
By Dave - 10/28/2019

Amarins - 10/29/2019
Hi all,

I have tried to select different images of an iceberg using the ontrialend-option. 
However, it seems like something's going wrong with linking the images: they don't change according to the choices.

Can anyone find the problem in my code?
Participants start trial the first trial with a medium-sized iceberg (picture ib.5/ item 6).


<block B1_products_fb1>
/ trials = [1-5 = noreplace(sus_left_fb1, sus_right_fb1)]
</block>

<trial sus_left_fb1>
/ stimulustimes = [1 = iceberg_animation]
/ correctresponse = ("a")
/ validresponse = ("a", "l")
/ ontrialend = [
IF (trial.sus_left_fb1 == "a") values.iceberg +1;
IF (trial.sus_left_fb1 == "l") values.iceberg -1
]
</trial>

<trial sus_right_fb1>
/ stimulustimes = [1 = iceberg_animation]
/ correctresponse = ("a")
/ validresponse = ("a", "l")
/ ontrialend = [
IF (trial.sus_right_fb1 == "l") values.iceberg +1;
IF (trial.sus_right_fb1 == "a") values.iceberg -1
]
</trial>

<values>
/ iceberg = 6
</values>

<picture iceberg_animation>
/ items = iceberg_picture
/ position = (50, 50)
/ size = (25%, 25%)
/ select = values.iceberg
</picture>

<list iceberg>
/ items = (1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11)
/ replace = false
</list>

<item iceberg_picture>
/1 = "ib0.png"
/2 = "ib1.png"
/3 = "ib2.png"
/4 = "ib3.png"
/5 = "ib4.png"
/6 = "ib5.png"
/7 = "ib6.png"
/8 = "ib7.png"
/9 = "ib8.png"
/10 = "ib9.png"
/11 = "ib10.png"
</item>

Thanks in advance!

<trial sus_left_fb1>
/ stimulustimes = [1 = iceberg_animation]
/ correctresponse = ("a")
/ validresponse = ("a", "l")
/ ontrialend = [
IF (trial.sus_left_fb1 == "a") values.iceberg +1;
IF (trial.sus_left_fb1 == "l") values.iceberg -1

]
</trial>

<trial sus_right_fb1>
/ stimulustimes = [1 = iceberg_animation]
/ correctresponse = ("a")
/ validresponse = ("a", "l")
/ ontrialend = [
IF (trial.sus_right_fb1 == "l") values.iceberg +1;
IF (trial.sus_right_fb1 == "a") values.iceberg -1

]
</trial>

The syntax bolded above is wrong on several counts and will not change the value of values.iceberg. It ought to read

<trial sus_left_fb1>
/ stimulustimes = [1 = iceberg_animation]
/ correctresponse = ("a")
/ validresponse = ("a", "l")
/ ontrialend = [
if (trial.sus_left_fb1.response == 30) values.iceberg += 1;
if (trial.sus_left_fb1.response == 38) values.iceberg -= 1;

]
</trial>

<trial sus_right_fb1>
/ stimulustimes = [1 = iceberg_animation]
/ correctresponse = ("a")
/ validresponse = ("a", "l")
/ ontrialend = [
if (trial.sus_right_fb1.response == 38) values.iceberg += 1;
if (trial.sus_right_fb1.response == 30) values.iceberg -= 1;

]
</trial>

i.e. (1) you ought to query the respective trial's response property, (2) you ought to work with keyboard scan codes, because that's what the response property returns (see Tools -> Keyboard Scancodes...), and (3) you ought to make use of the proper operators, here increment (+=) and decrement (-=).