Canvas & Storyline

Feb 20, 2020

Several months ago I tested out embedding my storyline 360 content in Canvas without issue. Now that my project is completed, I am having an issue displaying the module in Canvas. When I link to the story.html file in a Page, all I get is a blank black screen - the player does not seem to launch at all. I tested the html files locally without issue. Suggestions?

14 Replies
Eugenio Brito

The same to me. After several tests using chrome as browser I found:

1) chrome synchronized using the same e-mail that is used in Canvas login: No problem :)

2) chrome synchronized using other e-mail that is used in Canvas login; no show :(

3) chrome syncrhonized using other e-mail that is used in Canvas login, but using a anonymous page: no show :((

4) chrome using a visitor page: No problem :)

And I also received message from students that they have the same blank screen using Safari and also in Canvas app at Iphone.

Katie Riggio

Hi there, Eugenio!

I appreciate you sharing your testing with us, and would love to help you get to the bottom of this!

It sounds like this problem only happens in desktop Chrome and mobile Safari, is that right? If so, what version of Chrome and Safari are your learners using?

I'm also curious to know how the course displays in another LMS environment like SCORM Cloud (an industry-standard LMS tool). If you can share the .story file, I can help you test there! You can attach it as a new reply here or send it privately through this link.

Dearne Willing

There have been many Canvas and Articulate discussions at the moment, especially regarding adding content and returning of results to the Canvas gradebook.  It would be much smoother if we could add Articulate as an LTI to Canvas for smooth integration into Canvas items and user results. 

Susan, have you find solutions to your issue, I would be keen to know your workflows?

Susan Buza

Update: For me, the problem with the blank black screen was related to updated security settings on the affected browsers. Blocked 3rd party cookies disable the playing of the embedded content within a canvas course site.

Fast forward to this week. I updated one of my modules and now am having a similar but different issue. I get the black play screen but once I click play, I just get a grey screen and no content. I thought perhaps it was my update but I uploaded an original version (which works in another page on the same site) and that will not work now as a new upload. I'm thinking it's something with updated security settings within Canvas or with the upload process (something going awry in the expansion of the .zip file?) Thoughts?

Leslie McKerchie

Hi Susan and Matt,

Thanks for reaching out and sharing what you are experiencing with your published courses.

I'm curious if either of you has been able to test in another published environment outside of Canvas? I'm curious if the issue is with the project or with the LMS.

With your permission, I'd like to take a look at your project file to investigate what's happening. You can share it publicly here, or send it to me privately by uploading it here. I'll delete it when I'm done troubleshooting.

Denise Haunstetter

I am having the same exact problem and have been pulling my hair out for days! Everything works fine on computer Preview. Once in Canvas, I get the black/gray screen. I did also try it on our Internet server with the same results. The original file was imported from PowerPoint. I tested and removed pieces (text, backgrounds, images) and kept trying to publish again. The closest I got was when removing all audio, then the slides showed up in Canvas. The original audio files were m4a’s so I thought that was the problem, converted to mp3s and re-Inserted them all. Failed again. Took all audio out again and tried just a sample that I recorded into the mic. Adding that also gave me the black screen when published to Canvas. I have reinstalled, updated everything. Happy to share any files that may help. Thank you!

Victoria Navarrete

Having the same situation with projects uploaded starting at the end of August. Projects uploaded prior to that time are working. Projects uploaded later show up as a frozen gray or black screen, never load, open with a messed up image (the font is strange and oddly spaced). I have been trying to find answers from the Canvas Community...where quite a few others are experiencing the same. The only way I have found around the issue is to upload to Google Cloud platform and embed the link from there. No help from Canvas at all.  

Matt Sheltz

I contacted Articulate Support and Canvas Support and here is what they had to say:

Articulate Support: "As much as I would like to provide assistance with the troubleshooting but, we don't support troubleshooting issues if it is only happening on a 3rd party's environment."

Canvas Support: "Since Storyline is a third-party product we unfortunately are not able to provide direct support for the content but you may want to try re-uploading the presentation that is not displaying properly to make sure that the appropriate files are in the course. "

This leaves us as the consumers without a solution, and without any indication that a solution is being worked on. Articulate and Canvas are among the most popular providers of their respective services, and users NEED the two to work together. Frankly I am baffled that neither party is interested in making this work.

Lauren Connelly

Hello Susan!

I've looked at similar cases, and I see the workaround is to upload the course to a web server or use a different LMS other than Canvas. Have you tried testing your course in SCORM cloud

I see that you've previously shared about security restrictions in Canvas. Is that similar to what you're running into now?

Center for Educational Innovation University of Minnesota

Hello, I have successfully used Canvas to host Storyline modules in the past. Here is an example: http://z.umn.edu/rolemodeling

Very short answer:

1. upload zip file (expand) of published storyline to Canvas

2. edit a page and create a course link to the .story file itself

3. go to the page and copy the URL link you just created

4. remove everything at the end of the URL starting with "download".

5. paste the URL in a browser and you'll go to your Storyline module