Can users record and interact with their own audio in Articulate Storyline 360?

Take a look at @Nedim's entry in this post:

Storyline 360 Microphone Input | Articulate - Community

He provides an online example that demonstrates how he accesses the microphone and records some audio with a MediaRecorder object, creating an audio blob. This blob can be internally assigned to a URL and then referenced into an audio element that can be added to your SL slide. You could then play this audio element via JavaScript, like any other. 

Quick reference on converting an audio blob into audio element:

https://stackoverflow.com/questions/63521599/setting-audio-element-source-from-blob

To see the details, open Nedim's example, then right click in the white box around the microphone button and select View Frame Source (or This Frame > View Frame Source).

Since he did not share the project directly, I would suggest using the code for guidance and inspiration rather than just copying his code.

 

Nathan_Hilliard​ Thank you for the shoutout!

The code can be copied and used exactly as Nathan suggested. It's all contained within an index.html file, which includes both the logic and the necessary UI elements. You can easily adjust or modify this code to customize properties such as colors, fonts, icons, and dimensions to fit the available space on your Storyline slide. You can import the copied HTML as a web object in Storyline, provided that you’ve created the necessary text variables in Storyline (e.g., note01, note02, note03, etc.). When these variables are referenced on the slide, they will display exactly what was spoken during each subsequent recording—creating a smooth, story-like narration told by the learner.

I also created another version for this eLearning challenge. The code setup is essentially the same, but with one key difference: This version does not capture speech or update a text variable in Storyline with the recognized speech content. Instead, I used a custom "slideTitle" variable so the audio gets saved with filenames like: YourSlideTitle_Note_1, YourSlideTitle_Note_2, and so on. However, the code can also be adjusted to save the recorded audio and update any text variable in Storyline with the recognized speech content, so that the transcribed text is displayed on the slide in real time.

In this version, I also modified the initializeRecorder function to use the Web Audio API, which processes the audio stream and adds a GainNode for volume control before recording. This significantly improves the quality of the recorded audio and provides much more flexibility allowing you to adjust volume, apply filters, EQ, effects, and more.

For your interaction, I suggest integrating a timer that starts counting down from 2 minutes to zero when recording begins. Once the countdown reaches zero, the recording would automatically stop and the audio file could be saved to the learner’s computer. I haven’t tested this setup yet, but it should work with the right modifications to the code. Of course, this feature is optional, but it could enhance the experience by providing a clear time limit for responses.