PopStage built all kinds of collaborative experiences with tailored permissions for their users using Liveblocks

Challenge

Begun in the middle of the Covid-19 pandemic, PopStage’s small parent team With Labs had no time to waste. As the virus spiked, the world soared into a work-from-home Zoom-filled reality that focused PopStage’s founding engineer, Grant Forrest, toward moving from the general-use video platforms, which can be constricting and flat, to creating an interactive experience. He and the rest of the PopStage team took on the challenge to create an experience for everyone involved that feels very hands-on and gives you the kind of treatment that you expect from a high-quality workshop.

Specifically to PopStage was the need to provide varying levels of permission for users: It provides a workshop builder experience with moderators running sessions in which attendees can jump from exercise to engaging exercise: polls, whiteboards, music, Q & A, group exercises, timer reminders and even lunch breaks. For those of us who’ve experienced turning into drained, lifeless Zoom-bies, PopStage’s features create a more natural experience, where the screen falls away and everything feels 3D. Due to its nature, PopStage needed specific permissions for different kinds of collaborators.

Forrest explains, “Permissions can get tricky, especially when it comes to whether or not users have privileges when others don't. So in a workshop setting, we have moderators, who need to be able to control and understand more state than participants do. We want to be able to trust that if someone says they’re a moderator, they have access to the mod chat, for instance, and we’ve got to ensure that mod chat stays private from the participants.”

Keep reading to see how Liveblocks’ centralized server approach helped Forrest’s team get PopStage into the market with no time to waste.

Solution

According to Forrest, “We were aware of the large number of problems in the multiplayer space that needed to be solved. So we were really excited to find Liveblocks. We’ve adopted Liveblocks as the entire layer for our real-time communications, using the presence, part of the product, and the storage. We built on top of that to very quickly provide that layer of extremely interactive behaviors for our workshops.”

Diving deeper into the behind-the-scenes logic, Forrest explains, “The brilliance of Liveblocks is that we create our own API endpoint, which mediates the transaction of joining a room and getting that permission. It just seamlessly places that information in the token.” With such an ease in authentication, how can one not feel a sense of reassurance?

Liveblocks’ unique centralized server allows you to share the state between all users: it’s not only easy to implement, but also provides all sorts of benefits. The solution for PopStage’s specific challenge is that, “You can trust that they really are the moderator, according to our system. We've encoded additional metadata in there that helps keep things secure.”

Results

Using Liveblocks made things incredibly flexible and light for Forrest’s engineering team. He says, “A big win for us was that we have almost an entirely serverless platform.” PopStage built all of their business logic with React – and they have a small Graph QL API that runs in a serverless function. Thus, PopStage’s development team saved on weeks if not months of setting up and maintaining customer servers and solutions.

In addition to getting up to speed in such a drastic fashion, Forrest found huge help from Liveblocks’ customer service: “I both appreciate how responsive Liveblocks has been, but also the depth of knowledge, not just about the real time aspects, but also as a React developer. It’s nice to be able to talk to people about how we could use React context. It’s great to have the products respond so quickly to the things that we've discovered in it.”

We at Liveblocks not only build these highly versatile interactive tools, but we are passionate about customer care and how their products proliferate in the world, especially because we understand that time is of the essence.

“I think a big impact for us as a very small startup is the ability to pivot quickly between some different ideas until we found this one that we’re really excited about. Just having the opportunity to basically pick up off-the-shelf live, real-time data integration is huge. As a small team that needs to move fast and focus on a lot of different things, it’s an accelerator to get us into this product space that we normally might not have been able to access, because we would have been too bogged down on the technical work of making the real time data work in it.”

Grant ForrestFounding Engineer at PopStage