PDF Certificate from Storyline

For the Bribery Act training module that I have been developing for our Legal, Governance and Business Assurance department, I was asked to find a solution whereby persons identified as being at high risk could prove that they had taken and passed the module. The module, which includes a presentation followed by a quiz, has been built in Storyline as they wanted something that could standalone and would look very slick.

We discussed the possibility of hosting the module in SunSpace and rewriting the quiz using SunSpace’s native Exam tool, but ruled this out as it adds unnecessary complexity and would result in an inferior experience for people taking the module.

We finally agreed that simply instructing the high risk individuals to save the results slide produced at the end of the quiz and emailing it back to Business Assurance would suffice. That’s fine as far as it goes, but actually introduces a lot of complexity and possibility for human error. People would have to either take a screenshot of the slide, different on every operating system, or save / print the slide as a PDF, different in every browser. I wanted a simple solution, a single button that all you had to do was click.

I found that solution through Articulate’s awesome E-Leaning Heroes community, in a post by Ryan Lowry which explained how to use pdfmake, a JavaScript library, to generate PDF documents on the fly, on the client side. After successfully integrating Ryan’s template into the Bribery Act module I then modified the code in pdfmake to produce a certificate that’s University of Sunderland branded and matches as closely as possible the certificates issued by HR upon completion of CPD courses. The only real issue I had with this was integrating an image for use in the footer. To get this working I had to convert the image to Base64 text and add it into the certificate.html document. To do that I found one of those fabulous little online niche tools: https://www.base64-image.de.

Leave a Reply

Your email address will not be published. Required fields are marked *