Forum Discussion
New feature in Storyline 360: Interactive 360° images
Today we released a new feature in Storyline 360 called 360° images. We think you’ll love transforming any 360° image into an interactive learning experience that invites learners to explore and engage.
Import any panoramic 360° image, pick an initial view, and resize for the perfect fit. Looking for images to experiment with? Try this collection.
Once you’ve imported an image, you can add interactions using markers, hotspots, and triggers to capture learners’ attention and add contextual info to the images they’re exploring. You can create custom markers and add hotspots anywhere on the image.
Finetune how learners interact with 360° images easily. Add progress meters to show learners their progress, and choose how learners navigate through the image to create the immersive experience you want.
Download the latest version of Storyline 360 to start experimenting with 360° images—and share your projects! We’d love to see them here in E-Learning Heroes.
Great that we can now finally include 360 images, but we are still playing catch up with Adobe Captivate and 3DVista on the 360 capability as they can import 360 videos.
Will we be seeing the introduction of 360 videos in the near future?
As Captivate has not been updated in almost 2 years now and its 360 images and video options are far less than Storyline already.
Two things i want to see and that's 360 Video and the ability to use our own icons as hot spots.
So has anyone developed a workflow/ has a resource list for creating the 360 images in the first place? Not having much luck creating something other than a portal to hell with my iPhone… 😭
Buy an Insta360
There is Google Street View on your smartphone. The app is free and pretty easy to use. It also imports nicely into SL. Here's a video on how to use it. https://www.youtube.com/watch?v=xk7BhjDWrrg There are also videos that provide tips on how to take 360 pictures. This video does a good job explaining how to hold the camera and using something like a tripod or broomstick to keep the phone level. https://www.youtube.com/watch?v=wLIzWD1gru8
You need a dedicated setup for that. Either use a cheap One shot camera or use a DSLR or a Panohead for high quality images.
This is so exciting to see 360 added to Storyline! I have been forced to using other software that are not meant to be for creating eLearning courses!
I have used the 360 feature for couple days now and I have some comments I would like to share :)
- Somehow when I add a 360 image it hides the Slide Master which is unfortunate because I am using a Timer that is programmed in the Slide Master.
- The field of view is little bite weird, I wish we can have some settings to tweak the field of view.
- I wish we can add custom hotspots in the feature rather that using the default ones :).
- When jumping between 360 images between different slides, there is a little glitch in the beginning that I find annoying specially when I am using the same 360 image and wanted to feel like we didn't change the slide.
- It will be awesome to have some setting to let the 360 image start automatically from the same position as the previous 360 image and not to set it manually every time.
Thank you :)
Hi Mehdi,
Thank you for all the great feedback and suggestions!
Could you elaborate a little more on the first two points? If I make the 360° image smaller on the stage, then I'm able to see objects that I have on the slide master. Maybe you could share your project since it sounds like your slide master is more complicated with a timer? For field of view, are you referring to wanting to change the initial view/camera angle or is it more about wanting to crop the image on the stage?
As for the glitch, that's actually an intentional nudge we added in. The idea behind that was we wanted the image to move slightly to indicate to learners that this isn't a static image but one that can be moved around. I hear you though and we are considering adding a way to toggle that nudge effect off.
For the last point, one hack would be to copy/paste the image if you're using the same image and it will keep the same initial view. Replacing an image from the stage will also maintain the same initial view.
We really appreciate yours and everyone else's feedback as we're in beta and we consider how we want to build out the feature more so keep them coming! =)
Hi Annie,
Thank you for taking the time to answer my comments.- About the Slide Master because I have a transparent header I need it to be in top of the 360 image, what I did to get around the issue is duplicating the header in all the slides and leaving all the coding in the slide master and it seems to work.
- For the field of view (FOV) the 360 image seems so stretched from the right and left sides, so there is no way to tweak the FOV in the 360 editing tool, I did found a solution by editing this value ''this.zoom,c=2'' inside the three.min.js file, but I have to do it every time I publish :).
- The last point, that's what I did but I still have an issue with it since I have a 360 environment with different elements that the user can click so I can't predict the users point of view / position. In the previous software I was using we had an option that's called ''Same spot as current media'' so it gave us the same exact spot as the previous 360 image.
One last comment I want to share, I also find the speed of the panning in the 360 image so fast, that may cause motion sickness for some users, its also something to consider, I am still look for a way to tweak it :).
Thank you again for your help.
FYI. I did open a new feature request similar to "let the 360 image start automatically from the same position as the previous 360 image". I think we just need the ability to set the "initial view" coordinates with triggers when a slide starts. I don't know the status of the request.
Hey Jerry!
I spotted your feature request, and I've linked it to this discussion so any movement can be shared here. I appreciate you taking the time to share your thoughts! Also, I wanted to share insight on How We Manage Feature Requests in case it helps!
Mouse hovers don't appear to be working in the demo above either. You have to click to see the text, which is problematic if clicking also triggers movement to another slide.
- Hi Chris, there are a couple built-in marker states for unvisited, selected, and hover, but you can't customize it any further at this time. I'd be interested to hear what kind of states you'd want and why though!Text displaying on mouse hover not working is currently expected behavior, but it's on the roadmap!
Thanks for the response Annie. It'd be great if there was a state where text appears on a hover like a tooltip.
Is accessibility not supported for markers in 360 images? I can't see a way to add alt text or set the focus order.
Accessibility is also on the roadmap and is a work in progress while this feature is in public beta, but eventually markers will be fully accessible.
Hi chris!
I'm excited to share that we just shipped Storyline 360 (Build 3.56.26145.0) today! In 360° interactions, you can now add alt text to images and videos to make them accessible to screen reader users.
Make sure to update Storyline 360 in your Articulate 360 desktop app! If you have any additional questions, you can reach out to us in this discussion or in a support case.
Can you please recommend a model/brand of camera to produce the equirectangular panorama jpgs?
I originally created 360 images with an SLR camera and then stitched with PTGUI - and then inserted in to Storyline using the web object functionality - but now I am using this beta and taking images with an Insta 360 One X2 - not as good quality wise as the PTGU/web object workflow (because you can zoom in), but more than adequate with this long (I think over 8 years requested) addition to Storyline - I hope that the final version doesnt take as long!! If you do go down the Insta 360 route... I highly recommend you shoot 360 pans in HDR
Dear Team,
Great new feature. I have just noticed that it only works in Edge but not in Chrome if you have imported it into a rise module. Nothing will appear there. Can this be fixed?
Thanks a lot!
Best regards,
Sabine
Hi Sabine,
Thanks for bringing this to our attention! That bug is already on our radar so keep an eye out on future releases for a fix.
This is an excellent feature and I am very thankful for it. I had preciously tried various workarounds (using weblinks to 3DVista hosted material) but this is a far more elegant solution. To create pictures, I use an Insta360 One X and export them to jpg format using Insta360 Studio.
Has anyone figured out a way to add persistent text labels to 360 images associated with "jump to" triggers? (For example, an arrow that moves a user into a conference room.)
Seems like it should be doable but I'm stumped...
Hi,
This is such a great feature, so I am using it already in my Rise modules. However I keep having the problem that the 360 Degree SL does only show a black screen once it was integrated into Rise - or lets rather say, it turns black after re-visiting the Rise chapter that contains the 360 Degree SL. Also, when previewing, it mostly displays a black screen, sometimes it works perfectly though. I could not yet figure out why this happens, but it may be worth mentioning this bug.
I am using Edge browser.
Thanks, Iris.
Annie mentioned above that this is an issue we are currently tracking so we'll be sure to update you here when we can.
Hi there, Iris. With today's update to Storyline 360, we've also fixed the issue with 360º images not appearing when you first view your Storyline block in a Rise 360 course.
Let me know if you're not seeing the fix after republishing your Storyline interaction and adding it back into the Rise 360 lesson.
I'm discovering the same issue with a black screen randomly showing up instead of the image. It's not encouraging to know that you posted this 5 months ago and it's still happening.
Hello C K1!
Just popping in to let you know I responded to you here :)
