surveypage continue button not appearing


Author
Message
reg_002
reg_002
Respected Member (494 reputation)Respected Member (494 reputation)Respected Member (494 reputation)Respected Member (494 reputation)Respected Member (494 reputation)Respected Member (494 reputation)Respected Member (494 reputation)Respected Member (494 reputation)Respected Member (494 reputation)
Group: Forum Members
Posts: 13, Visits: 65
I'm having an issue with a survey page. 

The survey page is embedded in a block with other trials (see part of the script below).
The issue is that the surveypage has a textbox. 
Now, below the textbox a button is normally shown that people should click on to continue with the study.
When I test the study on Inquisit Web, this works perfectly. I tried it with all different resolutions of my laptop (1920 x 1080 --> 800x600) and only with the smallest (800 x 600) a small portion of the button is hidden behind the textbox (it is only a small portion so no problem). 

So, what goes wrong? When I run the study with online participants, about 20% complain that they don't see the continue button, noting things such as "This page seems stuck I can't find how to move on now .". I asked some of them about the screen resolution and they seem to have the issue with resolutions that I don't have the problem with at all (1366x768). I'm in the dark about what is happening. 

Does anyone know a solution here?

If you want to try out the script yourself, it is here: https://mili2nd.co/zdwb

Part of the script: 

##Blocks##
<block LearningP1_nhd_pld>
/ trials = [1 = Markneutral; 2 = Markposld_el2; 4 = wait2; 5 = Markposld_el_; 6= Markneutral]
/preinstructions = (LearningMark)
</block>

##Trials##
<trial Markneutral>
/ stimulustimes = [0=Mark_1;500=neutralMark; 8500=space]
/ validresponse = (57)
/ beginresponsetime = 8500
</trial>

<trial Markposld_el2>
/ stimulustimes = [0=Mark_1;500=posldMark2,posldpic2_; 8500=space_]
/ validresponse = (57)
/ beginresponsetime = 8500
</trial>

<surveypage Markposld_el_>
/questions = [1=visualizeM]
/itemfontstyle = ("Arial", 14pt)
/showpagenumbers = false
/showquestionnumbers = false
/ stimulusframes = [1=Mark_q_, posldpic]
</surveypage>

<textbox visualizeM>
/ caption = "
Please think about the LAST piece of behavioral information that you just read. Your task is to think about this information for a while.
Please visualize the behavior and form an interactive image of what Mark did.
Please also elaborate on the information any way you can and write your elaboration below.
Make sure to elaborate sufficiently (please write at least four sentences).
After writing down the elaboration, you can click below to continue."
/ position = (30px, 300px)
/ textboxsize = (80%, 300px)
/ multiline = true
/ required = true
/ minchars = 40
</textbox>

<trial wait2>
/ validkeys = ("8")
/ correctresponse = ("8")
/ frames = [1=blackscreen2]
/ timeout = 10
/ errormessage = false
</trial>

##Stimuli##

<picture Mark_q_>
/ numitems = 1
/ items = ("man1.jpg")
/ position = (40%, 185px)
/ size = (250,215)
</picture>

<text posldMark2>
/ items = ("Mark gave up his seat on the bus to an older person.")
/ fontstyle = ("Arial", 18pt)
/ position = (50%, 35%)
/ txbgcolor = black
/ color = black
/ txcolor = white
</text>

<picture posldpic>
/ items = ("pld.jpg")
/ position = (75%, 175px)
/ size = (272,185)
</picture>

<text blackscreen2>
/ numitems = 1
/ items = ("      ")
/ txbgcolor = (0,0,0)
/ color = (255, 255, 255)
/ fontstyle = ("Arial", 103.43%, false, false, false, false, 5, 1)
</text>


Dave
Dave
Supreme Being (871K reputation)Supreme Being (871K reputation)Supreme Being (871K reputation)Supreme Being (871K reputation)Supreme Being (871K reputation)Supreme Being (871K reputation)Supreme Being (871K reputation)Supreme Being (871K reputation)Supreme Being (871K reputation)
Group: Administrators
Posts: 10K, Visits: 62K
reg_002 - 11/7/2020
I'm having an issue with a survey page. 

The survey page is embedded in a block with other trials (see part of the script below).
The issue is that the surveypage has a textbox. 
Now, below the textbox a button is normally shown that people should click on to continue with the study.
When I test the study on Inquisit Web, this works perfectly. I tried it with all different resolutions of my laptop (1920 x 1080 --> 800x600) and only with the smallest (800 x 600) a small portion of the button is hidden behind the textbox (it is only a small portion so no problem). 

So, what goes wrong? When I run the study with online participants, about 20% complain that they don't see the continue button, noting things such as "This page seems stuck I can't find how to move on now .". I asked some of them about the screen resolution and they seem to have the issue with resolutions that I don't have the problem with at all (1366x768). I'm in the dark about what is happening. 

Does anyone know a solution here?

If you want to try out the script yourself, it is here: https://mili2nd.co/zdwb

Part of the script: 

##Blocks##
<block LearningP1_nhd_pld>
/ trials = [1 = Markneutral; 2 = Markposld_el2; 4 = wait2; 5 = Markposld_el_; 6= Markneutral]
/preinstructions = (LearningMark)
</block>

##Trials##
<trial Markneutral>
/ stimulustimes = [0=Mark_1;500=neutralMark; 8500=space]
/ validresponse = (57)
/ beginresponsetime = 8500
</trial>

<trial Markposld_el2>
/ stimulustimes = [0=Mark_1;500=posldMark2,posldpic2_; 8500=space_]
/ validresponse = (57)
/ beginresponsetime = 8500
</trial>

<surveypage Markposld_el_>
/questions = [1=visualizeM]
/itemfontstyle = ("Arial", 14pt)
/showpagenumbers = false
/showquestionnumbers = false
/ stimulusframes = [1=Mark_q_, posldpic]
</surveypage>

<textbox visualizeM>
/ caption = "
Please think about the LAST piece of behavioral information that you just read. Your task is to think about this information for a while.
Please visualize the behavior and form an interactive image of what Mark did.
Please also elaborate on the information any way you can and write your elaboration below.
Make sure to elaborate sufficiently (please write at least four sentences).
After writing down the elaboration, you can click below to continue."
/ position = (30px, 300px)
/ textboxsize = (80%, 300px)
/ multiline = true
/ required = true
/ minchars = 40
</textbox>

<trial wait2>
/ validkeys = ("8")
/ correctresponse = ("8")
/ frames = [1=blackscreen2]
/ timeout = 10
/ errormessage = false
</trial>

##Stimuli##

<picture Mark_q_>
/ numitems = 1
/ items = ("man1.jpg")
/ position = (40%, 185px)
/ size = (250,215)
</picture>

<text posldMark2>
/ items = ("Mark gave up his seat on the bus to an older person.")
/ fontstyle = ("Arial", 18pt)
/ position = (50%, 35%)
/ txbgcolor = black
/ color = black
/ txcolor = white
</text>

<picture posldpic>
/ items = ("pld.jpg")
/ position = (75%, 175px)
/ size = (272,185)
</picture>

<text blackscreen2>
/ numitems = 1
/ items = ("      ")
/ txbgcolor = (0,0,0)
/ color = (255, 255, 255)
/ fontstyle = ("Arial", 103.43%, false, false, false, false, 5, 1)
</text>


You have sized and posititioned things such that the textbox will cover up the survey page's navigation buttons under some circumstances.

Here's a screenshot at 1366x768



Here's another one at 1366x768, with the textbox's height reduced to 150px, so you can clearly see what's going on:


One of the major problems / mistakes is that you've specifed the "Please think about..." description text in poins (Arial, 14pt), which will not adapt based on screen resolution: 14pt is 14pt, so it takes up more space on screens set to lower resolution.

What you'll generally want to do is (1) specify a suitable /canvasaspectratio in your <defaults>, and (2) specify all sizes, including font sizes, and positions in percentages.


reg_002
reg_002
Respected Member (494 reputation)Respected Member (494 reputation)Respected Member (494 reputation)Respected Member (494 reputation)Respected Member (494 reputation)Respected Member (494 reputation)Respected Member (494 reputation)Respected Member (494 reputation)Respected Member (494 reputation)
Group: Forum Members
Posts: 13, Visits: 65
Dave - 11/9/2020
reg_002 - 11/7/2020
I'm having an issue with a survey page. 

The survey page is embedded in a block with other trials (see part of the script below).
The issue is that the surveypage has a textbox. 
Now, below the textbox a button is normally shown that people should click on to continue with the study.
When I test the study on Inquisit Web, this works perfectly. I tried it with all different resolutions of my laptop (1920 x 1080 --> 800x600) and only with the smallest (800 x 600) a small portion of the button is hidden behind the textbox (it is only a small portion so no problem). 

So, what goes wrong? When I run the study with online participants, about 20% complain that they don't see the continue button, noting things such as "This page seems stuck I can't find how to move on now .". I asked some of them about the screen resolution and they seem to have the issue with resolutions that I don't have the problem with at all (1366x768). I'm in the dark about what is happening. 

Does anyone know a solution here?

If you want to try out the script yourself, it is here: https://mili2nd.co/zdwb

Part of the script: 

##Blocks##
<block LearningP1_nhd_pld>
/ trials = [1 = Markneutral; 2 = Markposld_el2; 4 = wait2; 5 = Markposld_el_; 6= Markneutral]
/preinstructions = (LearningMark)
</block>

##Trials##
<trial Markneutral>
/ stimulustimes = [0=Mark_1;500=neutralMark; 8500=space]
/ validresponse = (57)
/ beginresponsetime = 8500
</trial>

<trial Markposld_el2>
/ stimulustimes = [0=Mark_1;500=posldMark2,posldpic2_; 8500=space_]
/ validresponse = (57)
/ beginresponsetime = 8500
</trial>

<surveypage Markposld_el_>
/questions = [1=visualizeM]
/itemfontstyle = ("Arial", 14pt)
/showpagenumbers = false
/showquestionnumbers = false
/ stimulusframes = [1=Mark_q_, posldpic]
</surveypage>

<textbox visualizeM>
/ caption = "
Please think about the LAST piece of behavioral information that you just read. Your task is to think about this information for a while.
Please visualize the behavior and form an interactive image of what Mark did.
Please also elaborate on the information any way you can and write your elaboration below.
Make sure to elaborate sufficiently (please write at least four sentences).
After writing down the elaboration, you can click below to continue."
/ position = (30px, 300px)
/ textboxsize = (80%, 300px)
/ multiline = true
/ required = true
/ minchars = 40
</textbox>

<trial wait2>
/ validkeys = ("8")
/ correctresponse = ("8")
/ frames = [1=blackscreen2]
/ timeout = 10
/ errormessage = false
</trial>

##Stimuli##

<picture Mark_q_>
/ numitems = 1
/ items = ("man1.jpg")
/ position = (40%, 185px)
/ size = (250,215)
</picture>

<text posldMark2>
/ items = ("Mark gave up his seat on the bus to an older person.")
/ fontstyle = ("Arial", 18pt)
/ position = (50%, 35%)
/ txbgcolor = black
/ color = black
/ txcolor = white
</text>

<picture posldpic>
/ items = ("pld.jpg")
/ position = (75%, 175px)
/ size = (272,185)
</picture>

<text blackscreen2>
/ numitems = 1
/ items = ("      ")
/ txbgcolor = (0,0,0)
/ color = (255, 255, 255)
/ fontstyle = ("Arial", 103.43%, false, false, false, false, 5, 1)
</text>


You have sized and posititioned things such that the textbox will cover up the survey page's navigation buttons under some circumstances.

Here's a screenshot at 1366x768



Here's another one at 1366x768, with the textbox's height reduced to 150px, so you can clearly see what's going on:


One of the major problems / mistakes is that you've specifed the "Please think about..." description text in poins (Arial, 14pt), which will not adapt based on screen resolution: 14pt is 14pt, so it takes up more space on screens set to lower resolution.

What you'll generally want to do is (1) specify a suitable /canvasaspectratio in your <defaults>, and (2) specify all sizes, including font sizes, and positions in percentages.


Hi Dave,

Many thanks for your reply. I'm not a big fan of changing the canvas or specifying sizes in percentages (as pps don't get the same experience). 
This is why I try to run the script in the different screen resolutions and then make adaptions. However, this seems not the best option anymore given that I get very different results with 1366x768 (continue button is perfectly visible) then you do (and then pps do). Not sure why this might be the case (if you have any ideas, please let me know ;-p) but I guess it's probably best then to do as you advised.

Thanks again,

Pieter
Dave
Dave
Supreme Being (871K reputation)Supreme Being (871K reputation)Supreme Being (871K reputation)Supreme Being (871K reputation)Supreme Being (871K reputation)Supreme Being (871K reputation)Supreme Being (871K reputation)Supreme Being (871K reputation)Supreme Being (871K reputation)
Group: Administrators
Posts: 10K, Visits: 62K
reg_002 - 11/9/2020
Dave - 11/9/2020
reg_002 - 11/7/2020
I'm having an issue with a survey page. 

The survey page is embedded in a block with other trials (see part of the script below).
The issue is that the surveypage has a textbox. 
Now, below the textbox a button is normally shown that people should click on to continue with the study.
When I test the study on Inquisit Web, this works perfectly. I tried it with all different resolutions of my laptop (1920 x 1080 --> 800x600) and only with the smallest (800 x 600) a small portion of the button is hidden behind the textbox (it is only a small portion so no problem). 

So, what goes wrong? When I run the study with online participants, about 20% complain that they don't see the continue button, noting things such as "This page seems stuck I can't find how to move on now .". I asked some of them about the screen resolution and they seem to have the issue with resolutions that I don't have the problem with at all (1366x768). I'm in the dark about what is happening. 

Does anyone know a solution here?

If you want to try out the script yourself, it is here: https://mili2nd.co/zdwb

Part of the script: 

##Blocks##
<block LearningP1_nhd_pld>
/ trials = [1 = Markneutral; 2 = Markposld_el2; 4 = wait2; 5 = Markposld_el_; 6= Markneutral]
/preinstructions = (LearningMark)
</block>

##Trials##
<trial Markneutral>
/ stimulustimes = [0=Mark_1;500=neutralMark; 8500=space]
/ validresponse = (57)
/ beginresponsetime = 8500
</trial>

<trial Markposld_el2>
/ stimulustimes = [0=Mark_1;500=posldMark2,posldpic2_; 8500=space_]
/ validresponse = (57)
/ beginresponsetime = 8500
</trial>

<surveypage Markposld_el_>
/questions = [1=visualizeM]
/itemfontstyle = ("Arial", 14pt)
/showpagenumbers = false
/showquestionnumbers = false
/ stimulusframes = [1=Mark_q_, posldpic]
</surveypage>

<textbox visualizeM>
/ caption = "
Please think about the LAST piece of behavioral information that you just read. Your task is to think about this information for a while.
Please visualize the behavior and form an interactive image of what Mark did.
Please also elaborate on the information any way you can and write your elaboration below.
Make sure to elaborate sufficiently (please write at least four sentences).
After writing down the elaboration, you can click below to continue."
/ position = (30px, 300px)
/ textboxsize = (80%, 300px)
/ multiline = true
/ required = true
/ minchars = 40
</textbox>

<trial wait2>
/ validkeys = ("8")
/ correctresponse = ("8")
/ frames = [1=blackscreen2]
/ timeout = 10
/ errormessage = false
</trial>

##Stimuli##

<picture Mark_q_>
/ numitems = 1
/ items = ("man1.jpg")
/ position = (40%, 185px)
/ size = (250,215)
</picture>

<text posldMark2>
/ items = ("Mark gave up his seat on the bus to an older person.")
/ fontstyle = ("Arial", 18pt)
/ position = (50%, 35%)
/ txbgcolor = black
/ color = black
/ txcolor = white
</text>

<picture posldpic>
/ items = ("pld.jpg")
/ position = (75%, 175px)
/ size = (272,185)
</picture>

<text blackscreen2>
/ numitems = 1
/ items = ("      ")
/ txbgcolor = (0,0,0)
/ color = (255, 255, 255)
/ fontstyle = ("Arial", 103.43%, false, false, false, false, 5, 1)
</text>


You have sized and posititioned things such that the textbox will cover up the survey page's navigation buttons under some circumstances.

Here's a screenshot at 1366x768