At Maestro, we put people first, so when we realized that our free response section in Rise could be better optimized for learners by building it in Storyline to be used in Rise, we set to work to fix it. Here’s how we identified the problem, creatively collaborated to find a solution, and solved our issue to create a better experience for our learners. And the best part? You can do it too! After reading about how we optimized our free response field, download the script and instructions at the bottom of this blog, and try it for yourself.

The problem

Initially, when designing the free response option in Storyline to be used in Rise, we wanted a space that maintained visual continuity, allowed learners to respond without a length restriction, and provided learners with the ability to save their response if they wanted to. We assumed that most learners’ free response would fit on-screen in the space provided. 

At first, we thought that we’d succeeded in allowing learners to save their full responses. We had found an example on the Articulate forum that included a short piece of javascript to “print window” that would allow learners to print their responses if they wanted to. The problem arose, however, when we realized that this wouldn’t necessarily print the full response. If a learner writes a lengthy response that goes beyond the on-screen allotted space, the text entry box will scroll to accommodate all of the text. Unfortunately, our “print window” option would only print the text showing on-screen in the free response component—any scrolled text not currently visible would not be included.

This meant we weren’t delivering on all of the elements we wanted out of our free response option—there was no way for the learner to save their full response if it went beyond the on-screen space. So, we started brainstorming to find the right solution. 

Trouble-shooting

Our first idea was to embed an entire PDF generation library in the Storyline course to give learners the option to manually generate a PDF of their response if they wished to save it. But this wasn’t the perfect solution we were hoping for. Because it required embedding a whole PDF generation library, this option ended up having a few issues. The main problem? It was simply too large. Though there were some workarounds that we could incorporate, they weren’t easy to implement, and it would be confusing and difficult to maintain. So, embedding the PDF wasn’t going to work. We had to find another solution. 

The solution

We had to consider the problem again. What did we know? Well, we knew how to print the response field (it just wasn’t always the whole response), and we knew that embedding a PDF wasn’t an option. From there, it actually turned out to be a fairly simple solution. With a few lines of Javascript and CSS, we were able to format the printed content to display the full response. And just like that, it was fixed!

While it doesn’t download a PDF automatically, this solution simply presents the learner with familiar print dialogue that allows them to print directly or save their response as a PDF. By taking a step back and reevaluating the problem, we were able to use basic web development practices to arrive at our desired solution and provide the learner-centered experience we were committed to.

New & improved free response

Understanding and anticipating the needs of our learners is important to us, so it was clear that we had to find the solution to our free response problem. And now, we’re excited to share it with you! Our new and improved free response is available through the download below. Not only does it allow your learners to save their free responses, but it does all of the other things we wanted it to too. You can still experience the visual customization options while now enjoying the optimized functionality. What’s not to love?