📝 Liveblocks: Bringing Collaboration to Software
The inside story of how Liveblocks is building the backend infrastructure for developers to power the real-time collaboration layer of the internet
Hi everyone 👋, welcome back to The Split.
If you’re reading this, we successfully made the transition to Substack. If you want to join in on the conversation, jump into the comments and I’ll be sure to reply.
Today I'm diving in to our portfolio company, Liveblocks. Liveblocks is building the infrastructure for collaborative experiences, and its suite of products enables developers to build collaborative experiences in days, not months.
Full disclosure that my firm Banana is an investor in Liveblocks. None of the below is financial advice or a guarantee of investment returns.
Introducing Liveblocks
On September 15th, 2022, Adobe announced it was acquiring Figma, the browser-based collaborative design tool, for approximately $20 billion. Figma built a passionate community around its product and is adored by designers across the world. The yet-to-close acquisition would represent an incredible outcome for everyone involved. It was a high price for Adobe to pay at nearly 15% of its market cap at the time, but it was likely worth every penny. And it represented Adobe admitting collaboration was the future of design software.
It begs the question: will a similar dynamic play out across other software categories? That’s what Liveblocks co-founders Steven Fabre, Guillaume Salles, and the rest of the team are betting on. Liveblocks enables developers to build collaborative experiences in days, not months.
Liveblocks has a full product suite for building collaboration features, and its early customers span from pre-launch startups to publicly traded companies. And funny enough, the story intersects with Figma.
A Decade in Design Software
Steven started working with creativity tools at his first job editing videos for the French publication, Midi Libre. He then did a brief design internship in Quebec before moving to Sydney to work as a designer at The Iconic, a Rocket Internet-backed online fashion retailer in Australia. He then co-founded Backseat, Australia’s first ride-sharing app. After shutting down due to regulatory setbacks, he spent a few years leading design on Campaign Monitor’s email builder.
On the side, he started building Easee, a drag and drop web animation tool for designers. By 2016, this caught the eye of Invision, which was one of the most popular design software tools at the time. Invision acquired Easee in April of 2016, and Steven spent four years in a design role that touched all aspects of Invision’s product.
A Match Made in France
Three years later, Guillaume’s first day at Invision coincided with a team offsite in San Francisco. As the only two employees from France, they had instant chemistry. As they started talking, they realized Guillaume was from the same town as Steven’s mom, and knew they had to work together. Here’s a photo from that day:
The two paired up on almost all of Invision’s performance and quality projects over the next few months. As the design world watched the rise of Figma, they were eventually tasked with building Invision Studio’s multiplayer collaboration functionality, taking it from a file-based desktop application to a browser-based multiplayer one. Steven designed and Guillaume would build.
It took them over a year to complete the initial transition from desktop to the browser, with a lot of performance and quality issues still left to solve. This gave them a front row seat to know just how hard and resource intensive collaborative features are to build, integrate, and maintain in-house. Especially working within an existing product.
It also convinced them real-time collaboration was coming to other software.
The Lightbulb Moment
Meanwhile, Steven was still working on side projects at night. One that’s still running today is Gifmock, which makes it simple to create high-quality GIFs from static images and mockups.
As they became more convinced collaboration would spread to other software, they started brainstorming bigger ideas to work on together. After months of iterating, they finally felt like they had something, and started building a browser-based video presentation tool that looked similar to what Pitch is today (below).
But like all things in startups, nothing came easy. Steven had jumped over to Facebook Messenger’s design team, while Guillaume stayed at Invision, working from Montreal. They struggled finding tools with the right multiplayer functionality. Some didn’t integrate easily into their back-end, others made it difficult to incorporate version control and undo/redo. Some were optimized for text instead of layer-based creative tools, and each feature required cobbling multiple services together.
They tried Y.js, Automerge, and read as many research papers as they could find on Conflict-free Replicated Data Type (or CRDTs). While great technologies, the decentralized nature of a pure CRDT approach wasn’t pragmatic enough for what they needed. CRDTs alone only solved part of their problem, made things like data migrations and document permissions more difficult, and didn’t allow for other important collaborative features like commenting. This all led to a sloppy end-user experience.
Despite all their earned secrets building collaborative features at Invision, they still spent months getting their video presentation tool perfect. When they finally had a functioning prototype, they realized they uncovered an even bigger opportunity: everything they built could be used in other products.
Diving Into the Liveblocks Product
They were back at square one, but this time they knew exactly what to build. While building the video presentation tool, they took inspiration from Figma, relying on an approach similar to CRDTs where parts of conflicts that almost never happen get resolved on the server. And to offer true real-time performance and scale to millions, they use on-the-edge infrastructure where each collaborative multiplayer document lives physically close to each users location to reduce latency.
To start, they lifted their Presence product out of the slide presentation tool. Multiplayer Text came shortly after, which meant anyone could build a product that looked like Notion in just a few hours.
Throughout the rest of 2022, they worked alongside customers to figure out the most urgent problems to solve. Over the next few months they released features like Storage, Permissions Management and Analytics. By 2023, they had built an entire product suite.
The real secret they unlocked was how to make all kinds of technologies and approaches work seamlessly together (WebSocket, conflict-free data types, Presence, Broadcast, Comments, etc). This is what the early Figma team was able to do and what inspired Liveblocks initial approach.
In February of 2023, they repackaged everything into Liveblocks 1.0, a sleek fully hosted solution and toolkit to modularly embed collaborative experiences into any product incredibly fast. Later that week, they unveiled their Chrome Extension that enables developers to inspect collaborative experiences live (click the image below for a 40 second YouTube video).
Most recently, they unveiled the Liveblocks Starter Kit built with Next.js to integrate directly with Vercel. This made it simple for any developer to get up and running with everything they needed to build a collaborative experience.
And customers started to notice.
Understanding the Market and Opportunity
Working collaboratively is key to any successful team, but most software isn’t designed to be used collaboratively. This becomes a real problem as knowledge workers have increasingly started working remotely.
And even if a team isn’t fully remote, US office occupancy is at barely 50% of pre-pandemic levels. It’s become increasingly likely that all members of a team aren’t in the office at the same time.
Liveblocks believes collaboration will become a commodity embedded into every software product, and not a separate destination. Like what played out with Figma, Liveblocks thinks browser-based tools create a new source of truth. It’s an entirely new paradigm than file-based version control, where each small change in the browser becomes the latest save file.
Their belief is collaboration will permeate into other verticals, across industries like architecture (Arcol), construction (Propeller), legal (things like redlining documents), and healthcare (Dialogue). With recent advances in AI likely enabling a new wave of software to emerge, the timing couldn’t be better for Liveblocks.
Customer Case Studies in Construction and Architecture
Early customers are already benefitting from building with Liveblocks.
Propeller is a smart survey tool that civil engineers use to boost productivity on construction sites. Their core software transforms data into an interactive map used by stakeholders to communicate, plan, and execute on projects. Historically, this process involved printing physical paper maps and huddling as a team around a table. You can guess where this is going…
Liveblocks enabled Propeller to build a collaborative tool (in 45 minutes) that replaces reading physical maps around a table. Survey managers can create multiple markups on a map, which viewers from any angle can see updated in real-time, even if they join late after the markups have been created.
Propeller shared:
We started looking into building a service ourselves. We looked at a few solutions we would have had to host internally, and a super underrated and unexpected selling point of Liveblocks is not maintaining the infrastructure ourselves. It’s a very difficult problem to solve and entirely different from our core tech stack. Liveblocks allows us to focus on the front end while they handle all the collaboration infrastructure.
In an adjacent field, Arcol used Liveblocks to build collaborative Building Information Modeling (BMI) software for architects.
Desktop-based BIM tools haven’t changed much over the past two decades. And Arcol enables the hundreds of people who often edit the same file to work on a project in real-time, collaboratively in the browser.
Building the Real-Time Collaboration Infrastructure for Developers
When I asked Steven to summarize everything they’re building in a few sentences, he shared:
Liveblocks is building real-time collaboration infrastructure for developers. Our goal is to essentially condense all of Figma’s infrastructure (multiplayer editor, workspace document browsing, comments, etc.) into something developers can use to get up and running in just a couple of minutes. Developers can integrate Liveblocks directly into their front-end stack of choice through our client and React packages, but also with our middleware for state management libraries like Redux and Zustand. And the magic here is that, by just passing an API key, developers have a full WebSocket on the edge infrastructure automatically set up in the background for them.
Real-time collaborative software done right makes it feel like you’re in the same space. The team is riding the unique insight that shared presence drives creativity, and that most companies' secret sauce lies within building its own front-end user experience and distribution, not its backend infrastructure.
To 2023 and Beyond
Investors are fully bought-in to the vision. Max Stoiber, the co-founder and CEO of Stellate, was an early angel investor and connected Steven and Guillaume with Ellen Chisa at Boldstart Ventures in 2021.
They didn’t plan on raising an institutional round, but they loved their early conversations with Ellen, Ed, Eliot, and Shomik at Boldstart. They shortly after closed a $1.4 million Pre-Seed round led by Boldstart and Seedcamp, and six months later their traction prompted Boldstart to lead a $5 million Seed, joined by us at Banana Capital plus Seedcamp, Kima Ventures, and Atlassian.
This gave capital to start building the team, which recently got back from their annual offsite in Morocco (click for video 👇).
And they’re still hiring! They’re specifically looking for a full-stack engineer who can ship fast, take ownership, and be a customer advocate.
Best of all, Liveblocks isn’t just running on venture funding. Early customers and design partners include Microsoft, Hugging Face, Runway, Causal, and the BBC. And they’ve started expanding outside their initial market of creativity software, with customers spanning telemedicine, architecture, video editing, mapping, and more.
If you’re a developer, check out Liveblocks’ Starter Kit and see what you can build.
🍌 The Split is brought to you by Banana Capital. We invest $250k to $750k in Pre-Seed and Seed rounds globally. Read more about what we're up to and the latest on our Fund 2 here.
Good stuff. I imagine there's going to be a lot of opportunity building Chrome Extensions that enable these features on legacy SaaS or intranet apps