Forum Discussion

AndersBrydeThor's avatar
AndersBrydeThor
Community Member
7 months ago

SCORM courses made in Storyline 360 doesn't fill out the entire space when running in iframe

We've been looking into better supporting mobile users in our existing catalog of courses on our own developed LMS.

A major challenge is simply to make the course take up enough space on the page (see image 1).

Our developers have been working on it, but they are left baffled by the fact that the course doesn't actually play in the entire frame they are giving it. In fact, you can see before playback is started, that the "Play" screen is filling all the space given to it (see image 2), but then when the actual course starts it is much smaller than that (as per image 1).

This doesn't occur on desktop (or maybe there is a small difference between the space taken up by the black "Play" screen and the actual course playing, but if there is, it is so small as to not matter).

Have anyone experienced anything similar? Does anyone have a theory of what is going on here?

 

 

  • I did, and no they didn't exhibit the same behavior. But then on SCORM Cloud the course is launched in a pop-up window, not in an iframe, so I don't know if it's 1:1 comparable.

    • JoeFrancis's avatar
      JoeFrancis
      Community Member

      That's a setting you would adjust in the Launch Behavior tab of the Course Properties panel on the Course page.

  • There are lots of possible reasons you are seeing a difference between the 'Player' window and the actual Storyline 'content' window.

    One (but only one of many possibilities) is aspect ratio:

    The Player is launched in a 'container' and, by default, will expand to fill that container size. The course content cannot do that as it must maintain it's original aspect ratio (width:height) because, if it didn't, the screen content would become distorted.

    You could try checking what the player container size is (i.e. the frame it is being launched in), calculate the aspect ratio and then set your Storyline screen size to the same aspect ratio.

    Normally, the wrong aspect ratio will just give you blank space at the sides:

    so, I doubt this is your problem - but it won't do any harm checking :)

  • I should perhaps add that when I say "wrong aspect ratio" I mean "wrong aspect ratio for the device being used". It is a constant challenge for designers that tablets have an aspect ratio of 4:3 whilst most laptops and smartphones have a 'widescreen' aspect ratio of 16:9.

  • Our courses do have a 16:9 ratio. They are set to the custom size of 1152x648. I don't remember if there was a good reason those specific numbers were chosen, but it still comes to a 16:9 ratio.

    Now I also went back to SCORM cloud and adjusted the launch behavior to not create a pop-up window. But it still lets the course take up the entire window, not just an embedded frame alongside other content, so I don't know if it really is comparable.

    Here the contents do fill out the full width given to it. So no, I guess it doesn't exhibit the same behavior.