Mobile version that is different from desktop version (device responsive)?

Not in Storyline because it's slide-based and will scale the content based on the device similar to the way video responds.

Rise 360 is form-based and will respond to the device screen.

Thanks Tom.  What an honor to have my question answered by the Godfather of eLearning!! 

Makes sense.  I feel like Storyline is so close to a tool that let's me really design custom learning that feels almost like a website.  It's a shame it stops short on mobile responsiveness.   Also wish it could leverage transitions like morph (ppt).

Just thinking out loud here, but does the file know when it's being viewed on a phone?  Could I somehow setup a trigger to send viewers to a different url or even scene or slide in my elearn when they're on a phone?  I guess I could setup a button and ask them, but is there a way to have the elearn detect that itself?

I'm still a big fan.  Just want to keep pushing it to it's limits : )

Thanks again!

I've used custom javascript code in the past to do this for a client, but it looks like Articulate uses Bowser https://github.com/lancedikson/bowser to do this in Storyline, which may be more reliable. It would be as simple as including some detection code in a trigger at the beginning of your course, and then sending the user to the appropriate scene depending on the platform/browser variables returned.

I'm going to see if I can figure this out, but I don't code - I borrow from examples I find : ).  If you have an example of how this would look, I would be forever grateful!!

I built a demo a while back in Storyline 2 (I'll see if I can find it) where I created a landscape and portrait version of a course. I put the published out of the portrait course into the published course folder. Then in the html file there was some code that detected the device and if it was mobile, it linked to the portrait version. If it was a computer it linked to the regular version.

It was more of a prototype but it worked.

That's exactly what I was hoping I could do Tom.  Thanks for looking for an example.  I'm looking through the code in my published files and just not savvy enough to do it myself.  It'd be so cool if I could make this work!!

I'll start with saying I am not a programmer so I don't know what you need to do. :)

However, here is what I did in the past that worked in my prototype. But this was with SL2 before html5 was more standard in the browsers.

• I create a landscape and portrait version of the course.
• In the published output of the landscape version, I added the folder with the portrait version.
• Then in the story.html file for the landscape course, I modified the line that switched from the Flash version to HTML5 version. Instead of launching story_html5.html it redirected to the portrait folder and the story_html5.html inside that. It worked because most browsers played Flash so when you accessed from a mobile device it looked for the html5.

What you'd need is some code for the story.html file to do the same thing only it would need to look for a mobile device and then play the alternate version. I don't know enough to create that code.

Hi Lin and Math!  I had forgotten about this, but you've both inspired me to play with it again soon.  I love that this works.  I really with Articulate would build it in as functionality.  I'll try to share an example if I create something.

Whenever we need different layouts for mobile devices (which happens a lot!) we now use Lectora.
Simply scaling everything down is not an option, especially when you're using text entry fields. They simply become unworkable when they're sized down, it just doesn't provide a good user experience.