Perform Livestreams
Perform Education is the largest children's touring theatre company in Australia, visiting over 100,000 children a year via their live-in-school theatrical performances. Similar to many touring theatre companies in 2020 - Perform Education was put between a rock and a hard place during the pandemic. Most of the schools across the country were closed, putting the company at serious risk of going under if they could not find a way to pivot their business model in a serious way.
Kickstarting in 2021, this Livestream platform was the most ambitious attempted by the company thus far.
The Problem
Being the sole web developer working for Perform Education it fell to me to create a web platform that could host interactive online Livestream versions of our current shows. It also needed to sustain large amounts of schools and students logging on from all over the country, and function with multiple sessions happening simultaneously. Having already attempted this process with National Theatre for Children (see other case study) with great success, I knew it was possible, but would need to be replicated on a much larger scale and with more complexity for Perform Education.
To achieve this I needed to overhaul our backend process as well as expand out onsite capability. We'd need to have at least three spaces in our studio dedicated to streaming content for schools live, so we could run multiple sessions at the same time. This meant we also needed to streamline our internal booking system (Salesforce) to manage the rooms and efficiently schedule each showing.
The problems we had to overcome:
Creating a scalable solution for bookings and room management
Being able to run multiple sessions at the same time
Making a login system that both teachers and students could use
Weaving multiple technologies together
Making a booking system that was able to be used easily by the communications team
Being able to change bookings easily without causing complications
Catering for multiple versions of the same show (Junior/senior)
The Process
Taking on board everything I learned with our first Livestream performances with the NTC Livestream platform, I made a rough technology guideline. We couldn't replicate the NTC system entirely since its use-case was 'one Livestream at a time', and Perform Education's would be multiple. One of the big successes of NTC was the live chat function. The students loved the interactivity, and how reactive the Livestream host was. However, our first implementation let the students see other students' comments. While this fostered interaction, we found it to be disruptive and the chat often devolved into spam. For our new system, we just wanted the ability for users to be able to send messages and see their own, but not be able to see the messages of others.
For the front-end application I used:
Nuxt Js (since this was my most used frontend platform and it could do everything I wanted it to)
Tailwind CSS (to keep the style guide consistent)
For the back-end I used:
Salesforce SOAP API
Express Js and JSForce (to communicate with Salesforce)
Firebase (to host the live chat and authentication service for our admin login)
To solve the session management issue and to make the login easier for schools and our internal teams alike - we upgraded our Salesforce account to Enterprise in order to use the inbuilt SOAP API and calendar.
With these things in play, I needed to weave all of these technologies together.
Room and Session Management
Since we had no idea how many schools we would have, we needed a scalable solution that could accommodate as many rooms as needed. To help with this, I made a new section of elements in Salesforce to track the performance times, which version of the show, and which room a Livestream was assigned to. I then mapped these elements out onto Salesforce's internal calendar app to show the upcoming performances in the most succinct way possible. This let the communications team track when and where Livestreams were happening, and easily manage the booking if a school requested a change of date or a delay to their performance.
Login system
Our one requirement for the login system was that it is as user friendly as possible since anyone from a 60-year-old teacher to a 4-year-old student would be attempting to log in. I settled on a simple code that was generated based on the unique Salesforce ID, which was less complicated, and easier for students to use.
I used JSForce, a Javascript Library that utilises Salesforce's API, and created my own API endpoints in an express server that ran in tandem with the Livestream website to process the requests. If valid, the API would then return the associated performances. This meant that the login system was streamlined through Salesforce, automating a lot of work for the communications team and saving them a lot of wasted time.
The Front End Application
For the actual user application, I used Nuxt - a framework for Vue JS. With this, I made the user-facing pages and login flow. I also made a password protected backend for the Livestream operators to view the live chat log, protecting the data and school information. I could then control all of the chat information with Firebase's Firestore and Firebase's authentication for the admin login.
Adding or removing Livestreams and chatroom's was as simple as having a dynamic route for admin/chat/x, with x being the room letter. This would take only the chats that appeared in the corresponding letters Firestore collection. With this system, we had a very easily scalable solution. This came in handy multiple times as there were often last minute changes, with sessions needing to be added at a moments notice - which only involved adding them as options to Salesforce and a small change in the Nuxt application.
Outcome
During Book Week 2021 (5 weeks), we managed to serve 154,000 devices over the tour period with no downtime and minimal service disruption.
Schools needing to change or delay their Livestream were able to do it, and it caused our communications team minimal fuss. At it's peak we had 5 rooms running at one time with no serious technical issues.
The system performed admirably and thanks to its ease of use and scalability, we were able to expand our bookings to incorporate schools from all over Australia, instead of just the ones we would usually be able to reach on our physical tour.
This has led to a 65% increase in sales throughout 2021, with 2022 looking on track to continue to grow even further. It has also opened the door for Perform Education to create a larger range of Livestream performances to offer as part of their permanent program.
Like National Theatre for Children, expanding and evolving their business to a more flexible and sustainable model has meant the company was able to pivot during one of the most challenging times globally. The integration of a fully online program into their usual touring program has meant that Perform Education has expanded it's reach to even more students that they previously couldn't, improving access to theater and education for students who need it most.