Western CPE courses are delivered through live seminars, self-study (online content and exam) and webcast
(video, slides and questions, with attendance checks).
Webcasts are required by NASBA (National Association of State Boards of Accountancy) to simulate a live experience.
The requirements included a "real time" video that does not pause and continues playing if the user leaves and returns, slides that follow the video and change at specific times, a question-and-answer channel that returns answers within minutes without a page refresh, and attendance checks that appear unpredictably during the webcast and record the viewer's response.
I built it with Vue.js and API services, loading components via JavaScript promises. JW Player was selected for its robust API, which let me mimic live television from a webcast start value and use the video timeline to trigger attendance-check events and slide changes.
PDF.js allowed a webcast to use a single PDF file and load slides as page changes. The app also handled webcasts with slides burned into the video itself, adjusting the layout accordingly.
A footer control section displayed the status of the attendance checks and provided links to course materials and a fullscreen option. Fullscreen gave a true fullscreen experience while maintaining the layout and functionality of the application.
Viewers could ask questions, which were routed to moderators who placed "dibs" on a question as the first step to answering it. Answers then loaded via polling, in line with the earlier questions and answers moderators chose to keep for future viewers. These questions scrolled along with the video timeline so they always appeared in context.
An intro screen with instructions and an overview, and a conclusion screen with the user's results, sandwiched the webcast experience.
I also built a webcast builder that let administrators assemble a webcast course from segments, videos and PDFs, along with the associated slide-change timings and attendance checks.
The requirements included a "real time" video that does not pause and continues playing if the user leaves and returns, slides that follow the video and change at specific times, a question-and-answer channel that returns answers within minutes without a page refresh, and attendance checks that appear unpredictably during the webcast and record the viewer's response.
I built it with Vue.js and API services, loading components via JavaScript promises. JW Player was selected for its robust API, which let me mimic live television from a webcast start value and use the video timeline to trigger attendance-check events and slide changes.
PDF.js allowed a webcast to use a single PDF file and load slides as page changes. The app also handled webcasts with slides burned into the video itself, adjusting the layout accordingly.
A footer control section displayed the status of the attendance checks and provided links to course materials and a fullscreen option. Fullscreen gave a true fullscreen experience while maintaining the layout and functionality of the application.
Viewers could ask questions, which were routed to moderators who placed "dibs" on a question as the first step to answering it. Answers then loaded via polling, in line with the earlier questions and answers moderators chose to keep for future viewers. These questions scrolled along with the video timeline so they always appeared in context.
An intro screen with instructions and an overview, and a conclusion screen with the user's results, sandwiched the webcast experience.
I also built a webcast builder that let administrators assemble a webcast course from segments, videos and PDFs, along with the associated slide-change timings and attendance checks.